/* Copyright (c) 2026 Bc. Jan Krejčí. All rights reserved.                  */
/* Proprietary and confidential. See LICENSE in the project root.           */

/* ==========================================================================
 *  KURNÍK PROFI — KANONICKÉ ZNAČKOVÉ TOKENY
 *
 *  Toto je JEDINÝ zdroj pravdy pro vzhled APLIKACE (/app/*).
 *  Rozhodnutí majitele značky (31. 7. 2026): varianta A1 + B3 + C2.
 *
 *    A1  Primární akční barva = ZELENÁ #3C7A34.
 *        Zlatá #D9A441 je akcent (vajíčka, Founder, odměny).
 *        Terakota #C1502E je VYHRAZENÁ pro kritická upozornění a mazání.
 *        Vychází z pravidla poměru Design Bible: krém + zeleň ~75 %,
 *        zlatá ~15 %, terakota ~10 %. Barva primárního tlačítka na každé
 *        obrazovce nemůže být ta, které má být na ploše 10 %.
 *
 *    B3  Základ Plus Jakarta Sans (nadpisy) + Inter (text).
 *        Fredoka POUZE na jména slepiček, herní prvky a velká hero čísla.
 *
 *    C2  Teplý krém #F3E8D5 jako světlé pozadí.
 *
 *  ----------------------------------------------------------------------
 *  PROČ JE VŠE SCOPOVANÉ NA .kp-app
 *
 *  Marketingový web na `/` používá starší paletu z Design Bible (terakota
 *  jako primární, Fredoka + Outfit), definovanou v `forge-tokens.css`.
 *  Zadání zní ponechat web beze změny, proto se kanonická paleta aplikuje
 *  jen uvnitř aplikačního shellu `.kpa-app`. Stejné názvy tokenů (--kp-*)
 *  se tím uvnitř aplikace přepíšou, takže i sdílené komponenty (Mascot)
 *  se automaticky obarví na aplikační paletu.
 *
 *  Až se marketingový web převede na kanonickou paletu, přesune se obsah
 *  bloku `.kpa-app` do `:root` a scope se zruší. Do té doby je tohle
 *  vědomá, dočasná hranice — ne technický dluh bez majitele.
 *
 *  ----------------------------------------------------------------------
 *  PROČ SE PŘEPISUJE I --accent A JÁDROVÉ TOKENY FORGE
 *
 *  Forge komponenty čtou `var(--accent)`, `var(--bg-2)`, `var(--fg-1)` atd.
 *  Přepsáním těchto tokenů na `.kp-app` se obarví VŠECHNY komponenty
 *  najednou, bez sahání do jejich kódu.
 *
 *  Pozor na jednu vlastnost CSS proměnných: `--accent` je v Forge složené
 *  z `--accent-h/c/l`, ale substituce `var()` proběhne UŽ na `:root`.
 *  Potomek, který přepíše jen `--accent-h`, tedy zděděné `--accent`
 *  nezmění. Proto se `--accent` (a -soft/-glow) níže deklarují ZNOVU —
 *  tím se přepočítají z hodnot platných na `.kpa-app`.
 * ========================================================================== */

/* `.forge-tweaks-panel` je v seznamu schválně: panel Vzhled se renderuje
   jako sourozenec shellu, tedy MIMO `.kpa-app`. Bez toho by dědil výchozí
   Forge akcent (magenta) a v naší zelené aplikaci by svítil cize. */
