/* ============================================================================
   panel-gourmet.css — nakładka motywu GOURMET na skin panel-kds.v2.css
   Ładowana PO panel-kds.v2.css, TYLKO z restaurant-panel.html (scope: panel restauracji).
   Nadpisuje tokeny CHROME (tło/powierzchnie/tekst/border/brand/primary/SIDEBAR/font).
   Statusy KDS (new/prep/warn/late/ready/cancel/multi/note) NIETKNIĘTE — zostają funkcjonalne.
   Toggle jasny/ciemny (papu.panel.dark → html.dark) działa bez zmian.
   Rollback: usuń <link> do tego pliku z restaurant-panel.html.
   v2 (2026-06-22): + --kds-chrome (sidebar) + --kds-on-brand krem + nagłówki Fraunces.
   ============================================================================ */

/* ---------- JASNY (Gourmet light: krem + złoto + burgund; sidebar = ciepły węgiel) ---------- */
:root {
  --kds-bg:         #F7F1E6;
  --kds-bg-grad:    radial-gradient(60rem 40rem at 100% -12%, rgba(169,128,46,.10) 0%, rgba(169,128,46,0) 60%),
                    radial-gradient(50rem 34rem at -12% 112%, rgba(139,58,70,.05) 0%, rgba(139,58,70,0) 60%),
                    linear-gradient(180deg, #FBF6EC 0%, #F5EEDF 100%);
  --kds-surface:    #FFFFFF;
  --kds-surface-2:  #FBF5EA;
  --kds-surface-3:  #F3E9D6;
  --kds-text:       #221A10;
  --kds-text-2:     #4A3D2C;
  --kds-text-muted: #6B5D49;
  --kds-text-faint: #9A8B72;
  --kds-border:     #E8DEC9;
  --kds-border-2:   #DCCFB4;

  /* SIDEBAR w trybie JASNYM → kremowy (warm white); tekst ciemny (overrides niżej) */
  --kds-chrome:     #FCF8EF;
  --kds-chrome-700: #F0E6D2;
  --kds-on-brand:   #221A10;   /* ciemny tekst na jasnym sidebarze */

  --kds-brand:      #A9802E;   /* złoto (było czerwień/zieleń) — logo/aktywna nav/focus */
  --kds-brand-700:  #8A6726;
  --kds-brand-tint: #F5EAD2;
  --kds-brand-50:   #F5EAD2;
  --kds-focus:      #A9802E;

  --kds-primary:    #8B3A46;   /* burgund — PRIMARY akcja (biały tekst, AA ~5.9:1) */
  --kds-primary-700:#6E2E38;
}

/* ---------- CIEMNY (Gourmet dark: ciepły węgiel + złoto + burgund) ---------- */
html.dark {
  --kds-bg:         #15100B;
  --kds-bg-grad:    radial-gradient(60rem 40rem at 100% -12%, rgba(216,180,94,.06) 0%, rgba(216,180,94,0) 60%);
  --kds-surface:    #211910;
  --kds-surface-2:  #2A2015;
  --kds-surface-3:  #332817;
  --kds-text:       #F6EEE0;
  --kds-text-2:     #D4C6AE;
  --kds-text-muted: #B6A888;
  --kds-text-faint: #8A7B62;
  --kds-border:     #3A2E1C;
  --kds-border-2:   #4A3A24;

  --kds-chrome:     #1B140D;
  --kds-chrome-700: #120D08;
  --kds-on-brand:   #F6EEE0;

  --kds-brand:      #D8B45E;   /* złoto rozjaśnione na ciemnym */
  --kds-brand-700:  #C29A3F;
  --kds-brand-tint: #2A2015;
  --kds-brand-50:   #2A2015;
  --kds-focus:      #D8B45E;

  --kds-primary:    #9B4450;
  --kds-primary-700:#8B3A46;
}

/* aktywna nav w DARK: skin twardo ustawia #6FA776 (zieleń) — przepinamy na złoto */
html.dark header nav .text-tomato-700,
html.dark header nav button.bg-tomato-50 { color: #D8B45E !important; }

/* DNA Gourmet: nagłówki = Fraunces (serif). Skin redesign wymuszał Bricolage — nadpisujemy.
   KDS liczby/timery zostają robocze (Inter tabular). Fraunces self-hostowany w panelu. */
.font-display, h1, h2, .font-brand {
  font-family: 'Fraunces Variable', Fraunces, Georgia, serif !important;
  letter-spacing: -0.012em;
}

/* delikatny złoty top-border na sidebarze (akcent Gourmet, zamiast czysto białej hairline) */
.lk-sidebar { border-right: 1px solid rgba(216,180,94,.14) !important; }
.lk-sidebar__brand .lk-logo { box-shadow: 0 2px 10px rgba(0,0,0,.3), 0 0 0 1px rgba(216,180,94,.25) !important; }

/* ---------- JASNY SIDEBAR w trybie jasnym: hardcoded biały tekst → ciemny ----------
   Dotyczy WYŁĄCZNIE html:not(.dark). Tryb ciemny (html.dark) ma sidebar ciemny + biały tekst (bez zmian). */
html:not(.dark) .lk-sidebar { border-right: 1px solid var(--kds-border) !important; box-shadow: inset -1px 0 0 rgba(169,128,46,.10) !important; }
html:not(.dark) .lk-brand-meta b { color: var(--kds-text) !important; }
html:not(.dark) .lk-brand-meta span { color: var(--kds-text-muted) !important; }
html:not(.dark) .lk-nav-link, html:not(.dark) .lk-nav-grouphead { color: var(--kds-text-2) !important; }
html:not(.dark) .lk-nav-link:hover, html:not(.dark) .lk-nav-grouphead:hover { color: var(--kds-text) !important; background: rgba(169,128,46,.10) !important; }
html:not(.dark) .lk-nav-link.is-active { color: var(--kds-text) !important; background: color-mix(in srgb, var(--kds-brand) 16%, transparent) !important; }
html:not(.dark) .lk-nav-sublink { color: var(--kds-text-muted) !important; }
html:not(.dark) .lk-nav-sublink:hover { color: var(--kds-text) !important; background: rgba(169,128,46,.08) !important; }
html:not(.dark) .lk-nav-sublink.is-active { color: var(--kds-text) !important; }
html:not(.dark) .lk-nav-section { color: var(--kds-text-faint) !important; }
html:not(.dark) .lk-iconbtn { color: var(--kds-text-2) !important; background: var(--kds-surface-3) !important; }
html:not(.dark) .lk-iconbtn:hover { color: var(--kds-text) !important; background: var(--kds-border) !important; }
html:not(.dark) .lk-side-link, html:not(.dark) .lk-side-user { color: var(--kds-text-muted) !important; }
html:not(.dark) .lk-side-link:hover { color: var(--kds-text) !important; }
html:not(.dark) .lk-logout { color: var(--kds-text-2) !important; }
html:not(.dark) .lk-logout:hover { color: var(--kds-text) !important; }
html:not(.dark) .lk-sidebar__footer { border-top-color: var(--kds-border) !important; }
html:not(.dark) .lk-nav::-webkit-scrollbar-thumb { background: rgba(40,30,18,.16) !important; }
html:not(.dark) .lk-nav-sublink::before { background: rgba(40,30,18,.12) !important; }
html:not(.dark) .lk-kiosk-exit { color: var(--kds-text) !important; }
html:not(.dark) .lk-sidebar__brand .lk-logo { box-shadow: 0 1px 4px rgba(120,80,40,.18), 0 0 0 1px rgba(169,128,46,.22) !important; }
/* złoty pasek aktywnej pozycji (::before) zostaje złoty w obu trybach */

/* płynna zmiana motywu */
body, header, .lk-sidebar, .lk-topbar, .bg-white, .kds-tile {
  transition: background-color .25s ease, color .22s ease, border-color .25s ease;
}
@media (prefers-reduced-motion: reduce) {
  body, header, .lk-sidebar, .lk-topbar, .bg-white, .kds-tile { transition: none; }
}
