/**
 * Elevate CRM · Design Tokens
 * Vorlage: elevate-handoff (nicht 1:1 Source of Truth)
 */

:root {
  --surface: #fcfcfc;
  --surface-muted: #ebebea;
  /* Listen / Lead-Rows (pen.dev Suchläufe) */
  --surface-list: #f0f0f0;
  --surface-panel: #e8e8e6;
  /* Echtes Weiß für Kontrastflächen auf Panel-Grau (Toggle, Tipps, Score-Chips) */
  --surface-raised: #ffffff;
  --surface-inverse: #020202;
  --surface-nav: #141414;
  --surface-preview: #0e1116;

  --white: #fcfcfc;
  --black: #020202;
  --jet: #32312f;
  --silver: #d6d6d6;
  --aero: #fc1a08;
  --accent: #fc1a08;
  --accent-soft: #ffe8e5;

  --text-primary: #020202;
  --text-secondary: #5c5c5a;
  /* Labels/Hints — heller als Secondary, damit sich Meta klar vom Body trennt (pen: #8A8A88) */
  --text-muted: #8a8a88;
  --text-inverse: #fcfcfc;
  --text-inverse-muted: #b0b0ae;

  --border: #d0d0ce;
  --border-subtle: #e2e2e0;
  --border-strong: #32312f;

  --success: #1b7f4e;
  --success-soft: #e6f5ee;
  --warning: #b86e00;
  --warning-soft: #fff4e0;
  --danger: #fc1a08;
  --danger-soft: #ffe8e5;

  --score-fit: #32312f;
  --score-opportunity: #fc1a08;

  --font-ui: "Space Grotesk", system-ui, sans-serif;
  --font-data: "IBM Plex Mono", ui-monospace, monospace;
  --font-brand: var(--font-ui);
  --font-mono: var(--font-data);

  /* Typo-Skala — Body möglichst auf --fs-body halten */
  --fs-label: 11px;
  --fs-meta: 12px;
  --fs-body: 13px;
  --fs-copy: 14px;
  --fs-title: 16px;
  --fs-display: 20px;

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  --radius: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 14px;
  --radius-card: 18px;
  --radius-panel: 28px;
  --radius-shell: 0;
  --radius-pill: 999px;

  --shell-w: 100%;
  --shell-h: 100dvh;
  --topbar-h: 72px;
  --rail-w: 72px;
  --rail-h: 64px;

  --shadow-card: 0 1px 0 #0202020a, 0 4px 18px #0202020c;
  --shadow-strip: 0 1px 0 #0202020a, 0 2px 10px #0202020a;
  --shadow-popover: 0 8px 24px #02020218;
  --shadow-toast: 0 10px 28px #0202022e;
  --shadow-accent: 0 6px 16px #fc1a0844;
  --overlay-scrim: rgba(2, 2, 2, 0.78);
  --overlay-backdrop: rgba(2, 2, 2, 0.45);

  /* Cards: unten bewusst mehr Luft — verhindert „an der Kante“-Look */
  --card-pad-x: 16px;
  --card-pad-top: 16px;
  --card-pad-bottom: 24px;
  --card-pad-x-lg: 20px;
  --card-pad-top-lg: 20px;
  --card-pad-bottom-lg: 28px;
  --panel-pad-bottom: 48px;

  /* Reader-Listen (Post · Audit · Übersicht · Adressbuch): Dichte hier drehen */
  --dash-row-pad-y: 12px;
  --dash-row-pad-x: 14px;
  --dash-row-gap: 4px;
  --dash-row-line: 1.35;
  --dash-row-ico-gap: 16px;
}