/* ============================================================
   LA'ORO NGO — RTL / Hebrew Overrides
   Applied when html[lang="he"] is set by main.js
   ============================================================ */

/* ------------------------------------------------------------
   Base Direction
   Already set in style.css via html[lang="he"] { direction: rtl }
   This file contains component-level RTL corrections only.
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
   Typography adjustments
   Heebo is optimised for Hebrew; these tweaks improve reading
   ------------------------------------------------------------ */
html[lang="he"] body {
  font-size: 1rem;          /* Heebo reads slightly larger, keep 16px */
  letter-spacing: 0;        /* Hebrew doesn't benefit from letter-spacing */
}

html[lang="he"] h1,
html[lang="he"] h2,
html[lang="he"] h3,
html[lang="he"] h4,
html[lang="he"] h5,
html[lang="he"] h6 {
  letter-spacing: 0;
  font-weight: 800;         /* Heebo 800 renders sharper for headings */
}

/* ------------------------------------------------------------
   Navigation — RTL corrections
   ------------------------------------------------------------ */

/* Logo text direction when nav flips */
html[lang="he"] .nav-logo {
  flex-direction: row-reverse; /* icon on the right in RTL */
}

/* Hamburger stays visually correct (no mirroring needed) */

/* Mobile drawer link alignment */
html[lang="he"] .nav-mobile a {
  text-align: right;
}

/* ------------------------------------------------------------
   Buttons — icon gap direction
   Inline-flex gap is direction-aware; no override needed for text.
   If icon + label are used, logical properties handle it.
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
   Footer
   ------------------------------------------------------------ */
html[lang="he"] .footer-col h4 {
  /* Underline accent should align to start (right in RTL) */
  margin-inline-end: auto;
  margin-inline-start: 0;
}

html[lang="he"] .footer-bottom {
  text-align: right;
}

/* ------------------------------------------------------------
   Section headers — accent line centering (already centered,
   but ensure it doesn't break under RTL auto margins)
   ------------------------------------------------------------ */
html[lang="he"] .section-header h2::after {
  margin-inline: auto;
}

/* ------------------------------------------------------------
   Form inputs — align placeholder and text to right in RTL
   ------------------------------------------------------------ */
html[lang="he"] input,
html[lang="he"] textarea,
html[lang="he"] select {
  text-align: right;
}

/* ------------------------------------------------------------
   List bullets / counters — flip to right side
   ------------------------------------------------------------ */
html[lang="he"] ul.styled-list,
html[lang="he"] ol.styled-list {
  padding-inline-start: 0;
  padding-inline-end: 1.5rem;
}

html[lang="he"] ul.styled-list li::before {
  /* Custom bullet — will be defined per-page; ensure it floats right */
  float: right;
  margin-inline-start: var(--space-sm);
  margin-inline-end: 0;
}

/* ------------------------------------------------------------
   Cards — text alignment
   ------------------------------------------------------------ */
html[lang="he"] .card {
  text-align: right;
}

/* ------------------------------------------------------------
   Page hero — center is always center; no override needed
   ------------------------------------------------------------ */

/* ------------------------------------------------------------
   Utility: force LTR for specific embedded elements
   (phone numbers, URLs, email addresses, numeric data)
   ------------------------------------------------------------ */
html[lang="he"] .ltr-inline,
html[lang="he"] [dir="ltr"] {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* ------------------------------------------------------------
   Logical property fallbacks
   All layout uses margin-inline / padding-inline so RTL is
   automatic. These overrides are only for legacy properties.
   ------------------------------------------------------------ */
html[lang="he"] .text-start { text-align: right; }
html[lang="he"] .text-end   { text-align: left;  }
