/**
 * tokens.css — shared design tokens (single source of truth)
 * Loaded before each app's own styles so admin + member look consistent.
 * Includes both naming conventions (admin: --primary/--danger, member: --green/--red)
 * mapped to the SAME unified values. The kiosk uses its own dark theme and is excluded.
 */
:root {
  /* ── Brand ──────────────────────────────────────────────── */
  --primary:       #7db602;
  --primary-dark:  #5f8902;
  --primary-light: #eef7d0;
  --green:         #7db602;   /* member alias of --primary */
  --green-dark:    #5f8902;   /* member alias of --primary-dark */
  --green-bg:      #f1f7e0;

  /* ── Surfaces ───────────────────────────────────────────── */
  --bg:     #f6f7f9;
  --card:   #ffffff;
  --white:  #ffffff;
  --border: #e6e8ec;

  /* ── Text ───────────────────────────────────────────────── */
  --text:        #111827;
  --text-2:      #374151;
  --muted:       #6b7280;
  --muted-light: #9ca3af;

  /* ── Semantic ───────────────────────────────────────────── */
  --success: #10b981;
  --warning: #f59e0b;
  --danger:  #ef4444;
  --info:    #0ea5e9;
  --amber:    #f59e0b;   /* member alias of --warning */
  --amber-bg: #fffbeb;
  --red:      #ef4444;   /* member alias of --danger (unified from #dc2626) */
  --red-bg:   #fef2f2;

  /* ── Radii ──────────────────────────────────────────────── */
  --radius:      12px;
  --radius-sm:   8px;
  --radius-pill: 800px;
}
