/* JDServer-Webs v6.2.2 — modules/radar_rv/radar-rv.css */
#radar-rv{ margin:16px 0 28px; }
#radar-rv > h3{ margin:0 0 12px; font-weight:600; }

.card.radar-rv-card{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-1);
  padding: 12px;
  display: grid;
  gap: 12px;
  min-width: 0;
  position: relative;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.radar-rv-card:hover{
  transform: translateY(-2px);
  box-shadow: var(--shadow-2);
}

.radar-rv-mapwrap{
  position:relative;
  width:100%;
  height: 370px;
  border-radius: calc(var(--radius) - 2px);
  overflow:hidden;
  border:1px solid color-mix(in oklab, var(--border, rgba(255,255,255,.12)) 85%, transparent);
}
.radar-rv-map{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background: rgba(255,255,255,.03);
}

.radar-rv-meta{
  display:grid;
  gap:6px;
}
.radar-rv-meta-label{
  font: 600 13px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--muted);
}
.radar-rv-meta-value{
  font: 500 15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--text, inherit);
}

.radar-rv-controls{
  display:grid;
  gap:12px;
}
.radar-rv-controls-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.radar-rv-btn{
  appearance:none;
  border:1px solid var(--border);
  background: color-mix(in oklab, var(--card, #0f172a) 88%, white 6%);
  color: var(--text, inherit);
  border-radius: 12px;
  min-height: 40px;
  padding: 0 14px;
  font: 600 14px/1 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  cursor:pointer;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.radar-rv-btn:hover{ transform: translateY(-1px); box-shadow: var(--shadow-1); }
.radar-rv-btn-primary{
  background: linear-gradient(180deg, color-mix(in oklab, var(--brand, #60a5fa) 80%, white 14%), color-mix(in oklab, var(--brand, #60a5fa) 72%, black 10%));
  color: #fff;
  border-color: color-mix(in oklab, var(--brand, #60a5fa) 65%, black 20%);
}
.radar-rv-speedwrap{
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto;
}
.radar-rv-speedlabel{
  font: 600 13px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--muted);
}
.radar-rv-select{
  min-height:40px;
  border-radius:12px;
  border:1px solid var(--border);
  background: color-mix(in oklab, var(--card, #0f172a) 88%, white 6%);
  color: var(--text, inherit);
  padding: 0 12px;
  font: 500 14px/1 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}

.radar-rv-rangebox{
  display:grid;
  gap:8px;
}
.radar-rv-rangehead{
  font: 600 14px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--text, inherit);
}
.radar-rv-rangeinfo{
  font: 500 13px/1.2 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--muted);
}
.radar-rv-range{
  width:100%;
}

.radar-rv-attrib,
#radar-rv .leaflet-control-attribution{
  font: 12px/1.25 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color: var(--muted);
}
#radar-rv .leaflet-control-attribution{
  background: rgba(15,23,42,.72);
  color:#e5e7eb;
  backdrop-filter: blur(6px);
}
#radar-rv .leaflet-control-attribution a{ color:#bfdbfe; }
#radar-rv .leaflet-control-zoom a{
  color:#111827;
}

/* Alertas visuales */
@keyframes rvGlowBlue  { 0%,100%{box-shadow:0 0 0 rgba(56,189,248,0)} 50%{box-shadow:0 0 24px rgba(56,189,248,.45)} }
@keyframes rvGlowRed   { 0%,100%{box-shadow:0 0 0 rgba(244,63,94,0)}  50%{box-shadow:0 0 28px rgba(244,63,94,.50)} }
@keyframes rvGlowAmber { 0%,100%{box-shadow:0 0 0 rgba(245,158,11,0)} 50%{box-shadow:0 0 24px rgba(245,158,11,.46)} }

.radar-rv-card.alert-rain{
  border-color: rgba(56,189,248,.58);
  animation: rvGlowBlue 2.5s ease-in-out infinite;
}
.radar-rv-card.alert-rain .radar-rv-meta-label{ color:#38bdf8; }

.radar-rv-card.alert-extreme{
  border-color: rgba(244,63,94,.62);
  animation: rvGlowRed 2.2s ease-in-out infinite;
}
.radar-rv-card.alert-extreme .radar-rv-meta-label{ color:#f43f5e; }

.radar-rv-card.alert-thunder{
  outline: 1px solid rgba(245,158,11,.45);
  animation: rvGlowAmber 2.0s ease-in-out infinite;
}

@media (max-width: 760px){
  .radar-rv-mapwrap{
    height: 320px;
  }
  .radar-rv-controls-row{
    align-items:stretch;
  }
  .radar-rv-speedwrap{
    margin-left:0;
    width:100%;
  }
  .radar-rv-select{ width:100%; }
}