/* ============================================================
   CENTRO DE ALERTAS — Viña Las Pitras
   Campana en la barra superior que agrega las señales de todos
   los módulos (caja, presupuesto, calidad, casas, campo) en un
   solo lugar.
   ============================================================ */

.chile-clock {
  font:600 11px 'DM Mono',monospace;color:var(--muted);margin-right:10px;flex-shrink:0;
  white-space:nowrap;letter-spacing:.2px;
}

.alert-bell {
  position:relative;width:32px;height:32px;border-radius:50%;border:none;cursor:pointer;
  background:var(--soft);color:var(--forest);font-size:15px;display:inline-flex;
  align-items:center;justify-content:center;margin-right:6px;flex-shrink:0;transition:background .15s;
}
.alert-bell:hover { background:#e2efe0 }
.alert-bell .ab-dot {
  position:absolute;top:-2px;right:-2px;min-width:15px;height:15px;padding:0 3px;border-radius:8px;
  background:var(--red);color:#fff;font:700 9px 'DM Mono',monospace;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--paper);
}
.alert-bell.ab-ok .ab-dot { background:var(--forest-2) }

.alerts-center-panel {
  position:fixed;top:52px;right:60px;z-index:99988;width:min(360px,92vw);max-height:min(500px,76vh);
  display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 14px 44px rgba(12,67,36,.24);overflow:hidden;animation:alertIn .18s ease;
}
@keyframes alertIn { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:none} }
.alerts-center-panel .ap-head { padding:12px 14px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center }
.alerts-center-panel .ap-head h3 { font:700 13px Manrope;color:var(--ink);margin:0 }
.alerts-center-panel .ap-head small { display:block;font:400 9px Manrope;color:var(--muted);margin-top:1px }
.alerts-center-panel .ap-close { background:none;border:none;font-size:16px;color:var(--muted);cursor:pointer }
.alerts-center-panel .ap-body { overflow-y:auto;padding:6px }

.alert-empty { padding:26px 16px;text-align:center;color:var(--muted);font:400 11px/1.6 Manrope }
.alert-empty .ae-ico { font-size:24px;display:block;margin-bottom:6px }

.alert-group { margin-bottom:4px }
.alert-group h4 { font:700 8.5px Manrope;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;padding:8px 10px 4px }
.alert-row { display:flex;align-items:stretch;border-radius:9px;transition:background .12s }
.alert-row:hover { background:var(--soft) }
.alert-row .ar-go {
  flex:1;min-width:0;display:flex;gap:9px;align-items:flex-start;text-align:left;
  padding:8px 4px 8px 10px;border:none;background:none;cursor:pointer;font:inherit;border-radius:9px 0 0 9px;
}
.alert-row .ar-ico { font-size:14px;flex-shrink:0;margin-top:1px }
.alert-row .ar-body { flex:1;min-width:0 }
.alert-row .ar-title { font:600 11px Manrope;color:var(--ink);line-height:1.4 }
.alert-row .ar-detail { font:400 10px/1.4 Manrope;color:var(--muted);margin-top:1px }
.alert-row.error .ar-title { color:var(--red) }
.alert-row.warn .ar-title { color:#8a6d3b }
.alert-row.info .ar-title { color:var(--blue) }

/* Silenciar: visible siempre (también en táctil), discreto hasta el hover. */
.alert-row .ar-mute {
  flex-shrink:0;align-self:center;width:22px;height:22px;margin:0 6px;padding:0;border:none;background:none;
  border-radius:6px;color:var(--muted);font-size:15px;line-height:1;cursor:pointer;opacity:.4;
  transition:opacity .12s,background .12s,color .12s;
}
.alert-row:hover .ar-mute { opacity:.75 }
.alert-row .ar-mute:hover, .alert-row .ar-mute:focus-visible { opacity:1;background:rgba(187,62,73,.1);color:var(--red) }

.alerts-center-panel .ap-foot {
  display:flex;justify-content:space-between;align-items:center;gap:10px;flex-shrink:0;
  padding:8px 12px;border-top:1px solid var(--line);background:var(--soft);
}
.alerts-center-panel .ap-foot span { font:400 9.5px Manrope;color:var(--muted) }
.alerts-center-panel .ap-restore {
  border:none;background:none;padding:2px 4px;border-radius:5px;cursor:pointer;
  font:600 9.5px Manrope;color:var(--forest);text-decoration:underline;
}
.alerts-center-panel .ap-restore:hover { background:#e2efe0 }

@media(max-width:620px){
  .alerts-center-panel { right:10px;top:48px;width:calc(100vw - 20px) }
  .alert-row .ar-mute { opacity:.75;width:26px;height:26px }
}