/* Section-specific theme for /ordlistan pages */
:root {
  --primary: #2d5f8a;
  --primary-dim: #234a6e;
  --primary-container: #d0e8f7;
  --secondary: #4e6f8a;
  --secondary-dim: #3c5870;
  --secondary-container: #d8ecf7;
  --tertiary: #3d6b55;
  --tertiary-dim: #2f5442;
  --tertiary-container: #cce8d8;

  --on-primary: #f0f8ff;
  --on-primary-container: #163a5a;
  --on-secondary: #eef5fa;
  --on-secondary-container: #2c4a60;
  --on-tertiary: #eef8f2;
  --on-tertiary-container: #1e4232;

  --surface-tint: #2d5f8a;
  --gradient-primary: linear-gradient(135deg, var(--primary), var(--primary-dim));
  --gradient-hero: linear-gradient(135deg, rgba(45, 95, 138, 0.12), rgba(35, 74, 110, 0.05));
}

body {
  background: linear-gradient(135deg, rgba(45, 95, 138, 0.07), rgba(35, 74, 110, 0.03)), var(--surface);
}

body::before {
  background:
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.65), transparent 20%),
    radial-gradient(circle at 80% 0%, rgba(45, 95, 138, 0.07), transparent 28%),
    repeating-linear-gradient(0deg, rgba(45, 52, 51, 0.015) 0, rgba(45, 52, 51, 0.015) 1px, transparent 1px, transparent 5px);
}

@media (prefers-color-scheme: dark) {
  :root {
    --primary: #9ecbeb;
    --primary-dim: #7cb5da;
    --primary-container: #163a5a;
    --secondary: #a0bdd0;
    --secondary-dim: #88a8be;
    --secondary-container: #2c4a60;
    --tertiary: #95cca8;
    --tertiary-dim: #76b88d;
    --tertiary-container: #1e4232;

    --on-primary: #0a2035;
    --on-primary-container: #d0e8f7;
    --on-secondary: #12283a;
    --on-secondary-container: #d8ecf7;
    --on-tertiary: #0a2018;
    --on-tertiary-container: #cce8d8;
  }

  body {
    background: linear-gradient(135deg, rgba(45, 95, 138, 0.12), rgba(35, 74, 110, 0.06)), var(--surface);
  }
}