/*
 * Datei: assets/styles/tokens.css
 * Zweck: Globale visuelle Tokenquelle.
 * Status: führend
 * Verantwortet: Farben, Radien, Abstände, Touch-Höhen und gemeinsame Designvariablen.
 */

:root {
  --surface2: var(--surface-2, var(--surface, #1b1f27));
  --surface3: var(--surface-3, var(--surface2, var(--surface, #232935)));
  --text-soft: var(--text-muted, var(--text-secondary, #b5bcc8));
  --text2: var(--text-secondary, var(--text-soft, #b5bcc8));

  --bg:#26282b;
  --surface:#121316;
  --surface-2:#17191c;
  --surface-3:#1d2024;
  --line:#303236;
  --text:#f3f0ec;
  --muted:#b9b6b1;
  --brand:#d7b56d;
  --panel:var(--surface);
  --panel2:var(--surface-2);
  --accent:var(--brand);
  --track:var(--surface-3);
  --danger:#ff6e89;
  --good:#92d5a6;
  --ok:var(--good);
  --bad:var(--danger);
  --shadow:0 12px 28px rgba(0,0,0,.26);
  --radius-s:16px;
  --radius-m:22px;
  --radius-l:28px;
  --radius-xl:36px;
  --header-pad:14px;
  --section-pad:12px;
  --touch:44px;


  /* AP-29D-REV14-PHASE4-B | Führende DG-UI-Grammatik */
  --dg-bg:#26282b;
  --dg-bg-2:#24262a;
  --dg-bg-gradient:linear-gradient(180deg, #28292b 0%, #25272a 48%, #222428 100%);
  --dg-surface:rgba(8,8,9,.40);
  --dg-surface-solid:#121316;
  --dg-surface-2:rgba(8,8,9,.56);
  --dg-surface-strong:rgba(8,8,9,.76);
  --dg-line:#303236;
  --dg-line-soft:rgba(255,255,255,.065);
  --dg-text:#f5f2ee;
  --dg-muted:#bdb9b4;
  --dg-muted-2:#9f9c98;
  --dg-accent:#d7b56d;
  --dg-accent-soft:rgba(215,181,109,.28);
  --dg-card-radius:36px;
  --dg-chip-radius:30px;
  --dg-image-radius:30px;
  --dg-image-aspect-ratio:4 / 3;
  --dg-image-focus-y:82%;
  --dg-accordion-radius:22px;
  --dg-accordion-open-scale:1.006;
  --dg-shadow-card:0 8px 18px rgba(0,0,0,.24);
  --dg-accordion-shadow:var(--dg-shadow-card);
  --dg-shadow-card-open:0 14px 30px rgba(0,0,0,.34);
  --dg-accordion-open-shadow:var(--dg-shadow-card-open);
  --dg-shadow-chip:0 6px 12px rgba(0,0,0,.20);
  --dg-shadow-image:0 22px 52px rgba(0,0,0,.38);
  --dg-shadow-image-soft:0 16px 38px rgba(0,0,0,.32);
  --dg-title-overlay:rgba(0,0,0,.50);
  --dg-motion-fast:160ms;
  --dg-motion-medium:240ms;
  --dg-motion-ease:cubic-bezier(.2,.8,.2,1);

  /* AP-29D-REV14-PHASE4-A | Shell-/Header-/Search-Dock-Vertrag */
  --shell-bg:var(--dg-bg, var(--bg));
  --shell-surface:var(--dg-surface-solid, var(--surface));
  --shell-surface-2:var(--surface-2);
  --shell-line:var(--dg-line, var(--line));
  --shell-text:var(--dg-text, var(--text));
  --shell-muted:var(--dg-muted, var(--muted));
  --shell-accent:var(--dg-accent, var(--brand));
  --shell-header-bg:var(--dg-bg, var(--bg));
  --shell-header-shadow:0 8px 20px rgba(0,0,0,.20);
  --shell-dock-bg:linear-gradient(180deg, rgba(38,40,43,0), rgba(38,40,43,.72) 22%, rgba(18,19,22,.96));
  --shell-dock-shadow:0 14px 34px rgba(0,0,0,.32);
  --shell-overlay-bg:rgba(0,0,0,.42);
  --shell-blur:18px;
  --shell-header-height:64px;
  --shell-dock-height:74px;
  --shell-keyboard-offset:0px;
  --shell-z-header:240;
  --shell-z-dock:220;
  --shell-z-results:230;
  --shell-z-overlay:210;

  --shell-line-soft:rgba(255,255,255,.06);
  --shell-line-subtle:rgba(255,255,255,.04);
  --shell-accent-border:rgba(215,181,109,.46);
  --shell-accent-border-soft:rgba(215,181,109,.34);
  --shell-accent-ring:rgba(215,181,109,.16);
  --shell-accent-ring-soft:rgba(215,181,109,.12);
  --shell-result-bg:color-mix(in srgb, var(--shell-surface, var(--surface)) 94%, transparent);
  --shell-side-shadow:-18px 0 44px rgba(0,0,0,.28);
  --shell-result-shadow:0 12px 26px rgba(0,0,0,.22);

  /* AP-29D-REV14-PHASE4-C | Defektkorrektur: kompakter Header, reduzierte Accordion-Radien, zentraler Open-State und Keyboard-Dock-Offset. */
  --app-header-compact-height:64px;
  --app-header-logo-size:42px;
  --app-header-action-size:44px;
  --dg-accordion-radius-compact:22px;
  --dg-title-overlay-radius:18px;
}