/* ============================================================================
   LIAM HOTELS — LTR overrides  (/en/ only)
   ----------------------------------------------------------------------------
   Loaded ONLY when pll_current_language() is 'en', on top of main.css and
   alongside Bootstrap's LTR build (§5F.5).

   ⚠ KEEP THIS FILE SMALL. Bootstrap's own mirroring is the reason this build is
   on Bootstrap — lean on it. main.css already uses logical properties
   (padding-inline, margin-inline-start, inset-inline-end, text-align: start) in
   most places, and those need NO override at all. Only add a rule here when a
   PHYSICAL property in main.css genuinely points the wrong way in LTR.

   ⚠ HAND-EDITED (§4B). Nothing compiles this.

   ⚠ FIRST TWO RULES ADDED 18/08/2026 (EN pass #2, A4 + A5). Both are traced to
   a NAMED physical/RTL-shaped declaration in main.css and are arithmetic, not
   appearance, judgements — neither has been seen in a browser (see the report's
   NOT-VERIFIED section). Everything else in this file is still deliberately
   empty: the correct order stays EN content exists -> view /en/ -> record the
   real divergences here.

   SCOPE HOOK — established, do not re-derive. The theme's own language hooks are
   BODY CLASSES: em_body_class() (functions.php l.~198) appends `lang-{code}` and
   `dir-rtl`/`dir-ltr` on every request. The <html> element gets only `dir` (via
   the language_attributes filter, l.~189); its `lang` attribute is WordPress's
   LOCALE, which is Polylang's to set, so `:lang(en)` would be second-hand.
   `.dir-ltr` is theme-owned and deterministic, and it is what these rules use.
   It is belt-and-braces on top of the enqueue gate — this whole stylesheet only
   loads when em_is_rtl_lang() is false (functions.php l.~329) — but it keeps
   each rule self-documenting and lifts it one class above its main.css original.

   Slider direction is NOT handled in this file. It is a runtime concern:
   window.emLiam.rtl is emitted per request from PHP and every ported slider
   reads it, so the tracks and the arrow bindings flip on their own. See
   discovery-findings.md §6 for the full mapping in both directions.

   Known candidates to check first when EN content lands:
     - .header__cart-count  : uses inset-inline-end, should already mirror
     - .banner__words       : verify the stacked headings' alignment
     - .contact-form__control--select : chevron is background-position: left in
                              both directions BY DESIGN (the design shows it on
                              the control's left edge) — confirm that still
                              reads correctly in LTR before "fixing" it
     - any remaining physical left/right in main.css (grep for
       "left:" / "right:" / "text-align: right")
   ============================================================================ */


/* ============================================================================
   A4 — boutique icon-strip item width for long English labels.

   main.css `.split-feature__feature { width: 8rem }` (l.~1605) is a HARD width
   on a flex item in a centred `flex-wrap` row. 8rem = 80px was sized against the
   Hebrew labels ("בר יין חופשי", "נרות Wellness"); the English ones this pass
   seeds are 2-4x longer ("Walking Distance from the Beaches", "Spa & Wellness
   Experience"), so at 80px they wrap to four or five lines each. They do not
   OVERFLOW — the label <span> is display:block and wraps normally, and F3's
   `grid-template-rows: var(--size-700) auto` keeps every label starting on the
   same y no matter how many lines it runs to — but the strip reads as a stack
   of columns of text rather than a row of icons.

   Relaxed to a RANGE: `width:auto` releases the flex basis (a bare min/max pair
   cannot beat a definite `width`, so the reset is required, not decorative), and
   the item then sizes to its content between 8rem and 12rem. 8rem keeps the
   Hebrew-era floor so a short label ("Free Wine Bar") still occupies the same
   column it does today; 12rem = 120px is a 1.5x ceiling — enough for "Walking
   Distance" to break in two rather than five, and still narrow enough that four
   of them plus gaps fit the >=576px widths this rule applies at.

   ⚠ BREAKPOINT IS PART OF THE FIX, not a hedge. main.css caps the strip at
   `max-width: 28.8rem` below 576px (l.~1853) to force the balanced 3+2 wrap the
   design shows, and that number is 3 x 8rem + 2 x 2.4rem — i.e. it is DERIVED
   FROM the 8rem item width. Three 12rem items would need 3 x 12 + 2 x 1 (the
   <=767.98px gap) = 38rem, which is wider than the whole content box of a 375px
   phone, so no cap value can buy back a 3-up line for 12rem items on a phone;
   raising the cap would only turn a deliberate 3+2 into an accidental 2+2+1.
   So the relaxation starts at 576px, exactly where the cap stops, and the cap's
   arithmetic stays true as written.

   ANSWER TO "does EN need its own cap value": NO. The cap is untouched and stays
   correct, because the width it is computed from is unchanged in the range where
   it applies.
   ============================================================================ */
