/* ═══════════════════════════════════════════════════
   ENGEBLIND — Design Tokens (Glassmorphism Premium)
═══════════════════════════════════════════════════ */
:root {
  /* ── Gradient Background (Clean default) ── */
  --grad-1: #f8fafc;
  --grad-2: #f1f5f9;
  --grad-3: #ffffff;

  /* ── Glass Surfaces ── */
  --glass-bg:          rgba(255, 255, 255, 0.75);
  --glass-bg-hover:    rgba(255, 255, 255, 0.90);
  --glass-bg-strong:   rgba(255, 255, 255, 1);
  --glass-border:      rgba(0, 0, 0, 0.08);
  --glass-border-soft: rgba(0, 0, 0, 0.04);
  --glass-shadow:      0 8px 32px rgba(0, 0, 0, 0.05);
  --glass-blur:        blur(18px);
  --glass-blur-strong: blur(28px);

  --glass-sidebar:     rgba(255, 255, 255, 0.40);
  --glass-topbar:      rgba(255, 255, 255, 0.50);
  --glass-input:       rgba(255, 255, 255, 0.60);
  --glass-input-border:rgba(0, 0, 0, 0.12);

  /* ── Text ── */
  --text-primary:   #111827;
  --text-secondary: #4b5563;
  --text-muted:     #6b7280;

  /* ── Accent ── */
  --accent:         #2563eb;
  --accent-glow:    rgba(37, 99, 235, 0.25);
  --accent-hover:   #1d4ed8;
  --accent-btn-bg:  #2563eb;

  /* ── Status Colors ── */
  --s-blue-bg:   rgba(37, 99, 235, 0.12);
  --s-blue-text: #2563eb;
  --s-amber-bg:  rgba(217, 119, 6, 0.12);
  --s-amber-text:#d97706;
  --s-red-bg:    rgba(220, 38, 38, 0.12);
  --s-red-text:  #dc2626;
  --s-green-bg:  rgba(5, 150, 105, 0.12);
  --s-green-text:#059669;

  /* ── Spacing & Radii ── */
  --sp-1: 0.25rem; --sp-2: 0.5rem; --sp-3: 0.75rem; --sp-4: 1rem; --sp-6: 1.5rem; --sp-8: 2rem;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-xl: 20px; --r-2xl: 28px; --r-full: 9999px;
  
  /* ── Transitions ── */
  --t-fast:   all 0.18s ease;
  --t-normal: all 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  --t-slow:   all 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.dark-theme {
  --grad-1: #0f0c29;
  --grad-2: #302b63;
  --grad-3: #24243e;

  --glass-bg:          rgba(255, 255, 255, 0.07);
  --glass-bg-hover:    rgba(255, 255, 255, 0.12);
  --glass-bg-strong:   rgba(255, 255, 255, 0.14);
  --glass-border:      rgba(255, 255, 255, 0.18);
  --glass-border-soft: rgba(255, 255, 255, 0.10);
  --glass-shadow:      0 8px 32px rgba(0, 0, 0, 0.37);

  --glass-sidebar:     rgba(0, 0, 0, 0.25);
  --glass-topbar:      rgba(0, 0, 0, 0.20);
  --glass-input:       rgba(0, 0, 0, 0.25);
  --glass-input-border:rgba(255, 255, 255, 0.18);

  --text-primary:   #ffffff;
  --text-secondary: rgba(255, 255, 255, 0.70);
  --text-muted:     rgba(255, 255, 255, 0.40);

  --accent:         #4f8ef7;
  --accent-glow:    rgba(79, 142, 247, 0.45);
  --accent-hover:   #6ba3ff;
  --accent-btn-bg:  rgba(79, 142, 247, 0.85);

  --s-blue-bg:   rgba(79,  142, 247, 0.18);
  --s-blue-text: #82b4ff;
  --s-amber-bg:  rgba(251, 191, 36,  0.18);
  --s-amber-text:#fcd34d;
  --s-red-bg:    rgba(248, 113, 113, 0.18);
  --s-red-text:  #fca5a5;
  --s-green-bg:  rgba(52,  211, 153, 0.18);
  --s-green-text:#6ee7b7;
}