/* ============================================================================
   ROBETA STUDIO · styles/tokens.css
   F0 · korak 2 · TOKEN MOST · 13.8.2026

   Dva sloja:

   A) PRIMITIVI INK MONOLITH - prebrani iz
      ~/Desktop/STUDIO-REDESIGN/studio-ink-monolith-demo.html (vrstice 13-35).

   B) ALIASI - vseh 32 tokenov, ki jih bere ŽIVA koda:
      29 jih bere inline <style> blok v index.html, 23 jih bere JS
      (unija = 32; presek = 20). V JS je ~930 var() BREZ fallbacka, zato
      manjkajoč token ne odpove enotno:
         color:var(--mut)              -> podeduje barvo starša
         border:1px solid var(--line)  -> shorthand neveljaven, rob IZGINE
         background:var(--panel)       -> transparent, plošča IZGINE
         border-color:var(--line)      -> currentColor, hairline POČRNI

   ---------------------------------------------------------------------------
   ŽELEZNO PRAVILO
   Vse v tej datoteki je scope-ano pod html[data-skin="ink"].
   Brez tega atributa ta datoteka NE deklarira ničesar. Legacy je nedotaknjen.
   ---------------------------------------------------------------------------

   TEMA
   Register uporablja samo bright različico. Temni način in preklopnik sta
   odstranjena; data-skin ostaja ločena os za zasilni legacy prikaz.

   KONTEKSTNI ALIASI (ključno)
   V demotu ni ene same "barve besedila". Ohišje je črno, dokumenti so papir,
   gosti paneli so temni. Zato isti token pomeni drugo vrednost glede na
   površino, na kateri element stoji:

     token        ohišje (shell)     papir (plate)     gost panel (dense)
     --ink        svetlo besedilo    #141310           svetlo besedilo
     --panel      temna kartica      papir             temna kartica
     --line       svetel hairline    #E3E1DC           svetel hairline

   Zato so aliasi deklarirani trikrat: na korenu (ohišje) in znova na
   seznamu površin, ki so papir oz. gost panel. Custom properties se dedujejo,
   zato vsak potomec dobi pravilno vrednost brez posega v JS.
   ============================================================================ */


/* ==========================================================================
   A · PRIMITIVI · REGISTER BRIGHT
   Vir: Register handoff, lastnikova odločitev 21.8.2026.
   ========================================================================== */
html[data-skin="ink"]{
  /* Register · topla paleta (paket 21.8.2026) */
  --espresso-deep:#3B302A;
  --espresso:#5B4A3E;
  --pavement:#8A8077;
  --oat:#CBBFAF;
  --ivory:#E8DED4;
  --veil:#F6F2EB;
  --hair-strong:#D8CCBD;
  --hair-weak:#E4DACE;
  --paper-ter:#6E6559;
  --console-fg:#F6F2EB;
  --console-mut:#B4A794;
  --err-bg:#F0DDDA;
  --err-bd:#B4443A;
  --err-fg:#8E362E;

  --accent:var(--oat);
  --gold:var(--accent);           /* združljivost z obstoječimi INK komponentami */
  --green:#3F7A58;
  --rail-bg:var(--espresso-deep);
  --rail-fg:var(--console-fg);
  --rail-fg2:var(--console-mut);
  --rail-hair:rgba(246,242,235,.18);
  --fD:'Fraunces',Georgia,serif;
  --fB:'Hanken Grotesk','Helvetica Neue',Arial,sans-serif;
  --fM:'Geist Mono','SF Mono',Menlo,monospace;

  /* -- ohišje -- */
  --shell:var(--ivory);
  --shell-fg:var(--espresso-deep);
  --shell-fg2:var(--espresso);
  --shell-fg3:var(--paper-ter);
  --shell-hair:var(--hair-strong);
  --shell-hair2:var(--hair-weak);
  --acc-text:var(--espresso-deep);

  /* -- papirna plošča -- */
  --plate:var(--veil);
  --plate-line:var(--hair-strong);
  --plate2:#EFEAE3;
  --hair-p:var(--hair-strong);
  --hair-p2:var(--hair-weak);

  /* -- gost (temen) panel -- */
  --dense:var(--espresso-deep);
  --dense-fg:var(--console-fg);
  --dense-fg2:var(--console-mut);
  --dense-fg3:var(--console-mut);
  --dense-hair:rgba(246,242,235,.28);
  --dense-hair2:rgba(246,242,235,.16);
  --dense-rule:rgba(246,242,235,.55);
  --dense2:#493B33;

  --btn2:rgba(246,242,235,.4);
  --gh-bg:var(--espresso-deep);
  --gh-fg:var(--veil);
}