@media (min-width: 576px) {
  .dir-ltr .split-feature__feature {
    width: auto;
    min-width: 8rem;
    max-width: 12rem;
  }
}


/* ============================================================================
   A5 — deals card: logo side / text alignment.

   THE RTL RULE PAIR, established before touching anything. The deal card's head
   row is `.deals__card-head { display:flex; justify-content:space-between }`
   with `.deals__card-text` first in the DOM and the hotel logo
   (`.deals__card-logo`, `flex-shrink:0` + `max-width`) second
   (template-parts/cards/card-deal.php l.72-83). Flexbox + space-between is
   direction-relative, so the logo side mirrors ON ITS OWN under dir=ltr — text
   to the left edge, logo to the right — and needs NO rule here. Same for
   `.zamarin-deal-card__footer`.

   The ONE declaration in that chain that does not mirror is PHYSICAL:
   `.deals__card-panel { text-align: right }` (main.css l.~1895). In LTR it left
   the whole panel's copy hugging the right edge while the logo had already moved
   there — the title, subtitle and price ran into the logo's column and the card
   read as broken. That is the "logo side" symptom; the cause is one word.

   `.zamarin-deal-card__body { text-align: right }` (main.css l.~4836) is the
   same declaration on the OTHER deal-card shape (the gift-card page / hotel deal
   listing, which carries `.zamarin-deal-card__logo` in its footer), included for
   parity — flagged in the report as an addition beyond the single card named.

   ONLY the mirrored property is written. Nothing else in either rule is repeated
   here, so the two stay one edit apart if they ever change.
   ============================================================================ */
.dir-ltr .deals__card-panel,
.dir-ltr .zamarin-deal-card__body {
  text-align: left;
}


/* ============================================================================
   A6 (pass #3 C2) — spa-facility icon-strip item width for long English labels.

   SAME RELAXATION FAMILY AS A4, different component. main.css
   `.spa-facility__feature { width: 9rem }` (l.~2886) is a HARD width on a flex
   item; the comment there says 9rem (not 8rem) was chosen so the longest HEBREW
   label ("מרחק הליכה מחופי הים") sits on two lines. The English labels this pass
   seeds are longer word-wise ("Walking Distance from the Beaches", "Spa &
   Wellness Experience"), so at a fixed 9rem they wrap to four or five lines and
   the strip reads as columns of text rather than a row of icons — the same
   symptom A4 fixed on .split-feature__feature.

   Relaxed to a RANGE: `width:auto` releases the fixed basis (a bare min/max pair
   cannot beat a definite `width`, so the reset is required), then the item sizes
   to content between 8rem and 12rem. Ron specified 8rem as the floor for this
   family; note the Hebrew floor on THIS component is 9rem, so a short EN label
   ("Free Wine Bar") may sit up to 1rem narrower than its Hebrew counterpart —
   flagged in the report, swap to 9rem if that reads wrong. 12rem ceiling matches
   A4.

   NO min-width:576 GATE, unlike A4. A4 is gated because main.css caps
   .split-feature__features at 28.8rem below 576px and that cap is DERIVED from
   the 8rem item width. .spa-facility has NO such derived cap: below 767.98px the
   strip switches to a horizontal SCROLL (main.css l.~2946 sets
   .spa-facility__feature { flex: 0 0 auto }), so relaxed items simply keep their
   content width (>= 8rem) and scroll — no wrap arithmetic to protect. Verified:
   at <=576 the row already scrolls, width:auto changes only the per-item width
   within the scroll track, not the wrap/scroll behaviour, so no extra rule is
   owed there.
   ============================================================================ */
