/* ScoreBattle · RTL overrides.
   Loaded last so it wins the cascade. Scoped to html[dir="rtl"], which i18n.js
   sets whenever an RTL language (currently Arabic) is applied. The base sheets
   use physical properties (left/right, margin-left, …); `dir="rtl"` auto-flips
   flex order and default text alignment, and the rules below fix the rest. */

/* ---- Arabic typography ----------------------------------------------------
   Inter / Bebas Neue carry no Arabic glyphs, so swap in Cairo (loaded via the
   Google Fonts link in index.html) for every text node under RTL. */
html[dir="rtl"],
html[dir="rtl"] body {
  font-family: 'Cairo', 'Inter', system-ui, sans-serif;
}
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] .form-card__title,
html[dir="rtl"] [class*="__title"],
html[dir="rtl"] [class*="eyebrow"] {
  font-family: 'Cairo', 'Inter', system-ui, sans-serif;
  letter-spacing: 0; /* tight Latin tracking looks wrong on Arabic */
}

/* ---- Default text alignment ----------------------------------------------- */
html[dir="rtl"] .auth-foot,
html[dir="rtl"] .lang-picker,
html[dir="rtl"] .lang-picker__opt,
html[dir="rtl"] .menu-item,
html[dir="rtl"] .terms__table th,
html[dir="rtl"] .terms__table td {
  text-align: right;
}

/* ---- Form field icons (password reveal, …) -------------------------------- */
html[dir="rtl"] .field__eye {
  right: auto;
  left: 8px;
}

/* ---- Toggles: the knob sits on the inline-start edge ----------------------- */
html[dir="rtl"] .toggle__dot::after {
  left: auto;
  right: 2px;
}
html[dir="rtl"] .toggle input:checked + .toggle__dot::after {
  left: auto;
  right: 18px;
}
html[dir="rtl"] .ms__toggle::after {
  left: auto;
  right: 2px;
}
html[dir="rtl"] .ms__toggle.is-on::after {
  transform: translateX(-18px);
}

/* ---- Inline tick / cross spacing ------------------------------------------ */
html[dir="rtl"] .ms__sv .tick,
html[dir="rtl"] .ms__sv .cross {
  margin-left: 0;
  margin-right: 3px;
}

/* ---- Nav tab notification badge ------------------------------------------- */
html[dir="rtl"] .mv2__tabs .tbadge {
  right: auto;
  left: 50%;
  margin-right: 0;
  margin-left: -22px;
}

/* ---- Floating "change league" toast --------------------------------------- */
html[dir="rtl"] #sb-change-league {
  right: auto;
  left: 18px;
}

/* ---- Terms / legal document ----------------------------------------------- */
html[dir="rtl"] .terms__notice {
  border-left: 0;
  border-right: 4px solid var(--red);
}
html[dir="rtl"] .terms__doc ul {
  padding-left: 0;
  padding-right: 20px;
}

/* ---- Language picker dropdown anchors to the inline-start edge ------------- */
html[dir="rtl"] .lang-picker__menu {
  right: auto;
  left: 0;
}

/* ---- Fixture cards: keep the away block mirrored under RTL ----------------- */
html[dir="rtl"] .fwk-team--away {
  flex-direction: row;
  text-align: right;
}
html[dir="rtl"] .fwk-live::before {
  left: auto;
  right: -1px;
  border-radius: 0 10px 10px 0;
}