/* =========================================================================
   SkillWay – design tokeny
   Rozhodnuto 22. 8. 2026. Jediné místo, kde se mění barvy, písma a rozměry.
   Zdroj: AgentOS/business/SkillWay/design/tokens.css (kopie z 30. 8. 2026,
   při změně přepsat celý soubor, ne upravovat po částech).
   ========================================================================= */
:root {
  /* --- PÍSMA -------------------------------------------------------------
     Sada A: Alegreya Sans (web, nadpisy i text) + Alegreya (dokumenty).
     Obě mají otevřenou licenci OFL, kurzívu a české znaky.
     Hostovat vlastní woff2, ne přes odkaz na Google (rychlost a soukromí). */
  --pismo-nadpis: "Alegreya Sans", "Segoe UI", system-ui, sans-serif;
  --pismo-text: "Alegreya Sans", "Segoe UI", system-ui, sans-serif;
  --pismo-dokument: "Alegreya", Georgia, "Times New Roman", serif;
  /* Systémové neproporční písmo (16. 9. 2026): promptové bloky jdou do
     prezentací, handoutů i na web a musí vypadat stejně na Macu, Windows
     a iPadu bez instalace. Menlo je v macOS/iOS, Consolas ve Windows. */
  --pismo-kod: Menlo, Consolas, "Cascadia Mono", "Courier New", monospace;

  /* tloušťky, které Alegreya Sans má: 100 300 400 500 700 800 900 */
  --vaha-text: 400;
  --vaha-zvyraz: 500;
  --vaha-nadpis: 700;
  --vaha-hero: 800;

  /* --- ZÁKLADNÍ BARVY ---------------------------------------------------- */
  --petrolej: #0F5B6B;
  --petrolej-tmavy: #0C4A57;
  --petrolej-svetly: #15788D;
  --malina: #D31746;
  --malina-tmava: #A81038;
  --malina-svetla: #E63E68;

  /* doplňková dvojice, zatím prostřední sytost (varianta 3+);
     jemnější je #FF7A59 / #17A9BD, sytější #FF5A30 / #009FBA */
  --koral: #FF6A45;
  --tyrkys: #06A5BB;

  /* --- PLOCHY ------------------------------------------------------------ */
  --papir: #FAF6EF;          /* krémové pozadí webu */
  --papir-bily: #FFFFFF;     /* dokumenty, karty */
  --tma: #101417;            /* čistá tma */
  --tma-petrolej: linear-gradient(160deg, #0E3A46 0%, #0A2731 55%, #08171C 100%);
  --tma-petrolej-roh: radial-gradient(120% 105% at 18% 0%, #17697F 0%, #0C2C36 52%, #060F13 100%);
  --tma-malina: linear-gradient(160deg, #B01038 0%, #6E0722 55%, #2C040F 100%);
  --papir-prechod: linear-gradient(160deg, #FAF6EF, #E6ECE9);
  /* Jemná vlna na velkých plochách (varianta D, Jiřík 8. 9. 2026): měkký oblouk
     v petroleji a náznak maliny v pravém dolním rohu. Krytí do 5 %, takže se
     plocha přestane tvářit mrtvě, ale nic nepřebije. Trik je prstenec uvnitř
     velkého kruhového přechodu – po roztažení z něj zbude oblouk jako záhyb. */
  --vlna:
    radial-gradient(160% 125% at -22% -32%, transparent 55%, rgba(15, 91, 107, .05) 63%, transparent 73%),
    radial-gradient(95% 75% at 100% 100%, rgba(211, 23, 70, .035), transparent 60%);

  /* --- TEXT NA PLOŠE ----------------------------------------------------- */
  --text-hlavni: #1B2426;
  --text-vedlejsi: #5A6B70;
  --text-slaby: #8A9699;
  --linka: #E4E8E7;
  --tint: #EEF3F3;          /* podklad štítků a vybraných filtrů */

  /* --- ROLE ---------------------------------------------------------------
     Používej role, ne barvy. Přebarvení značky pak znamená změnit jen role. */
  --pozadi: var(--papir);
  --pozadi-karta: var(--papir-bily);
  --barva-1: var(--petrolej);      /* hlavní, nadpisy a odkazy */
  --barva-2: var(--malina);        /* akcent, tlačítka a ceny */
  --text: var(--text-hlavni);
  --text-tlumeny: var(--text-vedlejsi);
  --na-barve-1: #FFFFFF;           /* text na petrolejové ploše */
  --na-barve-2: #FFFFFF;           /* text na malinové ploše */
  --sklo: rgba(255, 255, 255, 0.72); /* poloprůhledná hlavička nad obsahem */
  color-scheme: light;
}

/* --- TMAVÝ REŽIM ---------------------------------------------------------
   Pravidlo z kola 7: petrolej se na tmě zesvětluje, jinak neprojde
   kontrastem (na tmě má poměr jen 2,41 : 1, proto se mění na bílou).
   Malina se NEzesvětluje (rozhodnuto 16. 9. 2026): značka má jeden odstín
   ve světlém i tmavém režimu, tlačítka zůstávají #D31746 s bílým textem
   (5,9 : 1). Zesvětlené odstíny #E63E68 a #FF7DA0 jsou jen barva písma
   na tmavé ploše, nikdy výplň tlačítka. */
/* Výchozí je světlý vzhled, i když má systém nastavený tmavý (zadání Jiříka
   7. 9. 2026). Tmavý se zapne jen volbou v přepínači vzhledu. */
:root[data-rezim="tmavy"] {
  --pozadi: var(--tma-petrolej);
  --pozadi-karta: #131B1F;
  --barva-1: #FFFFFF;
  --barva-2: var(--malina);        /* stejný odstín jako ve světlém režimu */
  --na-barve-1: #101417;
  --na-barve-2: #FFFFFF;
  --text: rgba(255, 255, 255, 0.90);
  --text-tlumeny: rgba(255, 255, 255, 0.66);
  --linka: rgba(255, 255, 255, 0.14);
  --tint: rgba(255, 255, 255, 0.10);
  --sklo: rgba(19, 27, 31, 0.72);
  /* Na tmavém podkladu musí vlna světlat, jinak plocha zůstane mrtvá. */
  --vlna:
    radial-gradient(160% 125% at -22% -32%, transparent 55%, rgba(255, 255, 255, .05) 63%, transparent 73%),
    radial-gradient(95% 75% at 100% 100%, rgba(255, 125, 160, .06), transparent 60%);
  color-scheme: dark;
}

/* =========================================================================
   VELIKOSTI PÍSMA
   Web roste s šířkou okna, dokumenty mají pevné body podle Wordu.
   ========================================================================= */
:root {
  /* Zvětšeno o zhruba 6 % (Jiřík 9. 9. 2026: první recenzenti hlásili malé
     písmo). Hero zůstává, tam bylo dost. */
  --text-hero: clamp(34px, 5vw, 60px);
  --text-h1: clamp(30px, 3.8vw, 46px);
  --text-h2: clamp(23px, 2.5vw, 32px);
  --text-h3: 22px;
  --text-zaklad: 18px;      /* chlebový text webu */
  --text-maly: 15.5px;
  --text-drobny: 13.5px;

  --radky-nadpis: 1.15;
  --radky-text: 1.62;

  /* dokumenty: 1 bod = 1,333 px při 96 dpi */
  --doc-h1: 21.3px;   /* 16 bodů */
  --doc-h2: 17.3px;   /* 13 bodů */
  --doc-h3: 16px;     /* 12 bodů */
  --doc-text: 14.7px; /* 11 bodů */
  --doc-popisek: 12px;/*  9 bodů */
}

/* =========================================================================
   ODSTUPY, ROHY, STÍNY
   ========================================================================= */
:root {
  --o1: 4px;  --o2: 8px;  --o3: 12px; --o4: 16px;
  --o5: 24px; --o6: 32px; --o7: 48px; --o8: 64px; --o9: 96px;

  --roh-maly: 8px;
  --roh: 12px;
  --roh-velky: 20px;

  --stin: 0 1px 2px rgba(16, 20, 23, 0.06), 0 8px 24px rgba(16, 20, 23, 0.08);

  /*
   * Text vyplňuje blok, ve kterém stojí (Jiřík, závazné pravidlo).
   * Do 9. 9. 2026 tu bylo 68ch a odstavce končily uprostřed stránky:
   * článek 646 px v obsahu širokém 1180 px, vpravo půl obrazovky prázdné.
   * O délce řádku rozhoduje šířka bloku, ne strop v ch. Zúžení se dělá
   * zúžením bloku (grid, sloupec), ne max-width na odstavcích.
   */
  --sirka-textu: none;
  /*
   * Šířka obsahového bloku. 9. 9. 2026 zvednuto z 1180 px: na širokém
   * monitoru zbývalo vlevo i vpravo přes 200 px prázdna a na detailu kurzu
   * z toho vyšel text jen 778 px široký, protože si ho ještě dělí s boxem
   * ceny (340 px). Strop drží jen to, aby řádek nepřerostl obrazovku.
   */
  --sirka-obsahu: 1520px;
}

/* =========================================================================
   PRAVIDLA, KTERÁ SE NESMÍ PORUŠIT
   1. Malina má jeden odstín #D31746 ve světlém i tmavém režimu, na ní vždy
      bílý text (5,9 : 1). Zesvětlené odstíny #E63E68 a #FF7DA0 smí být jen
      barvou písma na tmavé ploše, nikdy výplní tlačítka (16. 9. 2026).
   2. Tmavé plochy nikdy nedávat na čistou černou, používat --tma-petrolej.
      Čistá --tma je jen pro jednobarevné a tiskové varianty.
   3. Gradient je doplňková podoba. Do Wordu, do malých velikostí a do
      černobílého tisku vždy plná barva.
   4. Písma hostovat vlastní ve formátu woff2 s font-display: swap.
   ========================================================================= */