/**
 * EVENTA Core - RTL Fix Styles
 * RTL compatibility fixes for Arabic language support via WPML
 * This file should be loaded only when dir="rtl" is set on HTML element
 * 
 * Target files overrides: extra.css, styles.min.css, widgets-base.css
 */

/* ============================================
   1. BASE RTL OVERRIDES
   ============================================ */

[dir="rtl"] {
    direction: rtl;
    unicode-bidi: bidi-override;
    text-align: right;
}

/* Fix text alignment utilities */
[dir="rtl"] .text-left {
    text-align: right !important;
}

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

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

/* ============================================
   2. MARGIN AND PADDING SWAPS
   ============================================ */

/* Swapping Margin/Padding Left and Right */
[dir="rtl"] .ml-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

[dir="rtl"] .mr-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Font Awesome Lists */
[dir="rtl"] .fa-ul {
    margin-right: var(--fa-li-margin, 2.5em) !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
}

[dir="rtl"] .fa-li {
    right: calc(var(--fa-li-width, 2em) * -1) !important;
    left: auto !important;
}

/* Top Bar fixes */
[dir="rtl"] .top-bar-left span {
    margin-right: 0 !important;
    margin-left: 20px !important;
}

/* Icons in links/lists */
[dir="rtl"] .footer-section ul li i,
[dir="rtl"] .contact-details i {
    margin-right: 0 !important;
    margin-left: 10px !important;
}

[dir="rtl"] .submit-btn .fa-spinner {
    margin-right: 0 !important;
    margin-left: 8px !important;
}

/* Privacy Policy (extra.css) */
[dir="rtl"] .policy-section-block .section-content ul {
    padding-right: 0 !important;
    padding-left: 20px !important;
}

[dir="rtl"] .policy-section-block .section-content ul li::before {
    right: auto !important;
    left: -20px !important;
}
[dir="rtl"] .filter-select .chevron {
    
      right: unset !important;
    left: 16px !important; 
}
    html[dir="rtl"] input[type="tel"] {
    text-align: right;
}
/* ============================================
   3. POSITIONING FIXES (Right <-> Left)
   ============================================ */
  
 
 
 
[dir="rtl"] .decoration-bottom-left {
    left: auto !important;
    right: 0 !important;
}

[dir="rtl"] .decoration-bottom-right {
    right: auto !important;
    left: 0 !important;
}

[dir="rtl"] .sn_sidebar-wave {
    right: auto !important;
    left: 0 !important;
    transform: scaleX(-1);
}

[dir="rtl"] .sn_sidebar-card img {
    inset-inline-end: auto !important;
    inset-inline-start: 0 !important;
    transform: scaleX(-1);
}

/* Search bar positioning */
[dir="rtl"] .search-submit {
    right: auto !important;
    left: 5px !important;
}

/* Video popup close */
[dir="rtl"] .video-modal-close {
    right: auto !important;
    left: 20px !important;
}

/* ============================================
   4. BORDER RADIUS MIRRORING
   ============================================ */

/* Generic asymmetrical radius */
[dir="rtl"] .card-3 {
    border-radius: 12px 38px 38px 38px !important;
    /* Mirrored from 38 12 38 38 */
}

/* Hero and large sections */
[dir="rtl"] .exhibition-booth-section {
    border-radius: 40px !important;
    /* Maintain symmetry if specified */
}

/* Specific asymmetrical found in styles.min.css */
/* Example: 300px 200px 0 300px -> 200px 300px 300px 0 */
[dir="rtl"] .hero-diagonal-shape {
    border-radius: 200px 300px 300px 0 !important;
}

/* ============================================
   5. TRANSFORM AND TRANSITION MIRRORING
   ============================================ */

/* Hover slide effects */
[dir="rtl"] .nav-menu ul li a:hover,
[dir="rtl"] .nav-menu ul li a.active {
    transform: translateX(-2px) !important;
}

[dir="rtl"] .read-more:hover {
    transform: translateX(-8px) rotate(-133deg) !important;
}

[dir="rtl"] .read-more:hover i {
    transform: translateX(-4px) rotate(-133deg) !important;
}
 /* Service card hover rotations mirroring */
[dir="rtl"] .service-card.card-1:hover {
    transform: rotate(3.66deg) translateY(-12px) !important;
    /* Mirrored from -3.66 */
}

[dir="rtl"] .service-card.card-2:hover {
    transform: rotate(-3.66deg) translateY(-12px) !important;
    /* Mirrored from 3.66 */
}

