/* ============================================
   SUPERNOVA RIYADH — Bilingual EN + AR
   Switch UI + RTL adaptation
   ============================================ */

/* ---------- LANGUAGE SWITCH BUTTON (top-right of nav) ---------- */
.lang-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-inline-start: 1.2rem;
  margin-inline-end: 0.4rem;
  padding: 0.35rem 0.7rem;
  border: 1px solid rgba(196, 165, 114, 0.28);
  border-radius: 999px;
  background: rgba(18, 13, 10, 0.35);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font-size: 0.78rem;
  letter-spacing: 0.06em;
  user-select: none;
  transition: border-color 240ms ease, background 240ms ease;
}
.lang-switch:hover { border-color: rgba(196, 165, 114, 0.6); }

.lang-switch button {
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(245, 239, 231, 0.55);
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  cursor: pointer;
  padding: 0.15rem 0.35rem;
  border-radius: 6px;
  transition: color 200ms ease, transform 200ms ease;
}
.lang-switch button:hover { color: var(--color-accent); transform: scale(1.05); }
.lang-switch button.active {
  color: var(--color-accent);
  font-weight: 600;
}
.lang-switch button[data-set-lang="ar"] {
  font-family: 'Reem Kufi Fun', 'Tajawal', system-ui, sans-serif;
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 0;
}
.lang-switch .divider {
  color: rgba(245, 239, 231, 0.25);
  font-weight: 300;
  pointer-events: none;
}

