/* ============================================
   PANKHURST DUBAI — Arabic / RTL stylesheet
   Mayfair tone preserved: Amiri (display) + Tajawal (body).
   Restraint, not flourish. Aligned with the British understated voice.
   ============================================ */

/* ---------- Language switch (top-right, EN | عربي) ---------- */
.lang-switch {
  position: fixed;
  top: 1rem;
  right: 1.25rem;
  z-index: 10001;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.85rem;
  background: rgba(10, 9, 8, 0.55);
  backdrop-filter: blur(18px) saturate(180%);
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  border: 1px solid rgba(158, 127, 74, 0.25);
  border-radius: 999px;
  font-family: var(--font-body, 'Inter', sans-serif);
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  transition: border-color 0.4s ease, background 0.4s ease;
}
.lang-switch:hover { border-color: rgba(158, 127, 74, 0.5); }
.lang-switch button {
  background: none;
  border: 0;
  color: rgba(232, 226, 214, 0.62);
  cursor: pointer;
  padding: 0.15rem 0.35rem;
  font: inherit;
  letter-spacing: inherit;
  text-transform: uppercase;
  transition: color 0.3s ease;
  font-weight: 500;
}
.lang-switch button.active {
  color: #9E7F4A; /* or vieilli */
}
.lang-switch button[data-set-lang="ar"] {
  font-family: 'Amiri', 'Tajawal', serif;
  font-size: 0.95rem;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 700;
}
.lang-switch .divider {
  color: rgba(158, 127, 74, 0.4);
  font-weight: 300;
}
@media (hover: hover) {
  .lang-switch button:hover { color: #C4A56F; }
}
@media (max-width: 760px) {
  .lang-switch {
    top: 0.75rem;
    right: 0.75rem;
    padding: 0.35rem 0.7rem;
    font-size: 0.78rem;
  }
}

/* On payment / booking pages, lang switch sits next to nav-back-link.
   Push it slightly lower so it never overlaps the centered logo. */
.page-booking .lang-switch,
.page-payment .lang-switch {
  top: 1rem;
}

/* ---------- Visibility logic ---------- */
[data-lang="ar"] { display: none; }
html[dir="rtl"] [data-lang="en"] { display: none; }
html[dir="rtl"] [data-lang="ar"] { display: initial; }
/* For inline spans inside h1/h2/p we want them to behave as the parent's display */
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"],
html[dir="rtl"] p  [data-lang="ar"],
html[dir="rtl"] span[data-lang="ar"],
html[dir="rtl"] a  [data-lang="ar"],
html[dir="rtl"] li [data-lang="ar"],
html[dir="rtl"] strong[data-lang="ar"] { display: inline; }
html[dir="rtl"] div[data-lang="ar"],
html[dir="rtl"] section[data-lang="ar"] { display: block; }

/* ---------- AR typography — Mayfair tone preserved ---------- */
html[dir="rtl"] body {
  font-family: 'Tajawal', 'Inter', sans-serif;
  font-weight: 400;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] .hero-title,
html[dir="rtl"] .booking-title,
html[dir="rtl"] .section-title,
html[dir="rtl"] .subpage-title,
html[dir="rtl"] .logo {
  font-family: 'Amiri', 'Tajawal', serif;
  font-style: normal;       /* Arabic doesn't italicise — stay nobly upright */
  letter-spacing: 0;        /* never letter-space Arabic — kills ligatures */
  font-weight: 700;
}
html[dir="rtl"] em,
html[dir="rtl"] .hero-title em,
html[dir="rtl"] .section-title em,
html[dir="rtl"] .booking-title em,
html[dir="rtl"] .subpage-title em,
html[dir="rtl"] .footer-brand-em,
html[dir="rtl"] .logo-accent em {
  font-family: 'Amiri', 'Tajawal', serif;
  font-style: normal;
  font-weight: 700;
  color: var(--color-accent);
}
html[dir="rtl"] .eyebrow,
html[dir="rtl"] .hero-eyebrow {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
  text-transform: none;
  font-weight: 500;
  font-size: 0.82rem;
}
html[dir="rtl"] .quiet-text,
html[dir="rtl"] .quiet-tag {
  font-family: 'Amiri', serif;
  font-weight: 400;
  letter-spacing: 0;
}
html[dir="rtl"] .marquee-item {
  font-family: 'Amiri', serif;
  font-style: normal;
  letter-spacing: 0;
}
html[dir="rtl"] .marquee-item strong {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0.02em;
}
html[dir="rtl"] .gallery-item::after {
  font-family: 'Amiri', serif;
  font-style: normal;
  letter-spacing: 0;
  content: attr(data-caption-ar);
}

/* ---------- RTL — flip directional motifs ---------- */
html[dir="rtl"] .marquee-track {
  animation-direction: reverse;
}
html[dir="rtl"] .hero-scroll span::after,
html[dir="rtl"] .subpage-back,
html[dir="rtl"] .nav-back-link {
  /* invert the "←" arrow visually */
}
html[dir="rtl"] .subpage-back,
html[dir="rtl"] .nav-back-link {
  display: inline-block;
  /* "← Back" must read "Back →" visually in RTL — we replace text in HTML, no scaleX needed */
}

/* Keep counters / numbers / prices LTR — premium Gulf standard */
html[dir="rtl"] .counter,
html[dir="rtl"] .repere-stat,
html[dir="rtl"] .dish-price,
html[dir="rtl"] .bs-total-amount,
html[dir="rtl"] .hero-stamp,
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] .contact-info-value a[href^="tel:"] {
  direction: ltr;
  unicode-bidi: embed;
}
html[dir="rtl"] .dish-price,
html[dir="rtl"] .bs-total-amount {
  text-align: start;
}

