/* PWA — Shadow / Elevation Tokens */

:root {
  /* ── Neutral Elevation Scale ───────────────────────────────────────── */
  --shadow-none: none;
  --shadow-xs:   0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-sm:   0 1px 3px rgba(0, 0, 0, 0.08),  0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md:   0 4px 12px rgba(0, 0, 0, 0.08),  0 2px 6px rgba(0, 0, 0, 0.05);
  --shadow-lg:   0 8px 24px rgba(0, 0, 0, 0.10),  0 4px 12px rgba(0, 0, 0, 0.06);
  --shadow-xl:   0 16px 48px rgba(0, 0, 0, 0.12), 0 8px 24px rgba(0, 0, 0, 0.07);
  --shadow-2xl:  0 32px 64px rgba(0, 0, 0, 0.14), 0 16px 32px rgba(0, 0, 0, 0.09);

  /* ── Brand-tinted: Navy ────────────────────────────────────────────── */
  --shadow-navy-sm:  0 4px 12px  rgba(19, 34, 114, 0.18), 0 2px 6px  rgba(19, 34, 114, 0.12);
  --shadow-navy-md:  0 8px 24px  rgba(19, 34, 114, 0.22), 0 4px 12px rgba(19, 34, 114, 0.14);
  --shadow-navy-lg:  0 16px 48px rgba(19, 34, 114, 0.28), 0 8px 24px rgba(19, 34, 114, 0.18);
  --shadow-navy-xl:  0 32px 64px rgba(19, 34, 114, 0.32), 0 16px 48px rgba(19, 34, 114, 0.22);

  /* ── Brand-tinted: Sky ─────────────────────────────────────────────── */
  --shadow-sky-sm:   0 4px 12px  rgba(77, 196, 232, 0.22), 0 2px 6px  rgba(77, 196, 232, 0.14);
  --shadow-sky-md:   0 8px 24px  rgba(77, 196, 232, 0.28), 0 4px 12px rgba(77, 196, 232, 0.18);
  --shadow-sky-lg:   0 16px 48px rgba(77, 196, 232, 0.35), 0 8px 24px rgba(77, 196, 232, 0.22);

  /* ── Inset / Inner Shadows ─────────────────────────────────────────── */
  --shadow-inset-xs: inset 0 1px 1px rgba(0, 0, 0, 0.04);
  --shadow-inset-sm: inset 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-inset-md: inset 0 2px 6px rgba(0, 0, 0, 0.10);
}