/* ==========================================================================
   A2 · KONSTANTE PAPIRJA
   V demotu sta --ink in --ink2 deklarirana med konstantami, ker vedno
   pomenita "črnilo NA papirju". Ker sta --ink / --ink2 hkrati imeni dveh
   živih legacy tokenov (ki pa pomenita "besedilo na TEJ površini"), sta
   konstanti tu preimenovani v --plate-fg / --plate-fg2, alias --ink pa
   dobi pravo vrednost glede na kontekst (glej sloj B).
   ========================================================================== */
html[data-skin="ink"][data-skin]{
  --plate-fg:var(--espresso-deep);
  --plate-fg2:var(--espresso);
  --plate-mut:var(--paper-ter);
  --plate-faint:var(--paper-ter);

  /* semantične barve - papirna in ohišna različica */
  --sem-red-p:#B4443A;   --sem-red-s:#E0796D;
  --sem-green-p:#3F7A58; --sem-green-s:#5DB47F;
  --sem-amber-p:#8A6D2A; --sem-amber-s:#C9A24E;
  --sem-orange-p:#C05A3A;--sem-orange-s:#E28C5F;
  --sem-blue-p:#4E5F98;  --sem-blue-s:#8B99C8;
}


/* ==========================================================================
   B · ALIASI · KONTEKST OHIŠJA (privzeto na korenu)
   Vse, kar ni izrecno na papirju ali v gostem panelu, dobi te vrednosti.
   --panel privzeto pade na --dense (temna kartica), ne na papir: to je
   fail-safe, ker neznana JS plošča na temnem ohišju s papirnim ozadjem in
   podedovanim svetlim besedilom ne bi bila berljiva.
   ========================================================================== */
html[data-skin="ink"][data-skin]{
  /* --- površine --- */
  --bg:var(--shell);
  --panel:var(--dense);
  --panel-solid:var(--dense);
  --panel2:var(--dense2);
  --paper:var(--plate);

  /* --- besedilo --- */
  --ink:var(--shell-fg);
  --ink2:var(--shell-fg2);
  --ink-2:var(--shell-fg2);
  --mut:var(--shell-fg2);
  --faint:var(--shell-fg3);

  /* --- črte --- */
  --line:var(--shell-hair);
  --line2:var(--shell-hair2);
  --hair:var(--shell-hair);

  /* --- akcent --- */
  --gold-deep:color-mix(in srgb, var(--gold) 70%, var(--shell-fg));

  /* --- semantika --- */
  --excl:var(--sem-red-s);
  --dep:var(--sem-green-s);
  --price:var(--sem-amber-s);
  --disc:var(--sem-orange-s);
  --vis:var(--sem-blue-s);

  /* --- obrnjena površina (žig .fill / .fill-inv iz demota) --- */
  --invert:var(--shell-fg);
  --on-invert:var(--shell);

  /* --- rail (v demotu VEDNO črn, neodvisno od teme) --- */
  --rail:var(--rail-bg);
  --rail-ink:var(--rail-fg);
  --rail-line:var(--rail-hair);

  /* --- ugasnjeni glass / senca / radij / tekstura ------------------------
     Legacy blok bere te tokene kot CELE vrednosti lastnosti
     (backdrop-filter:var(--glass), box-shadow:var(--edge),var(--lift)).
     Ker jih tu nastavimo na nevidno, postane legacy CSS pod ink skinom
     ploski - brez ene same box-shadow ali backdrop-filter deklaracije
     v naših datotekah.
     --grid:transparent ugasne radial-gradient pikčasto teksturo
     iz index.html:308.
     -------------------------------------------------------------------- */
  --glass:none;
  --edge:0 0 0 transparent;
  --lift:0 0 0 transparent;
  --shadow:0 0 0 transparent;
  --shadow-lg:0 0 0 transparent;
  --grid:transparent;
  --r:0;
}


