/* ===========================================================================
   THEME: default  (indigo / corporate)
   ---------------------------------------------------------------------------
   A theme is JUST these design tokens. Duplicate this file as
   themes/<name>.css, change the values, and set 'theme' in config/site.php.
   Each of the 50 sites can therefore look completely different while sharing
   one engine and one structural stylesheet (style.css).
   =========================================================================== */
:root {
  /* Brand */
  --brand:        #d6112a;
  --brand-600:    #b91c2c;
  --brand-700:    #991b1b;
  --brand-soft:   #fff1f1;
  --brand-grad:   linear-gradient(135deg, #ef4444 0%, #dc2626 55%, #d6112a 100%);

  /* Surfaces & text */
  --bg:           #f6f7fb;
  --surface:      #ffffff;
  --surface-2:    #f9fafb;
  --ink:          #1f2430;
  --ink-soft:     #5b6472;
  --muted:        #8a93a3;
  --border:       #e7e9ef;
  --border-strong:#d6dae3;

  /* Category colors (text + tint background) */
  --federal:      #dc2626;  --federal-bg:    #fdecec;
  --observance:   #b45309;  --observance-bg: #fdf3e2;
  --religious:    #047857;  --religious-bg:  #e3f6ee;
  --season:       #0369a1;  --season-bg:     #e4f1fb;

  /* Weekend & today */
  --weekend:      #d11f4a;
  --today:        var(--brand);
  --today-bg:     var(--brand-soft);

  /* Shape & depth */
  --radius:       16px;
  --radius-sm:    10px;
  --radius-pill:  999px;
  --shadow-sm:    0 1px 2px rgba(20,24,40,.06), 0 1px 3px rgba(20,24,40,.05);
  --shadow:       0 6px 18px -6px rgba(24,30,60,.18), 0 2px 6px rgba(24,30,60,.06);
  --shadow-lg:    0 24px 48px -16px rgba(24,30,60,.30);
  --ring:         0 0 0 3px rgba(79,70,229,.35);

  /* Typography */
  --font:         "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}