/* ============================================
   RTL.CSS - Right-to-Left Language Support
   Modern implementation using CSS Logical Properties
   ============================================ */

/* Apply RTL-specific styles when html has dir="rtl" */
html[dir="rtl"] {
    direction: rtl;
    text-align: start;
}

/* ========== BUTTONS ========== */
/* Buttons with icons - reverse flex direction */
html[dir="rtl"] .ep-btn {
    flex-direction: row-reverse;
}

/* ========== CARDS ========== */
/* Card links - reverse arrow direction */
html[dir="rtl"] .ep-card__link {
    flex-direction: row-reverse;
}

html[dir="rtl"] .ep-card__link:hover {
    gap: var(--space-3);
}

/* ========== NAVIGATION ========== */
/* Navigation - reverse order */
html[dir="rtl"] .ep-nav {
    flex-direction: row-reverse;
}

html[dir="rtl"] .ep-nav__link {
    flex-direction: row-reverse;
}

/* ========== MEGA MENU ========== */
/* Mega menu positioning - keep centered regardless of direction */
html[dir="rtl"] .ep-mega-menu {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
}

/* Mega menu links */
html[dir="rtl"] .ep-mega-menu__link {
    flex-direction: row-reverse;
}

html[dir="rtl"] .ep-mega-menu__link:hover {
    padding-inline-start: var(--space-4);
    padding-inline-end: var(--space-3);
}

/* Mega menu column titles alignment */
html[dir="rtl"] .ep-mega-menu__column h3 {
    text-align: right;
}

html[dir="rtl"] .ep-mega-menu__column h3::after {
    right: 0;
    left: auto;
}

/* ========== LANGUAGE SWITCHER ========== */
html[dir="rtl"] .ep-lang-switcher {
    flex-direction: row-reverse;
}

/* ========== FORMS ========== */
/* Form elements - use logical properties */
html[dir="rtl"] .ep-form__input,
html[dir="rtl"] .ep-form__textarea,
html[dir="rtl"] .ep-form__select {
    text-align: start;
}

html[dir="rtl"] .ep-form__label {
    text-align: right;
}

/* ========== ACCORDION ========== */
html[dir="rtl"] .ep-accordion__header {
    flex-direction: row-reverse;
    text-align: start;
}

/* ========== HERO SLIDER ========== */
html[dir="rtl"] .ep-hero__cta {
    flex-direction: row-reverse;
}

html[dir="rtl"] .ep-hero__content {
    text-align: start;
}

/* ========== GRID & LAYOUT ========== */
/* Grid layouts - maintain LTR visual order even in RTL */
html[dir="rtl"] .ep-grid {
    direction: rtl;
}

/* Stats layout - keep centered */
html[dir="rtl"] .ep-stat {
    text-align: center;
}

/* ========== LISTS ========== */
/* Lists - use logical properties */
html[dir="rtl"] ul,
html[dir="rtl"] ol {
    padding-inline-start: 0;
    padding-inline-end: var(--space-6);
}

/* ========== HEADER LAYOUT ========== */
/* Header - reverse flex order */
html[dir="rtl"] .ep-header__inner {
    flex-direction: row-reverse;
}

/* Mobile toggle - keep on left side (right in visual RTL) */
html[dir="rtl"] .ep-mobile-toggle {
    order: -1;
}

/* Header logo - move to right side */
html[dir="rtl"] .ep-header__logo {
    order: 2;
}

/* ========== FOOTER ========== */
html[dir="rtl"] .ep-footer__links {
    text-align: right;
}

html[dir="rtl"] .ep-footer__links a:hover {
    padding-right: var(--space-2);
    padding-left: 0;
}

html[dir="rtl"] .ep-footer__column h3::after {
    right: 0;
    left: auto;
}

/* ========== ICONS & ARROWS ========== */
/* Flip directional icons */
html[dir="rtl"] .ri-arrow-right-line,
html[dir="rtl"] .ri-arrow-left-line {
    transform: scaleX(-1);
}

/* ========== ANIMATIONS ========== */
/* Mirror slide animations for RTL */
@media (prefers-reduced-motion: no-preference) {
    html[dir="rtl"] .slide-in-right {
        animation-name: slideInLeft;
    }

    html[dir="rtl"] .slide-in-left {
        animation-name: slideInRight;
    }
}

/* ========== MOBILE RESPONSIVE RTL ========== */
@media (max-width: 1024px) {
    /* Mobile menu in RTL - slide from left instead of right */
    html[dir="rtl"] .ep-header__nav {
        text-align: right;
        transform: translateX(-100vw) !important;
        left: 0 !important;
        right: auto !important;
        box-shadow: 8px 0 32px rgba(0, 0, 0, 0.15) !important;
    }

    html[dir="rtl"] .ep-header__nav.active {
        transform: translateX(0) !important;
    }

    /* Mobile toggle position in RTL */
    html[dir="rtl"] .ep-mobile-toggle {
        order: -1;
    }

    /* Navigation items alignment */
    html[dir="rtl"] .ep-nav__link {
        flex-direction: row-reverse !important;
    }

    html[dir="rtl"] .ep-nav__link-content {
        flex-direction: row-reverse !important;
    }

    /* Chevron position for RTL */
    html[dir="rtl"] .ep-nav__item.has-megamenu .ep-nav__link::after {
        order: -1;
        margin-left: auto;
        margin-right: 0;
    }

    /* Mega menu in RTL */
    html[dir="rtl"] .ep-mega-menu {
        text-align: right;
    }

    html[dir="rtl"] .ep-mega-menu__link {
        flex-direction: row-reverse !important;
    }

    html[dir="rtl"] .ep-mega-menu__column h3 {
        text-align: right;
    }

    /* Language switcher - keep centered */
    html[dir="rtl"] .ep-lang-switcher {
        direction: ltr;
    }
}

@media (max-width: 768px) {
    /* Mobile adjustments */
    html[dir="rtl"] .ep-hero__content-inner {
        text-align: start;
    }

    html[dir="rtl"] .ep-footer__brand {
        text-align: center;
    }

    html[dir="rtl"] .ep-footer__links {
        text-align: center;
    }
}