/* ==========================================================================
   B2 · ALIASI · KONTEKST PAPIRJA
   Vsaka površina, ki je v INK MONOLITH papirnata plošča. Seznam pokriva:
     - legacy razrede iz index.html
     - razrede, ki jih injicirajo view-*.js (izluščeno iz njihovih <style>)
     - vse inline stilirane elemente, ki sami rišejo var(--panel) /
       var(--panel-solid) / var(--panel2) - teh razredi ne opišejo, ker jih
       JS izriše z atributom style. Selektor [style*="..."] jih zajame kot
       razred. To je F0 most; ko posamezni pogled v F4 dobi svoje razrede,
       se njegov [style*] zadetek naravno umakne.
   ========================================================================== */
html[data-skin="ink"] .card,
html[data-skin="ink"] .kpis,
html[data-skin="ink"] .kpi,
html[data-skin="ink"] .rows,
html[data-skin="ink"] .stg,
html[data-skin="ink"] .opt,
html[data-skin="ink"] .bvcard,
html[data-skin="ink"] .brail,
html[data-skin="ink"] .note,
html[data-skin="ink"] .ruleitem,
html[data-skin="ink"] .invoice,
html[data-skin="ink"] .vertbl,
html[data-skin="ink"] table.data,
html[data-skin="ink"] .drawer,
html[data-skin="ink"] .vermodal-box,
html[data-skin="ink"] .cfgcard,
html[data-skin="ink"] .cfgplate,
html[data-skin="ink"] .cfgpanel,
html[data-skin="ink"] .cfgtree,
html[data-skin="ink"] .cfgrule,
html[data-skin="ink"] .cfgstat,
html[data-skin="ink"] .cfgstep,
html[data-skin="ink"] .cfgver1,
html[data-skin="ink"] .cfgtabs,
html[data-skin="ink"] .cfgfoot,
html[data-skin="ink"] .cfgadv,
html[data-skin="ink"] .cfgsoon,
html[data-skin="ink"] .crmact,
html[data-skin="ink"] .crmtbl,
html[data-skin="ink"] .kbcol,
html[data-skin="ink"] .kbcard,
html[data-skin="ink"] .kbfind,
html[data-skin="ink"] .kbdeal,
html[data-skin="ink"] .md-act,
html[data-skin="ink"] .md-rowlbl,
html[data-skin="ink"] .md-laycard,
html[data-skin="ink"] .md-mod,
html[data-skin="ink"] .pb-btn,
html[data-skin="ink"] .pb-oin,
html[data-skin="ink"] .pb-sel,
html[data-skin="ink"] .pb-params,
html[data-skin="ink"] .pv-bb,
html[data-skin="ink"] .pv-dec,
html[data-skin="ink"] .pv-empty,
html[data-skin="ink"] .pv-res,
html[data-skin="ink"] .pv-rule,
html[data-skin="ink"] .pv-tbl,
html[data-skin="ink"] .rbx,
html[data-skin="ink"] .rbro,
html[data-skin="ink"] .tr-edit,
html[data-skin="ink"] .usact,
html[data-skin="ink"] .uscard,
html[data-skin="ink"] .ustbl,
/* Pregled: .sectitle je tam masthead plošče, torej papir, ne ohišje.
   Selektor je tu in ne v ink.css, da ostane ena sama pogodba za papirni
   kontekst (prej ročni prepis tega bloka v ink.css 14.2 brez semantičnih
   barv --excl/--dep/--price/--disc/--vis). */
