/* ============================================ * themes.css - Generated by ThemeGenerator.php * 6 themes: 3 schemas (flowpeak/brutal/minimal) x 2 variations (light/dark) * Activated via data-theme attribute on * ============================================ */ /* --- Flowpeak Light --- */ [data-theme="flowpeak-light"] { --color-bg: hsl(221, 40%, 97%); --color-surface: #ffffff; --color-surface-alt: hsl(221, 40%, 95%); --color-primary: #3568CC; --color-primary-hover: #2A52A6; --color-text: hsl(221, 10%, 10%); --color-text-secondary: hsl(221, 8%, 35%); --color-muted: hsl(221, 5%, 45%); --color-border: hsl(221, 10%, 85%); --color-header-bg: #ffffff; --color-header-text: hsl(221, 10%, 10%); --color-success: hsl(145, 60%, 36%); --color-danger: hsl(0, 65%, 48%); --color-warning: hsl(40, 90%, 45%); --radius-sm: 10px; --radius-md: 12px; --radius-lg: 18px; --border-width: 1px; --shadow-sm: 0 1px 2px rgba(16,24,40,0.06); --shadow-md: 0 4px 12px rgba(16,24,40,0.08); --shadow-lg: 0 12px 28px rgba(16,24,40,0.10); --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-size-xs: 11px; --font-size-sm: 13px; --font-size-base: 15px; --font-size-lg: 18px; --font-size-xl: 24px; --line-height: 1.6; --letter-spacing: -0.01em; } /* --- Flowpeak Dark --- */ [data-theme="flowpeak-dark"] { --color-bg: hsl(221, 40%, 9%); --color-surface: hsl(221, 40%, 14%); --color-surface-alt: hsl(221, 40%, 17%); --color-primary: #5B8AE6; --color-primary-hover: #7AA1EC; --color-text: hsl(221, 5%, 93%); --color-text-secondary: hsl(221, 5%, 70%); --color-muted: hsl(221, 5%, 60%); --color-border: hsl(221, 8%, 26%); --color-header-bg: hsl(221, 40%, 12%); --color-header-text: hsl(221, 5%, 95%); --color-success: hsl(145, 55%, 48%); --color-danger: hsl(0, 60%, 58%); --color-warning: hsl(45, 85%, 55%); --radius-sm: 10px; --radius-md: 12px; --radius-lg: 18px; --border-width: 1px; --shadow-sm: 0 1px 2px rgba(16,24,40,0.06); --shadow-md: 0 4px 12px rgba(16,24,40,0.08); --shadow-lg: 0 12px 28px rgba(16,24,40,0.10); --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-size-xs: 11px; --font-size-sm: 13px; --font-size-base: 15px; --font-size-lg: 18px; --font-size-xl: 24px; --line-height: 1.6; --letter-spacing: -0.01em; } /* --- Brutal Light --- */ [data-theme="brutal-light"] { --color-bg: hsl(0, 0%, 97%); --color-surface: #ffffff; --color-surface-alt: hsl(0, 0%, 95%); --color-primary: #111111; --color-primary-hover: #000000; --color-text: hsl(0, 10%, 10%); --color-text-secondary: hsl(0, 8%, 35%); --color-muted: hsl(0, 5%, 45%); --color-border: #111111; --color-header-bg: #ffffff; --color-header-text: hsl(0, 10%, 10%); --color-success: hsl(145, 60%, 36%); --color-danger: hsl(0, 65%, 48%); --color-warning: hsl(40, 90%, 45%); --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --border-width: 3px; --shadow-sm: 4px 4px 0 #111; --shadow-md: 6px 6px 0 #111; --shadow-lg: 8px 8px 0 #111; --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-size-xs: 11px; --font-size-sm: 13px; --font-size-base: 14px; --font-size-lg: 18px; --font-size-xl: 24px; --line-height: 1.5; --letter-spacing: -0.01em; } /* --- Brutal Dark --- */ [data-theme="brutal-dark"] { --color-bg: hsl(0, 10%, 9%); --color-surface: hsl(0, 10%, 14%); --color-surface-alt: hsl(0, 10%, 17%); --color-primary: #ededed; --color-primary-hover: #ffffff; --color-text: hsl(0, 5%, 93%); --color-text-secondary: hsl(0, 5%, 70%); --color-muted: hsl(0, 5%, 60%); --color-border: #ededed; --color-header-bg: hsl(0, 10%, 12%); --color-header-text: #0a0a0a; --color-success: hsl(145, 55%, 48%); --color-danger: hsl(0, 60%, 58%); --color-warning: hsl(45, 85%, 55%); --radius-sm: 0; --radius-md: 0; --radius-lg: 0; --border-width: 3px; --shadow-sm: 4px 4px 0 rgba(255,255,255,0.15); --shadow-md: 6px 6px 0 rgba(255,255,255,0.12); --shadow-lg: 8px 8px 0 rgba(255,255,255,0.10); --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-size-xs: 11px; --font-size-sm: 13px; --font-size-base: 14px; --font-size-lg: 18px; --font-size-xl: 24px; --line-height: 1.5; --letter-spacing: -0.01em; } /* --- Minimal Light --- */ [data-theme="minimal-light"] { --color-bg: hsl(220, 8%, 97%); --color-surface: #ffffff; --color-surface-alt: hsl(220, 8%, 95%); --color-primary: #1f2937; --color-primary-hover: #111827; --color-text: hsl(220, 10%, 10%); --color-text-secondary: hsl(220, 8%, 35%); --color-muted: hsl(220, 5%, 45%); --color-border: hsl(220, 10%, 85%); --color-header-bg: #ffffff; --color-header-text: hsl(220, 10%, 10%); --color-success: hsl(145, 60%, 36%); --color-danger: hsl(0, 65%, 48%); --color-warning: hsl(40, 90%, 45%); --radius-sm: 6px; --radius-md: 8px; --radius-lg: 12px; --border-width: 1px; --shadow-sm: none; --shadow-md: none; --shadow-lg: none; --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-size-xs: 11px; --font-size-sm: 13px; --font-size-base: 15px; --font-size-lg: 18px; --font-size-xl: 24px; --line-height: 1.6; --letter-spacing: 0; } /* --- Minimal Dark --- */ [data-theme="minimal-dark"] { --color-bg: hsl(220, 10%, 9%); --color-surface: hsl(220, 10%, 14%); --color-surface-alt: hsl(220, 10%, 17%); --color-primary: hsl(220, 55%, 55%); --color-primary-hover: hsl(220, 60%, 62%); --color-text: hsl(220, 5%, 93%); --color-text-secondary: hsl(220, 5%, 70%); --color-muted: hsl(220, 5%, 60%); --color-border: hsl(220, 8%, 26%); --color-header-bg: hsl(220, 10%, 12%); --color-header-text: hsl(220, 5%, 95%); --color-success: hsl(145, 55%, 48%); --color-danger: hsl(0, 60%, 58%); --color-warning: hsl(45, 85%, 55%); --radius-sm: 6px; --radius-md: 8px; --radius-lg: 12px; --border-width: 1px; --shadow-sm: none; --shadow-md: none; --shadow-lg: none; --font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace; --font-size-xs: 11px; --font-size-sm: 13px; --font-size-base: 15px; --font-size-lg: 18px; --font-size-xl: 24px; --line-height: 1.6; --letter-spacing: 0; }