/* ============================================================
   ELEVATION — Skiforeningen
   Discrete 0–4 scale. Soft, low-contrast navy-tinted shadows.
   Use sparingly — prefer flat, airy surfaces with clear edges (DNT calm).
   Each level pairs a shadow with an optional hairline border.
   ============================================================ */

:root {
  --shadow-color:      218 60% 18%;  /* navy HSL components for rgba mixing */

  --elevation-0: none;
  --elevation-1:
    0 1px 2px hsl(var(--shadow-color) / 0.06),
    0 1px 1px hsl(var(--shadow-color) / 0.04);
  --elevation-2:
    0 2px 4px hsl(var(--shadow-color) / 0.07),
    0 4px 10px hsl(var(--shadow-color) / 0.06);
  --elevation-3:
    0 6px 14px hsl(var(--shadow-color) / 0.08),
    0 10px 24px hsl(var(--shadow-color) / 0.07);
  --elevation-4:
    0 12px 28px hsl(var(--shadow-color) / 0.10),
    0 20px 48px hsl(var(--shadow-color) / 0.09);

  /* Companion borders — pair with low elevations for crisp edges */
  --border-hairline: 1px solid var(--color-outline-variant);
  --border-default:  1px solid var(--color-outline);

  /* Focus ring (kept separate from elevation) */
  --focus-ring:        0 0 0 3px var(--color-focus-ring);
  --focus-ring-offset: 0 0 0 2px var(--color-surface), 0 0 0 5px var(--color-focus-ring);
}

[data-theme="dark"] {
  --shadow-color: 218 60% 4%;
}