.intl-phone-field {
    width: 100%;
}

.intl-phone-field .iti {
    display: block;
    width: 100%;
}

.intl-phone-field .iti__tel-input,
.intl-phone-field .iti__tel-input[type="tel"] {
    width: 100%;
    padding: 0.65rem 0.75rem;
    border: 1px solid #d4d4d4;
    border-radius: var(--radius, 8px);
    font: inherit;
    background: var(--surface, #fff);
    color: var(--text, #171717);
}

.intl-phone-field .iti__tel-input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--accent, #b45309) 45%, #d4d4d4);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent, #b45309) 18%, transparent);
}

.intl-phone-field.is-invalid .iti__tel-input,
.intl-phone-field .iti__tel-input.is-invalid {
    border-color: #b91c1c;
}

.intl-phone-field .iti--separate-dial-code .iti__selected-country {
    border-radius: var(--radius, 8px) 0 0 var(--radius, 8px);
}

.intl-phone-field .iti--separate-dial-code .iti__tel-input {
    padding-left: calc(var(--iti-selected-country-arrow-width, 46px) + 0.75rem);
}

.registration-form--compact .intl-phone-field .iti__tel-input {
    min-height: 2.75rem;
}

/* Filament admin — organizer register and other back-office forms */
.fi-fo-intl-phone-field .intl-phone-field {
    border: 1px solid color-mix(in srgb, var(--platform-border, #e5e7eb) 92%, var(--platform-text, #111827));
    border-radius: 0.5rem;
    background: var(--platform-card, #fff);
    box-shadow: 0 1px 2px color-mix(in srgb, var(--platform-text, #111827) 4%, transparent);
    overflow: hidden;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.fi-fo-intl-phone-field .intl-phone-field:focus-within {
    border-color: color-mix(in srgb, var(--platform-brand, #b45309) 40%, var(--platform-border, #e5e7eb));
    box-shadow:
        0 1px 2px color-mix(in srgb, var(--platform-text, #111827) 4%, transparent),
        0 0 0 3px color-mix(in srgb, var(--platform-brand, #b45309) 12%, transparent);
}

.fi-fo-intl-phone-field--invalid .intl-phone-field,
.fi-fo-intl-phone-field .intl-phone-field.is-invalid {
    border-color: #fca5a5;
}

.fi-fo-intl-phone-field .iti__tel-input,
.fi-fo-intl-phone-field .iti__tel-input[type="tel"] {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.fi-fo-intl-phone-field .iti__tel-input:focus {
    box-shadow: none;
}

.fi-fo-intl-phone-field .iti--separate-dial-code .iti__selected-country {
    background: color-mix(in srgb, var(--platform-surface, #f9fafb) 65%, var(--platform-card, #fff));
    border-right: 1px solid color-mix(in srgb, var(--platform-border, #e5e7eb) 88%, transparent);
}

.dark .fi-fo-intl-phone-field .intl-phone-field {
    background: var(--platform-input, #27272a);
    border-color: color-mix(in srgb, var(--platform-border, #3f3f46) 80%, #fff);
}

.dark .fi-fo-intl-phone-field .iti--separate-dial-code .iti__selected-country {
    background: color-mix(in srgb, var(--platform-input, #27272a) 88%, #000);
}

.dark .fi-fo-intl-phone-field .iti__tel-input,
.dark .fi-fo-intl-phone-field .iti__tel-input[type="tel"] {
    color: #fff;
}
