/**
 * Elementor Phone Validator RTL Styles
 * Right-to-left language support (Hebrew, Arabic, etc.)
 */

/* RTL: Error message text direction */
html[dir="rtl"] .epv-error-message,
body.rtl .epv-error-message {
    direction: rtl;
    text-align: right;
    border-left: none;
    border-right: 3px solid #d32f2f;
}

/* RTL: Error icon positioning */
html[dir="rtl"] .epv-error-message::before,
body.rtl .epv-error-message::before {
    margin-right: 0;
    margin-left: 5px;
}

/* RTL: Phone input stays LTR (numbers are always left-to-right) */
html[dir="rtl"] .epv-phone-field,
body.rtl .epv-phone-field {
    direction: ltr !important;
    text-align: left !important;
    /* Override any RTL text alignment */
}

/* RTL: Focus outline positioning */
html[dir="rtl"] .epv-phone-field:focus,
body.rtl .epv-phone-field:focus {
    box-shadow: 2px 0 0 0 #2271b1 !important;
}

/* RTL: Invalid field focus */
html[dir="rtl"] .epv-phone-field[aria-invalid="true"]:focus,
body.rtl .epv-phone-field[aria-invalid="true"]:focus {
    box-shadow: 2px 0 0 0 #d32f2f !important;
}

/* RTL: Elementor field group adjustments */
html[dir="rtl"] .elementor-field-group .epv-error-message,
body.rtl .elementor-field-group .epv-error-message {
    text-align: right;
}

/* RTL: Required asterisk positioning */
html[dir="rtl"] .elementor-mark-required,
body.rtl .elementor-mark-required {
    margin-right: 0;
    margin-left: 3px;
}

/* RTL: Form field wrapper */
html[dir="rtl"] .elementor-field-textual,
body.rtl .elementor-field-textual {
    /* Ensure proper text direction for labels */
}

/* RTL: Label alignment */
html[dir="rtl"] .elementor-field-label,
body.rtl .elementor-field-label {
    text-align: right;
}

/* BiDi isolation for mixed content */
.epv-error-message {
    unicode-bidi: isolate;
}

/* Ensure numbers in error message stay LTR even in RTL context */
.epv-error-message bdi {
    direction: ltr;
}

/* RTL: Mobile responsiveness */
@media (max-width: 768px) {
    html[dir="rtl"] .epv-error-message,
    body.rtl .epv-error-message {
        padding-right: 10px;
        padding-left: 10px;
    }
}

/* RTL: High contrast mode */
@media (prefers-contrast: high) {
    html[dir="rtl"] .epv-error-message,
    body.rtl .epv-error-message {
        border-right-width: 4px;
    }
}