/* On booking-nav (white bg pages) — invert palette */
.booking-nav .lang-switch {
  background: rgba(18, 13, 10, 0.03);
  border-color: rgba(18, 13, 10, 0.12);
}
.booking-nav .lang-switch button { color: rgba(18, 13, 10, 0.55); }
.booking-nav .lang-switch button.active,
.booking-nav .lang-switch button:hover { color: #8a5824; }
.booking-nav .lang-switch .divider { color: rgba(18, 13, 10, 0.2); }

/* Mobile — switch becomes a chip */
@media (max-width: 880px) {
  .lang-switch {
    margin-inline-start: auto;
    margin-inline-end: 0.6rem;
    padding: 0.25rem 0.55rem;
    font-size: 0.72rem;
  }
  .lang-switch button { font-size: 0.74rem; padding: 0.1rem 0.25rem; }
  .lang-switch button[data-set-lang="ar"] { font-size: 0.92rem; }
}

/* ---------- DEFAULT VISIBILITY: hide AR blocks by default ---------- */
[data-lang="ar"] { display: none; }

/* When RTL active: hide EN, show AR */
html[dir="rtl"] [data-lang="en"] { display: none; }
html[dir="rtl"] [data-lang="ar"] { display: initial; }

/* For block-level translation containers */
html[dir="rtl"] p[data-lang="ar"],
html[dir="rtl"] div[data-lang="ar"],
html[dir="rtl"] li[data-lang="ar"],
html[dir="rtl"] h1[data-lang="ar"],
html[dir="rtl"] h2[data-lang="ar"],
html[dir="rtl"] h3[data-lang="ar"],
html[dir="rtl"] h4[data-lang="ar"] { display: block; }

/* ---------- RTL TYPOGRAPHY ---------- */
html[dir="rtl"] body {
  font-family: 'Tajawal', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] .hero-title,
html[dir="rtl"] .section-title,
html[dir="rtl"] .subpage-title,
html[dir="rtl"] .booking-title,
html[dir="rtl"] .logo {
  font-family: 'Reem Kufi Fun', 'Tajawal', serif;
  font-style: normal !important;
}
html[dir="rtl"] em,
html[dir="rtl"] i,
html[dir="rtl"] .hero-title em,
html[dir="rtl"] .section-title em,
html[dir="rtl"] .subpage-title em,
html[dir="rtl"] .booking-title em,
html[dir="rtl"] .logo em {
  font-style: normal !important;
  font-family: 'Reem Kufi Fun', 'Tajawal', serif;
  font-weight: 500;
  color: var(--color-accent);
}

/* Eyebrow uppercase doesn't apply to Arabic */
html[dir="rtl"] .eyebrow,
html[dir="rtl"] .hero-eyebrow,
html[dir="rtl"] .form-eyebrow,
html[dir="rtl"] .repere-label,
html[dir="rtl"] .cartouche-label,
html[dir="rtl"] .contact-info-label,
html[dir="rtl"] .footer-col h4 {
  text-transform: none;
  letter-spacing: 0.04em;
  font-family: 'Tajawal', sans-serif;
  font-weight: 500;
}

/* ---------- RTL ADAPTATIONS ---------- */

/* Marquee reverses direction in RTL */
html[dir="rtl"] .marquee-track {
  animation-direction: reverse;
}

/* Phone numbers, emails, prices stay LTR even in RTL layout */
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] a[href^="mailto:"],
html[dir="rtl"] a[href^="https://wa.me"],
html[dir="rtl"] .dish-price,
html[dir="rtl"] .prestation-price,
html[dir="rtl"] .summary-line span:last-child,
html[dir="rtl"] .booking-detail span:last-child,
html[dir="rtl"] .repere-stat,
html[dir="rtl"] .counter {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* Stepper numbers stay LTR */
html[dir="rtl"] .step-num {
  direction: ltr;
}
html[dir="rtl"] .stepper {
  direction: rtl;
}

/* Card pay icons stay LTR */
html[dir="rtl"] .pay-icons,
html[dir="rtl"] .pay-trust span {
  direction: ltr;
}

/* Hero stamp content */
html[dir="rtl"] .hero-stamp {
  direction: rtl;
}

/* Logo: keep "Supernova" LTR for brand */
html[dir="rtl"] .logo {
  direction: ltr;
}

/* Footer base line — keep copyright LTR */
html[dir="rtl"] .footer-base {
  direction: ltr;
  text-align: center;
}

/* About-figure stamp (Est. 2018) */
html[dir="rtl"] .about-figure-stamp em {
  direction: ltr;
  display: inline-block;
}
html[dir="rtl"] .about-figure-stamp {
  text-align: right;
}
html[dir="rtl"] .about-figure-stamp small {
  font-family: 'Tajawal', sans-serif;
}

/* Mobile menu — RTL nav */
html[dir="rtl"] .mobile-menu {
  text-align: right;
}

/* Form inputs in RTL */
html[dir="rtl"] input[type="text"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] textarea,
html[dir="rtl"] select {
  text-align: right;
}
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="date"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input.card-input,
html[dir="rtl"] input[name="card-number"],
html[dir="rtl"] input[name="card-exp"],
html[dir="rtl"] input[name="card-cvc"] {
  direction: ltr;
  text-align: left;
}

/* Scroll progress bar — direction reversed */
html[dir="rtl"] .scroll-progress {
  right: 0;
  left: auto;
  transform-origin: right center;
}

/* Hero scroll indicator (keep visible LTR) */
html[dir="rtl"] .hero-scroll {
  direction: ltr;
}

/* Summary / booking rows */
html[dir="rtl"] .summary-line,
html[dir="rtl"] .booking-detail {
  direction: rtl;
}
html[dir="rtl"] .summary-line span:last-child,
html[dir="rtl"] .booking-detail span:last-child {
  text-align: left;
}

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

/* Footer right-align */
html[dir="rtl"] .footer-col {
  text-align: right;
}
html[dir="rtl"] .footer-col h4,
html[dir="rtl"] .footer-col p,
html[dir="rtl"] .footer-col ul,
html[dir="rtl"] .footer-col li {
  text-align: right;
}

/* AR-specific line-height bump (Arabic chars are taller) */
html[dir="rtl"] {
  --line-height-base: 1.85;
}
html[dir="rtl"] body,
html[dir="rtl"] p {
  line-height: 1.85;
}
html[dir="rtl"] .hero-title,
html[dir="rtl"] .section-title,
html[dir="rtl"] .subpage-title,
html[dir="rtl"] .booking-title {
  line-height: 1.25;
}

/* Hero ctas / final ctas keep mirrored if needed */
html[dir="rtl"] .hero-ctas,
html[dir="rtl"] .final-cta-buttons {
  flex-direction: row-reverse;
}
@media (max-width: 640px) {
  html[dir="rtl"] .hero-ctas,
  html[dir="rtl"] .final-cta-buttons {
    flex-direction: column;
  }
}