/* TIER 2 — SEMANTIC. Roles, not colors. This is the theme surface: every token here may be overridden by a theme scope. */
/* Theme «site» (default): public website. */
:root, [data-theme="site"] {
  --surface-page: var(--strom-cream-50);
  --surface-raised: var(--strom-white);
  --surface-inverse: var(--strom-green-700);
  --surface-inverse-deep: var(--strom-green-900);
  --surface-hover: var(--strom-cream-200);
  --surface-skeleton: var(--strom-sand-200);
  --surface-warning: var(--strom-gold-100);
  --surface-media: var(--strom-black);

  --ink-primary: var(--strom-green-900);
  --ink-secondary: var(--strom-grey-500);
  --ink-disabled: var(--strom-grey-400);
  --ink-brand: var(--strom-green-700);
  --ink-on-inverse: var(--strom-white);
  --ink-on-accent: var(--strom-green-700);
  --ink-warning: var(--strom-amber-900);

  --accent: var(--strom-gold-500);
  --accent-hover: var(--strom-gold-400);
  --accent-active: var(--strom-gold-600);
  --accent-soft: var(--strom-gold-a70);

  --brand: var(--strom-green-700);
  --brand-hover: var(--strom-green-600);

  --line: var(--strom-sand-300);
  --line-soft: var(--strom-sand-200);
  --line-strong: var(--strom-green-700);
  --line-leader: var(--strom-sand-400);
  --line-on-inverse: var(--strom-white-a32);
  --line-on-inverse-soft: var(--strom-white-a20);
  --line-accent: var(--strom-gold-a50);
  --line-accent-soft: var(--strom-gold-a60);       /* inline link underline on inverse (approved) */
  --line-on-inverse-card: var(--strom-white-a25);  /* post-card top rule on inverse */
  --line-warning: var(--strom-gold-200);
  --outline-hover: var(--strom-green-a50);         /* block hover outline, Rediger nettsiden */

  --status-open: var(--strom-ok-600);
  --status-closed: var(--strom-red-600);
  --status-scheduled: var(--strom-amber-700);
  --danger: var(--strom-red-600);

  --focus-ring: var(--strom-green-700);
  --focus-ring-on-inverse: var(--strom-gold-500);
  --shadow-text-hero: 0 2px 40px var(--strom-black-a35);
  --shadow-sheet: 0 20px 60px var(--strom-ink-a12);   /* preview sheet, admin */
  --shadow-dialog: 0 30px 80px var(--strom-black-a30);
  --scrim-media: linear-gradient(to top, var(--strom-black-a90), rgba(0,0,0,0) 70%);
  --hero-fade-wide: linear-gradient(to right, var(--strom-green-700) 0%, var(--strom-green-a0) 32%), linear-gradient(to top, var(--strom-green-a70) 0%, var(--strom-green-a0) 45%);
  --hero-fade-narrow: linear-gradient(to top, var(--strom-green-700) 0%, var(--strom-green-a75) 40%, var(--strom-green-a25) 100%);
  --line-on-inverse-grid: var(--strom-white-a30);    /* admin preview Ukeplan grid */
}

/* Surface scope «inverse»: any green block (Toppen, Åpningstider, Takeaway, Bunnen, Mobilmeny). */
[data-surface="inverse"] {
  --ink-primary: var(--strom-white);
  --ink-secondary: var(--strom-white);
  --ink-brand: var(--strom-white);
  --line: var(--strom-white-a32);
  --line-soft: var(--strom-white-a20);
  --line-strong: var(--strom-gold-500);
  --line-leader: var(--strom-white-a50);
  --focus-ring: var(--strom-gold-500);
  --surface-hover: var(--strom-green-600);
}

/* Theme «admin»: authenticated app. Lighter, softer, rounded. */
[data-theme="admin"] {
  --surface-page: var(--strom-cream-100);
  --surface-raised: var(--strom-white);
  --surface-sidebar: var(--strom-cream-50);
  --surface-hover: var(--strom-cream-200);
  --line: var(--strom-sand-200);
  --line-soft: var(--strom-cream-300);
  --ink-primary: var(--strom-green-900);
  --ink-secondary: var(--strom-grey-500);
}