/* Islagenda v7.5 · Efectos ligeros de las tres pantallas de inicio (panel, Mi Isla y Mi local). Solo CSS propio.
   .ig-luz      → borde iluminado: gradiente cónico que gira despacio alrededor de la tarjeta (--luz-1/--luz-2 cambian el color)
   .ig-estado   → píldora de estado con punto que late (.on verde, .aviso ámbar, .mal coral, .off gris)
   Con prefers-reduced-motion el borde queda quieto y el punto no late. */
@property --ig-ang{syntax:'<angle>';inherits:false;initial-value:0deg}
.ig-luz{position:relative;isolation:isolate;--luz-1:#17B3A6;--luz-2:#1F6FA8;--luz-g:1.5px}
.ig-luz::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:var(--luz-g);pointer-events:none;z-index:2;
  background:conic-gradient(from var(--ig-ang),transparent 0deg,transparent 200deg,var(--luz-1) 260deg,var(--luz-2) 320deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;
  animation:ig-gira 5.5s linear infinite}
.ig-luz.mal{--luz-1:#E8573A;--luz-2:#F59E0B}
.ig-luz.aviso{--luz-1:#E0A10B;--luz-2:#E8573A}
.ig-luz.calma::before{animation-duration:9s;opacity:.75}
@keyframes ig-gira{to{--ig-ang:360deg}}

.ig-estado{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:4px 12px 4px 10px;border-radius:999px;background:#fff;color:#0F1E2A;font:600 13px/1.2 Inter,system-ui,sans-serif;box-shadow:0 1px 2px rgba(11,60,93,.08)}
.ig-pt{position:relative;flex:none;width:9px;height:9px;border-radius:50%;background:#8696A3}
.ig-pt::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;opacity:0}
.ig-estado.on .ig-pt{background:#0E9F7A}.ig-estado.aviso .ig-pt{background:#E0A10B}.ig-estado.mal .ig-pt{background:#E8573A}
.ig-estado.on .ig-pt::after,.ig-estado.aviso .ig-pt::after,.ig-estado.mal .ig-pt::after{animation:ig-late 2.2s cubic-bezier(.22,1,.36,1) infinite}
@keyframes ig-late{0%{transform:scale(1);opacity:.55}80%,100%{transform:scale(2.8);opacity:0}}

@media (prefers-reduced-motion:reduce){
  .ig-luz::before{animation:none;--ig-ang:300deg}
  .ig-pt::after{animation:none!important}
}