/* [Pulso-Supabase] 🔔 Centro de notificaciones (avisos.js) */
.cf-btn-avisos { position: relative; }
.cf-avisos-n { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: linear-gradient(135deg, #f43f5e, #e11d48); color: #fff;
  font-size: 10.5px; font-weight: 900; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--surface, #181c2e); pointer-events: none; }
.cf-avisos-n[hidden] { display: none; }
html.cf-mov .cf-avisos-hay .cf-avisos-n { animation: cf-av-latir 2.4s ease-in-out infinite; }
@keyframes cf-av-latir { 0%, 100% { transform: scale(1); } 10% { transform: scale(1.25); } 20% { transform: scale(1); } }
.cf-mbar-avisos { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--border); background: var(--surface); color: var(--t1); cursor: pointer; }
.cf-avisos-svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cf-avisos { width: min(460px, calc(100vw - 24px)); max-height: min(86vh, 760px); overflow-y: auto; }
.cf-avisos-head { margin: 0 40px 10px 0; } .cf-avisos-head b { font-size: 18px; }
.cf-avisos-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 4px; border-radius: 12px; background: color-mix(in srgb, var(--t2) 10%, transparent); margin-bottom: 10px; }
.cf-avisos-tabs button { padding: 8px 6px; border: 0; border-radius: 9px; background: transparent; color: var(--t2); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.cf-avisos-tabs button.on { background: var(--surface); color: var(--t1); box-shadow: 0 2px 8px -4px rgba(0, 0, 0, .4); }
.cf-avisos-tabs em { font-style: normal; display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 4px; border-radius: 99px; background: #f43f5e; color: #fff; font-size: 11px; }
.cf-avisos-l { display: grid; gap: 6px; }
.cf-avisos-g { margin: 8px 2px 0; font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--t2); }
.cf-avisos-i { display: flex; align-items: flex-start; gap: 10px; width: 100%; text-align: left; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface); color: var(--t1); font: inherit; font-size: 13px; }
button.cf-avisos-i { cursor: pointer; } button.cf-avisos-i:hover { border-color: color-mix(in srgb, #a855f7 55%, var(--border)); }
.cf-avisos-i > div { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .cf-avisos-i small { color: var(--t2); font-size: 12px; }
.cf-avisos-ico { flex: 0 0 auto; width: 26px; text-align: center; font-size: 16px; }
.cf-avisos-t { flex: 0 0 auto; color: var(--t2); font-size: 11.5px; white-space: nowrap; }
.cf-avisos-i.nuevo { border-color: color-mix(in srgb, #a855f7 50%, var(--border)); background: color-mix(in srgb, #a855f7 7%, var(--surface)); box-shadow: inset 3px 0 0 #a855f7; }
.cf-avisos-i.mal { box-shadow: inset 3px 0 0 var(--red); } .cf-avisos-i.ok { box-shadow: inset 3px 0 0 var(--green); }
.cf-avisos-nov b { font-size: 13.5px; }
.cf-avisos-vacio { padding: 28px 10px; text-align: center; color: var(--t2); }
/* ⚙️ prender y apagar alertas */
.cf-avisos-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cf-avisos-cfg { padding: 6px 11px; border-radius: 99px; border: 1px solid var(--border); background: transparent; color: var(--t2); font: inherit; font-size: 12.5px; font-weight: 800; cursor: pointer; }
.cf-avisos-cfg:hover, .cf-avisos-cfg.on { border-color: #a855f7; color: var(--t1); background: color-mix(in srgb, #a855f7 12%, transparent); }
.cf-avisos-ayuda { margin: 0 0 10px; font-size: 13px; color: var(--t2); line-height: 1.45; }
.cf-avisos-pref { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; text-align: left; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--surface); color: var(--t1); font: inherit; cursor: pointer; }
.cf-avisos-pref span { display: flex; flex-direction: column; gap: 2px; min-width: 0; } .cf-avisos-pref b { font-size: 13.5px; } .cf-avisos-pref small { color: var(--t2); font-size: 12px; }
.cf-avisos-pref .ae-sw { flex: 0 0 auto; width: 40px; height: 23px; border-radius: 99px; background: color-mix(in srgb, var(--t2) 30%, transparent); position: relative; transition: background .2s; }
.cf-avisos-pref .ae-sw::after { content: ''; position: absolute; top: 3px; left: 3px; width: 17px; height: 17px; border-radius: 50%; background: #fff; transition: transform .2s; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
.cf-avisos-pref.on .ae-sw { background: linear-gradient(135deg, #f43f5e, #a855f7); } .cf-avisos-pref.on .ae-sw::after { transform: translateX(17px); }
.cf-avisos-off { display: block; width: 100%; margin: 0 0 8px; padding: 7px 10px; border-radius: 10px; border: 1px dashed var(--border); background: transparent; color: var(--t2); font: inherit; font-size: 12.5px; text-align: left; cursor: pointer; }
.cf-avisos-off:hover { color: var(--t1); border-color: #a855f7; }
/* 📢 novedades: el super administrador decide si van a todos los negocios */
.cf-nov-pub { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-top: 8px; font-size: 11.5px; font-weight: 700; color: #fbbf24; }
.cf-nov-pub.on { color: #4ade80; }
.cf-nov-pub button { padding: 4px 10px; border-radius: 99px; border: 1px solid color-mix(in srgb, currentColor 45%, transparent); background: transparent; color: var(--t1); font: inherit; font-size: 11.5px; cursor: pointer; }
.cf-nov-pub .cf-nov-pub-b { border: 0; color: #fff; background: linear-gradient(135deg, #ec4899, #8b5cf6); }
.cf-nov-pub button:disabled { opacity: .5; cursor: wait; }