/* ==========================================================================
   Tijdrit Design Tokens
   LinQiot huisstijl: antraciet #24272A + koraalrood #E64B38 + wit
   Sidebar-navy uit Tijdrit-logo (letter i): #021940
   ========================================================================== */

:root {
  /* Brand */
  --color-primary:         #E64B38;  /* CTA, active, links, focus ring */
  --color-primary-hover:   #CC3E2C;  /* button hover, gebruik ook voor kleine tekst op wit */
  --color-primary-muted:   #F5B5AD;  /* badges, tag backgrounds */
  --color-primary-bg:      #fde8e4;  /* lichtroos/koraal — o.a. verlof page-head */
  --color-secondary:       #24272A;  /* headers, dark surfaces, primaire tekst */
  --color-sidebar:         #021940;  /* sidebar — navy uit logo-letter i */

  /* Neutrals */
  --color-white:           #FFFFFF;
  --color-bg:              #FAFAFA;  /* page background */
  --color-surface:         #F3F4F6;  /* cards, sections */
  --color-border:          #E5E7EB;  /* dividers, input borders */
  --color-muted:           #9CA3AF;  /* placeholder text, disabled */
  --color-text-secondary:  #4B5157;  /* subheadings, secundaire tekst */
  --color-text:            #24272A;  /* primaire tekst */

  /* Semantic */
  --color-success:  #059669;   /* rit goedgekeurd, uren gedeclareerd */
  --color-success-bg: #ecfdf5; /* success-badge/flash achtergrond */
  --color-warning:  #D97706;   /* concept, moet nog worden ingediend */
  --color-warning-bg: #fffbeb; /* warning-badge/flash achtergrond */
  --color-error:    #B91C1C;   /* validatiefout — donkerder dan brand rood voor onderscheid */
  --color-error-bg: #fef2f2;   /* error-badge/flash achtergrond */
  --color-info:     #0369A1;   /* info-banners, waterblauw past bij LinQiot context */
  --color-info-bg:  #e0f2fe;   /* info-badge achtergrond */
  --color-reports:  #6B5B8C;   /* rapportages page-head accent — gedempt paars */
  --color-reports-bg: #f2eef8; /* lichtpaars — rapportages page-head achtergrond */
  --color-billing:  #021940;   /* facturatie page-head accent — sidebar-navy */
  --color-billing-bg: #e8eef5; /* licht navy — facturatie page-head achtergrond */
  --color-subscription: #5B4B8A; /* abonnementen op facturatie — blauwpaars */
  --color-subscription-bg: #efeef7; /* licht blauwpaars — abonnement badges/blokken */

  /* Type */
  --font-sans: 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif;
  --font-mono: 'SF Mono', 'Consolas', 'Menlo', monospace;

  /* Radius & shadow */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 2px rgba(36, 39, 42, 0.05);
  --shadow-md: 0 4px 12px rgba(36, 39, 42, 0.08);
}