/* ============================================================
   AGT Design System — Tokens
   Modern-minimal. Clean. No decorative noise.
   ============================================================ */

:root {
  color-scheme: light;

  /* ── Surfaces ──────────────────────────────────────────── */
  --bg:            #f9fafb;
  --surface:       #ffffff;
  --panel:         #ffffff;
  --panel-soft:    #f3f4f6;
  --border:        #e5e7eb;
  --border-strong: #d1d5db;

  /* ── Text ──────────────────────────────────────────────── */
  --text:          #111827;
  --text-secondary:#4b5563;
  --muted:         #6b7280;
  --text-muted:    #9ca3af;

  /* ── Accent (Blue) ─────────────────────────────────────── */
  --accent:        #3a6ea5;
  --accent-strong: #2d5686;
  --accent-hover:  #2d5686;
  --accent-soft:   #eff4fb;

  /* ── Semantic ──────────────────────────────────────────── */
  --success:       #16a34a;
  --danger:        #dc2626;
  --warning:       #d97706;

  /* ── Shadows ───────────────────────────────────────────── */
  --shadow:        rgba(0, 0, 0, 0.06);
  --shadow-card:   0 1px 2px rgba(0, 0, 0, 0.05);

  /* ── Toggles ───────────────────────────────────────────── */
  --toggle-track:  #d1d5db;
  --toggle-thumb:  #ffffff;

  /* ── Table ─────────────────────────────────────────────── */
  --row-alt:       rgba(0, 0, 0, 0.02);

  /* ── Spacing ───────────────────────────────────────────── */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  12px;
  --space-base: 16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  /* ── Radius ────────────────────────────────────────────── */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;

  /* ── Typography ────────────────────────────────────────── */
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'SF Mono', 'Fira Code', Consolas, monospace;
  --text-xs:   0.75rem;
  --text-sm:   0.8125rem;
  --text-base: 0.875rem;
  --text-md:   0.9375rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  1.875rem;

  /* ── Transitions ───────────────────────────────────────── */
  --duration-fast: 120ms;
  --transition-interactive: 120ms ease;

  /* ── Colors (scale — for components) ───────────────────── */
  --color-primary-50:  #eff4fb;
  --color-primary-100: #dce6f5;
  --color-primary-200: #b8ccea;
  --color-primary-400: #6a9bd0;
  --color-primary-500: #3a6ea5;
  --color-primary-600: #2d5686;
  --color-primary-700: #1e3d63;
  --color-primary-800: #142a47;
  --color-primary-900: #0d1c30;

  --color-gray-50:  #f9fafb;
  --color-gray-100: #f3f4f6;
  --color-gray-200: #e5e7eb;
  --color-gray-300: #d1d5db;
  --color-gray-400: #9ca3af;
  --color-gray-500: #6b7280;
  --color-gray-600: #4b5563;
  --color-gray-700: #374151;
  --color-gray-800: #1f2937;
  --color-gray-900: #111827;

  --color-success-500: #16a34a;
  --color-success-600: #15803d;
  --color-danger-500:  #dc2626;
  --color-danger-600:  #b91c1c;
  --color-amber-500:   #d97706;
  --color-amber-600:   #b45309;
}

/* ── Dark Mode (explicit) ────────────────────────────────── */

html[data-theme="dark"] {
  color-scheme: dark;

  --bg:            #111111;
  --surface:       #1a1a1a;
  --panel:         #1a1a1a;
  --panel-soft:    #222222;
  --border:        #2a2a2a;
  --border-strong: #3a3a3a;

  --text:          #f0f0f0;
  --text-secondary:#b0b0b0;
  --muted:         #888888;
  --text-muted:    #666666;

  --accent:        #6b9fe8;
  --accent-strong: #89b5f0;
  --accent-hover:  #89b5f0;
  --accent-soft:   #1a2538;

  --success:       #4ade80;
  --danger:        #f87171;
  --warning:       #fbbf24;

  --shadow:        rgba(0, 0, 0, 0.25);
  --shadow-card:   0 1px 2px rgba(0, 0, 0, 0.2);

  --toggle-track:  #404040;
  --toggle-thumb:  #e5e5e5;
  --row-alt:       rgba(255, 255, 255, 0.03);

  --color-gray-50:  #1a1a1a;
  --color-gray-100: #222222;
  --color-gray-200: #2a2a2a;
  --color-gray-300: #3a3a3a;
  --color-gray-400: #666666;
  --color-gray-500: #888888;
  --color-gray-600: #aaaaaa;
  --color-gray-700: #cccccc;
  --color-gray-800: #e0e0e0;
  --color-gray-900: #f0f0f0;

  --color-primary-50:  #1a2538;
  --color-primary-100: #1e3050;
  --color-primary-200: #2a4a75;
}

/* ── Dark Mode (auto / OS preference) ────────────────────── */

@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    color-scheme: dark;

    --bg:            #111111;
    --surface:       #1a1a1a;
    --panel:         #1a1a1a;
    --panel-soft:    #222222;
    --border:        #2a2a2a;
    --border-strong: #3a3a3a;

    --text:          #f0f0f0;
    --text-secondary:#b0b0b0;
    --muted:         #888888;
    --text-muted:    #666666;

    --accent:        #6b9fe8;
    --accent-strong: #89b5f0;
    --accent-hover:  #89b5f0;
    --accent-soft:   #1a2538;

    --success:       #4ade80;
    --danger:        #f87171;
    --warning:       #fbbf24;

    --shadow:        rgba(0, 0, 0, 0.25);
    --shadow-card:   0 1px 2px rgba(0, 0, 0, 0.2);

    --toggle-track:  #404040;
    --toggle-thumb:  #e5e5e5;
    --row-alt:       rgba(255, 255, 255, 0.03);

    --color-gray-50:  #1a1a1a;
    --color-gray-100: #222222;
    --color-gray-200: #2a2a2a;
    --color-gray-300: #3a3a3a;
    --color-gray-400: #666666;
    --color-gray-500: #888888;
    --color-gray-600: #aaaaaa;
    --color-gray-700: #cccccc;
    --color-gray-800: #e0e0e0;
    --color-gray-900: #f0f0f0;

    --color-primary-50:  #1a2538;
    --color-primary-100: #1e3050;
    --color-primary-200: #2a4a75;
  }
}

/* ── Admin tokens ────────────────────────────────────────── */

body.admin-v2 {
  --admin-surface:       var(--panel-soft);
  --admin-surface-raised: var(--surface);
  --admin-surface-muted: var(--panel-soft);
  --admin-border:        var(--border);
  --admin-border-strong: var(--border-strong);
  --admin-text:          var(--text);
  --admin-text-muted:    var(--muted);
  --admin-accent:        var(--accent);
  --admin-accent-strong: var(--accent-strong);
  --admin-danger:        var(--danger);
  --admin-shadow-soft:   var(--shadow-card);
  --admin-shadow-hard:   var(--shadow-card);
}