/* ================= META ADS ================= */
.meta-cab{display:flex;align-items:center;justify-content:space-between;gap:.7rem;flex-wrap:wrap;margin-bottom:.7rem}
.meta-cab h3{margin:0}
.meta-acc{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.meta-dias{display:flex;gap:.25rem}
.panel.meta-alerta{border-left:2px solid var(--medio)}

.cmp{border:1px solid var(--bd);border-left:2px solid var(--or);background:var(--b3);
  padding:.75rem .85rem;margin-bottom:.55rem}
.cmp-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.cmp-cab strong{font-size:.9rem;margin-right:.35rem}
.cmp-nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:.5rem;margin-top:.65rem}
.cmp-nums>div{min-width:0}
.cmp-nums b{display:block;font-family:var(--fd);font-size:1.25rem;line-height:1.05;color:var(--tx);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmp-nums span{display:block;margin-top:.15rem;font-size:.62rem;color:var(--tx3);line-height:1.4}
.var{font-weight:700;letter-spacing:.02em}
.var.bien{color:var(--ok)}
.var.mal{color:var(--alto)}
.var.igual{color:var(--tx3)}

.rgl{border:1px solid var(--bd);background:var(--b3);padding:.7rem .8rem;margin-bottom:.5rem}
.rgl-cab{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.rgl-cab strong{font-size:.88rem}
.rgl-txt{margin-top:.35rem;font-size:.75rem;line-height:1.6;color:var(--tx2)}
.rgl-txt b{color:var(--or)}
.rgl-pie{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.6rem}
.rgl-nueva{margin-top:.9rem}
.rgl-nueva summary{cursor:pointer;font-size:.75rem;color:var(--or);letter-spacing:.03em}
.rgl-nueva .campos{margin-top:.8rem}

.evt{border-left:2px solid var(--bd2);padding:.45rem 0 .45rem .65rem;margin-bottom:.45rem}
.evt b{font-size:.78rem}
.evt small{display:block;margin-top:.2rem;font-size:.7rem;line-height:1.5;color:var(--tx2)}
.evt small.cuando{color:var(--tx3);font-size:.64rem}
.evt.pausado{border-left-color:var(--medio)}
.evt.presupuesto{border-left-color:var(--ok)}
.evt.error{border-left-color:var(--alto)}
.evt .et{margin-left:.3rem}

@media(max-width:560px){
  .meta-cab{align-items:stretch;flex-direction:column}
  .cmp-nums{grid-template-columns:repeat(auto-fit,minmax(95px,1fr))}
  .cmp-nums b{font-size:1.05rem}
}

/* ================= LA GRILLA DE AVISOS ================= */
.luces{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.8rem}
.luz-chip{font:inherit;font-size:.68rem;letter-spacing:.03em;cursor:pointer;
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.35rem .7rem;border:1px solid var(--bd2);background:var(--b2);color:var(--tx2);
  transition:border-color .15s,color .15s}
.luz-chip i{font-style:normal;font-weight:700;opacity:.75}
.luz-chip:hover{border-color:var(--or);color:var(--or)}
.luz-chip.activa{border-color:var(--or);color:var(--or);background:rgba(255,106,0,.08)}
.luz-chip.l-verde.activa{border-color:var(--ok);color:var(--ok);background:rgba(55,194,106,.1)}
.luz-chip.l-amarillo.activa{border-color:var(--medio);color:var(--medio);background:rgba(255,176,32,.1)}
.luz-chip.l-rojo.activa{border-color:var(--alto);color:var(--alto);background:rgba(255,77,77,.1)}

.avisos{display:grid;gap:.6rem}
.av{display:grid;grid-template-columns:92px minmax(0,1fr);gap:.8rem;
  border:1px solid var(--bd);border-left:3px solid var(--bd2);background:var(--b3);
  padding:.75rem .85rem;box-shadow:var(--sombra)}
.av.luz-verde{border-left-color:var(--ok)}
.av.luz-amarillo{border-left-color:var(--medio)}
.av.luz-rojo{border-left-color:var(--alto)}
.av-foto{width:92px;height:92px;background:var(--b4);border:1px solid var(--bd);overflow:hidden;
  display:flex;align-items:center;justify-content:center}
.av-foto img{width:100%;height:100%;object-fit:cover;display:block}
.av-foto.rota img{display:none}
.av-foto.rota::after{content:"sin imagen";font-size:.56rem;letter-spacing:.06em;color:var(--tx3);text-align:center;padding:.3rem}
.av-cuerpo{min-width:0}
.av-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem;flex-wrap:wrap}
.av-cab strong{display:block;font-size:.88rem;line-height:1.3}
.av-padres{display:block;margin-top:.2rem;font-size:.63rem;color:var(--tx3)}
.av-etis{display:block;margin-top:.3rem}
.av-etis .et{margin-right:.25rem}
.av-luz{display:flex;align-items:center;gap:.35rem;flex-shrink:0}
.av-luz b{font-size:.68rem;letter-spacing:.04em;text-transform:uppercase}
.bolita{width:.62rem;height:.62rem;border-radius:50%;background:var(--bajo);flex-shrink:0}
.luz-verde .bolita{background:var(--ok);box-shadow:0 0 .5rem rgba(55,194,106,.55)}
.luz-amarillo .bolita{background:var(--medio);box-shadow:0 0 .5rem rgba(255,176,32,.55)}
.luz-rojo .bolita{background:var(--alto);box-shadow:0 0 .5rem rgba(255,77,77,.55)}
.luz-verde .av-luz b{color:var(--ok)}
.luz-amarillo .av-luz b{color:var(--medio)}
.luz-rojo .av-luz b{color:var(--alto)}
.av-porque{margin-top:.45rem;font-size:.7rem;line-height:1.5;color:var(--tx2)}
.av .cmp-nums{margin-top:.6rem}
.av-pie{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.65rem}
@media(max-width:560px){
  .av{grid-template-columns:64px minmax(0,1fr);gap:.6rem}
  .av-foto{width:64px;height:64px}
  .av-cab{flex-direction:column}
}

/* ---------- El embudo: dónde se cae la gente ---------- */
/* La fila de plata va más grande porque es la que decide; la de alcance
   va chica porque es contexto, no criterio. */
.cmp-nums.plata-fila b{font-size:1.05rem}
.cmp-nums.plata-fila .destaca b{color:var(--or)}
.cmp-nums.chica{margin-top:.4rem}
.cmp-nums.chica b{font-size:.85rem;color:var(--tx2)}
.cmp-nums.chica span{font-size:.55rem}

.embudo{display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem;margin-top:.7rem}
.embudo .paso{border:1px solid var(--bd);background:var(--b2);padding:.5rem .55rem;
  display:flex;flex-direction:column;gap:.15rem;min-width:0}
.embudo .paso b{font-family:var(--fd);font-size:1.15rem;letter-spacing:.02em;color:var(--tx);line-height:1}
.embudo .paso span{font-size:.55rem;letter-spacing:.06em;text-transform:uppercase;color:var(--tx3);
  line-height:1.3;overflow-wrap:anywhere}
.embudo .paso small{font-size:.58rem;color:var(--tx3);opacity:.75;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.embudo .paso.total{border-color:rgba(255,106,0,.35)}
.embudo .paso.total b{color:var(--or)}
/* El escalón flojo se marca solo: es el que hay que ir a arreglar. */
.embudo .paso.flojo{border-color:var(--alto);background:rgba(255,77,77,.07)}
.embudo .paso.flojo b{color:var(--alto)}

.embudo-roto{margin-top:.4rem;font-size:.68rem;line-height:1.5;color:var(--tx2);
  border-left:2px solid var(--alto);padding-left:.55rem}
.embudo-roto b{color:var(--alto)}

@media (max-width:640px){
  .embudo{grid-template-columns:repeat(2,1fr)}
  .embudo .paso b{font-size:1rem}
}