/* ════════════════════════════════════════════════════════════════════════
   KUKKONIA SHOP · STARÝ OTEC a.s. — DIZAJN TOKENS (zdieľané premenné)
   ════════════════════════════════════════════════════════════════════════
   Tento súbor je JEDINÝ zdroj brand farieb, typografie, spacingu a tieňov.
   Linkujú ho všetky moduly (index, prevádzky, plánovače) aj dizajn systém.
   Zmena tu = zmena všade.
   ════════════════════════════════════════════════════════════════════════ */

/* ═══════════════ 01 · CSS PREMENNÉ (DESIGN TOKENS) ═══════════════ */
:root {
  /* Brand farby - default Starý Otec
     ZMENA 2026-06-17: základná červená #A8242B → #C91520 (R201 G21 B32, jasnejšia).
     REVERT (pôvodná paleta): --red:#A8242B; --red-dark:#7C1A20; --red-light:#C84850;
       --role-0:#A8242B; --shadow-red rgba(168,36,43,..); --shadow-red-lg rgba(168,36,43,..);
       --shadow-header rgba(124,26,32,..); brand-primary:#A8242B/#7C1A20/#C84850. */
  --red: #C91520;
  --red-dark: #A50F18;
  --red-darker: #840C13;   /* tmavší odtieň red-dark — hover profilového chipu (nahrádza starú natvrdú vínovú #6B161C) */
  --red-light: #E0454F;
  /* RGB trojice tej istej červenej — pre rgba(...) tiene/tinty, aby sa farba brala
     z tokenu (nie napevno). Pri zmene červenej zmeň aj tieto. REVERT: 168,36,43 / 124,26,32 */
  --red-rgb: 201, 21, 32;
  --red-dark-rgb: 165, 15, 24;
  
  /* Béžová škála */
  --cream: #FAF6EE;
  --beige-paper: #FEFDFA;
  --beige-light: #F7F0E3;
  --beige: #EFE4D2;
  --beige-dark: #DDD0B8;
  
  /* Hover stavy */
  --hover-soft: #F7F0E3;
  --hover-strong: #E5D7BB;
  
  /* Row state farby (pre tabuľky data manager aplikácií) */
  --row-urgent: #FFE9E9;
  --row-auto-90: #F3E8F5;
  --row-auto-zaradene: #FFF8E1;
  --row-limit-border: #D87B2C;
  
  /* Šedá / čierna */
  --black: #2A1F18;
  --grey-dark: #5A4A3F;
  --grey: #8A7868;
  --grey-light: #D9CFC0;
  --white: #FFFFFF;
  /* Pruhovanie riadkov tabuliek (zebra) — JEDINÝ CENTRÁLNY zdroj farby striedavého riadku.
     Zmena TOHTO tokenu prefarbí zebra vo VŠETKÝCH appkách (zdieľaný dm-table aj lokálne tabuľky,
     ktoré používajú var(--row-stripe)). Aktuálne = BIELA → riadky sú jednofarebné (bez zebry). */
  --row-stripe: #FFFFFF;

  /* Status farby */
  --green: #6FA844;
  --orange: #D87B2C;
  --red-alert: #C73E3E;
  --blue-info: #4A6FA5;

  /* Žltá/jantárová — TIPY (komponent dm-tip): žltý informačný box */
  --amber: #C9971F;          /* akcent (ikona/okraj) tip boxu */
  --amber-bg: #FFF8E1;       /* svetložlté pozadie tip boxu */
  --amber-border: #EAD8A6;   /* jemný okraj tip boxu */
  --medal-gold: #C9A227;     /* 1. miesto — medailový prstenec / korunka */
  --medal-silver: #9BA0A6;   /* 2. miesto */
  --medal-bronze: #B08D57;   /* 3. miesto */
  --green-rgb: 111, 168, 68; /* pre jemné pozadia (trend ▲) */
  --green-dark: #3B6D11;     /* tmavý text zeleného trendu */

  /* Koncept Starý Otec a.s. = HNEDÁ (KK Kukkonia = červená). Token namiesto natvrdých #7A5230/#5A3D24. */
  --brown-so: #7A5230;
  --brown-so-dark: #5A3D24;

  /* ── Farby rolí — SOLID avatary (biely text), 50-farebná paleta ──
     Jednotné naprieč všetkými aplikáciami; farba sa prideľuje podľa PORADIA
     roly v centrálnom zozname (rola 0 = admin = červená). Po 50 rolách sa
     paleta cyklicky opakuje (index = 1 + ((poradie-1) % 50)).
     Paleta je generovaná golden-angle rozostupom odtieňov a OVERENÁ na kontrast
     s bielym textom ≥ 4.5:1 (WCAG AA) — žiadny avatar nie je svetlý/neviditeľný.
     Badge varianty (svetlé chipy s tmavým textom) sú v dizajn_system .dm-role-badge--N. */
  --role-0: #C91520;   /* admin — vždy červená (= základná brand červená) */
  --role-1: #B23434;
  --role-2: #268241;
  --role-3: #7D34B2;
  --role-4: #7E7325;
  --role-5: #297D8E;
  --role-6: #B23478;
  --role-7: #3D8226;
  --role-8: #3934B2;
  --role-9: #B25E34;
  --role-10: #268260;
  --role-11: #B128BD;
  --role-12: #667A1A;
  --role-13: #2873BD;
  --role-14: #BD2847;
  --role-15: #1D8726;
  --role-16: #6028BD;
  --role-17: #936D1F;
  --role-18: #1C827E;
  --role-19: #BD2898;
  --role-20: #4B821C;
  --role-21: #3448B2;
  --role-22: #B24434;
  --role-23: #26824D;
  --role-24: #8D34B2;
  --role-25: #767722;
  --role-26: #2E7D9E;
  --role-27: #B23468;
  --role-28: #318226;
  --role-29: #4934B2;
  --role-30: #A2642F;
  --role-31: #1C8269;
  --role-32: #BD28B7;
  --role-33: #5D7E1B;
  --role-34: #285FBD;
  --role-35: #BD2834;
  --role-36: #1C8232;
  --role-37: #7328BD;
  --role-38: #87711D;
  --role-39: #1D818B;
  --role-40: #BD2885;
  --role-41: #448226;
  --role-42: #3438B2;
  --role-43: #B25434;
  --role-44: #268259;
  --role-45: #9E34B2;
  --role-46: #6F7B24;
  --role-47: #327AAE;
  --role-48: #B23458;
  --role-49: #278628;
  --role-50: #5934B2;
  
  /* Spacing tokens */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
  --space-2xl: 60px;
  --space-3xl: 80px;
  
  /* Border radius
     OKNÁ/PANELY/KARTY/TOOLBARY = --radius-lg = 8px (pravidlo 2026-06-30; 12px→10px→8px).
     TLAČIDLÁ/INPUTY = --radius-md = 8px. ČIPY = --radius-pill. */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 8px;
  --radius-xl: 14px;
  --radius-pill: 999px;
  
  /* Typography */
  --font-sans: 'Helvetica Neue', 'Segoe UI', Arial, sans-serif;
  --font-serif: Georgia, 'Times New Roman', serif;
  --font-mono: 'Courier New', monospace;
  
  /* Animácie */
  --duration-instant: 100ms;
  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 300ms;
  --ease: ease;
  --ease-out: ease-out;
  --ease-in: ease-in;
  
  /* Layout dimensions */
  --nav-width: 220px;   /* ľavý modulový nav — JEDNOTNÁ šírka pre všetky appky (pravidlo 2026-07-03); appky používajú var(--nav-width), nehardkódujú */
  --aside-width: 320px;
  --header-height: 75px;
  --footer-height: 50px;
  
  /* Tiene */
  --shadow-sm: 0 2px 8px rgba(42, 31, 24, 0.06);
  --shadow-md: 0 8px 24px rgba(42, 31, 24, 0.10);
  --shadow-lg: 0 12px 32px rgba(42, 31, 24, 0.12);
  --shadow-red: 0 12px 30px rgba(var(--red-rgb), 0.15);
  --shadow-red-lg: 0 24px 60px rgba(var(--red-rgb), 0.18);
  --shadow-header: 0 2px 8px rgba(var(--red-dark-rgb), 0.15);
}