.dir-ltr .spa-facility__feature {
  width: auto;
  min-width: 8rem;
  max-width: 12rem;
}


/* ============================================================================
   A7 (pass #3 C4) — Gravity Forms contact form, LTR alignment.

   THE HE SKIN IS style.css's `.em-contact-form_wrapper.gform_wrapper` carve-out
   and it is NOT touched (Ron's instruction). The one declaration in it that is
   PHYSICAL rather than logical is `.gfield_label { text-align: right }`
   (style.css l.~214) — in LTR that hugs every label to the right edge. The
   controls themselves use padding-inline (logical) and inherit their text
   direction; on /en/ they still align right because GF renders the form in the
   context it was built in. Forcing `direction: ltr` on the wrapper flips the
   field text (and caret) to the left via inheritance, and the explicit label
   override handles the one hard physical rule.

   ⚠ SPECIFICITY / LOAD ORDER. style.css (`em-css`) is enqueued LAST, after this
   file (functions.php l.~378/388, both depend on `em-main`), so ltr.css CANNOT
   win on source order — it must MATCH OR EXCEED the HE rule's specificity. The
   label rule in style.css is (0,4,0) (`.em-contact-form_wrapper.gform_wrapper.
   gravity-theme .gfield_label`); this rule adds `.dir-ltr` in front of that same
   scope for (0,5,0), so it wins regardless of order. A bare
   `.dir-ltr .gform_wrapper .gfield_label` (0,3,0) — the literal shorthand in the
   brief — would LOSE to the (0,4,0) HE rule; documented so the next hand doesn't
   "simplify" it back.

   The hotel <select>'s chevron is background-position:left BY DESIGN in both
   directions (style.css l.~281, and the ltr.css header note) — `direction` does
   not move a physical background-position, so the chevron stays put; the field's
   padding-inline-start (now the left, in LTR) sits the text clear of it. Not
   overridden.
   ============================================================================ */
.dir-ltr .em-contact-form_wrapper.gform_wrapper.gravity-theme {
  direction: ltr;
}
.dir-ltr .em-contact-form_wrapper.gform_wrapper.gravity-theme .gfield_label {
  text-align: left;
}


/* ============================================================================
   A8 (pass #4 P2) — FAQ accordion, LTR alignment.

   COMPONENT: template-parts/network/contact-faq.php. `.faq-item__header` is the
   accordion question BUTTON (display:flex) holding `.faq-item__chevron` then
   `.faq-item__q`; `.faq-item__answer` is the panel body. main.css block
   l.~3409-3467.

   THE HE RULE SET, established before touching anything — every PHYSICAL
   declaration in that block:
     - .faq-item__header  { text-align: right }        (l.~3419)  PHYSICAL
     - .faq-item__answer  { text-align: right }        (l.~3466)  PHYSICAL
     - .faq-item__header  { padding: 1.5rem 2.4rem }   symmetric L/R — no mirror
     - .faq-item__answer  { padding: 0 2.4rem 1.8rem } symmetric L/R — no mirror
     - .faq-item__chevron { order: 1 }                 main-axis — mirrors itself

   The chevron needs NO rule here: `order:1` pins it to the END of the flex main
   axis, which follows the container's direction — the LEFT edge in RTL, the
   RIGHT edge under dir=ltr — so it moves to the right on /en/ on its own,
   matching LTR reading. Both paddings are symmetric, nothing to mirror. The ONLY
   declarations that point the wrong way in LTR are the two `text-align: right`.

   SPECIFICITY / LOAD ORDER (A7 lesson). style.css (`em-css`) prints LAST, after
   this file, but it carries NO faq rule; the HE rules live in main.css at
   (0,1,0). `.dir-ltr .faq-item__…` is (0,2,0), so it wins on specificity
   regardless of source order — match-or-exceed satisfied. HE untouched.
   ============================================================================ */
.dir-ltr .faq-item__header,
.dir-ltr .faq-item__answer {
  text-align: left;
}