/* === base.css ===========================================
   Zentrale Farb- und Layout-Variablen + Grundtypografie
========================================================= */

/* === base.css ===========================================
   Zentrale Farb- und Layout-Variablen + Grundtypografie
========================================================= */

:root {
  /* Grundpalette (bestehend) */
  --bg: #0b1220;
  --card: #0f172a;
  --text: #e6e9ef;
  --muted: #94a3b8;

  /* Akzente (bestehend) */
  --brand: #4f8cff;   /* Links/Brand (blau) */
  --accent: #22c55e;  /* Bestätigen/Success (grün) */
  --warn: #f59e0b;
  --danger: #ef4444;

  /* Rahmen/Flächen (bestehend) */
  --border: #243042;
  --hover: rgba(255,255,255,.08);

  /* Admin-Sidebar Maße (bestehend) */
  --admin-w: 280px;
  --admin-w-collapsed: 90px;
  --icon-box: 50px;

  /* ===== Bridge: POS-/Theme-Tokens auf Base mappen ===== */
  --clr-bg-dark: #0f172a;
  --clr-bg-dark-2: #0b1220;
  --clr-elev-1: var(--card);
  --clr-elev-2: var(--border);
  --clr-text: var(--text);
  --clr-text-muted: var(--muted);

  --clr-green: var(--accent);
  --clr-green-700: #16a34a;

  --clr-blue: #3b82f6;
  --clr-amber: #fbbf24;
  --clr-amber-text: #1e293b;

  --clr-success-bg: #064e3b;
  --clr-success-text: #bbf7d0;
  --clr-success-strong: #4ade80;

  --clr-danger-bg: #7f1d1d;
  --clr-danger-text: #fecaca;

  --clr-border: var(--border);

  --shadow-raise: 0 0 8px rgba(34,197,94,.7);
  --shadow-selected: 0 0 10px rgba(255,152,0,.8);
  --shadow-sticky: 0 -4px 12px rgba(0,0,0,.25);

  --kasse-padding: 10px;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;

  --size-btn-height: 45px;
  --size-btn-large-h: 56px;

  /* Minor: für Icons/Links stärkerer Textton, falls benötigt */
  --text-strong: #ffffff;
}

* { box-sizing: border-box; }

html, body {
  margin: 0; padding: 0;
  background: var(--bg); color: var(--text);
  font: 16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, 'DejaVu Sans', Arial, sans-serif;
}

a { color: var(--text); text-decoration: none; }
img { max-width: 100%; }


* {
    box-sizing: border-box;
}