/* ============================================
   RTL SUPPORT FOR ARABIC - VERSION SIMPLIFIÉE
   Header isolé du RTL pour garder le même layout visuel
   ============================================ */

/* Base RTL */
html[dir="rtl"] {
    direction: rtl;
}

html[dir="rtl"] body {
    font-family: 'Cairo', 'Tajawal', 'Arial', sans-serif;
}

/* RTL pour texte uniquement */
html[dir="rtl"] p,
html[dir="rtl"] span,
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6,
html[dir="rtl"] li,
html[dir="rtl"] a {
    direction: rtl;
}

/* ============================================
   HEADER - ISOLATION COMPLÈTE DU RTL
   Le header garde EXACTEMENT le même layout qu'en EN/FR
   ============================================ */

/* Isoler complètement le header du RTL */
html[dir="rtl"] .header-1,
html[dir="rtl"] .header-1 .container-fluid,
html[dir="rtl"] .header-1 .mega-menu-wrapper,
html[dir="rtl"] .header-main {
    direction: ltr !important;
    unicode-bidi: isolate !important;
    isolation: isolate !important;
}

/* Forcer tous les enfants du header-main en LTR */
html[dir="rtl"] .header-main * {
    direction: ltr !important;
    unicode-bidi: embed !important;
}

/* Header-left et header-right - garder le layout original */
html[dir="rtl"] .header-main .header-left {
    order: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html[dir="rtl"] .header-main .header-right {
    order: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Header-right - garder justify-content-end */
html[dir="rtl"] .header-right {
    flex-direction: row !important;
    justify-content: flex-end !important;
}

/* Texte dans le header - aligner à droite pour l'arabe */
html[dir="rtl"] .header-main .main-menu ul li a {
    text-align: right;
}

html[dir="rtl"] .header-main .icon-items .content {
    text-align: right;
}

html[dir="rtl"] .header-main .icon-items .content p,
html[dir="rtl"] .header-main .icon-items .content h6 {
    text-align: right;
}

html[dir="rtl"] .header-main .header-button .header-btn {
    text-align: center;
    /* Le bouton reste centré */
}

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

html[dir="rtl"] .dropdown-menu {
    right: auto !important;
    left: 0 !important;
    text-align: right;
}

html[dir="rtl"] .dropdown-menu-end {
    left: 0 !important;
    right: auto !important;
}

html[dir="rtl"] .has-dropdown>.submenu {
    left: auto !important;
    right: 0 !important;
    text-align: right;
}

/* ============================================
   SECTIONS ISOLÉES DU RTL
   ============================================ */

/* Car Rentals - Isolation complète */
html[dir="rtl"] .car-rentals-section {
    direction: ltr !important;
    unicode-bidi: isolate !important;
    isolation: isolate !important;
}

html[dir="rtl"] .car-rentals-section * {
    direction: ltr !important;
    unicode-bidi: embed !important;
}

html[dir="rtl"] .car-rentals-wrapper {
    padding-left: 160px !important;
    padding-right: 160px !important;
    direction: ltr !important;
}

@media (max-width: 1899px) {
    html[dir="rtl"] .car-rentals-wrapper {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
}

html[dir="rtl"] .car-rentals-section .swiper,
html[dir="rtl"] .car-rentals-section .swiper-wrapper,
html[dir="rtl"] .car-rentals-section .swiper-slide {
    direction: ltr !important;
}

/* GLOBAL FIX FOR CAR CARDS IN RTL - APPLIES TO ALL SECTIONS */
/* GLOBAL FIX FOR CAR CARDS IN RTL - APPLIES TO ALL SECTIONS */
html[dir="rtl"] .car-rentals-items,
html[dir="rtl"] .car-rentals-section .icon-items,
html[dir="rtl"] .car-rentals-section-2 .icon-items {
    direction: ltr !important;
    text-align: left !important;
}

html[dir="rtl"] .car-rentals-items .car-content,
html[dir="rtl"] .car-rentals-section .car-content,
html[dir="rtl"] .car-rentals-section-2 .car-content {
    text-align: left !important;
}

html[dir="rtl"] .car-rentals-items .car-content h4,
html[dir="rtl"] .car-rentals-items .car-content h6,
html[dir="rtl"] .car-rentals-items .car-content .star {
    text-align: left !important;
}

html[dir="rtl"] .car-rentals-items .post-cat {
    left: auto !important;
    right: 30px !important;
}

/* Container for the two columns (ULs) */
html[dir="rtl"] .car-rentals-items .icon-items {
    direction: ltr !important;
    /* Removed overrides to match EN layout */
}

/* Fix ULs to not have RTL padding */
html[dir="rtl"] .car-rentals-items ul,
html[dir="rtl"] .car-rentals-items .icon-items ul {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    text-align: left !important;
}

/* Force LTR for list items: Icon + Text side-by-side */
html[dir="rtl"] .car-rentals-items li,
html[dir="rtl"] .car-rentals-items ul li,
html[dir="rtl"] .car-rentals-items .icon-items ul li {
    direction: ltr !important;
    text-align: left !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    /* Force Left alignment of contents */
    align-items: center !important;
    gap: 8px !important;
    /* Small gap between Icon and Text */
}

html[dir="rtl"] .car-rentals-wrapper {
    padding-left: 0px !important;
    padding-right: 0px !important;
    direction: ltr !important;
}

@media (max-width: 1199px) {
    html[dir="rtl"] .car-rentals-wrapper {
        padding-left: 45px !important;
        padding-right: 45px !important;
    }
}

@media (max-width: 991px) {
    html[dir="rtl"] .car-rentals-wrapper {
        padding-left: 45px !important;
        padding-right: 45px !important;
    }
}

/* Dégradé des images catégories inversé en AR (RTL) */
html[dir="rtl"] .popular-card-items .car-image,
html[dir="rtl"] .popular-card-items .car-image img,
html[dir="rtl"] .popular-card-items .car-image::before {
    border-radius: 10px 0 0 10px !important;
}
html[dir="rtl"] .popular-card-items .car-image::before {
    background: linear-gradient(270deg, #fefdfd 0%, rgba(254, 253, 253, 0) 100%) !important;
}

/* Popular cards - RTL mobile: dégradé blanc inversé */
@media (max-width: 991px) {
    html[dir="rtl"] .popular-card-items .car-image,
    html[dir="rtl"] .popular-card-items .car-image img,
    html[dir="rtl"] .popular-card-items .car-image::before {
        border-radius: 10px 0 0 10px !important;
    }
    html[dir="rtl"] .popular-card-items .car-image::before {
        background: linear-gradient(270deg, #fefdfd 0%, rgba(254, 253, 253, 0) 100%) !important;
    }
}

/* Testimonials - Isolation complète */
html[dir="rtl"] .testimonial-section {
    direction: ltr !important;
    unicode-bidi: isolate !important;
    isolation: isolate !important;
}

html[dir="rtl"] .testimonial-section * {
    direction: ltr !important;
    unicode-bidi: embed !important;
}

html[dir="rtl"] .testimonial-section .swiper,
html[dir="rtl"] .testimonial-section .swiper-wrapper,
html[dir="rtl"] .testimonial-section .swiper-slide {
    direction: ltr !important;
}

html[dir="rtl"] .testimonial-section .testimonial-items-top {
    text-align: right !important;
}

html[dir="rtl"] .testimonial-section .testimonial-items-top p {
    text-align: right !important;
}

html[dir="rtl"] .testimonial-section .testimonial-items-top .star {
    text-align: right !important;
}

html[dir="rtl"] .testimonial-section .testimonial-items-top::before {
    right: 41px !important;
    left: auto !important;
    transform-origin: bottom left !important;
}

html[dir="rtl"] .testimonial-section .testimonial-items-top::after {
    right: 50px !important;
    left: auto !important;
    border-right: 1px solid transparent !important;
    border-left: none !important;
    -webkit-clip-path: polygon(100% 0, 0 0, 100% 100%) !important;
    clip-path: polygon(100% 0, 0 0, 100% 100%) !important;
}

html[dir="rtl"] .testimonial-section .testimoni-bg-shape::after {
    left: 0 !important;
    right: auto !important;
}

html[dir="rtl"] .testimonial-section .client-info-items {
    flex-direction: row !important;
}

/* Brand Slider - Isolation complète */
html[dir="rtl"] .brand-logos-section-modern {
    direction: ltr !important;
    unicode-bidi: isolate !important;
    isolation: isolate !important;
}

html[dir="rtl"] .brand-logos-section-modern * {
    direction: ltr !important;
    unicode-bidi: embed !important;
}

html[dir="rtl"] .brand-slider-modern .swiper-wrapper {
    direction: ltr !important;
}

html[dir="rtl"] .brand-slider-modern .swiper-slide {
    direction: ltr !important;
}

html[dir="rtl"] .brand-card-modern {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

html[dir="rtl"] .brand-card-modern img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* ============================================
   FORMULAIRES
   ============================================ */
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
    text-align: right;
    direction: rtl;
}

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

html[dir="rtl"] .form-clt input,
html[dir="rtl"] .form-clt textarea {
    text-align: right;
}

/* ============================================
   AUTRES SECTIONS
   ============================================ */
html[dir="rtl"] .news-card-items {
    text-align: right;
}

html[dir="rtl"] .feature-benefit-items {
    direction: ltr;
    text-align: left;

}

html[dir="rtl"] .team-card-items {
    text-align: right;
}

/* ============================================
   NAVIGATION SWIPER
   ============================================ */
html[dir="rtl"] .swiper-button-next {
    left: 10px !important;
    right: auto !important;
}

html[dir="rtl"] .swiper-button-prev {
    right: 10px !important;
    left: auto !important;
}

html[dir="rtl"] .swiper-button-next::after {
    content: '←';
}

html[dir="rtl"] .swiper-button-prev::after {
    content: '→';
}

/* ============================================
   TEXT ALIGNMENT UTILITIES
   ============================================ */
html[dir="rtl"] .text-start {
    text-align: right !important;
}

html[dir="rtl"] .text-end {
    text-align: left !important;
}

html[dir="rtl"] .text-left {
    text-align: right !important;
}

html[dir="rtl"] .text-right {
    text-align: left !important;
}

/* ============================================
   LISTS
   ============================================ */
html[dir="rtl"] ul {
    padding-right: 0;
    padding-left: 20px;
}

html[dir="rtl"] .about-list-item ul {
    padding-right: 0;
    padding-left: 20px;
}

/* ============================================
   LANGUAGE SWITCHER - FLAGS
   ============================================ */
.lang-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 4px 8px !important;
    min-width: 40px !important;
    height: 32px !important;
    transition: all 0.3s ease !important;
}

.lang-btn svg {
    width: 24px !important;
    height: 18px !important;
    display: block !important;
    transition: all 0.3s ease !important;
}

.lang-btn:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
}

.lang-btn.active {
    background: #FF3726 !important;
    color: #fff !important;
    border-color: #FF3726 !important;
    box-shadow: 0 2px 8px rgba(255, 55, 38, 0.3) !important;
}

.lang-btn.active svg {
    filter: brightness(0) invert(1) !important;
}

@media (max-width: 767px) {
    .lang-btn {
        padding: 3px 6px !important;
        min-width: 35px !important;
        height: 28px !important;
    }

    .lang-btn svg {
        width: 20px !important;
        height: 15px !important;
    }
}

/* ============================================
   OFFCANVAS
   ============================================ */
html[dir="rtl"] .offcanvas__content {
    text-align: right;
}

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

html[dir="rtl"] .offcanvas__contact ul {
    padding-right: 0;
    padding-left: 0;
}

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

html[dir="rtl"] .single-footer-widget {
    text-align: right;
}
/* Footer newsletter : bouton bleu à gauche en arabe */
html[dir="rtl"] .footer-widgets-wrapper .single-footer-widget .footer-content .footer-input .newsletter-btn {
    right: auto;
    left: 12px;
  }
/* ============================================
   BUTTONS
   ============================================ */
html[dir="rtl"] .theme-btn i.fa-arrow-right,
html[dir="rtl"] .theme-btn i.fa-arrow-right-long {
    transform: scaleX(-1);
}

html[dir="rtl"] .link-btn i.fa-arrow-right {
    transform: scaleX(-1);
}
/* Flèche de la bannière de recherche inversée en AR */
html[dir="rtl"] .hero-search-banner .hero-search-btn i,
html[dir="rtl"] .hero-search-btn i.fa-arrow-right {
    transform: scaleX(-1);
}
/* Bannière de recherche en arabe : espace texte + flèche au bord */
html[dir="rtl"] .search-input-wrapper {
    padding-left: 8px;
    padding-right: 20px;
}
html[dir="rtl"] .hero-search-btn {
    margin-left: 0;
    margin-right: 0;
}
/* ============================================
   SECTION TITLES
   ============================================ */
html[dir="rtl"] .section-title {
    text-align: right;
}

/* ============================================
   CONTACT SECTION
   ============================================ */
html[dir="rtl"] .contact-right-items {
    text-align: right;
}

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

/* ============================================
   NEWS CARDS
   ============================================ */
html[dir="rtl"] .news-cont {
    text-align: right;
}

html[dir="rtl"] .news-content ul {
    flex-direction: row-reverse;
}

/* ============================================
   ABOUT SECTION
   ============================================ */
html[dir="rtl"] .about-content {
    text-align: right;
}

html[dir="rtl"] .about-list-wrapper {
    text-align: right;
}

/* ============================================
   CAR DETAILS
   ============================================ */
html[dir="rtl"] .car-details-content {
    text-align: right;
}

/* ============================================
   GALLERY
   ============================================ */
html[dir="rtl"] .gallery-image {
    text-align: right;
}

/* ============================================
   FAQ
   ============================================ */
html[dir="rtl"] .faq-content {
    text-align: right;
}

/* ============================================
   MOBILE - HAMBURGER MENU
   ============================================ */
@media (max-width: 1199px) {

    /* EN/FR - S'assurer que tous les éléments sont visibles */
    .header__hamburger {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin-left: 15px !important;
        margin-right: 0 !important;
        flex-shrink: 0 !important;
    }

    .header-right {
        gap: 15px !important;
        display: flex !important;
        align-items: center !important;
    }

    .header-right .search-icon {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        flex-shrink: 0 !important;
    }

    .header-right .header__hamburger {
        order: 999 !important;
        flex-shrink: 0 !important;
    }

    /* AR - Même comportement car le header est isolé du RTL */
    html[dir="rtl"] .header__hamburger {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin-left: 15px !important;
        margin-right: 0 !important;
        order: 999 !important;
        flex-shrink: 0 !important;
    }

    html[dir="rtl"] .header-right {
        gap: 15px !important;
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
    }

    html[dir="rtl"] .header-right .search-icon {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        flex-shrink: 0 !important;
    }
}

/* ============================================
   MOBILE RTL - HEADER LAYOUT
   Correction pour que tout reste sur une ligne
   ============================================ */
@media (max-width: 991px) {

    /* EN/FR - S'assurer que le header reste sur une ligne */
    .header-main {
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    .header-left {
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 15px !important;
    }

    .header-right {
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 15px !important;
    }

    .language-switcher {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        flex-shrink: 0 !important;
        margin-left: 15px !important;
        margin-right: 0 !important;
    }

    /* AR - Même layout car le header est isolé du RTL */
    html[dir="rtl"] .header-main {
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    html[dir="rtl"] .header-left {
        order: 0 !important;
        width: auto !important;
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 15px !important;
        margin-bottom: 0 !important;
        justify-content: flex-start !important;
    }

    html[dir="rtl"] .header-right {
        order: 0 !important;
        width: auto !important;
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        gap: 15px !important;
        margin-top: 0 !important;
        justify-content: flex-end !important;
    }

    html[dir="rtl"] .language-switcher {
        margin-right: 0 !important;
        margin-left: 15px !important;
        flex-shrink: 0 !important;
    }

    html[dir="rtl"] .header-button {
        order: 0 !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex-shrink: 0 !important;
    }
}

@media (max-width: 767px) {

    /* EN/FR - Ajustements pour très petits écrans */
    .header-main {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .header-left {
        flex-shrink: 0 !important;
        min-width: auto !important;
    }

    .header-right {
        flex-shrink: 0 !important;
        flex-wrap: nowrap !important;
        gap: 10px !important;
    }

    .language-switcher {
        gap: 6px !important;
        margin-left: 10px !important;
    }

    .language-switcher .lang-btn {
        padding: 5px 10px !important;
        font-size: 11px !important;
    }

    .header-right .search-icon {
        font-size: 18px !important;
    }

    .header-right .header__hamburger {
        margin-left: 10px !important;
    }

    /* AR - Même comportement */
    html[dir="rtl"] .header-main {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    html[dir="rtl"] .header-left {
        width: auto !important;
        flex-shrink: 0 !important;
        min-width: auto !important;
        justify-content: flex-start !important;
        margin-bottom: 0 !important;
    }

    html[dir="rtl"] .language-switcher {
        margin-left: 10px !important;
        margin-right: 0 !important;
        gap: 6px !important;
    }

    html[dir="rtl"] .language-switcher .lang-btn {
        padding: 5px 10px !important;
        font-size: 11px !important;
    }

    html[dir="rtl"] .header-right {
        width: auto !important;
        flex-shrink: 0 !important;
        flex-wrap: nowrap !important;
        gap: 10px !important;
        justify-content: flex-end !important;
    }

    html[dir="rtl"] .header-right .search-icon {
        font-size: 18px !important;
    }

    html[dir="rtl"] .header-right .header__hamburger {
        margin-left: 10px !important;
    }

    html[dir="rtl"] .header-button {
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        flex-shrink: 0 !important;
    }

    html[dir="rtl"] .icon-items {
        flex: 0 0 auto !important;
        min-width: auto !important;
    }
}

/* ============================================
   LANGUAGE SWITCHER DROPDOWN
   ============================================ */
.language-switcher-dropdown {
    position: relative !important;
    display: inline-block !important;
}

.lang-dropdown-btn {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 12px !important;
    border: 1px solid #ddd !important;
    background: #fff !important;
    cursor: pointer !important;
    border-radius: 4px !important;
    min-width: 80px !important;
    transition: all 0.3s ease !important;
}

.lang-dropdown-btn:hover {
    border-color: #FF3726 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.lang-dropdown-btn.active .fa-chevron-down {
    transform: rotate(180deg) !important;
}

.lang-dropdown-btn .lang-flag {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

.lang-dropdown-btn .lang-flag svg {
    width: 20px !important;
    height: 15px !important;
    border-radius: 2px !important;
}

.lang-dropdown-btn .lang-code {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333 !important;
}

.lang-dropdown-menu {
    position: absolute !important;
    top: calc(100% + 5px) !important;
    left: 0 !important;
    right: auto !important;
    bottom: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(0) !important;
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15) !important;
    min-width: 100% !important;
    z-index: 10000 !important;
    overflow: hidden !important;
    animation: fadeInDown 0.3s ease !important;
}

/* Pour RTL, inverser le positionnement horizontal mais garder en dessous */
html[dir="rtl"] .lang-dropdown-menu {
    left: 0 !important;
    right: auto !important;
    top: calc(100% + 5px) !important;
    bottom: auto !important;
    transform: translateY(0) !important;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.lang-option {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 10px 15px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1) !important;
    user-select: none !important;
}

.lang-option:not(:last-child) {
    border-bottom: 1px solid #f0f0f0 !important;
}

.lang-option:hover {
    background: #f8f8f8 !important;
}

.lang-option.active {
    background: #fff5f5 !important;
}

.lang-option .lang-flag {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

.lang-option .lang-flag svg {
    width: 24px !important;
    height: 18px !important;
    border-radius: 2px !important;
}

.lang-option span:last-child {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #333 !important;
}

/* Fermer le dropdown en cliquant ailleurs */
body.lang-dropdown-open::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999;
    pointer-events: none !important;
    /* Permet aux clics de passer à travers */
}

@media (max-width: 767px) {
    .lang-dropdown-btn {
        min-width: 70px !important;
        padding: 5px 10px !important;
    }

    .lang-dropdown-btn .lang-flag svg {
        width: 18px !important;
        height: 13px !important;
    }

    .lang-dropdown-btn .lang-code {
        font-size: 12px !important;
    }

    /* Correction du positionnement du menu déroulant sur mobile */
    .lang-dropdown-menu {
        top: calc(100% + 5px) !important;
        left: auto !important;
        right: 0 !important;
        bottom: auto !important;
        min-width: 120px !important;
        max-width: 150px !important;
        transform: translateY(0) !important;
    }

    /* Pour RTL, inverser le positionnement */
    html[dir="rtl"] .lang-dropdown-menu {
        left: 0 !important;
        right: auto !important;
        top: calc(100% + 5px) !important;
        bottom: auto !important;
        transform: translateY(0) !important;
    }

    /* Ajuster les options du menu sur mobile */
    .lang-option {
        padding: 8px 12px !important;
        gap: 8px !important;
        pointer-events: auto !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1) !important;
    }

    .lang-option .lang-flag svg {
        width: 20px !important;
        height: 15px !important;
    }

    .lang-option span:last-child {
        font-size: 13px !important;
    }
}

/* Ajustement supplémentaire pour très petits écrans */
@media (max-width: 575px) {
    .language-switcher-dropdown {
        margin-left: 10px !important;
        position: relative !important;
        z-index: 10001 !important;
    }

    .lang-dropdown-btn {
        min-width: 65px !important;
        padding: 4px 8px !important;
        position: relative !important;
    }

    .lang-dropdown-menu {
        top: calc(100% + 5px) !important;
        bottom: auto !important;
        left: auto !important;
        right: 0 !important;
        min-width: 110px !important;
        max-width: 140px !important;
        transform: translateY(0) !important;
        position: absolute !important;
        z-index: 10002 !important;
    }

    /* Pour RTL sur très petits écrans */
    html[dir="rtl"] .lang-dropdown-menu {
        left: 0 !important;
        right: auto !important;
        top: calc(100% + 5px) !important;
        bottom: auto !important;
        transform: translateY(0) !important;
        position: absolute !important;
        z-index: 10002 !important;
    }
}

/* Correction supplémentaire pour écrans encore plus petits */
@media (max-width: 480px) {
    .lang-dropdown-menu {
        top: calc(100% + 5px) !important;
        bottom: auto !important;
        transform: translateY(0) !important;
        position: absolute !important;
        z-index: 10002 !important;
    }

    /* Pour RTL sur très petits écrans */
    html[dir="rtl"] .lang-dropdown-menu {
        left: 0 !important;
        right: auto !important;
        top: calc(100% + 5px) !important;
        bottom: auto !important;
        transform: translateY(0) !important;
        position: absolute !important;
        z-index: 10002 !important;
    }
}

/* S'assurer que le header n'interfère pas */
.header-1,
.header-1 .container-fluid,
.header-main,
.header-right {
    overflow: visible !important;
}

.language-switcher-dropdown {
    overflow: visible !important;
}

/* Règles RTL spécifiques pour le conteneur */
html[dir="rtl"] .language-switcher-dropdown {
    position: relative !important;
    overflow: visible !important;
    z-index: 10001 !important;
}

html[dir="rtl"] .header-1,
html[dir="rtl"] .header-1 .container-fluid,
html[dir="rtl"] .header-main,
html[dir="rtl"] .header-right {
    overflow: visible !important;
}

/* ============================================
   MENU ICONS - SVG WITH RTL SUPPORT (CORRECTED)
   ============================================ */
.menu-item-with-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* EN/FR : Icon Left, Text Right */
html[dir="ltr"] .menu-item-with-icon,
html:not([dir]) .menu-item-with-icon {
    flex-direction: row;
}

/* AR : Icon Right, Text Left */
html[dir="rtl"] .menu-item-with-icon {
    flex-direction: row;
}

html[dir="rtl"] .menu-item-with-icon .menu-icon {
    order: 1 !important;
    /* Icon First (Right) */
    margin-left: 8px;
    margin-right: 0;
}

html[dir="rtl"] .menu-item-with-icon .menu-text {
    order: 2 !important;
    /* Text Second (Left) */
    text-align: right;
}

/* Force order in header */
html[dir="rtl"] .header-main .menu-item-with-icon {
    flex-direction: row !important;
}

html[dir="rtl"] .header-main .menu-item-with-icon .menu-icon {
    order: 1 !important;
}

html[dir="rtl"] .header-main .menu-item-with-icon .menu-text {
    order: 2 !important;
}

.menu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.menu-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.menu-text {
    flex: 1;
}

/* Popular Cards Icons */
.popular-card-items h4.menu-item-with-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}

html[dir="ltr"] .popular-card-items h4.menu-item-with-icon,
html:not([dir]) .popular-card-items h4.menu-item-with-icon {
    flex-direction: row;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon {
    flex-direction: row;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon .menu-icon {
    order: 1 !important;
    /* Icon First */
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon .menu-text {
    order: 2 !important;
    /* Text Second */
}


/* ============================================
   MOBILE ADJUSTMENTS (Global & RTL)
   ============================================ */
@media (max-width: 991px) {

    /* Reduce huge breadcrumb padding */
    .breadcrumb-wrapper {
        padding: 60px 0 40px !important;
    }

    /* Responsive H1 sizing */
    .hero-content h1,
    .breadcrumb-content h1 {
        font-size: 32px !important;
        line-height: 1.2 !important;
    }

    /* Fix Language Switcher Overlap */
    .language-switcher-dropdown {
        margin-left: 0 !important;
        margin-right: 15px;
        position: relative;
        z-index: 1002;
    }

    .lang-dropdown-btn {
        padding: 4px 8px !important;
        min-width: 70px !important;
    }

    /* Ensure dropdown opens correctly */
    .lang-dropdown-menu {
        top: 100% !important;
        right: auto !important;
        left: 0 !important;
        min-width: 140px !important;
        z-index: 99999 !important;
        box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15) !important;
    }

    /* Fix Mobile Menu in RTL */
    html[dir="rtl"] .mean-container .mean-nav {
        text-align: right;
    }

    html[dir="rtl"] .mean-container .mean-nav ul li a {
        text-align: right;
        padding-right: 5%;
    }

    html[dir="rtl"] .mean-container .mean-nav ul li a.mean-expand {
        right: 0 !important;
        left: auto !important;
        text-align: center;
    }
}

/* Menu offcanvas en AR : symbole + à gauche pour ne pas chevaucher le texte */
html[dir="rtl"] .offcanvas__content .mobile-menu.mean-container .mean-nav ul li a.mean-expand {
    left: 0 !important;
    right: auto !important;
}

html[dir="rtl"] .offcanvas__content .mobile-menu.mean-container .mean-nav ul li > a:not(.mean-expand) {
    padding-left: 38px !important;
    padding-right: 12px !important;
}

/* EN/FR : Icône avant le texte (à gauche) */
html[dir="ltr"] .menu-item-with-icon,
html:not([dir]) .menu-item-with-icon {
    flex-direction: row;
}

/* AR : Icône après le texte (à droite) - TEXTE puis ICONE */
html[dir="rtl"] .menu-item-with-icon {
    flex-direction: row;
}

html[dir="rtl"] .menu-item-with-icon .menu-icon {
    order: 2 !important;
}

html[dir="rtl"] .menu-item-with-icon .menu-text {
    order: 1 !important;
}

/* Forcer l'ordre même dans le header (qui est isolé du RTL) */
html[dir="rtl"] .header-main .menu-item-with-icon {
    flex-direction: row !important;
}

html[dir="rtl"] .header-main .menu-item-with-icon .menu-icon {
    order: 2 !important;
}

html[dir="rtl"] .header-main .menu-item-with-icon .menu-text {
    order: 1 !important;
}

.menu-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
}

.menu-icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.menu-text {
    flex: 1;
}

/* Pour les cartes populaires */
.popular-card-items h4.menu-item-with-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}

html[dir="ltr"] .popular-card-items h4.menu-item-with-icon,
html:not([dir]) .popular-card-items h4.menu-item-with-icon {
    flex-direction: row;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon {
    flex-direction: row;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon .menu-icon {
    order: 2 !important;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon .menu-text {
    order: 1 !important;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon .menu-icon {
    order: 2 !important;
}

html[dir="rtl"] .popular-card-items h4.menu-item-with-icon .menu-text {
    order: 1 !important;
}

/* ============================================
   MENU ICONS - RTL ROTATION & ORDER
   ============================================ */
/* Rotation de la flèche (vers la gauche) */
html[dir="rtl"] .menu-item-with-icon .fa-chevron-right {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}

/* Force l'ordre : Texte en premier, Icône en deuxième pour l'Arabe */
html[dir="rtl"] .menu-item-with-icon .menu-text {
    order: 1 !important;
    margin-left: 10px;
    margin-right: 0;
}

html[dir="rtl"] .menu-item-with-icon .menu-icon {
    order: 2 !important;
}