/* ==========================================================================
   site-fixes.css — targeted corrections for the tenant PUBLIC site chrome
   --------------------------------------------------------------------------
   Loaded from resources/views/layouts/app.php AFTER primunity.css (and after
   nav-offset.css) so these rules win without editing layout.css /
   sitebuilder.css — both of which are being rewritten by another editor.
   Each rule below is additive and low-specificity; fold it into its natural
   home (noted per block) once that rewrite lands.

   Uses logical properties only (RTL-safe) and design tokens only.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) FOOTER LINK COLUMNS  (natural home: layout.css, beside .footer__col a)
   --------------------------------------------------------------------------
   BUG: layout.css styles `.footer__col a{display:inline-block}` but never makes
   `.footer__col` a column, so the anchors flow INLINE and run together with no
   separator — on the Hebrew demo site the footer read "ביתעלייצור קשר"
   (בית + עליי + צור קשר mashed into one word).
   FIX: stack the column's children and give them breathing room. Applies to the
   SiteBuilder chrome footer and the platform footer partial alike.
   -------------------------------------------------------------------------- */
.footer__col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--s-1);
  min-width: 0;
}

/* Headings keep their own rhythm; links become full-width block targets so a
   long Hebrew label can never sit on the same line as the next link. */
.footer__col h4 {
  margin-block-end: var(--s-3);
}

.footer__col a {
  display: block;
  width: auto;
  max-width: 100%;
  padding-block: 4px;
  /* Let a mixed HE/EN label resolve its own direction (see §2). */
  unicode-bidi: plaintext;
  text-align: start;
}

/* The brand/about column is prose, not a link list — keep it readable. */
.footer__col .sb-chrome-footer__about,
.footer__col p {
  max-width: 42ch;
  unicode-bidi: plaintext;
  text-align: start;
}

/* --------------------------------------------------------------------------
   2) TESTIMONIAL QUOTES — BIDI + LOCALE-CORRECT QUOTATION MARKS
      (natural home: sitebuilder.css, .sb-quote__text block)
   --------------------------------------------------------------------------
   BUG A (direction): `.sb-quote__text` inherited the PAGE direction. On the
   Hebrew site an ENGLISH testimonial was therefore laid out RTL, so its final
   period jumped to the FRONT of the line — ".community keeps me accountable"
   instead of "community keeps me accountable." — and the decorative quote sat
   on the wrong side.
   FIX A: `unicode-bidi: plaintext` makes EACH quote resolve its own base
   direction from its first strong character (English → LTR, Hebrew → RTL),
   which is exactly the Unicode Bidi "plaintext" behaviour intended for
   user-authored strings of unknown language. Punctuation then lands correctly
   in both languages with no markup change.

   BUG B (glyph): the opening mark was the hardcoded English “ regardless of
   locale.
   FIX B: drive it from the CSS `quotes` property with `content: open-quote`, so
   the mark follows the ACTIVE language — curly “ ” for English, gershayim ״ for
   Hebrew (U+05F4, the standard Hebrew quotation mark).
   -------------------------------------------------------------------------- */
.sb-quote__text {
  /* Each testimonial resolves its own direction — fixes misplaced punctuation. */
  unicode-bidi: plaintext;
  text-align: start;
  /* English default; overridden per-language below. */
  quotes: "\201C" "\201D";
}

/* Hebrew: gershayim (״) is the correct quotation mark. */
:lang(he) .sb-quote__text,
[lang="he"] .sb-quote__text {
  quotes: "\05F4" "\05F4";
}

/* Render the locale-correct opening mark instead of a hardcoded “. */
.sb-quote__text::before {
  content: open-quote;
}

/* The author block is user content too — let it resolve its own direction so a
   Hebrew name inside an English card (or vice-versa) is not reversed. */
.sb-quote__meta b,
.sb-quote__meta .muted {
  unicode-bidi: plaintext;
  text-align: start;
}