html[data-skin="ink"] #view > .wrap:has(> .funnel) > .sectitle,
html[data-skin="ink"] [style*="var(--panel)"],
html[data-skin="ink"] [style*="var(--panel-solid)"],
html[data-skin="ink"] [style*="var(--panel2)"],
/* DOPOLNJENO 13.8.2026: zgornje tri oblike ujamejo samo var() BREZ fallbacka.
   V JS je fallback pogost - view-dealer.js:376 pise var(--panel2,#f7f5f2),
   :314 in :405 var(--panel2,#f2f0ec), offer-docs.js:894 var(--panel-solid,...).
   Te povrsine so ostale zunaj papirnega konteksta. Zapis brez zaklepaja
   ([style*="var(--panel2,"]) ujame OBE serializaciji naenkrat, ker Chrome ob
   ponovnem izpisu doda presledek sele ZA vejico (var(--panel2, #f7f5f2)),
   predpona do vejice pa ostane enaka. */
html[data-skin="ink"] [style*="var(--panel,"],
html[data-skin="ink"] [style*="var(--panel-solid,"],
html[data-skin="ink"] [style*="var(--panel2,"]{
  --bg:var(--plate);
  --panel:var(--plate);
  --panel-solid:var(--plate);
  --panel2:var(--plate2);

  --ink:var(--plate-fg);
  --ink2:var(--plate-fg2);
  --ink-2:var(--plate-fg2);
  --mut:var(--plate-mut);
  --faint:var(--plate-faint);

  --line:var(--hair-p);
  --line2:var(--hair-p2);
  --hair:var(--hair-p);

  --gold-deep:color-mix(in srgb, var(--gold) 72%, var(--plate-fg));

  --excl:var(--sem-red-p);
  --dep:var(--sem-green-p);
  --price:var(--sem-amber-p);
  --disc:var(--sem-orange-p);
  --vis:var(--sem-blue-p);

  --invert:var(--plate-fg);
  --on-invert:var(--plate);
}

/* ==========================================================================
   B3 · ALIASI · KONTEKST GOSTEGA PANELA
   Demo: .cmdbar, .ledger, .term, .wk. V legacy je najbližji ekvivalent
   iskalno polje v mastheadu (postane ukazna vrstica).
   ========================================================================== */
html[data-skin="ink"] .searchbox,
html[data-skin="ink"] .ink-dense{
  --bg:var(--dense);
  --panel:var(--dense);
  --panel-solid:var(--dense);
  --panel2:var(--dense2);

  --ink:var(--dense-fg);
  --ink2:var(--dense-fg2);
  --ink-2:var(--dense-fg2);
  --mut:var(--dense-fg2);
  --faint:var(--dense-fg3);

  --line:var(--dense-hair);
  --line2:var(--dense-hair2);
  --hair:var(--dense-hair);

  --invert:var(--dense-fg);
  --on-invert:var(--dense);
}

/* ==========================================================================
   B4 · ALIASI · KONTEKST RAILA
   Rail je v demotu vedno črn, tudi v svetli temi.
   ========================================================================== */
html[data-skin="ink"] aside{
  --bg:var(--rail-bg);
  --panel:var(--rail-bg);
  --panel-solid:var(--rail-bg);
  --panel2:var(--rail-bg);

  --ink:var(--rail-fg);
  --ink2:var(--rail-fg2);
  --ink-2:var(--rail-fg2);
  --mut:var(--rail-fg2);
  --faint:var(--rail-fg2);

  --line:var(--rail-hair);
  --line2:var(--rail-hair);
  --hair:var(--rail-hair);

  --gold-deep:var(--gold);
  --invert:var(--rail-fg);
  --on-invert:var(--rail-bg);
}
