/**
 * RTL (Right-to-Left) CSS Fixes
 * 3layna - Lebanese Marketplace
 * 
 * This file contains CSS fixes and adjustments for Arabic/RTL language support
 */

/* ===== General RTL Fixes ===== */

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

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

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

/* ===== Margin and Padding Fixes ===== */

/* Margin End (me) becomes Margin Start in RTL */
[dir="rtl"] .me-1 { margin-right: 0; margin-left: 0.25rem !important; }
[dir="rtl"] .me-2 { margin-right: 0; margin-left: 0.5rem !important; }
[dir="rtl"] .me-3 { margin-right: 0; margin-left: 1rem !important; }
[dir="rtl"] .me-4 { margin-right: 0; margin-left: 1.5rem !important; }
[dir="rtl"] .me-5 { margin-right: 0; margin-left: 3rem !important; }
[dir="rtl"] .me-auto { margin-right: 0; margin-left: auto !important; }

/* Margin Start (ms) becomes Margin End in RTL */
[dir="rtl"] .ms-1 { margin-left: 0; margin-right: 0.25rem !important; }
[dir="rtl"] .ms-2 { margin-left: 0; margin-right: 0.5rem !important; }
[dir="rtl"] .ms-3 { margin-left: 0; margin-right: 1rem !important; }
[dir="rtl"] .ms-4 { margin-left: 0; margin-right: 1.5rem !important; }
[dir="rtl"] .ms-5 { margin-left: 0; margin-right: 3rem !important; }
[dir="rtl"] .ms-auto { margin-left: 0; margin-right: auto !important; }

/* Padding End (pe) becomes Padding Start in RTL */
[dir="rtl"] .pe-1 { padding-right: 0; padding-left: 0.25rem !important; }
[dir="rtl"] .pe-2 { padding-right: 0; padding-left: 0.5rem !important; }
[dir="rtl"] .pe-3 { padding-right: 0; padding-left: 1rem !important; }
[dir="rtl"] .pe-4 { padding-right: 0; padding-left: 1.5rem !important; }
[dir="rtl"] .pe-5 { padding-right: 0; padding-left: 3rem !important; }

/* Padding Start (ps) becomes Padding End in RTL */
[dir="rtl"] .ps-1 { padding-left: 0; padding-right: 0.25rem !important; }
[dir="rtl"] .ps-2 { padding-left: 0; padding-right: 0.5rem !important; }
[dir="rtl"] .ps-3 { padding-left: 0; padding-right: 1rem !important; }
[dir="rtl"] .ps-4 { padding-left: 0; padding-right: 1.5rem !important; }
[dir="rtl"] .ps-5 { padding-left: 0; padding-right: 3rem !important; }

/* ===== Float Fixes ===== */

[dir="rtl"] .float-start {
  float: right !important;
}

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

/* ===== Icons and FontAwesome ===== */

/* Prevent icons from being mirrored */
[dir="rtl"] .fa,
[dir="rtl"] .fas,
[dir="rtl"] .far,
[dir="rtl"] .fal,
[dir="rtl"] .fab {
  /* Don't flip icons by default */
}

/* Some icons that should be flipped in RTL */
[dir="rtl"] .fa-chevron-right::before {
  content: "\f053"; /* chevron-left */
}

[dir="rtl"] .fa-chevron-left::before {
  content: "\f054"; /* chevron-right */
}

[dir="rtl"] .fa-angle-right::before {
  content: "\f104"; /* angle-left */
}

[dir="rtl"] .fa-angle-left::before {
  content: "\f105"; /* angle-right */
}

[dir="rtl"] .fa-arrow-right::before {
  content: "\f060"; /* arrow-left */
}

[dir="rtl"] .fa-arrow-left::before {
  content: "\f061"; /* arrow-right */
}

/* Flip subcategory card arrows in RTL */
[dir="rtl"] .subcategory-card-arrow i {
  transform: scaleX(-1);
}

[dir="rtl"] .subcategory-card-new:hover .subcategory-card-arrow i {
  transform: scaleX(-1) translateX(-4px) !important;
}

/* ===== Navbar Fixes ===== */

[dir="rtl"] .navbar-nav {
  padding-right: 0;
}

[dir="rtl"] .navbar-nav .nav-link {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}

[dir="rtl"] .navbar-toggler {
  margin-left: 0;
  margin-right: auto;
}

/* ===== Dropdown Fixes ===== */

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

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

[dir="rtl"] .dropdown-menu-start {
  left: auto;
  right: 0;
}

/* ===== Form Fixes ===== */

[dir="rtl"] input[type="text"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="password"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="search"],
[dir="rtl"] textarea,
[dir="rtl"] select {
  text-align: right;
  direction: rtl;
}

[dir="rtl"] input::placeholder,
[dir="rtl"] textarea::placeholder {
  text-align: right;
}

/* ===== Button Group Fixes ===== */

[dir="rtl"] .btn-group > .btn:not(:last-child):not(.dropdown-toggle) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
}

[dir="rtl"] .btn-group > .btn:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

/* ===== List Fixes ===== */

[dir="rtl"] ul,
[dir="rtl"] ol {
  padding-right: 2rem;
  padding-left: 0;
}

[dir="rtl"] .list-unstyled {
  padding-right: 0;
}

/* ===== Badge Fixes ===== */

[dir="rtl"] .badge {
  margin-left: 0.5rem;
  margin-right: 0;
}