/* --------------------------------------------------------------------------
   3) DUPLICATE LANGUAGE SWITCHER — DEFENCE IN DEPTH
      (natural home: sitebuilder.css, beside the .sb-langswitch block)
   --------------------------------------------------------------------------
   BUG: the site rendered TWO language controls at once — the styled HE/EN pill
   inside the tenant nav (ChromeRenderer::langSwitch → .lang-switch--topbar) AND
   the floating `.sb-langswitch` partial, which `position:fixed` pins to the
   top-INLINE-END corner — i.e. the TOP-LEFT of an RTL page — where it read as
   bare "HE EN" text floating over the hero.

   PRIMARY FIX is at the render source: resources/views/partials/site-lang-switch
   now returns early when the nav already emitted a pill (and always in
   language_mode='single'). Include site for the record: partials/nav.php:43.

   This rule is the belt-and-braces layer for any OTHER template that includes the
   partial (or a cached page rendered before the PHP fix): if a nav pill exists
   anywhere in the document, the floating one is removed from the layout entirely.
   `:has()` is supported by every browser that supports the tenant sites' baseline;
   where it is not, the PHP guard has already done the job.
   -------------------------------------------------------------------------- */
body:has(.sb-chrome-nav .lang-switch) .sb-langswitch,
body:has(.nav .lang-switch) .sb-langswitch {
  display: none !important;
}

/* When the fallback DOES render (tenant hid the site header), keep it clear of the
   page edge and above the content, and make sure it never overlaps a sticky nav. */
.sb-langswitch {
  inset-block-start: max(14px, env(safe-area-inset-top, 0px));
}

/* The nav pill itself: keep it compact and aligned with the other nav actions in
   both directions, and never let it wrap the two options onto separate lines. */
.sb-chrome-nav .lang-switch--topbar {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  white-space: nowrap;
}

/* --------------------------------------------------------------------------
   4) BOOKING STEPPER — FLAT NUMERALS, NO FILLED CHIP
      (natural home: scheduling.css .stepper__dot block)
   --------------------------------------------------------------------------
   BUG: scheduling.css paints the ACTIVE step as a filled chip
   (`background:var(--brand-grad); color:var(--on-brand); box-shadow:var(--glow)`).
   Once the circular medallion was removed CMS-wide, that fill lost its radius and
   rendered as a hard blue SQUARE around the number — the thing the user has now
   rejected three times.

   This rule has been fixed at source twice and re-introduced twice by concurrent
   rewrites of scheduling.css, so it lives here instead: site-fixes.css is loaded
   from layouts/app.php (which the public booking page uses) and the selector is
   deliberately over-specific — (0,5,2) — so it beats scheduling.css no matter
   what order the sheets land in or who rewrites that file next.

   The step marker is now a bare NUMERAL. State is carried by weight + colour +
   a 2px brand underline, so it still survives greyscale and is never colour-only.
   -------------------------------------------------------------------------- */
html body .stepper .stepper__step .stepper__dot,
html body .stepper .stepper__step.is-active .stepper__dot,
html body .stepper .stepper__step.is-done .stepper__dot {
  inline-size: auto;
  min-inline-size: 1.25em;
  block-size: auto;
  border-radius: 0;
  border: 0;
  background: none;
  box-shadow: none;
  padding: 0 0 3px;
  display: inline-grid;
  place-items: center;
  font-size: var(--fz-sm);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  border-block-end: 2px solid transparent;
}

html body .stepper .stepper__step .stepper__dot { color: var(--muted); }

html body .stepper .stepper__step.is-active .stepper__dot {
  color: var(--brand-fg, var(--brand-2));
  border-block-end-color: var(--brand-fg, var(--brand-2));
}

html body .stepper .stepper__step.is-done .stepper__dot {
  color: var(--success-fg);
  border-block-end-color: transparent;
}
html body .stepper .stepper__step.is-done .stepper__dot .icon { inline-size: 15px; block-size: 15px; }

/* The connector line should read as a hairline, not a heavy rule. */
html body .stepper .stepper__sep { opacity: .55; }
