/* Estilos de Leaflet + MapLibre (deben ir antes de las reglas de Tailwind por spec de @import) */
@import "leaflet/dist/leaflet.css";
@import "maplibre-gl/dist/maplibre-gl.css";

@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  color-scheme: light;
}

html,
body {
  height: 100%;
}

body {
  @apply bg-bg text-ink antialiased;
}

/* Mapa claro por defecto (día). El modo noche se aplica agregando .map-night al contenedor. */
.leaflet-container {
  background: #eef2f7;
}
.leaflet-control-attribution {
  background: rgba(255, 255, 255, 0.75) !important;
  color: #64748b !important;
}
.leaflet-control-attribution a {
  color: #0891b2 !important;
}

/* Modo noche del mapa: oscurece los tiles claros de OSM */
.map-night .leaflet-container {
  background: #0d1117;
}
.map-night .leaflet-tile {
  filter: brightness(0.7) contrast(1.05) saturate(0.85) hue-rotate(180deg) invert(1);
}
.map-night .leaflet-control-attribution {
  background: rgba(13, 17, 23, 0.75) !important;
  color: #7c7c90 !important;
}

/* Textura mate reutilizable (ruido soft-light) para zonas hero */
.matte {
  position: relative;
}
.matte::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
  opacity: 0.5;
  mix-blend-mode: soft-light;
}
.matte > * {
  position: relative;
  z-index: 1;
}

/* ── Home: título con degradé teal y glow (zona hero oscura) ───────────────── */
.text-glow-teal {
  background-image: linear-gradient(180deg, #eaf7ff 0%, #22d3ee 55%, #0891b2 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 6px 34px rgba(34, 211, 238, 0.42));
}

/* Respetar a quien pidió menos movimiento: la home no debe latir ni deslizarse. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}