/* intl-tel-input-theme.css — the phone field's country picker in tokens.
   Loads after /assets/vendor/intl-tel-input/css/intlTelInput.min.css. */
.iti { width: 100%; display: block; }
.iti__flag-container { font-family: var(--font-body); }
.iti__selected-flag { border-radius: var(--radius) 0 0 var(--radius); padding: 0 8px 0 10px; }
.iti__selected-flag:hover, .iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag { background: var(--bg); }
.iti__arrow { border-top-color: var(--muted-soft); }
/* separateDialCode: the "+353" is part of the field, so it takes the field's
   type and colour, not the plugin's larger default. The plugin sets the
   input's left padding inline to clear it. */
.iti--separate-dial-code .iti__selected-flag { background: var(--bg); border-right: 1px solid var(--control-edge); }
.iti__selected-dial-code { font-size: var(--text-ui, 14px); color: var(--ink); margin-left: 6px; }
.iti__country-list { border: 1px solid var(--line-strong); border-radius: var(--radius-lg); box-shadow: var(--sh-pop); font-size: var(--text-ui); color: var(--ink); background: var(--surface); }
.iti__country.iti__highlight { background: var(--bg); }
.iti__dial-code { color: var(--muted); }
.iti__divider { border-bottom-color: var(--line); }
.iti input[type=tel] { padding-left: 52px; }