/* ============================================================================
   Loop type layer — Jai Guru Loop Sans v0.100 applied to the app
   Loads AFTER brand-type/fonts.css (which carries the @font-face rules and is
   kept exactly as the package delivered it, so the package can be replaced
   wholesale on the next revision).

   Three rules the package asks for, and this file enforces:
     1. One family everywhere, including things browsers style themselves —
        buttons, inputs, selects, textareas, dialogs, tables.
     2. Malayalam gets its own face, never letter-spacing, and room to breathe.
        Malayalam marks sit above and below the letter; a Latin cap-height box
        clips them.
     3. Real weights only. The package ships 400/500/600/700, so nothing is
        faked — font-synthesis is off and the app's 800/900 are mapped down.
   ========================================================================== */

:root{
  --font-loop:"Jai Guru Loop Sans","Jai Guru Loop Malayalam",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-loop-ml:"Jai Guru Loop Malayalam","Jai Guru Loop Sans",system-ui,sans-serif;
  /* code and fixed-width columns stay monospaced — the brand face is not one */
  --font-loop-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}

html,body{ font-family:var(--font-loop); font-synthesis:none; }

/* Form controls and dialogs do not inherit type in any browser unless told to.
   font-family only — sizes stay exactly where each page put them. */
button,input,select,textarea,optgroup,option,
fieldset,legend,label,output,progress,meter,
dialog,menu,table,th,td,caption,summary{ font-family:inherit; }
::placeholder{ font-family:inherit; }
::file-selector-button{ font-family:inherit; }
select option{ font-family:var(--font-loop); }

/* Malayalam — the companion face, no tracking, and a taller line.
   !important is deliberate and narrow: the app tracks its headings, labels and
   tags in ems, and that tracking breaks Malayalam conjuncts. Script correctness
   outranks the styling that happens to sit above it. */
.l-ml,.ml,[lang="ml"],:lang(ml){
  font-family:var(--font-loop-ml);
  letter-spacing:normal !important;
  word-spacing:normal !important;
  line-height:1.65;
  font-feature-settings:normal;
}
/* In Malayalam mode the whole screen is Malayalam, including text the app never
   wrapped in a span — a label whose own text node LoopLang swapped. The app
   tracks its labels, tags and headings in ems for Latin; that tracking has to
   come off those elements too, or the conjuncts break apart. English inside
   them (Loop, a job code) is short and reads fine untracked. */
/* Unwrapped Malayalam — a heading, button or label whose own text is Malayalam
   with no span around it. loop-lang.js marks those elements with data-ml as it
   walks the page, so the tracking above them can be switched off by script and
   not by guessing at selectors. The family still comes from the normal stack:
   Latin face first, Malayalam companion for the Malayalam, exactly as the
   package intends — this rule is about tracking only. */
[data-ml]{ letter-spacing:normal !important; word-spacing:normal !important; }

/* Real weights only: 400 body · 500 labels · 600 buttons and headings · 700 rare.
   <b>/<strong> default to 700 in every browser; in this app they mark a value
   inside a line, not a shout, so they sit at 600. */
b,strong{ font-weight:600; }

/* Amounts, quantities, times and codes line up in columns.
   Job codes get the slashed zero the package provides so JGL-0108 cannot be
   misread; ordinary amounts keep the dotted zero. */
.u-mono,.num,.amt,.reg,.money,
td.num,th.num,time,
input[type="number"],input[type="tel"],input[inputmode="numeric"],input[inputmode="decimal"]{
  font-variant-numeric:lining-nums tabular-nums;
}
.loop-numeric{ font-variant-numeric:lining-nums tabular-nums; }
.loop-code,.reg,code,kbd,samp{ font-feature-settings:"zero" 1; font-variant-numeric:tabular-nums; }

/* Room for the marks. Malayalam sits taller than Latin at the same size; the
   1.65 line above gives the vowel signs and chillus their space. Nothing here
   sets a height — the app's own spacing is left exactly as it was, and any
   clipping found on a real screen is fixed at that component, not globally. */