/* ═══════════════════════════════════════════════════════════════════════════
   Coursely.be — Dark Mode
   ═══════════════════════════════════════════════════════════════════════════ */

[data-theme="dark"] {
  --clr-bg:            #0f172a;
  --clr-surface:       #1e293b;
  --clr-surface-2:     #334155;
  --clr-border:        #334155;
  --clr-border-dark:   #475569;

  --clr-text:          #f1f5f9;
  --clr-text-2:        #94a3b8;
  --clr-text-3:        #64748b;

  --clr-primary:       #60a5fa;
  --clr-primary-dark:  #3b82f6;
  --clr-primary-light: #1e3a5f;
  --clr-primary-xlt:   #172554;

  --clr-accent:        #fbbf24;
  --clr-accent-light:  #422006;

  --clr-success:       #34d399;
  --clr-success-bg:    #064e3b;
  --clr-error:         #f87171;
  --clr-error-bg:      #450a0a;
  --clr-warning:       #fbbf24;
  --clr-warning-bg:    #451a03;

  --clr-info:          #60a5fa;
  --clr-info-bg:       #172554;
  --clr-info-border:   #1e3a5f;
  --clr-tip:           #34d399;
  --clr-tip-bg:        #064e3b;
  --clr-tip-border:    #065f46;
  --clr-warn:          #fbbf24;
  --clr-warn-bg:       #451a03;
  --clr-warn-border:   #78350f;
  --clr-exercise:      #a78bfa;
  --clr-exercise-bg:   #2e1065;
  --clr-exercise-border: #4c1d95;
  --clr-new:           #34d399;
  --clr-new-bg:        #064e3b;
  --clr-new-border:    #065f46;

  --clr-inline-code-bg:   #334155;
  --clr-inline-code-text: #e2e8f0;

  --shadow-sm:  0 1px 2px rgba(0,0,0,.2);
  --shadow-md:  0 4px 6px -1px rgba(0,0,0,.3), 0 2px 4px -2px rgba(0,0,0,.2);
  --shadow-lg:  0 10px 15px -3px rgba(0,0,0,.3), 0 4px 6px -4px rgba(0,0,0,.2);
  --shadow-xl:  0 20px 25px -5px rgba(0,0,0,.3), 0 8px 10px -6px rgba(0,0,0,.2);

  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    --clr-bg:            #0f172a;
    --clr-surface:       #1e293b;
    --clr-surface-2:     #334155;
    --clr-border:        #334155;
    --clr-border-dark:   #475569;
    --clr-text:          #f1f5f9;
    --clr-text-2:        #94a3b8;
    --clr-text-3:        #64748b;
    --clr-primary:       #60a5fa;
    --clr-primary-dark:  #3b82f6;
    --clr-primary-light: #1e3a5f;
    --clr-primary-xlt:   #172554;
    --clr-inline-code-bg:   #334155;
    --clr-inline-code-text: #e2e8f0;
    --shadow-sm:  0 1px 2px rgba(0,0,0,.2);
    --shadow-md:  0 4px 6px -1px rgba(0,0,0,.3), 0 2px 4px -2px rgba(0,0,0,.2);
    --shadow-lg:  0 10px 15px -3px rgba(0,0,0,.3), 0 4px 6px -4px rgba(0,0,0,.2);
    --shadow-xl:  0 20px 25px -5px rgba(0,0,0,.3), 0 8px 10px -6px rgba(0,0,0,.2);
    color-scheme: dark;
  }
}