/* ============================================
   GRAPH Suite — CSS Theme Variables
   ACG Suite — Design System Centralizzato
   Tema di riferimento: COSMINA (Inter + Lucide)
   ============================================ */

:root {
  /* Light theme — Clean & Professional */
  --background: 0 0% 100%;
  --foreground: 222.2 84% 4.9%;

  --card: 0 0% 100%;
  --card-foreground: 222.2 84% 4.9%;

  --popover: 0 0% 100%;
  --popover-foreground: 222.2 84% 4.9%;

  /* Primary: Light Blue */
  --primary: 213 90% 58%;
  --primary-foreground: 210 40% 98%;

  /* Secondary: Light Gray */
  --secondary: 210 40% 96%;
  --secondary-foreground: 222.2 47.4% 11.2%;

  --muted: 210 40% 96%;
  --muted-foreground: 215.4 16.3% 46.9%;

  /* Accent */
  --accent: 210 40% 96%;
  --accent-foreground: 222.2 47.4% 11.2%;

  --destructive: 0 84.2% 60.2%;
  --destructive-foreground: 210 40% 98%;

  --border: 214.3 31.8% 91.4%;
  --input: 214.3 31.8% 91.4%;
  --ring: 221.2 83% 53%;

  --radius: 0.5rem;

  /* Status colors */
  --success: 142 76% 36%;
  --success-light: 142 76% 90%;
  --warning: 38 92% 50%;
  --warning-light: 48 96% 89%;
  --error: 0 84% 60%;
  --error-light: 0 93% 94%;
  --info: 217 91% 60%;
  --info-light: 214 95% 93%;

  /* Layout */
  --sidebar-width: 256px;
  --sidebar-collapsed: 64px;
  --header-height: 64px;
  --content-max-width: 1400px;
  --sidebar-font-size: 14px;
  --base-font-size: 14px;

  /* Typography */
  --font-primary: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* ---- Backward Compatibility Aliases ----
     Per app che usano le vecchie variabili hex (Guazzotti, READER, KANT, DOC)
  */
  --surface: hsl(var(--card));
  --surface-alt: hsl(var(--muted));
  --text: hsl(var(--foreground));
  --text-secondary: hsl(var(--muted-foreground));
  --text-muted: hsl(var(--muted-foreground));
  --border-light: hsl(var(--border));
  --info-bg: hsl(var(--info-light));
  --success-bg: hsl(var(--success-light));
  --warning-bg: hsl(var(--warning-light));
  --error-bg: hsl(var(--error-light));
  --primary-dark: hsl(213 90% 40%);
  --primary-light: hsl(213 90% 70%);
  --primary-rgb: 66, 133, 244;
  --accent-color: hsl(25 95% 53%);
  --font-secondary: var(--font-primary);

  /* Old spacing/radius names */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 9999px;

  /* Old shadow names */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.15);
  --shadow-primary: 0 2px 8px hsl(var(--primary) / 0.15);
  --shadow-card-hover: 0 4px 12px rgba(0, 0, 0, 0.08);

  /* Old transition names */
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;
  --transition-slow: 0.3s ease;
}

/* Dark Mode */
.dark {
  --background: 220 15% 13%;
  --foreground: 210 40% 98%;

  --card: 220 15% 16%;
  --card-foreground: 210 40% 98%;

  --popover: 220 15% 16%;
  --popover-foreground: 210 40% 98%;

  --primary: 210 100% 70%;
  --primary-foreground: 220 20% 10%;

  --secondary: 220 15% 20%;
  --secondary-foreground: 210 40% 98%;

  --muted: 220 15% 20%;
  --muted-foreground: 215 20% 65%;

  --accent: 220 15% 22%;
  --accent-foreground: 210 40% 98%;

  --destructive: 0 62.8% 45%;
  --destructive-foreground: 210 40% 98%;

  --border: 220 15% 22%;
  --input: 220 15% 20%;
  --ring: 210 100% 60%;

  /* Compat aliases aggiornate per dark */
  --surface: hsl(var(--card));
  --surface-alt: hsl(var(--muted));
  --text: hsl(var(--foreground));
  --text-secondary: hsl(var(--muted-foreground));
  --text-muted: hsl(var(--muted-foreground));
  --border-light: hsl(var(--border));
  --primary-dark: hsl(210 100% 55%);
  --primary-light: hsl(210 100% 80%);
}