.fenix-phone-field{display:grid;grid-template-columns:minmax(108px,132px) minmax(0,1fr);gap:8px;width:100%;align-items:stretch;margin-top:7px}
.fenix-phone-country-shell,.fenix-phone-visible{min-width:0;width:100%;box-sizing:border-box;border:1px solid var(--line,#dbe2e6);border-radius:12px;background:var(--phone-bg,#0a0e14);color:var(--text,#f4f7fa)}
.fenix-phone-country-shell{position:relative;min-height:48px;cursor:pointer;overflow:hidden}
.fenix-phone-country{position:absolute;inset:0;z-index:3;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;font:inherit}
.fenix-phone-country-display{position:absolute;inset:0;z-index:1;display:flex;align-items:center;gap:7px;padding:0 29px 0 10px;white-space:nowrap;overflow:hidden;pointer-events:none;font:inherit;font-weight:600}
.fenix-phone-country-flag{font-size:18px;line-height:1;flex:0 0 auto}
.fenix-phone-country-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.fenix-phone-country-dial{margin-left:auto;color:var(--muted,#8d98a5);font-size:.88em;flex:0 0 auto}
.fenix-phone-country-chevron{position:absolute;right:9px;top:50%;transform:translateY(-54%);font-size:16px;color:var(--muted,#8d98a5);line-height:1}
.fenix-phone-visible{font:inherit;padding:12px 10px;outline:none;letter-spacing:.01em}
.fenix-phone-country-shell:focus-within,.fenix-phone-visible:focus{border-color:var(--cyan,#67e5f2);box-shadow:0 0 0 3px #67e5f21d}
.fi-form .fenix-phone-field{--phone-bg:#f8fafb;--text:#10171d;--line:#dbe2e6}
.fi-form .fenix-phone-country-shell,.fi-form .fenix-phone-visible{margin-top:0;border-radius:13px}
.fi-form .fenix-phone-visible{padding:13px 10px}
.lead-form .fenix-phone-field{grid-column:auto;--phone-bg:#080c11;--text:#fff;--line:#252d37;margin-top:0}
.form-panel .fenix-phone-field,.settings-grid .fenix-phone-field{margin-top:7px}
.fenix-phone-field[data-valid="0"] .fenix-phone-visible:not(:focus){border-color:inherit}

/* Mobile-first CRM: in the closed field we only show the flag. The native
   selector still contains the full country name and dial code when opened. */
@media(max-width:720px){
  .fenix-phone-field{grid-template-columns:62px minmax(0,1fr);gap:8px}
  .fenix-phone-country-display{justify-content:center;padding:0 20px 0 7px;gap:0}
  .fenix-phone-country-name,.fenix-phone-country-dial{display:none}
  .fenix-phone-country-flag{font-size:22px}
  .fenix-phone-country-chevron{right:6px;font-size:14px}
}
@media(max-width:380px){
  .fenix-phone-field{grid-template-columns:56px minmax(0,1fr);gap:6px}
  .fenix-phone-country-display{padding-left:5px;padding-right:17px}
  .fenix-phone-country-flag{font-size:20px}
  .fenix-phone-country-chevron{right:5px;font-size:13px}
}