/* "Travel atlas" theme: warm ivory paper, ocean/sun/nature accents.
   Dark mode intentionally disabled (see layout-header.php) — the previous
   auto-dark near-black palette read as a hacker-terminal look, not travel. */
:root {
  --background: #fdfbf5;
  --foreground: #2b2420;

  /* Sampled from assets/images/weexplorer_logo.png — the logo itself has no
     white/light pixels, so the header stays solid light (not the translucent
     .glass look) or the mark disappears into a dark bar. */
  --brand-navy: #0c2a44;
  --brand-blue: #0084fc;
  --brand-orange: #fb9f2c;
  --brand-orange-hover: #e08a1f;

  --glass-bg: rgba(255, 255, 255, 0.72);
  --glass-bg-strong: rgba(255, 255, 255, 0.88);
  --glass-border: rgba(200, 170, 120, 0.35);
  --glass-shadow: 0 8px 28px rgba(120, 90, 40, 0.1);

  --gradient-bg: radial-gradient(
      ellipse 80% 60% at 10% -10%,
      rgba(56, 189, 178, 0.16),
      transparent 60%
    ),
    radial-gradient(ellipse 70% 55% at 100% 0%, rgba(56, 130, 246, 0.12), transparent 55%),
    radial-gradient(ellipse 65% 60% at 50% 105%, rgba(245, 166, 35, 0.14), transparent 60%),
    var(--background);
}

body {
  background: var(--gradient-bg);
  background-attachment: fixed;
  color: var(--foreground);
  font-family: Arial, Helvetica, sans-serif;
}

.glass {
  background: var(--glass-bg);
  backdrop-filter: blur(16px) saturate(150%);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

.glass-strong {
  background: var(--glass-bg-strong);
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}

.leaflet-container { width: 100%; height: 100%; z-index: 0; }

/* The CARTO raster tiles are flat images, so we can't recolor individual
   features (roads/water/parks) without switching to vector tiles — but a CSS
   filter on the tile pane gives real control over overall saturation/warmth
   to make the map feel less washed-out and closer to the brand palette. */
.leaflet-tile-pane {
  filter: saturate(var(--map-saturate, 2)) contrast(1.05) brightness(1.01);
}

/* Solid (not translucent) so it contrasts clearly against the page
   background and the logo's navy/blue pixels stay legible. */
.site-header {
  background: #ffffff;
  border-bottom: 1px solid rgba(12, 42, 68, 0.12);
  box-shadow: 0 2px 12px rgba(12, 42, 68, 0.08);
}