/* ============================================================
   MME Reservas — Sistema visual "MME premium"
   Navy #0B2545 · Azul #1D6FE0 · Teal #16B5C4 · Poppins + Inter.
   Cubre vecino (hero + tarjetas-llave) y panel de administración.
   ============================================================ */

:root{
  --navy:#0B2545; --navy2:#14315C; --navy900:#071A34;
  /* Acento principal = teal (antes azul chillón). La var --blue se conserva
     por compatibilidad pero ahora vale teal. Paleta "aurora": teal+cian+violeta. */
  --blue:#0FB0C0; --blue600:#0B8C9A;
  --teal:#16B5C4; --teal600:#0E93A0; --teal-soft:#E4F6F8;
  --cyan:#3AD3DD; --violet:#7C6CF2; --violet-soft:#ECEAFD; --mint:#22C39B; --rose:#EE7FC6;
  --ink:#0E1B2E; --muted:#6B7A90;
  --bg:#F4F6FB; --card:#ffffff; --line:#E4EAF3; --line2:#CFDAEA;
  --ok:#0E93A0; --ok-soft:#E4F6F8;
  --warn:#B8701F; --warn-soft:#F6EAD9;
  --danger:#C6394A; --danger-soft:#FBE7EA;
  --r-sm:10px; --r:14px; --r-lg:20px; --pill:999px;
  --sh:0 8px 22px rgba(11,37,69,.08); --sh-lg:0 18px 40px rgba(11,37,69,.18);
  --ring:0 0 0 4px rgba(18,181,196,.20);
  --font-d:'Poppins',system-ui,-apple-system,sans-serif;
  --font-b:'Inter',system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font-b);background:var(--bg);color:var(--ink);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-d);font-weight:700;letter-spacing:-.01em;line-height:1.15;margin:0;color:var(--navy)}
a{color:var(--blue);text-decoration:none}
a:hover{color:var(--blue600)}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:var(--r-sm)}
.tnum{font-variant-numeric:tabular-nums}

/* ---------------- Topbar ---------------- */
.topbar{background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar-in{max-width:1080px;margin:0 auto;padding:0 22px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.brand{display:inline-flex;align-items:center;gap:.6rem}
.brand img{height:50px}
.topbar nav{display:flex;align-items:center;gap:1.4rem;font-size:.93rem}
.topbar nav a{color:var(--muted);font-weight:500}
.topbar nav a:hover,.topbar nav a.on{color:var(--navy);text-decoration:none}
.topbar nav form.logout{display:inline;margin:0}
.topbar nav button.logout-btn{background:none;border:0;padding:0;font:inherit;color:var(--muted);font-weight:500;cursor:pointer}
.topbar nav button.logout-btn:hover{color:var(--navy)}
.avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--teal),var(--violet));
  color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-d);font-weight:700;font-size:13px}
.topbar nav .avatar,.topbar nav .avatar:hover{color:#fff;text-decoration:none}
.nav-burger{display:none;background:none;border:0;cursor:pointer;color:var(--navy);padding:6px;line-height:0}
@media (max-width:820px){
  .topbar-in{position:relative}
  .nav-burger{display:inline-flex}
  .topbar nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;
    gap:.15rem;background:var(--card);border-bottom:1px solid var(--line);box-shadow:var(--sh-lg);
    padding:.5rem .6rem .7rem;z-index:40}
  .nav-cb:checked~nav{display:flex}
  .topbar nav a{padding:.65rem .7rem;border-radius:9px;color:var(--navy)}
  .topbar nav a.on{background:var(--teal-soft)}
  .topbar nav form.logout{display:block;width:100%}
  .topbar nav button.logout-btn{width:100%;text-align:left;padding:.65rem .7rem}
  .topbar nav .avatar{align-self:flex-start;margin:.4rem .7rem 0}
}

.wrap{max-width:1080px;margin:1.8rem auto;padding:0 22px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem}
.page-title{font-size:1.55rem}
.page-sub{color:var(--muted);margin-top:.3rem}

