/* Force LTR direction for phone number input fields */
input[type="tel"],
input[name="phone"],
input[name="mobile"],
.form-control.phone-input {
    direction: ltr !important;
    text-align: left !important;
}

/* Ensure phone input fields in RTL mode still display correctly */
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[name="phone"],
html[dir="rtl"] input[name="mobile"],
html[dir="rtl"] .form-control.phone-input {
    direction: ltr !important;
    text-align: left !important;
}

/* Support for intl-tel-input */
.intl-tel-input,
.iti {
    direction: ltr !important;
    text-align: left !important;
    width: 100%;
}

/* Move country code flag to the left */
.iti__flag-container,
.iti__selected-flag {
    direction: ltr !important;
    left: 0 !important;
    right: auto !important;
}

/* Ensure dropdown menu aligns to the left */
.iti__country-list {
    direction: ltr !important;
    text-align: left !important;
    left: 0 !important;
    right: auto !important;
}

/* Fix any RTL overrides for the entire phone input container */
html[dir="rtl"] .intl-tel-input,
html[dir="rtl"] .iti,
html[dir="rtl"] .iti__flag-container,
html[dir="rtl"] .iti__selected-flag,
html[dir="rtl"] .iti__country-list {
    direction: ltr !important;
    text-align: left !important;
}

/* Adjust padding for input to accommodate flag on the left */
.intl-tel-input input {
    padding-left: 50px !important; /* Adjust based on flag width */
    padding-right: 10px !important;
}