/*
 * BeautyPro international phone input layout.
 *
 * Phone numbers are always rendered LTR. The country selector is intentionally
 * pinned to the physical left, including on Arabic pages, and JavaScript
 * replaces the fallback spacing with the selector's measured width.
 */
.iti {
    width: 100%;
    max-width: 100%;
    direction: ltr !important;
}

.iti > input[type="tel"],
.iti > input[type="text"] {
    box-sizing: border-box !important;
    width: 100%;
    direction: ltr !important;
    text-align: left !important;
    unicode-bidi: plaintext;
    padding-left: var(--bp-phone-selector-space, 120px) !important;
    padding-right: var(--bp-phone-input-end-space, 14px) !important;
}

.iti .iti__flag-container,
.iti.iti--rtl .iti__flag-container {
    right: auto !important;
    left: 0 !important;
    direction: ltr !important;
}

.iti .iti__selected-flag,
.iti.iti--rtl .iti__selected-flag {
    box-sizing: border-box;
    min-width: 92px;
    direction: ltr !important;
    flex-direction: row !important;
    white-space: nowrap;
}

.iti .iti__selected-dial-code {
    direction: ltr;
    unicode-bidi: isolate;
    white-space: nowrap;
}

.iti .iti__country-list {
    direction: ltr;
    text-align: left;
}

@media (max-width: 575.98px) {
    .iti > input[type="tel"],
    .iti > input[type="text"] {
        min-width: 0;
    }
}

/* Syria: replace old Ba'ath flag with new independence flag (green/white/black + 3 red stars, Dec 2024) */
.iti__flag.iti__sy {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 6'><rect width='9' height='2' fill='%23007A3D'/><rect y='2' width='9' height='2' fill='%23fff'/><rect y='4' width='9' height='2' fill='%23000'/><g fill='%23CE1126'><polygon transform='translate(2.25,3)' points='0,-0.55 0.12,-0.17 0.52,-0.17 0.20,0.065 0.32,0.445 0,0.21 -0.32,0.445 -0.20,0.065 -0.52,-0.17 -0.12,-0.17'/><polygon transform='translate(4.5,3)' points='0,-0.55 0.12,-0.17 0.52,-0.17 0.20,0.065 0.32,0.445 0,0.21 -0.32,0.445 -0.20,0.065 -0.52,-0.17 -0.12,-0.17'/><polygon transform='translate(6.75,3)' points='0,-0.55 0.12,-0.17 0.52,-0.17 0.20,0.065 0.32,0.445 0,0.21 -0.32,0.445 -0.20,0.065 -0.52,-0.17 -0.12,-0.17'/></g></svg>") !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
}