/* ---------------- Hero (vecino) ---------------- */
.hero{margin-bottom:1.7rem;border-radius:var(--r-lg);padding:32px 34px;position:relative;overflow:hidden;color:#fff;
  background:radial-gradient(560px 320px at 92% -30%,var(--violet) 0,transparent 60%),
             radial-gradient(520px 320px at -6% 130%,var(--teal) 0,transparent 58%),
             linear-gradient(135deg,#122C52,#0A1526);
  border:1px solid rgba(255,255,255,.06);box-shadow:0 30px 70px -34px rgba(11,37,69,.7)}
.hero .ey{font-size:12px;letter-spacing:3px;text-transform:uppercase;font-weight:700;
  background:linear-gradient(90deg,var(--cyan),var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero h1{color:#fff;font-size:34px;font-weight:800;margin-top:8px;letter-spacing:-.5px}
.hero h1 b{background:linear-gradient(90deg,var(--teal),#8FE9F0);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .sub{color:#C6D6F5;margin-top:10px;font-size:14.5px;max-width:56%}
.nextchip{position:absolute;right:30px;top:26px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  border-radius:16px;padding:14px 18px;min-width:196px}
.nextchip .l{font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:#8fd4dc;font-weight:700}
.nextchip .z{font-family:var(--font-d);font-weight:600;font-size:15px;margin-top:6px}
.nextchip .t{font-variant-numeric:tabular-nums;color:#C6D4E8;font-size:13px;margin-top:2px}
.help-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem}
.help-grid .card p{margin:0;color:var(--muted);line-height:1.6;font-size:.92rem}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;margin:0 4px 1rem}
.sec-h h2{font-size:1.2rem}
.sec-h span{font-size:.85rem;color:var(--muted)}

/* ---------------- Zonas: tarjetas-llave ---------------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.tile{position:relative;aspect-ratio:4/3.15;border-radius:var(--r-lg);overflow:hidden;text-decoration:none;color:#fff;
  background:linear-gradient(155deg,color-mix(in srgb,var(--c,#16B5C4) 42%,#0a1730),#0a1424);
  box-shadow:var(--sh);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s;display:block}
.tile:hover{transform:translateY(-6px);box-shadow:0 30px 60px -24px color-mix(in srgb,var(--c,#16B5C4) 45%,rgba(11,37,69,.5))}
.tile-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.tile:hover .tile-img{transform:scale(1.06)}
.tile-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,14,28,.05) 0%,rgba(6,14,28,.2) 45%,rgba(6,14,28,.86) 100%)}
.tile::after{content:"";position:absolute;left:0;right:0;top:0;height:4px;z-index:3;background:linear-gradient(90deg,var(--c,#16B5C4),var(--violet))}
.tile-ico{position:absolute;top:16px;left:16px;width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;z-index:2}
.tile-ico svg{width:26px;height:26px}
.tile-b{position:absolute;left:20px;right:20px;bottom:18px;z-index:2}
.tile-name{font-family:var(--font-d);font-weight:700;font-size:19px;line-height:1.12;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.tile-meta{font-size:12.5px;color:rgba(255,255,255,.9);margin-top:3px}
.tile-cta{position:absolute;top:18px;right:18px;font-size:12.5px;font-weight:600;font-family:var(--font-d);
  background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.32);border-radius:var(--pill);padding:5px 12px;
  opacity:0;transform:translateY(-4px);transition:.2s;z-index:2}
.tile:hover .tile-cta{opacity:1;transform:none}
/* Icono reacciona al hover */
.tile-ico{transition:transform .28s cubic-bezier(.2,.7,.3,1.4),background .2s}
.tile:hover .tile-ico{transform:scale(1.1) rotate(-4deg);background:rgba(255,255,255,.26)}
/* Brillo diagonal que barre al pasar el ratón */
.tile::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.18) 46%,transparent 60%);
  transform:translateX(-110%);transition:transform .7s ease}
.tile:hover::before{transform:translateX(110%)}
/* Entrada escalonada al cargar */
@keyframes tileIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.tile{animation:tileIn .5s both;animation-delay:calc(var(--i,0)*55ms)}
/* Chip de próxima reserva (clicable) */
.nextchip{text-decoration:none;color:#fff;transition:transform .2s,background .2s,border-color .2s;display:block}
.nextchip:hover{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4);transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.tile{animation:none}.tile::before{display:none}}

/* ---------------- Flash ---------------- */
.flash{padding:.75rem 1rem;border-radius:var(--r);margin-bottom:1.2rem;font-size:.92rem;border:1px solid transparent}
.flash-error{background:var(--danger-soft);color:#9a2b39;border-color:#f3c9cf}
.flash-ok,.flash-success{background:var(--ok-soft);color:#0b5b64;border-color:#bfe6ea}
.flash-info{background:#E6F0FE;color:#1450a8;border-color:#c3dcfb}

/* ---------------- Botones ---------------- */
.btn-primary,.btn-secondary,.btn-sm,.btn-grad{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  border-radius:var(--r);font-family:var(--font-d);font-weight:600;font-size:.92rem;padding:.62rem 1.1rem;cursor:pointer;
  border:1px solid transparent;transition:.15s;text-decoration:none}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue600);color:#fff;text-decoration:none}
.btn-grad{background:linear-gradient(135deg,var(--teal),var(--violet));color:#fff;box-shadow:0 12px 26px rgba(18,181,196,.32)}
.btn-grad:hover{filter:brightness(1.05);color:#fff;text-decoration:none}
.btn-secondary{background:var(--card);color:var(--blue);border-color:var(--line2)}
.btn-secondary:hover{background:#EFFBFC;border-color:var(--teal);text-decoration:none}
.btn-sm{padding:.44rem .8rem;font-size:.85rem}
.btn-link{color:var(--muted);font-weight:500;font-family:var(--font-b)}
.link-del{background:none;border:0;color:var(--danger);cursor:pointer;font-size:.9rem;padding:0;font-weight:500;font-family:var(--font-b)}
.link-del:hover{text-decoration:underline}

/* ---------------- Cards / tabla admin ---------------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.5rem;box-shadow:var(--sh)}
.card+.card,.form+.card,.form .card+.card{margin-top:1.1rem}
/* Cabecera de card con icono (estilo ERP) */
.card-h{display:flex;align-items:center;gap:.65rem;font-family:var(--font-d);font-weight:700;color:var(--navy);font-size:1.05rem;margin-bottom:1.1rem}
.card-h .ic{width:36px;height:36px;border-radius:11px;background:var(--teal-soft);display:flex;align-items:center;justify-content:center;font-size:18px;flex:0 0 auto}
.card-h .sub{font-family:var(--font-b);font-weight:400;font-size:.82rem;color:var(--muted);margin-top:2px}
/* En un formulario partido en cards, no repetir el borde superior de .sec */
.form.plain .sec:first-child{border-top:0;padding-top:0;margin-top:0}
.table-card{padding:0;overflow-x:auto}
.tbl{width:100%;border-collapse:collapse;font-size:.92rem}
.tbl th,.tbl td{text-align:left;padding:.85rem 1rem;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl thead th{color:var(--muted);font-weight:700;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;background:#F7FAFF}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:hover{background:#F7FAFF}
.tbl .days span{display:inline-block;font-size:.66rem;font-weight:700;padding:.08rem .32rem;border-radius:5px;margin:0 1px}
.tbl .days .on{background:var(--teal-soft);color:var(--teal600)}
.tbl .days .off{background:#eef2f8;color:#c2cede}
.tbl .actions{display:flex;gap:.9rem;align-items:center;white-space:nowrap}
.tbl .actions form{display:inline}
.badge{display:inline-flex;align-items:center;padding:.22rem .62rem;border-radius:var(--pill);font-size:.74rem;font-weight:700}
.badge-on{background:var(--teal-soft);color:var(--teal600)}
.badge-off{background:#eef2f8;color:var(--muted)}

/* ---------------- Formularios ---------------- */
label{display:block;font-family:var(--font-d);font-weight:600;font-size:.8rem;color:var(--navy);margin:.9rem 0 .35rem}
input[type=text],input[type=email],input[type=tel],input[type=search],input[type=url],input[type=password],input[type=number],input[type=time],input[type=date],select,textarea{
  width:100%;padding:.62rem .78rem;border:1px solid var(--line2);border-radius:var(--r);font-family:var(--font-b);
  font-size:.95rem;color:var(--ink);background:#F7FAFF;transition:.15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:var(--ring);background:#fff}
input[type=time],input[type=number]{font-variant-numeric:tabular-nums}
textarea{resize:vertical}
.form .sec{font-family:var(--font-d);font-size:1.02rem;color:var(--navy);margin:1.6rem 0 .7rem;padding-top:1.1rem;border-top:1px solid var(--line)}
.form .sec:first-of-type{border-top:0;padding-top:0}
.f-row{display:flex;gap:1.1rem;flex-wrap:wrap;align-items:flex-start}
.f-col{display:flex;flex-direction:column;margin-bottom:.3rem}
.f-col.grow{flex:1;min-width:220px}
.f-row.cols>.f-col{flex:1 1 180px;min-width:150px}
.f-row.cols select{width:100%}
.f-row.cols>.f-col>input{width:100%}
.f-sep{border:0;border-top:1px solid var(--line);margin:1.2rem 0}
.f-sub{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin:.1rem 0 .7rem}
.f-col label{margin-top:0}
.suffix{display:flex;align-items:center;gap:.45rem;color:var(--muted);font-size:.9rem}
.suffix input{width:88px}
.chk{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-b);font-weight:500;font-size:.9rem;margin:.25rem 0;cursor:pointer;color:var(--ink)}
.chk input{width:auto}
.hint{color:var(--muted);font-size:.82rem;margin:.35rem 0;line-height:1.45}
.days-pick{display:flex;gap:1rem;flex-wrap:wrap;margin:.35rem 0}
.form-footer{margin-top:1.5rem;padding-top:1.15rem;border-top:1px solid var(--line)}
.form-footer.btns{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center}

/* ---------------- Franjas (fichas de turno editables) ---------------- */
.franjas{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.6rem;margin:.5rem 0 1.2rem}
.franja{display:flex;align-items:center;gap:.3rem;background:var(--teal-soft);border:1px solid #c7e7eb;border-radius:var(--r);padding:.35rem .4rem}
.franja .t{width:70px;padding:.32rem .25rem;text-align:center;font-variant-numeric:tabular-nums;border:1px solid transparent;background:#fff;border-radius:var(--r-sm);font-weight:600;color:var(--teal600)}
.franja .t:focus{border-color:var(--blue)}
.franja .dash{color:var(--teal600);font-weight:700}
.franja-save,.franja-del{border:0;background:none;cursor:pointer;border-radius:var(--r-sm);height:28px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.franja-save{color:var(--blue);font-size:.72rem;font-weight:700;font-family:var(--font-d);width:auto;padding:0 .4rem}
.franja-save:hover{background:#d3ebef}
.franja-del{color:var(--danger);font-size:1.15rem;line-height:1;width:28px}
.franja-del:hover{background:var(--danger-soft)}
.franja-mj{border:0;background:#e7ecf4;color:var(--muted);cursor:pointer;border-radius:var(--r-sm);height:28px;width:auto;padding:0 .45rem;font-size:.65rem;font-weight:700;font-family:var(--font-d);flex:0 0 auto}
.franja-mj.on{background:var(--blue);color:#fff}
.franja.is-ex{border-color:#bcd0f0;background:#eef4fe}
.block-tools{border-top:1px solid var(--line);padding-top:1.1rem}
.inline-form{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.9rem}
.inline-form input[type=time]{width:auto}

/* ---------------- Login ---------------- */
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;overflow:hidden;
  background:radial-gradient(900px 500px at 15% 0%,#173A6B 0,transparent 55%),
             radial-gradient(800px 600px at 100% 100%,#0f4f57 0,transparent 55%),
             linear-gradient(135deg,var(--navy),#0a1c39)}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.5;z-index:0}
.blob-1{width:340px;height:340px;background:var(--blue);top:-80px;right:12%}
.blob-2{width:300px;height:300px;background:var(--teal);bottom:-80px;left:8%}
.login-card{position:relative;z-index:2;width:100%;max-width:400px;background:rgba(255,255,255,.97);border-radius:22px;
  padding:34px 30px;box-shadow:0 30px 70px rgba(3,12,30,.5);border:1px solid rgba(255,255,255,.6)}
.login-brand{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:18px}
.login-brand img{height:48px}
.login-card h1{font-size:22px;text-align:center}
.login-card .sub{color:var(--muted);text-align:center;font-size:13px;margin-top:2px}
.login-card .sub.small{font-size:12.5px;margin-top:18px}
.login-card .btn-grad{width:100%;margin-top:20px;padding:14px;font-size:15px}
.login-card a{font-weight:600}

/* ---------------- Detalle de zona / reserva (vecino) ---------------- */
.zbanner{position:relative;border-radius:var(--r-lg);overflow:hidden;color:#fff;min-height:150px;display:flex;align-items:flex-end;
  padding:22px 26px;margin-bottom:1.4rem;background:linear-gradient(150deg,var(--c,#1D6FE0),var(--navy))}
.zbanner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.zbanner .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,37,69,.15),rgba(11,37,69,.82))}
.zbanner .zico{position:absolute;top:18px;left:18px;width:46px;height:46px;border-radius:13px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;z-index:2}
.zbanner .zb{position:relative;z-index:2}
.zbanner h1{color:#fff;font-size:26px}
.zbanner .zmeta{color:rgba(255,255,255,.9);font-size:13px;margin-top:5px}
.backlink{display:inline-block;color:var(--muted);font-size:.9rem;margin-bottom:.8rem}

.daypills{display:flex;gap:.55rem;overflow-x:auto;padding-bottom:.4rem;margin-bottom:1.2rem}
.daypill{flex:0 0 auto;min-width:62px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:.55rem .3rem;text-decoration:none;color:var(--ink)}
.daypill .dw{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}
.daypill .dd{font-family:var(--font-d);font-weight:700;font-size:1.25rem;color:var(--navy);line-height:1.1;margin-top:2px}
.daypill.on{background:var(--navy);border-color:var(--navy)}
.daypill.on .dw{color:#8fd4dc}.daypill.on .dd{color:#fff}
.daypill:hover{text-decoration:none;border-color:var(--blue)}

.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:.7rem}
.slot{display:flex;align-items:center;gap:1rem;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:.8rem 1rem}
.slot .time{font-family:var(--font-d);font-weight:700;font-variant-numeric:tabular-nums;color:var(--navy);font-size:1.02rem;white-space:nowrap}
.slot .info{flex:1;min-width:0}
.slot .who{font-size:.8rem;color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slot .st{font-size:.82rem;font-weight:600}
.slot.free{border-color:#bfe6ea;background:#F5FDFE}
.slot.pool{border-color:var(--teal);background:#F0FCFD;box-shadow:inset 3px 0 0 var(--teal)}
.slot.mine{border-color:var(--teal);background:#EFFBFC}
.slot.full,.slot.past,.slot.notopen{background:#F7FAFF}
.slot .st.ok{color:var(--teal600)} .slot .st.mine{color:var(--blue)} .slot .st.muted{color:var(--muted)}
.slot form{margin:0}
.slot .btn-sm{white-space:nowrap}
.avail{font-size:.78rem;font-weight:700;color:var(--teal600);background:var(--teal-soft);border-radius:var(--pill);padding:.12rem .5rem}
.ex-tag{display:inline-block;font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--teal600);background:var(--teal-soft);border-radius:5px;padding:.06rem .34rem;margin-left:.45rem;vertical-align:middle}
.slot.blocked{opacity:.72}

/* Mis reservas */
.res-item{display:flex;align-items:center;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--line)}
.res-item:last-child{border-bottom:0}
.res-when{font-family:var(--font-d);font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums;min-width:150px}
.res-zone{flex:1}
.res-zone .z{font-weight:600}
.st-badge{font-size:.72rem;font-weight:700;padding:.18rem .55rem;border-radius:var(--pill)}
.st-active{background:var(--teal-soft);color:var(--teal600)}
.st-cancel{background:#eef2f8;color:var(--muted)}
.st-done{background:#E6F0FE;color:#1450a8}
.st-noshow{background:var(--danger-soft);color:#9a2b39}

/* Foto de zona (admin) */
.photo-cur{display:flex;align-items:center;gap:1rem;margin-bottom:.55rem}
.photo-cur img{height:72px;width:110px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}

/* Subnav admin (Zonas | Unidades) */
.subnav{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:var(--pill);padding:4px;margin-bottom:1.3rem;gap:2px}
.subnav a{padding:.4rem .95rem;border-radius:var(--pill);font-family:var(--font-d);font-weight:600;font-size:.86rem;color:var(--muted)}
.subnav a.on{background:var(--navy);color:#fff}
.subnav a:hover{text-decoration:none}

/* Unidades */
.stat-row{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:1.2rem}
.stat{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:.8rem 1.1rem;min-width:140px;display:flex;align-items:center;gap:.7rem;box-shadow:var(--sh)}
.stat .si{width:40px;height:40px;border-radius:12px;background:var(--teal-soft);display:flex;align-items:center;justify-content:center;font-size:19px;flex:0 0 auto}
.stat .n{font-family:var(--font-d);font-weight:700;font-size:1.5rem;color:var(--navy);line-height:1}
.stat .l{font-size:.76rem;color:var(--muted);margin-top:3px}
.code{font-family:'Poppins',monospace;font-weight:700;letter-spacing:1px;color:var(--navy);background:#F1F6FE;border:1px solid var(--line);border-radius:8px;padding:.18rem .5rem;font-size:.86rem}
.tag-reg{color:var(--teal600);font-weight:600;font-size:.8rem}
.tag-pend{color:var(--muted);font-size:.8rem}
.searchbox{width:100%;max-width:320px;margin-bottom:1rem}

@media (max-width:600px){
  .topbar-in,.wrap{padding-left:16px;padding-right:16px}
  .hero{padding:24px 22px}.hero h1{font-size:24px}.hero .sub{max-width:100%}
  .nextchip{position:static;margin-top:16px;min-width:0;display:inline-block}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---- Panel de plataforma (super-admin) ---- */
.btn-danger{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border-radius:var(--r);
  font-family:var(--font-d);font-weight:600;font-size:.92rem;padding:.62rem 1.1rem;cursor:pointer;
  border:1px solid transparent;background:#C0435F;color:#fff;text-decoration:none;transition:.15s}
.btn-danger:hover{background:#a5324c;color:#fff;text-decoration:none}
.btn-mini{display:inline-flex;align-items:center;justify-content:center;background:var(--soft);
  border:1px solid var(--line);color:var(--navy);border-radius:8px;font-weight:600;font-size:.78rem;
  padding:.34rem .6rem;cursor:pointer;margin:.1rem;text-decoration:none;transition:.15s}
.btn-mini:hover{background:#eef2f8;text-decoration:none}
.btn-mini-danger{color:#C0435F;border-color:#F0C0CE}
.btn-mini-danger:hover{background:#fdeef2}
.switch-row{display:flex;align-items:center;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--line);font-weight:500}
.switch-row:last-of-type{border-bottom:0}
.switch-row input[type=checkbox]{width:18px;height:18px;flex:0 0 auto;margin:0;padding:0;-webkit-appearance:checkbox;appearance:auto}