/**
 * Effect Workspace Color Theme
 * Neutral dark theme for artistic color work
 */

:root {
    /* Base colors - neutral dark */
    --color-bg: #0a0a0a;
    --color-bg-elevated: #141414;
    --color-bg-hover: #1e1e1e;
    --color-bg-active: #282828;
    --color-bg-overlay: rgba(10, 10, 10, 0.92);

    /* Glass effect backgrounds */
    --color-glass: rgba(20, 20, 20, 0.85);
    --color-glass-border: rgba(255, 255, 255, 0.06);

    /* Border colors */
    --color-border: #282828;
    --color-border-muted: #1a1a1a;
    --color-border-focus: #ffffff;
    --color-border-glow: rgba(255, 255, 255, 0.4);

    /* Text colors */
    --color-text-primary: #f0f0f0;
    --color-text-secondary: #a0a0a0;
    --color-text-muted: #707070;
    --color-text-placeholder: #505050;

    /* Primary accent - neutral white */
    --color-accent: #ffffff;
    --color-accent-hover: #e0e0e0;
    --color-accent-muted: rgba(255, 255, 255, 0.12);
    --color-accent-glow: 0 0 20px rgba(255, 255, 255, 0.3);

    /* Secondary accent - neutral gray */
    --color-secondary: #b0b0b0;
    --color-secondary-hover: #d0d0d0;
    --color-secondary-muted: rgba(176, 176, 176, 0.12);

    /* Semantic colors */
    --color-success: #22c55e;
    --color-success-muted: rgba(34, 197, 94, 0.12);
    --color-warning: #f59e0b;
    --color-warning-muted: rgba(245, 158, 11, 0.12);
    --color-error: #ef4444;
    --color-error-muted: rgba(239, 68, 68, 0.12);

    /* Syntax highlighting - vibrant, readable */
    --syntax-keyword: #f472b6;
    --syntax-function: #a78bfa;
    --syntax-string: #34d399;
    --syntax-number: #38bdf8;
    --syntax-comment: #707070;
    --syntax-operator: #f472b6;
    --syntax-variable: #fbbf24;

    /* UI sizing */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
    --radius-xl: 16px;

    /* Shadows - subtle effect */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6);
    --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.7);
    --shadow-glow: 0 0 30px rgba(255, 255, 255, 0.08);
    --shadow-glow-strong: 0 0 50px rgba(255, 255, 255, 0.15);

    /* Animation - quick, snappy fades */
    --transition-instant: 0.08s ease-out;
    --transition-fast: 0.12s ease-out;
    --transition-normal: 0.2s ease-out;
    --transition-slow: 0.35s ease-out;

    /* Grid/pattern colors */
    --grid-line: rgba(255, 255, 255, 0.06);
    --grid-line-accent: rgba(255, 255, 255, 0.15);
}