.kpa-app,
.forge-tweaks-panel {
    /* ---------------------------------------------------------------- */
    /*  Značková paleta — světlý režim („ranní farma")                   */
    /* ---------------------------------------------------------------- */

    /* Zelená — primární akce, zdraví, „vše v pořádku". */
    --kp-green:        #3C7A34;
    --kp-green-2:      #54A046;
    --kp-green-deep:   #2B5C26;
    --kp-green-ink:    #1C3A1A;
    --kp-green-soft:   #E4EED9;

    /* Zlatá — vajíčka, Founder, odměny, prestiž. Koření, ne omáčka. */
    --kp-gold:         #D9A441;
    --kp-gold-2:       #F5B841;
    --kp-gold-soft:    #F7EAC9;
    --kp-gold-glow:    #F7D488;

    /* Terakota — VÝHRADNĚ kritická upozornění a destruktivní akce. */
    --kp-terracotta:      #C1502E;
    --kp-terracotta-deep: #A03D20;
    --kp-terracotta-soft: #F6DDD1;

    /* Krém — pozadí a povrchy. */
    --kp-cream:        #F3E8D5;
    --kp-cream-2:      #FBF4E7;
    --kp-cream-3:      #EBDDC4;
    --kp-surface:      #FFFFFF;
    --kp-surface-2:    #FBF4E7;
    --kp-surface-3:    #F1E7D4;

    /* Nebeská modř — AI, data, počasí. */
    --kp-sky:          #5E93B8;
    --kp-sky-soft:     #DCEAF2;

    /* Text. */
    --kp-ink:          #28221B;
    --kp-ink-soft:     #5C5344;
    --kp-ink-faint:    #8B8173;

    /* Linky. */
    --kp-line:         rgba(40, 34, 27, 0.11);
    --kp-line-soft:    rgba(40, 34, 27, 0.06);
    --kp-line-strong:  rgba(40, 34, 27, 0.20);

    /* Zpětná kompatibilita se sdíleným maskotem (Mascot.razor čte
       --kp-barn / --kp-yolk / --kp-leaf). Uvnitř aplikace je mapujeme
       na kanonickou paletu, aby slepička ladila s appkou. */
    --kp-barn:         var(--kp-terracotta);
    --kp-yolk:         var(--kp-gold-2);
    --kp-leaf:         var(--kp-green);
    --kp-hen-body:     #FFF7EA;

    /* ---------------------------------------------------------------- */
    /*  Typografie — Fredoka (nadpisy a velká čísla) + Outfit (text)      */
    /* ---------------------------------------------------------------- */
    /* Jeden pár pro marketing i aplikaci. Fredoka je hravá a v hustém UI
       by unavovala — proto drží nadpisy a čísla, zatímco běžný text,
       tlačítka a formuláře jede Outfit. */
    --kp-font-display: 'Fredoka', 'Outfit', system-ui, -apple-system, sans-serif;
    --kp-font-body:    'Outfit', system-ui, -apple-system, sans-serif;
    --kp-font-playful: 'Fredoka', 'Outfit', system-ui, sans-serif;

    /* ---------------------------------------------------------------- */
    /*  Stíny — teplé hnědé, nikdy šedé/černé                            */
    /* ---------------------------------------------------------------- */
    --kp-shadow-sm: 0 1px 2px rgba(40, 30, 20, 0.05), 0 2px 8px rgba(40, 30, 20, 0.05);
    --kp-shadow:    0 6px 18px rgba(40, 30, 20, 0.07), 0 20px 44px rgba(40, 30, 20, 0.10);
    --kp-shadow-lg: 0 12px 34px rgba(40, 30, 20, 0.10), 0 40px 90px rgba(40, 30, 20, 0.16);
    --kp-shadow-green: 0 10px 26px rgba(43, 92, 38, 0.28);

    /* ---------------------------------------------------------------- */
    /*  MOSTY DO FORGE — obarví všechny Forge komponenty najednou        */
    /* ---------------------------------------------------------------- */

    /* Accent = zelená #3C7A34 → oklch(0.521 0.1216 141.46). */
    --accent-h: 141.46;
    --accent-c: 0.1216;
    --accent-l: 0.521;
    --accent:      oklch(var(--accent-l) var(--accent-c) var(--accent-h));
    --accent-soft: oklch(var(--accent-l) var(--accent-c) var(--accent-h) / 0.12);
    --accent-glow: oklch(var(--accent-l) var(--accent-c) var(--accent-h) / 0.32);
    --accent-base: var(--accent);
    --accent-hover: oklch(0.575 0.135 141.46);
    --accent-dim:  oklch(0.46 0.105 141.46);

    /* Pozadí a povrchy. */
    --bg-0: #EBDDC4;
    --bg-1: var(--kp-cream);
    --bg-2: var(--kp-cream-2);
    --bg-3: var(--kp-surface);
    --bg-4: #EFE3CC;
    --surface-s0: var(--kp-cream);
    --surface-s1: var(--kp-cream-2);
    --surface-s2: var(--kp-surface);
    --surface-s3: var(--kp-surface-3);
    --surface-elevated: var(--kp-surface);
    --surface-glass: rgba(255, 255, 255, 0.72);
    --surface-glass-strong: rgba(255, 255, 255, 0.88);

    /* Text. */
    --fg-1: var(--kp-ink);
    --fg-2: var(--kp-ink-soft);
    --fg-3: var(--kp-ink-faint);
    --fg-4: rgba(40, 34, 27, 0.38);
    --text-t1: var(--kp-ink);
    --text-t2: var(--kp-ink-soft);
    --text-t3: var(--kp-ink-faint);
    --text-t4: rgba(40, 34, 27, 0.38);

    /* Linky. */
    --line: var(--kp-line);
    --line-strong: var(--kp-line-strong);
    --line-accent: rgba(60, 122, 52, 0.34);
    --grid-line: var(--kp-line-soft);
    --border-b0: var(--kp-line-soft);
    --border-b1: var(--kp-line);
    --border-b2: var(--kp-line-strong);
    --border-b3: var(--kp-line-strong);

    /* Sémantika — zeleň OK, zlatá pozor, terakota kritické. */
    --ok:   var(--kp-green);
    --warn: #C98A1E;
    --bad:  var(--kp-terracotta);
    --info: var(--kp-sky);
    --semantic-success: var(--ok);
    --semantic-warning: var(--warn);
    --semantic-danger:  var(--bad);
    --semantic-info:    var(--info);
    --color-error:      var(--bad);

    /* Stíny Forge → teplé. */
    --shadow-color: rgba(40, 30, 20, 0.10);
    --shadow-color-strong: rgba(40, 30, 20, 0.18);
    --shadow-sm: var(--kp-shadow-sm);
    --shadow-md: var(--kp-shadow);
    --shadow-lg: var(--kp-shadow);
    --shadow-xl: var(--kp-shadow-lg);
    --shadow-glow: 0 0 0 4px var(--accent-soft);

    /* Typografie Forge. */
    --font-sans:    var(--kp-font-body);
    --font-display: var(--kp-font-display);

    /* Zaoblení — měkčí, „spotřebitelské". */
    --r-xs: 8px;
    --r-sm: 10px;
    --r-md: 14px;
    --r-lg: 18px;
    --r-xl: 24px;
    --r-2xl: 32px;

    /* Vstupy. */
    --input-bg: var(--kp-surface);
    --input-border: var(--kp-line-strong);
    --input-text: var(--kp-ink);
    --input-placeholder: var(--kp-ink-faint);
    --input-radius: 12px;

    color-scheme: light;
}