/* ═══════════════ 02 · THEME SYSTEM ═══════════════ */
/* Default = Starý Otec a.s. - aplikuje sa cez :root, môže byť overridnuté */

[data-brand="staryotec"] {
  --brand-primary: #C91520;
  --brand-primary-dark: #A50F18;
  --brand-primary-light: #E0454F;
}

[data-brand="snr"] {
  /* S & R s.r.o. — tmavomodrý gradient */
  --brand-primary: #143F66;
  --brand-primary-dark: #0F2F4D;
  --brand-primary-light: #1E5A8F;
  
  /* Override brand premenných */
  --red: var(--brand-primary);
  --red-dark: var(--brand-primary-dark);
  --red-light: var(--brand-primary-light);
}

/* Header — pri S&R sa použije gradient */
[data-brand="snr"] .app-header {
  background: linear-gradient(135deg, #143F66 0%, #1E5A8F 100%);
}


/* ─── LOGO FIRMA MARK (krúžok pre tenant brand) ─── */
/*
   PRAVIDLO: Kukkonia SHOP logo môže používať VÝLUČNE Starý Otec a.s.
   Ostatné firmy (S&R, atď.) dostanú krúžok s iniciálkami namiesto loga.
*/
.logo-firma-mark {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--cream);
  color: var(--red);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-serif);
  font-style: italic;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.5px;
  flex-shrink: 0;
}