.iti {
    width: 100%;
    font: inherit;
}

.iti__dropdown-content {
    z-index: 100000;
}

/* Keep the picker layout authoritative when Filament applies global input styles. */
body .iti__search-input-wrapper > .iti__search-input {
    box-sizing: border-box !important;
    padding-left: calc(
        var(--iti-spacer-horizontal) +
        var(--iti-globe-icon-size) +
        var(--iti-spacer-horizontal)
    ) !important;
    padding-right: calc(
        var(--iti-spacer-horizontal) +
        var(--iti-clear-icon-size) +
        var(--iti-spacer-horizontal)
    ) !important;
}

body .iti__search-input-wrapper > .iti__search-icon {
    left: var(--iti-spacer-horizontal) !important;
    z-index: 1 !important;
}

body .iti__search-input-wrapper > .iti__search-clear {
    right: calc(var(--iti-spacer-horizontal) / 2) !important;
    z-index: 1 !important;
}

/* Filament's global input padding can override the phone picker's search field. */
.iti__search-input-wrapper > .iti__search-input {
    box-sizing: border-box;
    padding-left: calc(
        var(--iti-spacer-horizontal) +
        var(--iti-globe-icon-size) +
        var(--iti-spacer-horizontal)
    ) !important;
    padding-right: calc(
        var(--iti-spacer-horizontal) +
        var(--iti-clear-icon-size) +
        var(--iti-spacer-horizontal)
    ) !important;
}

.iti__search-input-wrapper > .iti__search-icon {
    left: var(--iti-spacer-horizontal);
    z-index: 1;
}

.iti__search-input-wrapper > .iti__search-clear {
    right: calc(var(--iti-spacer-horizontal) / 2);
    z-index: 1;
}

body .iti__selected-country,
body .iti__selected-dial-code {
    font-family: var(--mm-phone-font-family, inherit) !important;
    font-size: var(--mm-phone-font-size, inherit) !important;
    font-style: var(--mm-phone-font-style, inherit) !important;
    font-weight: var(--mm-phone-font-weight, inherit) !important;
    line-height: var(--mm-phone-line-height, inherit) !important;
}