/* ==========================================================================
 *  TMAVÝ REŽIM — „luxusní večerní farma"
 *
 *  Není to inverze světlého režimu, ale samostatná nálada (Design Bible):
 *  noční les, teple svítící okna, zlatá září. Zeleň i zlatá se rozjasňují,
 *  aby na tmavém podkladu držely kontrast.
 * ========================================================================== */

[data-theme="dark"] .kpa-app,
[data-theme="dark"] .forge-tweaks-panel {
    --kp-green:        #5FB050;
    --kp-green-2:      #74C463;
    --kp-green-deep:   #3C7A34;
    --kp-green-ink:    #CDE6C2;
    --kp-green-soft:   #1C2A18;

    --kp-gold:         #F7C65A;
    --kp-gold-2:       #F0CD7E;
    --kp-gold-soft:    #2E2A1B;
    --kp-gold-glow:    #5C4D28;

    --kp-terracotta:      #E0714B;
    --kp-terracotta-deep: #C1502E;
    --kp-terracotta-soft: #3A2820;

    --kp-cream:        #12211F;
    --kp-cream-2:      #1B2E2A;
    --kp-cream-3:      #0D1714;
    --kp-surface:      #1B2E2A;
    --kp-surface-2:    #23403A;
    --kp-surface-3:    #16231F;

    --kp-sky:          #86B6D6;
    --kp-sky-soft:     #1E2A33;

    --kp-ink:          #F1E7D6;
    --kp-ink-soft:     #BFB4A2;
    --kp-ink-faint:    #93A096;

    --kp-line:         rgba(200, 220, 205, 0.13);
    --kp-line-soft:    rgba(200, 220, 205, 0.07);
    --kp-line-strong:  rgba(200, 220, 205, 0.24);

    --kp-hen-body:     #F3E7D2;

    --kp-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.30), 0 2px 8px rgba(0, 0, 0, 0.26);
    --kp-shadow:    0 6px 18px rgba(0, 0, 0, 0.38), 0 20px 44px rgba(0, 0, 0, 0.30);
    --kp-shadow-lg: 0 12px 34px rgba(0, 0, 0, 0.44), 0 40px 90px rgba(0, 0, 0, 0.40);
    --kp-shadow-green: 0 10px 26px rgba(95, 176, 80, 0.22);

    /* Accent = rozjasněná zelená #5FB050 → oklch(0.6836 0.1544 140.61). */
    --accent-h: 140.61;
    --accent-c: 0.1544;
    --accent-l: 0.6836;
    --accent:      oklch(var(--accent-l) var(--accent-c) var(--accent-h));
    --accent-soft: oklch(var(--accent-l) var(--accent-c) var(--accent-h) / 0.16);
    --accent-glow: oklch(var(--accent-l) var(--accent-c) var(--accent-h) / 0.34);
    --accent-base: var(--accent);
    --accent-hover: oklch(0.74 0.16 140.61);
    --accent-dim:  oklch(0.60 0.14 140.61);

    --bg-0: #0A1210;
    --bg-1: var(--kp-cream);
    --bg-2: var(--kp-cream-2);
    --bg-3: var(--kp-surface-2);
    --bg-4: #2A4A42;
    --surface-s0: var(--kp-cream);
    --surface-s1: var(--kp-cream-2);
    --surface-s2: var(--kp-surface-2);
    --surface-s3: var(--kp-surface-3);
    --surface-elevated: var(--kp-surface-2);
    --surface-glass: rgba(27, 46, 42, 0.66);
    --surface-glass-strong: rgba(27, 46, 42, 0.86);

    --fg-1: var(--kp-ink);
    --fg-2: var(--kp-ink-soft);
    --fg-3: var(--kp-ink-faint);
    --fg-4: rgba(241, 231, 214, 0.40);
    --text-t1: var(--kp-ink);
    --text-t2: var(--kp-ink-soft);
    --text-t3: var(--kp-ink-faint);
    --text-t4: rgba(241, 231, 214, 0.40);

    --line: var(--kp-line);
    --line-strong: var(--kp-line-strong);
    --line-accent: rgba(95, 176, 80, 0.40);
    --grid-line: var(--kp-line-soft);
    --border-b0: var(--kp-line-soft);
    --border-b1: var(--kp-line);
    --border-b2: var(--kp-line-strong);
    --border-b3: var(--kp-line-strong);

    --warn: #E0B45E;
    --shadow-color: rgba(0, 0, 0, 0.42);
    --shadow-color-strong: rgba(0, 0, 0, 0.60);

    --input-bg: var(--kp-surface-3);
    --input-border: var(--kp-line-strong);

    color-scheme: dark;
}