/* ===== Card Fixes ===== */

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

/* ===== Modal Fixes ===== */

[dir="rtl"] .modal-header .btn-close {
  margin: -0.5rem auto -0.5rem -0.5rem;
}

/* ===== Alert Fixes ===== */

[dir="rtl"] .alert-dismissible {
  padding-left: 3rem;
  padding-right: 1rem;
}

[dir="rtl"] .alert-dismissible .btn-close {
  left: 0;
  right: auto;
}

/* ===== Custom Fixes for 3layna ===== */

/* Hero section text alignment */
[dir="rtl"] .hero-section {
  text-align: center;
}

/* Category cards */
[dir="rtl"] .category-card {
  text-align: center;
}

/* Stats section */
[dir="rtl"] .stats-section {
  text-align: center;
}

/* Features section */
[dir="rtl"] .features-section {
  text-align: center;
}

/* Footer adjustments */
[dir="rtl"] footer ul {
  padding-right: 0;
}

[dir="rtl"] footer .list-unstyled {
  text-align: right;
}

/* Navbar brand */
[dir="rtl"] .navbar-brand {
  margin-left: 1rem;
  margin-right: 0;
}

/* User avatar in navbar */
[dir="rtl"] .navbar .rounded-circle {
  margin-left: 0.5rem;
  margin-right: 0;
}

/* Gap utilities remain the same in RTL */
[dir="rtl"] .gap-1,
[dir="rtl"] .gap-2,
[dir="rtl"] .gap-3,
[dir="rtl"] .gap-4,
[dir="rtl"] .gap-5 {
  /* Gap doesn't need adjustment */
}

/* ===== Arabic Font Optimization ===== */

[lang="ar"] {
  font-family: 'Cairo', 'Tajawal', 'Amiri', 'Arial', sans-serif;
  line-height: 1.8; /* Better line height for Arabic text */
}

[lang="ar"] h1,
[lang="ar"] h2,
[lang="ar"] h3,
[lang="ar"] h4,
[lang="ar"] h5,
[lang="ar"] h6 {
  font-weight: 700;
  line-height: 1.5;
}

[lang="ar"] .display-1,
[lang="ar"] .display-2,
[lang="ar"] .display-3,
[lang="ar"] .display-4,
[lang="ar"] .display-5,
[lang="ar"] .display-6 {
  font-weight: 700;
}

/* Better spacing for Arabic text */
[lang="ar"] p {
  line-height: 1.9;
}

/* ===== Media Queries for RTL ===== */

@media (min-width: 768px) {
  [dir="rtl"] .text-md-start {
    text-align: right !important;
  }
  
  [dir="rtl"] .text-md-end {
    text-align: left !important;
  }
}

@media (min-width: 992px) {
  [dir="rtl"] .text-lg-start {
    text-align: right !important;
  }
  
  [dir="rtl"] .text-lg-end {
    text-align: left !important;
  }
}

/* ===== Performance Optimization ===== */

/* Prevent text shifting during language change - but allow animations */
[dir="rtl"] body,
[dir="rtl"] .navbar,
[dir="rtl"] .navbar-nav,
[dir="rtl"] .dropdown-menu,
[dir="rtl"] .btn-group {
  transition: none !important;
}

/* Ensure animations still work in RTL mode */
[dir="rtl"] .animate-on-scroll,
[dir="rtl"] .animate-on-scroll.animated,
[dir="rtl"] .fade-in,
[dir="rtl"] .fade-in-up,
[dir="rtl"] .category-card,
[dir="rtl"] .category-card *,
[dir="rtl"] .category-card:hover,
[dir="rtl"] .category-icon,
[dir="rtl"] .category-icon i,
[dir="rtl"] .category-icon img,
[dir="rtl"] .product-card,
[dir="rtl"] .product-card *,
[dir="rtl"] .product-card:hover,
[dir="rtl"] .product-card img,
[dir="rtl"] .subcategory-card-new,
[dir="rtl"] .subcategory-card-new *,
[dir="rtl"] .subcategory-card-new:hover,
[dir="rtl"] .subcategory-card-image,
[dir="rtl"] .subcategory-card-overlay,
[dir="rtl"] .subcategory-card-content,
[dir="rtl"] .subcategory-card-header,
[dir="rtl"] .subcategory-card-icon,
[dir="rtl"] .subcategory-card-icon i,
[dir="rtl"] .subcategory-card-icon img,
[dir="rtl"] .subcategory-card-title,
[dir="rtl"] .subcategory-card-description,
[dir="rtl"] .subcategory-card-footer,
[dir="rtl"] .subcategory-card-arrow,
[dir="rtl"] .subcategory-card-arrow i,
[dir="rtl"] .card,
[dir="rtl"] .card:hover,
[dir="rtl"] .browse-header-section,
[dir="rtl"] .browse-header-container,
[dir="rtl"] .browse-header-title,
[dir="rtl"] .browse-header-description,
[dir="rtl"] .browse-header-icon-col,
[dir="rtl"] .browse-header-icon-col *,
[dir="rtl"] .hero-section img,
[dir="rtl"] .hero-section h1,
[dir="rtl"] .hero-section p,
[dir="rtl"] .hero-section .d-flex,
[dir="rtl"] .feature-icon,
[dir="rtl"] .feature-icon:hover,
[dir="rtl"] .btn:hover,
[dir="rtl"] .btn:active,
[dir="rtl"] .logo-piece {
  transition: revert !important;
}