/* ==========================================================================
   Design Tokens — Ponto Líteris
   Dark-mode tech aesthetic
   ========================================================================== */

:root {
  /* ----- Base surfaces (warm-tinted blacks) ----- */
  --bg-base: #0a0b0f;
  --bg-elevated: #13151b;
  --bg-elevated-2: #1a1d25;
  --bg-input: #0f1116;
  --bg-hover: #1f232c;

  /* ----- Borders ----- */
  --border-subtle: #1f232c;
  --border-default: #2a2f3a;
  --border-strong: #3a4151;
  --border-focus: #4a5263;

  /* ----- Text ----- */
  --text-primary: #f5f6f8;
  --text-secondary: #a0a6b3;
  --text-tertiary: #6b7280;
  --text-disabled: #4a5060;
  --text-inverse: #0a0b0f;

  /* ----- Accent — verde-limão técnico ----- */
  --accent: oklch(0.85 0.18 130);
  --accent-strong: oklch(0.78 0.20 130);
  --accent-soft: oklch(0.85 0.18 130 / 0.12);
  --accent-glow: oklch(0.85 0.18 130 / 0.35);
  --accent-text: #0a0b0f;

  /* ----- Semantic colors ----- */
  --success: oklch(0.78 0.15 150);
  --success-soft: oklch(0.78 0.15 150 / 0.12);
  --warning: oklch(0.78 0.15 75);
  --warning-soft: oklch(0.78 0.15 75 / 0.12);
  --danger: oklch(0.68 0.20 25);
  --danger-soft: oklch(0.68 0.20 25 / 0.12);
  --info: oklch(0.72 0.15 240);
  --info-soft: oklch(0.72 0.15 240 / 0.12);

  /* ----- Typography ----- */
  --font-sans: "Geist", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "Geist Mono", "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --font-display: "Geist", "Inter", sans-serif;

  /* ----- Sizes ----- */
  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 14px;
  --text-md: 15px;
  --text-lg: 17px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 32px;
  --text-4xl: 44px;
  --text-5xl: 64px;

  /* ----- Spacing ----- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 56px;
  --space-10: 80px;

  /* ----- Radii ----- */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 24px;
  --radius-full: 999px;

  /* ----- Shadows ----- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
  --shadow-glow: 0 0 0 1px var(--accent-glow), 0 0 24px var(--accent-glow);

  /* ----- Layout ----- */
  --sidebar-width: 240px;
  --topbar-height: 56px;
}