/* Paleta única para centro de control, emisión, vista pública y móvil. */
:root {
  --alevis-bg: #07111c;
  --alevis-panel: #0d1d2a;
  --alevis-panel-deep: #091722;
  --alevis-card: #142a3a;
  --alevis-border: #25465d;
  --alevis-text: #edf4fa;
  --alevis-muted: #a8bac8;
  --alevis-cyan: #39bdf1;
  --alevis-green: #43d39a;
  --alevis-red: #e21e30;
}

/* El color exterior identifica el fenómeno; el relleno conserva la gravedad oficial. */
.marcador-profesional.marcador-rain_alert { --fenomeno: #69d2ff; }
.marcador-profesional.marcador-wind_alert { --fenomeno: #a7e8e4; }
.marcador-profesional.marcador-storm_alert { --fenomeno: #ffe16b; }
.marcador-profesional.marcador-coastal_alert { --fenomeno: #6de3dc; }
.marcador-profesional.marcador-snow_alert { --fenomeno: #d9efff; }
.marcador-profesional.marcador-ice_alert { --fenomeno: #aac9ff; }
.marcador-profesional.marcador-fog_alert { --fenomeno: #c2cbd6; }
.marcador-profesional.marcador-hail_alert { --fenomeno: #b0ccff; }
.marcador-profesional.marcador-dust_alert { --fenomeno: #f2c68a; }
.marcador-profesional.marcador-cold_alert { --fenomeno: #99d8ff; }
.marcador-profesional.marcador-heat_alert { --fenomeno: #ff9a87; }
.marcador-profesional.marcador-weather_alert { --fenomeno: #d6e4ec; }
.marcador-profesional:is(.marcador-rain_alert,.marcador-wind_alert,.marcador-storm_alert,.marcador-coastal_alert,.marcador-snow_alert,.marcador-ice_alert,.marcador-fog_alert,.marcador-hail_alert,.marcador-dust_alert,.marcador-cold_alert,.marcador-heat_alert,.marcador-weather_alert) {
  border-color: var(--fenomeno);
  outline: 2px solid color-mix(in srgb, var(--fenomeno) 60%, transparent);
  outline-offset: 1px;
}
.marcador-profesional.marcador-roadworks {
  background: linear-gradient(145deg, #746046, #3a3027);
  border-color: #ffe1a0;
  outline: 2px solid #f1a44299;
  outline-offset: 1px;
}

:is(button, a, input, select, summary):focus-visible {
  outline: 2px solid #83d6ff;
  outline-offset: 3px;
}
@media (pointer: coarse) {
  :is(.thermal-toggle, .toolbar button, .region button, .filters button, .summary button) {
    min-height: 42px;
  }
}