/* ============================================
   VerbifyMain — Three Custom Color Themes
   Default: Ocean Breeze
   ============================================ */

/* --- Fallback / Ocean Breeze (default) --- */
:root,
[data-theme="ocean"] {
    --background: oklch(0.985 0.005 200);
    --foreground: oklch(0.20 0.02 230);
    --card: oklch(0.995 0.003 200);
    --card-foreground: oklch(0.20 0.02 230);
    --popover: oklch(0.995 0.003 200);
    --popover-foreground: oklch(0.20 0.02 230);
    --primary: oklch(0.55 0.15 175);
    --primary-foreground: oklch(0.98 0.005 175);
    --secondary: oklch(0.70 0.10 230);
    --secondary-foreground: oklch(0.98 0.005 230);
    --muted: oklch(0.94 0.01 200);
    --muted-foreground: oklch(0.50 0.02 230);
    --accent: oklch(0.85 0.06 80);
    --accent-foreground: oklch(0.25 0.02 80);
    --destructive: oklch(0.577 0.245 27.325);
    --destructive-foreground: oklch(1 0 0);
    --border: oklch(0.88 0.025 200);
    --input: oklch(0.90 0.02 200);
    --ring: oklch(0.55 0.15 175);
    --radius: 0.625rem;
    --font-sans: ui-sans-serif, system-ui, -apple-system, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    --font-mono: ui-monospace, "Cascadia Code", "Fira Code", monospace;
}

/* --- Electric Sunset --- */
[data-theme="sunset"] {
    --background: oklch(0.985 0.005 80);
    --foreground: oklch(0.18 0.01 30);
    --card: oklch(0.995 0.003 80);
    --card-foreground: oklch(0.18 0.01 30);
    --popover: oklch(0.995 0.003 80);
    --popover-foreground: oklch(0.18 0.01 30);
    --primary: oklch(0.45 0.2 275);
    --primary-foreground: oklch(0.97 0.01 275);
    --secondary: oklch(0.72 0.15 30);
    --secondary-foreground: oklch(0.98 0.005 30);
    --muted: oklch(0.94 0.01 80);
    --muted-foreground: oklch(0.50 0.01 30);
    --accent: oklch(0.82 0.16 80);
    --accent-foreground: oklch(0.25 0.02 80);
    --destructive: oklch(0.577 0.245 27.325);
    --destructive-foreground: oklch(1 0 0);
    --border: oklch(0.88 0.025 275);
    --input: oklch(0.90 0.02 275);
    --ring: oklch(0.45 0.2 275);
    --radius: 0.625rem;
}

/* --- Neon Garden --- */
[data-theme="neon"] {
    --background: oklch(0.14 0.01 270);
    --foreground: oklch(0.93 0.01 270);
    --card: oklch(0.20 0.015 270);
    --card-foreground: oklch(0.93 0.01 270);
    --popover: oklch(0.20 0.015 270);
    --popover-foreground: oklch(0.93 0.01 270);
    --primary: oklch(0.75 0.2 140);
    --primary-foreground: oklch(0.15 0.03 140);
    --secondary: oklch(0.65 0.22 350);
    --secondary-foreground: oklch(0.97 0.01 350);
    --muted: oklch(0.25 0.01 270);
    --muted-foreground: oklch(0.60 0.01 270);
    --accent: oklch(0.80 0.15 195);
    --accent-foreground: oklch(0.15 0.02 195);
    --destructive: oklch(0.65 0.25 25);
    --destructive-foreground: oklch(0.97 0.01 25);
    --border: oklch(0.30 0.02 270);
    --input: oklch(0.28 0.015 270);
    --ring: oklch(0.75 0.2 140);
    --radius: 0.625rem;
}

/* --- Smooth theme transitions --- */
*,
*::before,
*::after {
    transition: background-color 0.3s ease, color 0.2s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}