/* MAX TV PRO - RTL CSS (Arabic) */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap');

/* Override base styles for RTL */
[dir="rtl"] {
  font-family: "Tajawal", "Cairo", "Noto Sans Arabic", "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  unicode-bidi: plaintext;
}

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

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

/* Nav menu horizontal in desktop, vertical in mobile */
@media (min-width: 769px) {
  [dir="rtl"] .nav-menu {
    flex-direction: row-reverse;
  }
}

/* Dropdown menu should remain vertical in RTL */
[dir="rtl"] .dropdown-menu {
  left: auto;
  right: 0;
  text-align: right;
}

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

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

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

[dir="rtl"] .lang-switch {
  flex-direction: row-reverse;
}

/* Breadcrumbs RTL */
[dir="rtl"] .breadcrumb-list {
  flex-direction: row-reverse;
}

[dir="rtl"] .breadcrumb-list li:not(:last-child)::after {
  content: '/';
  margin-right: 0.5rem;
  margin-left: 0;
}

/* Features Grid RTL */
[dir="rtl"] .feature-card {
  text-align: center;
}

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

[dir="rtl"] .plan-features li {
  flex-direction: row-reverse;
}

[dir="rtl"] .plan-features li::before {
  margin-left: 0.75rem;
  margin-right: 0;
}

/* FAQ RTL */
[dir="rtl"] .faq-question {
  flex-direction: row-reverse;
}

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

/* WhatsApp Button RTL */
[dir="rtl"] .whatsapp-float {
  left: 20px;
  right: auto;
}

/* Telegram Button RTL */
[dir="rtl"] .telegram-float {
  left: 20px;
  right: auto;
}

/* Hero Features RTL */
[dir="rtl"] .hero-feature {
  flex-direction: row-reverse;
}

/* Mobile Menu RTL */
@media (max-width: 768px) {
  [dir="rtl"] .container {
    padding: 0 1rem;
  }
  
  [dir="rtl"] .nav {
    padding: 0.75rem 1rem;
  }
  
  [dir="rtl"] .nav-menu {
    text-align: right;
    padding: 1.5rem 1rem;
  }
  
  [dir="rtl"] .whatsapp-float {
    left: 20px;
    right: auto;
  }
  
  [dir="rtl"] .telegram-float {
    left: 20px;
    right: auto;
  }
  
  /* Logo RTL */
  [dir="rtl"] .logo {
    flex: 1;
    max-width: 70%;
  }
  
  /* Mobile Dropdown RTL */
  [dir="rtl"] .dropdown-toggle {
    text-align: right;
    flex-direction: row-reverse;
  }
  
  [dir="rtl"] .dropdown-arrow {
    margin-left: 0;
    margin-right: 0.5rem;
  }
  
  [dir="rtl"] .dropdown-menu {
    border-left: none;
    border-right: 2px solid var(--accent);
    margin-left: 0;
    margin-right: 1rem;
    padding-left: 0;
    padding-right: 1rem;
  }
  
  [dir="rtl"] .dropdown-item {
    text-align: right;
  }
  
  [dir="rtl"] .dropdown-section {
    text-align: right;
  }
}

/* Tablets and iPad RTL (481px - 768px) */
@media (min-width: 481px) and (max-width: 768px) {
  [dir="rtl"] .container {
    padding: 0 1.5rem;
  }
  
  [dir="rtl"] .nav {
    padding: 1rem 1.5rem;
  }
  
  [dir="rtl"] .nav-menu {
    padding: 2rem 1.5rem;
  }
  
  [dir="rtl"] .dropdown-menu {
    margin-right: 1rem;
    padding-right: 1rem;
  }
}

/* Small Phones RTL (376px - 480px) */
@media (min-width: 376px) and (max-width: 480px) {
  [dir="rtl"] .container {
    padding: 0 0.875rem;
  }
  
  [dir="rtl"] .nav {
    padding: 0.625rem 0.875rem;
  }
  
  [dir="rtl"] .nav-menu {
    padding: 1.5rem 0.875rem;
  }
  
  [dir="rtl"] .dropdown-menu {
    margin-right: 0.75rem;
    padding-right: 0.75rem;
  }
  
  [dir="rtl"] .whatsapp-float {
    left: 18px;
  }
  
  [dir="rtl"] .telegram-float {
    left: 18px;
  }
  
  [dir="rtl"] .back-to-top {
    left: 18px;
    right: auto;
  }
}

/* Extra Small Devices RTL (iPhone SE, ≤375px) */
@media (max-width: 375px) {
  [dir="rtl"] .container {
    padding: 0 0.75rem;
  }
  
  [dir="rtl"] .nav {
    padding: 0.5rem 0.75rem;
  }
  
  [dir="rtl"] .nav-menu {
    padding: 1rem 0.75rem;
  }
  
  [dir="rtl"] .dropdown-menu {
    margin-right: 0.5rem;
    padding-right: 0.5rem;
  }
  
  [dir="rtl"] .whatsapp-float {
    left: 15px;
  }
  
  [dir="rtl"] .telegram-float {
    left: 15px;
  }
  
  [dir="rtl"] .back-to-top {
    left: 15px;
    right: auto;
  }
}

/* iPad Pro and Large Tablets RTL (769px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  [dir="rtl"] .container {
    max-width: 960px;
    padding: 0 2rem;
  }
  
  [dir="rtl"] .nav-menu {
    gap: 1.5rem;
  }
  
  [dir="rtl"] .whatsapp-float {
    left: 20px;
    right: auto;
  }
  
  [dir="rtl"] .telegram-float {
    left: 20px;
    right: auto;
  }
  
  [dir="rtl"] .back-to-top {
    left: 20px;
    right: auto;
  }
}

/* Text alignment for RTL */
[dir="rtl"] .hero-content,
[dir="rtl"] .section-header {
  text-align: center;
}

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

[dir="rtl"] .footer-bottom {
  text-align: center;
}

/* Country Pages RTL Styles */
[dir="rtl"] .country-hero {
  text-align: center;
}

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

[dir="rtl"] .intro-content {
  text-align: center;
}

[dir="rtl"] .download-grid {
  direction: rtl;
}

[dir="rtl"] .download-card {
  text-align: center;
}

[dir="rtl"] .plans-grid {
  direction: rtl;
}

[dir="rtl"] .plan-card {
  text-align: center;
}

[dir="rtl"] .plan-header {
  text-align: center;
}

[dir="rtl"] .plan-price {
  direction: ltr;
  text-align: center;
}

[dir="rtl"] .local-price {
  text-align: center;
}

[dir="rtl"] .cta-content {
  text-align: center;
}

/* Arabic Badge Text */
[dir="rtl"] .plan-badge {
  font-family: "Tajawal", "Cairo", "Noto Sans Arabic", "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

[dir="rtl"] .plan-card.popular::before {
  content: 'الأكثر شعبية';
  font-family: "Tajawal", "Cairo", "Noto Sans Arabic", "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Desktop and Large Screens RTL (≥1025px) */
@media (min-width: 1025px) {
  [dir="rtl"] .whatsapp-float {
    left: 20px;
    right: auto;
  }
  
  [dir="rtl"] .telegram-float {
    left: 20px;
    right: auto;
  }
  
  [dir="rtl"] .back-to-top {
    left: 20px;
    right: auto;
  }
}