/* Shine effect mirror */
@keyframes statShineRTL {
    0% {
        transform: translateX(-100%) translateY(-50%);
    }

    100% {
        transform: translateX(100%) translateY(-50%);
    }
}

/* Slider animations */
@keyframes slideLeftRTL {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(50%);
    }
}

/* ============================================
   6. FLEXBOX AND GRID RTL FIXES
   ============================================ */

[dir="rtl"] .service-content,
[dir="rtl"] .sn_header-row,
[dir="rtl"] .sn_content-grid,
[dir="rtl"] .policy-wrapper {
    direction: rtl !important;
}

[dir="rtl"] .booth-buttons {
    flex-direction: row-reverse !important;
}

/* ============================================
   7. ARABIC TYPOGRAPHY (CRITICAL)
   ============================================ */

/* Import Fonts */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&family=Tajawal:wght@400;500;700;900&display=swap');

[dir="rtl"] body,
[dir="rtl"] p,
[dir="rtl"] a,
[dir="rtl"] li,
[dir="rtl"] span,
[dir="rtl"] label,
[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select,
[dir="rtl"] button {
    font-family: 'Cairo', 'Tajawal', 'Segoe UI', Tahoma, sans-serif !important;
}

[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6,
[dir="rtl"] .service-title,
[dir="rtl"] .sn_job-title,
[dir="rtl"] .booth-title {
    font-family: 'Cairo', 'Tajawal', 'Segoe UI', Tahoma, sans-serif !important;
    font-weight: 700 !important;
}

/* Fix line heights for Arabic font */
[dir="rtl"] p {
    line-height: 1.8 !important;
}

/* ============================================
   8. COMPONENT SPECIFIC FIXES (Career, Navbar, etc)
   ============================================ */

/* Career Sidebar */
[dir="rtl"] .sn_sidebar-card {
    text-align: right !important;
}

/* Swiper Navigation (Flipping arrows) */
/*[dir="rtl"] .swiper-button-next::after,*/
/*[dir="rtl"] .swiper-button-prev::after {*/
/*    transform: scaleX(-1) !important;*/
/*}*/

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

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

/* Form Select arrow flip */
[dir="rtl"] select {
    background-position: left 0.75rem center !important;
    padding-left: 2rem !important;
    padding-right: 0.75rem !important;
}
html[dir="rtl"] .about-card h2 {
    line-height: 1.7;
}
html[dir="rtl"] .about-card .orange-text {
 
}
html[dir="rtl"]  .vector_gal3 {
    left: unset !important;
    right: 20% !important;
    
}
html[dir="rtl"] .vector_gal2 {
     left: 0  !important;
      right: unset !important;
 }
 html[dir="rtl"] .vector_gal1, html[dir="rtl"] .vector_gal1_about {
    right: 0;
    max-width: 80px;
    transform: scaleX(-1);
    left: unset;
}
 
    html[dir="rtl"]   .footer-card::before {
       right: unset !important;
    left: -60px !important;
    
}

   html[dir="rtl"]  img.how_work-card-img {
    
    left: 34%;
     
    transform: translate(-50%, -50%) scaleX(-1);
    
}
html[dir="rtl"] .read-more:hover {
    transform: translateX(-8px)  !important;
}


html[dir="rtl"] .blogs-section .swiper-button-next::after,html[dir="rtl"]  .blogs-section .swiper-button-prev::after {
    transform: scaleX(-1);
}

html[dir="rtl"] .select-group .select-arrow {
      right: unset !important;
    left: 10px !important;
     
}


.faq-item.open .faq-toggle {
    
    transform: rotate(0) !important
}
html[dir="rtl"] .fa-arrow-right {
    transform: scaleX(-1);
}
html[dir="rtl"]  .read-more i {
    transform: rotate(-133deg) !important;
}
html[dir="rtl"] .page-arrow {
    transform: scaleX(-1); 
}
html[dir="rtl"] input#phone {
    text-align: right;
}
img.how_work-card-img {
    position: absolute;
    width: 151%;
    left: 66%;
    top: 50%;
    max-width: none;
    transform: translate(-50%, -50%);
    height: 117%;
}
html[dir="rtl"] .newsletter-btn svg {
   
    transform: rotate(-133deg)
}
/* ============================================
   9. MISC FIXES
   ============================================ */

[dir="rtl"] blockquote {
    border-left: none !important;
    border-right: 4px solid #dd5023 !important;
    padding-left: 0 !important;
    padding-right: 20px !important;
}