/* ==========================================================================
   Urdu view — /ur/<section>/<slug>/
   Loaded ONLY on Urdu pages, together with the Nastaliq webfont. Spec 4.3.
   The layout mirrors on its own because the rest of the CSS uses logical
   properties; what this file handles is what direction alone does not fix —
   Nastaliq's typographic demands.
   ========================================================================== */

:is([dir="rtl"], [lang="ur"]) {
  /* Nastaliq sits on a steep diagonal baseline and needs far more leading than
     a Latin face. It also renders small: bump the base size to compensate. */
  --lh-tight: 1.7;
  --lh-snug:  1.9;
  --lh-base:  2.15;
}

:is([dir="rtl"], [lang="ur"]) body {
  font-family: var(--font-ur);
  font-size: 1.0625rem;
  line-height: var(--lh-base);
}

/* Nastaliq is a connected script. Letter-spacing breaks the joins, and
   uppercasing is meaningless — both have to be switched off wherever the
   Latin design used them for texture. */
:is([dir="rtl"], [lang="ur"]) *:not(script):not(style) {
  letter-spacing: normal !important;
  text-transform: none !important;
}

/* The Google Fonts family ships a single weight; synthetic bold smears the
   strokes. Weight is carried by colour and size instead. */
:is([dir="rtl"], [lang="ur"]) b,
:is([dir="rtl"], [lang="ur"]) strong,
:is([dir="rtl"], [lang="ur"]) h1, :is([dir="rtl"], [lang="ur"]) h2, :is([dir="rtl"], [lang="ur"]) h3, :is([dir="rtl"], [lang="ur"]) h4 {
  font-weight: 400;
}
:is([dir="rtl"], [lang="ur"]) .card__title,
:is([dir="rtl"], [lang="ur"]) .post-header h1,
:is([dir="rtl"], [lang="ur"]) .section-banner h1 { color: var(--text); }
:is([dir="rtl"], [lang="ur"]) .facts__row dd,
:is([dir="rtl"], [lang="ur"]) .checkitem__text { color: var(--text); }
:is([dir="rtl"], [lang="ur"]) .facts__row dt { color: var(--text-muted); }

/* Headings need room around them, not weight, to read as headings. */
:is([dir="rtl"], [lang="ur"]) .prose h2 { margin-top: var(--s-12); }
:is([dir="rtl"], [lang="ur"]) .legal-doc h2 { margin-top: var(--s-12); }

/* Descenders in Nastaliq drop well below the baseline, so anything with a
   tight fixed height clips. Give the small chrome room to breathe. */
:is([dir="rtl"], [lang="ur"]) .pill,
:is([dir="rtl"], [lang="ur"]) .countdown,
:is([dir="rtl"], [lang="ur"]) .status { line-height: 2.2; padding-block: 2px; }
:is([dir="rtl"], [lang="ur"]) .btn { line-height: 2; padding-block: var(--s-2); }
:is([dir="rtl"], [lang="ur"]) .card__title { line-height: 1.95; }
:is([dir="rtl"], [lang="ur"]) .card__summary { -webkit-line-clamp: 2; line-height: 2; }
/* Clamped text measures in line boxes, and Gulzar's descenders fall outside a
   Latin-sized one — so clamped elements need a taller box or they shear. */
:is([dir="rtl"], [lang="ur"]) .row-item__title,
:is([dir="rtl"], [lang="ur"]) .queue__text b,
:is([dir="rtl"], [lang="ur"]) .news-item__title,
:is([dir="rtl"], [lang="ur"]) .day-item b {
  line-height: 2.15;
  /* The line box is tall enough, but Gulzar's ink still overshoots it by a
     few pixels, and these elements clip their overflow to clamp long titles.
     The padding keeps the clamp and lets the descenders show. */
  padding-block-end: 5px;
}

/* Latin runs inside Urdu text — figures, currency codes, dates — must not
   inherit the Urdu face, and need isolating so the bidi algorithm keeps
   them intact next to Urdu punctuation. */
:is([dir="rtl"], [lang="ur"]) .num,
:is([dir="rtl"], [lang="ur"]) .facts__row dd .num,
:is([dir="rtl"], [lang="ur"]) time,
:is([dir="rtl"], [lang="ur"]) .countdown,
:is([dir="rtl"], [lang="ur"]) .cal__num {
  font-family: var(--font-en);
  unicode-bidi: isolate;
  font-variant-numeric: tabular-nums;
}

/* The English toggle is the mirror of the Urdu one on the English view. */
:is([dir="rtl"], [lang="ur"]) .urdu-toggle { font-family: var(--font-en); font-size: var(--fs-sm); line-height: 1.6; }

/* Nastaliq needs a taller line box inside dense grid cells. */
:is([dir="rtl"], [lang="ur"]) .cal-ev { line-height: 1.9; font-size: 10px; }
:is([dir="rtl"], [lang="ur"]) .cal__day { min-height: 112px; }

/* A Latin run inside Urdu flow — an employer name, a licence number, a salary
   figure — must be isolated or the bidi algorithm moves its punctuation to the
   wrong end. `bdi` does this in markup; this covers the elements that hold
   Latin values without one. */
:is([dir="rtl"], [lang="ur"]) bdi { unicode-bidi: isolate; }
:is([dir="rtl"], [lang="ur"]) .facts__row dd,
:is([dir="rtl"], [lang="ur"]) .card__facts li { unicode-bidi: isolate; }
