/* ==========================================================
   Design tokens — single source of truth for color, type,
   spacing, radii, shadows. Importerade först av public-sidor.
   ========================================================== */
:root {
  /* ---- Color: warm cream palette som speglar fasaden ---- */
  --bg:         #f5efe6;
  --bg-soft:    #ece4d6;
  --bg-deep:    #e3d9c6;
  --paper:      #fbf7ef;
  --ink:        #1f1a14;
  --ink-soft:   #4a4034;
  --ink-mute:   #6f6353;
  --line:       #d8ccb6;
  --line-soft:  #e6dcca;
  --accent:     #9a5a2b;
  --accent-deep:#7a4520;
  --leaf:       #4a5d3a;
  --warn:       #b3531e;

  /* Driftbesked-banner — severity-färger för _PublicAnnouncementBanner */
  --severity-info-bg:       #2c5282;
  --severity-info-fg:       #ffffff;
  --severity-warning-bg:    #f4c430;
  --severity-warning-fg:    var(--ink);
  --severity-critical-bg:   #b91c1c;
  --severity-critical-fg:   #ffffff;

  /* Vit + scrims (för rgba där tokens annars saknas) */
  --white:               #ffffff;
  --scrim-strong:        rgba(20, 15, 10, 0.55);   /* modal backdrops */
  --scrim-soft:          rgba(0, 0, 0, 0.08);      /* tunna mörka linjer på ljus bg */
  --scrim-mid:           rgba(0, 0, 0, 0.18);      /* announce badge bg */
  --bg-scrim-86:         rgba(245, 239, 230, 0.86); /* header (scrolled) */
  --bg-scrim-96:         rgba(245, 239, 230, 0.96); /* header (nav-open) */
  --bg-scrim-98:         rgba(245, 239, 230, 0.98); /* mobil-meny dropdown */
  --paper-scrim-12:      rgba(251, 247, 239, 0.12); /* footer-bottom border */
  --paper-scrim-70:      rgba(251, 247, 239, 0.70); /* footer text */
  --paper-scrim-92:      rgba(255, 255, 255, 0.92); /* push-pop bg */
  --paper-scrim-04:      rgba(255, 255, 255, 0.04); /* phone inner-shadow */
  --paper-scrim-12-hover:rgba(255, 255, 255, 0.12); /* nav-hover på transparent header */
  --ink-scrim-06:        rgba(31, 26, 20, 0.06);    /* nav-hover på scrolled header */

  /* Form-states */
  --error-bg:            #fee2e2;
  --error-fg:            #b91c1c;
  --error-fg-strong:     #991b1b;

  /* Phone-mock dekor (App-sektion) */
  --phone-frame:         #1a1612;
  --phone-frame-edge:    #2a241d;
  --phone-notch:         #0a0807;

  --tag-drift-bg:    #ece1ce;
  --tag-info-bg:     #e1e8da;
  --tag-event-bg:    #e6dccd;
  --tag-event-fg:    #6b4a1f;
  --tag-viktigt-bg:  #f0d9c8;
  --tag-viktigt-fg:  #8a3a14;
  --footer-bg:       #1a1612;

  /* ---- Typography ---- */
  --font-sans:  'Sora', system-ui, -apple-system, sans-serif;
  --font-serif: 'Fraunces', 'Instrument Serif', Georgia, serif;
  --font-italic:'Instrument Serif', 'Fraunces', serif;
  --fs-base: 1.0625rem;   /* 17px */
  --lh-base: 1.55;

  /* ---- Spacing scale (rem) ---- */
  --space-1: 0.25rem;   /* 4  */
  --space-2: 0.5rem;    /* 8  */
  --space-3: 0.75rem;   /* 12 */
  --space-4: 1rem;      /* 16 */
  --space-5: 1.5rem;    /* 24 */
  --space-6: 2rem;      /* 32 */
  --space-7: 2.75rem;   /* 44 */
  --space-8: 3.5rem;    /* 56 */
  --space-9: 5rem;      /* 80 */
  --space-10: 7.5rem;   /* 120 */

  /* ---- Radius ---- */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 999px;

  /* ---- Shadows ---- */
  --shadow-1: 0 1px 2px rgba(31,26,20,.04), 0 8px 24px -12px rgba(31,26,20,.10);
  --shadow-2: 0 2px 4px rgba(31,26,20,.05), 0 24px 48px -20px rgba(31,26,20,.18);

  /* ---- Layout ---- */
  --container-max: 1200px;
}