/* Marco de la aplicación (menú lateral + barra superior móvil + avisos). CSS estático, sin build. */
.ic{width:1.15rem;height:1.15rem;flex:none}
body.app{background:#f6f7f9;margin:0}
.shell{display:flex;min-height:100dvh}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.content{flex:1;min-width:0}

/* ───── Menú lateral ───── */
.sb{--w:16rem;width:var(--w);flex:none;position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;background:#fff;border-right:1px solid #e5e7eb;z-index:60;transition:width .18s ease}
.sb-brand{display:flex;align-items:center;gap:.5rem;padding:1rem .9rem .6rem;min-height:3.6rem}
.sb-logo{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:#0f172a;min-width:0;flex:1}
.sb-mark{width:2.1rem;height:2.1rem;border-radius:.65rem;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;display:flex;align-items:center;justify-content:center;flex:none;box-shadow:0 4px 10px rgba(79,70,229,.3)}
.sb-name{font-weight:700;letter-spacing:-.02em;font-size:1.05rem;white-space:nowrap}
.sb-collapse,.sb-close,.tb-btn{border:0;background:none;color:#64748b;width:2rem;height:2rem;border-radius:.5rem;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none}
.sb-collapse:hover,.sb-close:hover,.tb-btn:hover{background:#f1f5f9;color:#0f172a}
.sb-collapse .ic{transition:transform .18s}
.sb-close{display:none}

.sb-site{margin:.2rem .8rem .5rem;padding:.55rem .65rem;border:1px solid #e5e7eb;border-radius:.8rem;background:#fafbfc;display:flex;align-items:center;gap:.6rem;min-width:0}
.sb-site-ic{width:1.9rem;height:1.9rem;border-radius:.55rem;background:#eef2ff;color:#4338ca;font-weight:700;display:flex;align-items:center;justify-content:center;flex:none;font-size:.9rem}
.sb-site-tx{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.sb-site-tx small{font-size:.68rem;color:#64748b;text-transform:uppercase;letter-spacing:.05em}
.sb-site-tx b{font-size:.88rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.sb-nav{flex:1;min-height:0;overflow-y:auto;padding:.3rem .6rem 1rem;scrollbar-width:thin}
.sb-group+.sb-group{margin-top:.25rem}
.sb-gh{width:100%;display:flex;align-items:center;gap:.7rem;padding:.55rem .65rem;border:0;background:none;border-radius:.6rem;cursor:pointer;color:#334155;font:inherit;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;position:relative}
.sb-gh:hover{background:#f8fafc;color:#0f172a}
.sb-gh .ic:first-child{color:#64748b}
.sb-gt{flex:1;text-align:left;white-space:nowrap}
.sb-gc{font-size:.68rem;font-weight:600;letter-spacing:0;color:#64748b;background:#f1f5f9;border-radius:999px;min-width:1.35rem;text-align:center;padding:.05rem .4rem}
.sb-chev{width:1.5rem;height:1.5rem;border-radius:.45rem;display:inline-flex;align-items:center;justify-content:center;color:#64748b;background:#f1f5f9;flex:none;transition:transform .2s,background .15s}
.sb-chev .ic{width:.9rem;height:.9rem}
.sb-gh:hover .sb-chev{background:#e2e8f0;color:#0f172a}
.sb-group.open>.sb-gh .sb-chev{transform:rotate(90deg);background:#e0e7ff;color:#4f46e5}
.sb-group.open>.sb-gh .sb-gc{display:none}
.sb-gh:focus:not(:focus-visible){outline:none}
.sb-group.open>.sb-gh{color:#3730a3}.sb-group.open>.sb-gh .ic:first-child{color:#4f46e5}
.sb-gdot{width:.5rem;height:.5rem;border-radius:50%;background:#fb7185;flex:none}
.sb-group.open .sb-gdot{display:none}
.sb-items{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s ease}
.sb-items>div{overflow:hidden;min-height:0;padding-left:.35rem}
.sb-group.open .sb-items{grid-template-rows:1fr}
.sb-group:not(.open) .sb-link{visibility:hidden}
.sb-gh:focus-visible{outline:2px solid #4f46e5;outline-offset:2px}
.sb-link{display:flex;align-items:center;gap:.7rem;padding:.45rem .65rem;border-radius:.6rem;color:#475569;text-decoration:none;font-size:.9rem;font-weight:500;position:relative;margin-bottom:.1rem}
.sb-link:hover{background:#f1f5f9;color:#0f172a}
.sb-link.on{background:#eef2ff;color:#3730a3;font-weight:600}
.sb-link.on::before{content:"";position:absolute;left:-.6rem;top:.45rem;bottom:.45rem;width:3px;border-radius:0 3px 3px 0;background:#4f46e5}
.sb-link.on .ic{color:#4f46e5}
.sb-lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.sb-badge{background:#fb7185;color:#fff;border-radius:999px;font-size:.68rem;font-weight:700;padding:.05rem .45rem;min-width:1.2rem;text-align:center}
.sb-link:focus-visible,.sb-collapse:focus-visible,.sb-out:focus-visible{outline:2px solid #4f46e5;outline-offset:2px}

.sb-user{display:flex;align-items:center;gap:.65rem;padding:.8rem .9rem;border-top:1px solid #f1f5f9;min-width:0}
.sb-av{width:2.2rem;height:2.2rem;border-radius:50%;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#3730a3;font-weight:700;font-size:.82rem;display:flex;align-items:center;justify-content:center;flex:none}
.sb-user-tx{display:flex;flex-direction:column;min-width:0;flex:1;line-height:1.25}
.sb-user-tx b{font-size:.85rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-user-tx small{font-size:.72rem;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-user form{margin:0}
.sb-out{border:0;background:none;color:#64748b;width:2rem;height:2rem;border-radius:.5rem;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.sb-out:hover{background:#ffe4e6;color:#be123c}

/* contraído: solo iconos */
body.sb-collapsed .sb{--w:4.4rem}
body.sb-collapsed .sb-name,body.sb-collapsed .sb-lbl,body.sb-collapsed .sb-gt,body.sb-collapsed .sb-chev,body.sb-collapsed .sb-gc,body.sb-collapsed .sb-site-tx,body.sb-collapsed .sb-user-tx,body.sb-collapsed .sb-user form{display:none}
body.sb-collapsed .sb-brand{flex-direction:column;padding:.8rem .4rem .4rem;gap:.4rem}
body.sb-collapsed .sb-logo{flex:none}
body.sb-collapsed .sb-collapse .ic{transform:rotate(180deg)}
body.sb-collapsed .sb-site{margin:.2rem .6rem .5rem;padding:.35rem;justify-content:center}
body.sb-collapsed .sb-nav{padding:.3rem .5rem 1rem}
body.sb-collapsed .sb-gh{justify-content:center;padding:.6rem}
body.sb-collapsed .sb-items>div{padding-left:0}
body.sb-collapsed .sb-gdot{position:absolute;top:.35rem;right:.5rem}
body.sb-collapsed .sb-link{justify-content:center;padding:.6rem}
body.sb-collapsed .sb-link.on::before{left:-.5rem}
body.sb-collapsed .sb-badge{position:absolute;top:.15rem;right:.15rem;font-size:.6rem;min-width:1rem;padding:0 .3rem}
body.sb-collapsed .sb-user{justify-content:center;padding:.8rem .4rem}

/* barra superior móvil + menú deslizante */
.topbar{display:none}
.sb-scrim{display:none}
@media (max-width:899px){
  .sb{position:fixed;left:0;top:0;--w:17rem;transform:translateX(-102%);transition:transform .2s ease;box-shadow:0 20px 50px rgba(15,23,42,.25)}
  body.sb-open .sb{transform:none}
  body.sb-open .sb-scrim{display:block;position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:55}
  .sb-collapse{display:none}.sb-close{display:inline-flex}
  body.sb-collapsed .sb{--w:17rem}
  body.sb-collapsed .sb-name,body.sb-collapsed .sb-lbl,body.sb-collapsed .sb-gt,body.sb-collapsed .sb-chev,body.sb-collapsed .sb-gc,body.sb-collapsed .sb-site-tx,body.sb-collapsed .sb-user-tx{display:revert}
  body.sb-collapsed .sb-user form{display:block}
  body.sb-collapsed .sb-site-tx{display:flex}
  body.sb-collapsed .sb-user-tx{display:flex}
  body.sb-collapsed .sb-brand{flex-direction:row;padding:1rem .9rem .6rem}
  body.sb-collapsed .sb-link{justify-content:flex-start;padding:.5rem .65rem}
  body.sb-collapsed .sb-user{justify-content:flex-start;padding:.8rem .9rem}
  .topbar{display:flex;align-items:center;gap:.6rem;position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid #e5e7eb;padding:.55rem .8rem}
  .tb-title{font-weight:650;font-size:.98rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}

/* ───── Avisos de página ───── */
.al{margin:1rem 1.5rem 0;padding:.65rem 1rem;border-radius:.8rem;border:1px solid;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1rem;font-size:.9rem}
.al a{font-weight:600;color:inherit;text-decoration:underline;text-underline-offset:2px}
.al-ok{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
.al-warn{background:#fffbeb;border-color:#fde68a;color:#92400e}
.al-err{background:#fff1f2;border-color:#fecdd3;color:#9f1239}
.al-info{background:#eef2ff;border-color:#c7d2fe;color:#3730a3}
@media (max-width:560px){.al{margin:.8rem 1rem 0}}

/* Encabezados de grupo (estilo Linear): etiqueta discreta + flecha simple, sin números ni cajas */
.sb-gh{padding:.45rem .65rem;font-size:.68rem;font-weight:600;letter-spacing:.08em;color:#94a3b8;gap:.5rem}
.sb-gh:hover{background:none;color:#475569}
.sb-gh>.ic:first-child{display:none}
.sb-gc{display:none!important}
.sb-chev{background:none!important;width:1.1rem;height:1.1rem;color:#cbd5e1}
.sb-chev .ic{width:.8rem;height:.8rem}
.sb-gh:hover .sb-chev{color:#64748b}
.sb-group.open>.sb-gh{color:#475569}
.sb-group.open>.sb-gh .sb-chev{background:none!important;color:#6366f1}
body.sb-collapsed .sb-gh>.ic:first-child{display:block}
body.sb-collapsed .sb-gh{padding:.6rem}
@media(max-width:1023px){body.sb-collapsed .sb-gh>.ic:first-child{display:none}}
