/*
 * Theme-friendly overrides for intl-tel-input so the country picker matches the
 * app's form styling and adapts to the backend dark theme (body.dark-theme).
 */

/* Fill the parent width like a normal Bootstrap form-control. */
.iti { width: 100%; display: block; }
.iti input.form-control,
.iti input[type="tel"],
.iti input[type="text"] { width: 100%; }

/* A touch more polish on the flag/dial-code trigger. */
.iti__selected-flag { border-top-left-radius: .375rem; border-bottom-left-radius: .375rem; }
.iti__country-list { border-radius: .375rem; box-shadow: 0 .5rem 1.25rem rgba(0,0,0,.15); z-index: 1080; }
.iti__country-list::-webkit-scrollbar { width: 8px; }
.iti__country-list::-webkit-scrollbar-thumb { background: rgba(0,0,0,.2); border-radius: 8px; }

/* Inline validation cue. */
.iti input.is-phone-invalid { border-color: #dc3545 !important; }
.phone-intl-error { color: #dc3545; font-size: .8125rem; margin-top: .25rem; display: none; }
.phone-intl-error.show { display: block; }

/* -------- Dark theme (backend: body.dark-theme) -------- */
body.dark-theme .iti__selected-flag { background-color: rgba(255,255,255,.04); }
body.dark-theme .iti__selected-flag:hover,
body.dark-theme .iti__selected-flag.iti__arrow--up { background-color: rgba(255,255,255,.08); }
body.dark-theme .iti__country-list {
    background-color: #1f2733;
    color: #e5e7eb;
    border: 1px solid #313b48;
}
body.dark-theme .iti__country { color: #e5e7eb; }
body.dark-theme .iti__country.iti__highlight { background-color: #2b3644; }
body.dark-theme .iti__divider { border-bottom-color: #313b48; }
body.dark-theme .iti__dial-code { color: #9aa4b2; }

/* -------- Non-backend surfaces that follow the OS theme -------- */
@media (prefers-color-scheme: dark) {
    body:not(.default-theme):not(.dark-theme) .iti__country-list {
        background-color: #1f2733;
        color: #e5e7eb;
        border: 1px solid #313b48;
    }
    body:not(.default-theme):not(.dark-theme) .iti__country.iti__highlight { background-color: #2b3644; }
    body:not(.default-theme):not(.dark-theme) .iti__dial-code { color: #9aa4b2; }
}