/* Press logos / press strip — keep latin */
html[dir="rtl"] .press-logos,
html[dir="rtl"] .press-strip-label {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
  text-transform: none;
}
html[dir="rtl"] .press-logos span {
  font-family: var(--font-display, 'Fraunces', serif);
  font-style: italic;
}

/* Logo: "Pankhurst" stays latin (brand). Only the "Dubai/دبي" tag flips. */
html[dir="rtl"] .logo {
  direction: ltr;
  unicode-bidi: embed;
  font-family: 'Fraunces', serif;
  font-style: normal;
  letter-spacing: -0.005em;
}
html[dir="rtl"] .logo .logo-accent em {
  font-family: 'Amiri', serif;
  font-style: normal;
}

/* Stepper labels in AR — restore non-italic */
html[dir="rtl"] .step-label {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
}

/* Buttons: keep refined Latin look for arrows; AR text uses Tajawal */
html[dir="rtl"] .btn,
html[dir="rtl"] .nav-cta {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0.02em;
  font-weight: 500;
}

/* Card CC visual numbers always LTR */
html[dir="rtl"] .cc-number,
html[dir="rtl"] .cc-exp,
html[dir="rtl"] .cc-name {
  direction: ltr;
  unicode-bidi: embed;
  font-family: 'JetBrains Mono', monospace;
}

/* Footer / address — preserve number-LTR strings */
html[dir="rtl"] .footer,
html[dir="rtl"] .contact-info {
  text-align: start;
}
html[dir="rtl"] .footer-base p,
html[dir="rtl"] .footer-tagline {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
}
html[dir="rtl"] .footer h4 {
  font-family: 'Amiri', serif;
  font-style: normal;
  letter-spacing: 0;
}

/* Reveal animations: ensure RTL transforms still feel right (translateX flip) */
html[dir="rtl"] .reveal {
  /* default reveal uses translateY — unchanged */
}

/* Nav links spacing in AR — Tajawal is slightly heavier */
html[dir="rtl"] .nav-links a {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
  font-size: 0.92rem;
  font-weight: 500;
}

/* Booking form labels */
html[dir="rtl"] .bf-field label,
html[dir="rtl"] .bs-label,
html[dir="rtl"] .bs-value,
html[dir="rtl"] .bs-total,
html[dir="rtl"] .bs-direct-note {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
}
html[dir="rtl"] .bs-title,
html[dir="rtl"] .bf-step-title {
  font-family: 'Amiri', serif;
  font-style: normal;
  letter-spacing: 0;
}
html[dir="rtl"] .bf-step-tag {
  direction: ltr;
  unicode-bidi: embed;
  font-family: 'JetBrains Mono', monospace;
}

/* Sticky CTA AR */
html[dir="rtl"] .sticky-cta {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
}

/* Cartouche AR */
html[dir="rtl"] .cartouche-label {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
  text-transform: none;
}
html[dir="rtl"] .cartouche-value {
  font-family: 'Amiri', serif;
  font-style: normal;
  letter-spacing: 0;
}

/* Trust grid — keep stars / icons LTR */
html[dir="rtl"] .trust-icon {
  direction: ltr;
  unicode-bidi: embed;
}
html[dir="rtl"] .trust-item p {
  font-family: 'Tajawal', sans-serif;
  letter-spacing: 0;
}