/* ==========================================================================
   Nooshin Patisserie — Right-to-Left layer (Persian)
   Loaded only by pages in /fa/, after style.css.
   Everything here is scoped to [dir="rtl"], so it never touches the LTR site.
   ========================================================================== */

[dir="rtl"] {
  --font-serif: 'Vazirmatn', Tahoma, sans-serif;
  --font-sans: 'Vazirmatn', Tahoma, sans-serif;
  --font-script: 'Vazirmatn', Tahoma, sans-serif;
}

/* Persian script joins its letters — tracking breaks the joins, so clear it.
   Latin runs inside Persian pages opt back in via .latin. */
[dir="rtl"] * {
  letter-spacing: normal;
}

[dir="rtl"] body {
  line-height: 1.9;
}

[dir="rtl"] .latin {
  font-family: 'Playfair Display', Georgia, serif;
  letter-spacing: 0.02em;
  direction: ltr;
  display: inline-block;
}

/* Persian typefaces have no true italic; synthetic slanting looks broken. */
[dir="rtl"] .home-hero-title span.italic,
[dir="rtl"] .home-chef-quote,
[dir="rtl"] .modal-tasting-notes {
  font-style: normal;
}

[dir="rtl"] .home-hero-title span.italic {
  color: var(--color-gold-deep, var(--color-gold));
}

/* Headlines: Persian needs a touch more leading and slightly less size. */
[dir="rtl"] .home-hero-title {
  line-height: 1.5;
  font-size: clamp(2.1rem, 4vw, 3.1rem);
}

[dir="rtl"] .page-title {
  line-height: 1.55;
}

[dir="rtl"] .home-hero-lead,
[dir="rtl"] .page-subtitle,
[dir="rtl"] .home-chef-text,
[dir="rtl"] .pastry-desc {
  line-height: 2;
}

/* --------------------------------------------------------------------------
   Mirrored elements — anything pinned to a physical edge
   -------------------------------------------------------------------------- */

/* Mobile drawer slides in from the left */
[dir="rtl"] .mobile-nav-drawer {
  right: auto;
  left: -320px;
  box-shadow: 10px 0 30px rgba(0, 0, 0, 0.12);
  /* The base rule only transitions `right`; in RTL the drawer moves on `left`. */
  transition: left 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

[dir="rtl"] .mobile-nav-drawer.open {
  right: auto;
  left: 0;
}

/* Hero whisk sits on the opposite side, mirrored */
[dir="rtl"] .home-hero::before {
  left: auto;
  right: -70px;
  transform: rotate(15deg) scaleX(-1);
}

[dir="rtl"] .pastry-tag {
  right: auto;
  left: 14px;
}

[dir="rtl"] .modal-close-btn {
  right: auto;
  left: 16px;
}

[dir="rtl"] .lightbox-close-btn {
  right: auto;
  left: 25px;
}

[dir="rtl"] .home-chef-quote {
  padding-left: 0;
  padding-right: 1.2rem;
  border-left: none;
  border-right: 3px solid var(--color-gold);
}

[dir="rtl"] .footer-contact-lines {
  text-align: left;
}

/* Directional arrows point the other way in RTL */
[dir="rtl"] .btn svg:not(.no-flip),
[dir="rtl"] .text-link svg,
[dir="rtl"] .view-details-link svg {
  transform: scaleX(-1);
}

/* --------------------------------------------------------------------------
   Numerals — Persian pages use Persian digits, so keep them upright and even
   -------------------------------------------------------------------------- */
[dir="rtl"] .pastry-number,
[dir="rtl"] .modal-eyebrow,
[dir="rtl"] .hours-row strong {
  font-variant-numeric: normal;
  font-feature-settings: normal;
}

/* Phone numbers and e-mail stay left-to-right even inside Persian text */
[dir="rtl"] .ltr-value {
  direction: ltr;
  display: inline-block;
  unicode-bidi: isolate;
}

/* --------------------------------------------------------------------------
   Responsive overrides that mirror the base stylesheet's own breakpoints
   -------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  [dir="rtl"] .home-chef-quote {
    text-align: right;
  }
}

@media (max-width: 860px) {
  [dir="rtl"] .footer-contact-lines {
    text-align: right;
  }
}
