/**
 * Copyright © 2026 Andreas Borinsky. All rights reserved.
 * Author: Andreas Borinsky (einfach.andi@gmail.com)
 * Proprietary and confidential. Unauthorized copying is prohibited.
 */

/* src/shared/css/theme-styles.css */
/**
 * Ästhetik-Tokens (Farben, Gradients, Schriften, Animationen)
 */

:root {
  /* -- Typography (Aesthetics) -- */
  --font-family-base: 'Inter', system-ui, -apple-system, sans-serif;
  --font-family-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* -- Colors (HSL) -- */
  --color-brand-h: 210;
  --color-brand-s: 100%;
  --color-brand-l: 50%;
  --color-brand: hsl(var(--color-brand-h), var(--color-brand-s), var(--color-brand-l));
  --color-brand-hover: hsl(var(--color-brand-h), var(--color-brand-s), calc(var(--color-brand-l) + 10%));
  
  /* Neutral Colors (Light Mode Default) */
  --color-bg-base: hsl(210, 15%, 95%);
  --color-bg-surface: hsl(210, 15%, 98%);
  --color-bg-elevated: hsl(210, 15%, 100%);
  
  --color-text-base: hsl(0, 0%, 10%);
  --color-text-muted: hsl(0, 0%, 40%);
  
  --color-border: hsl(0, 0%, 85%);
  --color-border-hover: hsl(0, 0%, 75%);

  /* Status Colors */
  --color-success: hsl(145, 63%, 42%);
  --color-warning: hsl(45, 100%, 51%);
  --color-error: hsl(0, 84%, 60%);

  /* -- Transitions -- */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;

  /* -- Gradients -- */
  --gradient-brand: linear-gradient(135deg, #6366f1, #a855f7);
  --gradient-success: linear-gradient(135deg, #22c55e, #10b981);
  --gradient-danger: linear-gradient(135deg, #ef4444, #f43f5e);
  --gradient-warning: linear-gradient(135deg, #f59e0b, #fbbf24);
  --gradient-neutral: linear-gradient(135deg, #94a3b8, #64748b);
  --gradient-soft: linear-gradient(135deg, #e2e8f0, #cbd5e1);
}

/* -- Dark Mode Overrides -- */
@media (prefers-color-scheme: dark) {
  :root {
    --color-bg-base: hsl(220, 10%, 10%);
    --color-bg-surface: hsl(220, 10%, 15%);
    --color-bg-elevated: hsl(220, 10%, 20%);
    --color-text-base: hsl(0, 0%, 95%);
    --color-text-muted: hsl(0, 0%, 65%);
    --color-border: hsl(220, 10%, 25%);
    --color-border-hover: hsl(220, 10%, 35%);
    --gradient-neutral: linear-gradient(135deg, #334155, #1e293b);
    --gradient-soft: linear-gradient(135deg, #1e293b, #0f172a);
  }
}

:root.dark-theme {
  --color-bg-base: hsl(220, 10%, 10%);
  --color-bg-surface: hsl(220, 10%, 15%);
  --color-bg-elevated: hsl(220, 10%, 20%);
  --color-text-base: hsl(0, 0%, 95%);
  --color-text-muted: hsl(0, 0%, 65%);
  --color-border: hsl(220, 10%, 25%);
  --color-border-hover: hsl(220, 10%, 35%);
  --gradient-neutral: linear-gradient(135deg, #334155, #1e293b);
  --gradient-soft: linear-gradient(135deg, #1e293b, #0f172a);
}

:root.light-theme {
  --color-bg-base: hsl(210, 15%, 95%);
  --color-bg-surface: hsl(210, 15%, 98%);
  --color-bg-elevated: hsl(210, 15%, 100%);
  --color-text-base: hsl(0, 0%, 10%);
  --color-text-muted: hsl(0, 0%, 40%);
  --color-border: hsl(0, 0%, 85%);
  --color-border-hover: hsl(0, 0%, 75%);
}