/* ==========================================================================
   Computer College Plus — LMS design tokens
   Matches the marketing site's Tailwind/shadcn theme:
   - dark theme by default (site's ThemeProvider defaultTheme="dark")
   - neutral gray scale (0% saturation, same as shadcn "neutral")
   - blue-500 -> purple-600 gradient for brand accents / primary CTAs
   - 0.5rem (8px) corner radius
   ========================================================================== */

:root,
[data-theme="dark"] {
  /* Brand gradient endpoints (Tailwind blue-500 / purple-600) */
  --brand-blue: #3b82f6;
  --brand-blue-600: #2563eb;
  --brand-purple: #9333ea;
  --brand-purple-700: #7e22ce;
  --brand-gradient: linear-gradient(to right, var(--brand-blue), var(--brand-purple));
  --brand-gradient-hover: linear-gradient(to right, var(--brand-blue-600), var(--brand-purple-700));

  /* Neutral scale (dark mode = default) */
  --background: #0a0a0a;
  --foreground: #fafafa;
  --card: #0a0a0a;
  --card-foreground: #fafafa;
  --popover: #0a0a0a;
  --popover-foreground: #fafafa;
  --primary: #fafafa;
  --primary-foreground: #171717;
  --secondary: #262626;
  --secondary-foreground: #fafafa;
  --muted: #262626;
  --muted-foreground: #a3a3a3;
  --accent: #262626;
  --accent-foreground: #fafafa;
  --destructive: #7f1d1d;
  --destructive-foreground: #fafafa;
  --success: #16a34a;
  --success-foreground: #fafafa;
  --border: #262626;
  --input: #262626;
  --ring: #d4d4d4;

  --radius: 0.5rem;
  --radius-lg: 0.75rem;
  --radius-full: 9999px;

  --font-sans: "Inter", "Helvetica Neue", Arial, Helvetica, sans-serif;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
}

[data-theme="light"] {
  --background: #ffffff;
  --foreground: #0a0a0a;
  --card: #ffffff;
  --card-foreground: #0a0a0a;
  --popover: #ffffff;
  --popover-foreground: #0a0a0a;
  --primary: #171717;
  --primary-foreground: #fafafa;
  --secondary: #f5f5f5;
  --secondary-foreground: #171717;
  --muted: #f5f5f5;
  --muted-foreground: #737373;
  --accent: #f5f5f5;
  --accent-foreground: #171717;
  --destructive: #dc2626;
  --destructive-foreground: #fafafa;
  --success: #16a34a;
  --success-foreground: #fafafa;
  --border: #e5e5e5;
  --input: #e5e5e5;
  --ring: #0a0a0a;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.12);
}