/* Gestión SST · versión servidor: acceso, estado de guardado, avisos y botones de cuenta */
body.sst-bloq{overflow:hidden}
.sst-acc{z-index:200}
.sst-acc.sst-modal{background:rgba(8,24,19,.62)}
.sst-acc .sxl-card h2{margin:4px 0 10px;font-family:var(--display);font-size:20px}
.sst-acc form{display:grid;gap:10px}
.sst-acc label{display:grid;gap:4px;font-size:13px;font-weight:600}
.sst-acc input{font:16px var(--body);padding:10px 11px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);min-height:44px}
.sst-acc .btn.primary{width:100%;min-height:44px;font-size:15px;justify-content:center;text-align:center;text-decoration:none;display:flex;align-items:center}
.sst-acc .btn.primary:disabled{opacity:.6}
.sst-nota{margin:0;font-size:13px;color:var(--muted);line-height:1.45}
.sst-lnk{background:none;border:0;color:var(--accent);font:600 13.5px var(--body);cursor:pointer;padding:8px 0;justify-self:center}
.sst-lnk:hover{text-decoration:underline}
.sst-load{display:flex;align-items:center;gap:10px;margin:8px 0 12px;color:var(--muted);font-size:14px}
.sst-spin{width:18px;height:18px;border-radius:50%;border:2.5px solid var(--line);border-top-color:var(--accent);animation:sstGira .8s linear infinite;flex:none}
@keyframes sstGira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.sst-spin{animation:none}}

/* Botones de cuenta en la cabecera: «Salir» siempre a la vista */
.sst-hb{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 10px;border-radius:8px;border:1px solid rgba(255,255,255,.28);background:transparent;color:inherit;font:600 13px var(--body);cursor:pointer;text-decoration:none;white-space:nowrap}
.sst-hb:hover{background:rgba(255,255,255,.12)}
.sst-hb:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media (max-width:620px){
  .sst-srv .sx-tbtns a.sst-hb{display:none} /* en el celular «Administración» está en el menú del usuario */
  .sst-hb.sst-out{width:36px;height:36px;padding:0;justify-content:center;border-radius:50%;border-color:rgba(255,255,255,.45);background:rgba(255,255,255,.1)}
  .sst-hb.sst-out span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .sst-srv .brandbtn b{font-size:21px;white-space:nowrap}
}
.sx-mea{flex-wrap:wrap}
.sx-mea .sx-adm{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;border-radius:7px;font:500 12px var(--body);padding:4px 9px;text-decoration:none;display:inline-flex;align-items:center}

/* Estado del guardado */
.sst-est{position:fixed;left:12px;bottom:calc(38px + env(safe-area-inset-bottom,0px));z-index:70;background:var(--fg);color:var(--bg);font:600 12px var(--body);padding:6px 11px;border-radius:999px;box-shadow:0 4px 14px rgba(0,0,0,.18);pointer-events:none}
.sst-est[data-e="reintentando"]{background:var(--r-crit,#b0341e);color:#fff}
.sst-est[hidden]{display:none}

/* Cambios de otros usuarios y aviso general */
.sst-ban,.sst-aviso{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(40px + env(safe-area-inset-bottom,0px));z-index:75;display:flex;align-items:center;gap:10px;max-width:min(560px,calc(100vw - 32px));
  background:var(--surface);color:var(--fg);border:1px solid var(--line);border-radius:12px;padding:9px 10px 9px 14px;box-shadow:0 10px 30px rgba(0,0,0,.22);font-size:13.5px}
.sst-aviso{top:calc(10px + env(safe-area-inset-top,0px));bottom:auto;border-left:4px solid var(--accent)}
.sst-aviso.al{border-left-color:var(--r-crit,#b0341e)}
.sst-ban span,.sst-aviso span{flex:1}
.sst-x{background:none;border:0;color:var(--muted);font-size:15px;cursor:pointer;padding:4px 6px;line-height:1}

/* Ficha de usuario: en el servidor se ingresa con la cuenta, no con PIN */
body.sst-srv label:has(> #sx-p[type="password"]){display:none}
.sst-nota.sst-ok{background:var(--accent-soft,#dfeae4);color:var(--fg);padding:9px 11px;border-radius:8px}
/* Ficha de usuario: acceso a la cuenta */
#sstCta .sst-cta-est{margin:0 0 8px;padding:8px 10px;border-radius:8px;background:var(--sunken);font-size:13px}
#sstCta .sst-cta-est.al{background:var(--r-mod-bg,#f6e7c8)}
#sstCta .sst-cta-opts{display:grid;gap:6px;margin-bottom:8px}
#sstCta .sst-cta-opts [hidden]{display:none}
.sst-temp{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0 12px}
.sst-temp code{font:600 20px var(--mono,monospace);letter-spacing:.06em;background:var(--sunken);padding:8px 12px;border-radius:8px;user-select:all}

/* Computadora: usar todo el ancho de la pantalla */
@media (min-width:900px){
  body.sst-srv .wrap{max-width:none;padding-left:max(28px,env(safe-area-inset-left,0px));padding-right:max(28px,env(safe-area-inset-right,0px))}
}

/* Ver / ocultar contraseña */
.sst-pw{position:relative;display:block}
.sst-pw>input{width:100%;padding-right:46px!important}
.sst-ojo{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}
.sst-ojo:hover{color:var(--fg);background:var(--sunken)}
.sst-ojo:focus-visible{outline:3px solid var(--accent);outline-offset:0}
.sst-ojo[aria-pressed="true"]{color:var(--accent)}

/* Cabecera en computadora: «Plataforma integrada…» junto al nombre, a la izquierda */
@media (min-width:621px){
  body.sst-srv .topbar .brandbtn{flex:0 0 auto}
  body.sst-srv .topbar .hero-meta{display:flex;align-items:center;gap:14px;flex:1 1 auto;min-width:0;text-align:left;margin-left:28px;margin-right:16px;padding-left:24px;border-left:1px solid rgba(255,255,255,.25)}
  body.sst-srv .topbar .hero-meta .hsub{text-align:left;max-width:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:0 1 auto}
  body.sst-srv .topbar .hero-meta .scope{flex:none;white-space:nowrap}
}

/* Elegir empresa y unidad desde la cabecera */
.sst-scope{cursor:pointer;font:inherit;color:inherit;display:inline-flex;align-items:center;gap:6px}
.sst-scope:hover{background:rgba(255,255,255,.22)}
.sst-scope:focus-visible{outline:3px solid #f2c230;outline-offset:2px}
.sst-pop{position:fixed;z-index:90;background:var(--surface);color:var(--fg);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.28);padding:14px;display:grid;gap:12px}
.sst-pop label{display:grid;gap:4px;font-size:13px;font-weight:600}
.sst-pop select{font:15px var(--body);padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--fg);width:100%}

/* Alertas: pestañas «No leídas» / «Leídas» */
.alrp-tabs{display:inline-flex;gap:4px;background:var(--sunken);border-radius:10px;padding:3px}
.alrp-tabs button{border:0;background:transparent;color:var(--muted);font:600 14px var(--body);padding:7px 12px;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.alrp-tabs button span{font:600 11px var(--mono,monospace);background:var(--line);color:var(--fg);border-radius:999px;padding:1px 7px}
.alrp-tabs button[aria-selected="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.alrp-tabs button[aria-selected="true"][data-alrtab="n"] span{background:var(--r-crit,#b0341e);color:#fff}
.alrp-tabs button:focus-visible{outline:3px solid var(--accent);outline-offset:1px}
@media (min-width:621px) and (max-width:1100px){body.sst-srv .topbar .hero-meta .hsub{display:none}}

/* ===== Menú lateral: más liviano, agrupado y práctico ===== */
body.sst-srv .drawer{width:min(320px,90vw)}
body.sst-srv .drawer .dhead{padding:14px 16px 12px}
body.sst-srv .drawer .dbrand{margin-bottom:8px}
body.sst-srv .drawer .dbrand b{font-size:21px}
body.sst-srv .drawer .dbrand .dico{width:34px;height:34px;font-size:12px}
body.sst-srv .drawer .dscope{display:none}
body.sst-srv .drawer .ddate{margin-top:2px;padding-top:0;border-top:0;font-size:12px}
body.sst-srv .drawer .sx-me{margin-top:10px;padding:10px;border:0;border-radius:12px;background:rgba(255,255,255,.08)}
body.sst-srv .drawer .sx-mea{gap:6px;margin-top:8px}
body.sst-srv .drawer .sx-mea>*{flex:1 1 auto;justify-content:center;text-align:center;padding:6px 8px;border-radius:8px}
body.sst-srv .drawer .dfil{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;padding:12px 16px;background:var(--dw-fil)}
body.sst-srv .drawer .dfil label{font-size:11.5px;letter-spacing:.02em}
body.sst-srv .drawer .dfil label:last-child{grid-column:1/-1}
body.sst-srv .drawer .dfil label:only-child,body.sst-srv .drawer .dfil label:first-child:nth-last-child(2){grid-column:1/-1}
body.sst-srv .drawer .dfil select{padding:7px 9px;font-size:13.5px;border-radius:8px}
body.sst-srv .drawer nav.dnav-x{padding:8px 10px 4px;display:grid;gap:6px}
body.sst-srv .drawer .dgx{border-radius:12px;background:var(--surface);border:1px solid var(--dw-line);overflow:hidden}
body.sst-srv .drawer .dgx.act{border-color:var(--accent)}
body.sst-srv .drawer .dgx>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:10px 12px;border-top:0;margin:0;color:var(--fg);font-size:12.5px;letter-spacing:.07em;user-select:none}
body.sst-srv .drawer .dgx>summary::-webkit-details-marker{display:none}
body.sst-srv .drawer .dgx>summary:hover{background:var(--dw-hover)}
body.sst-srv .drawer .dgx>summary:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
body.sst-srv .drawer .dgx .dgt{flex:1}
body.sst-srv .drawer .dgx .dcnt{font:600 11px var(--mono,monospace);font-style:normal;color:var(--muted);background:var(--sunken);border-radius:999px;padding:1px 8px;letter-spacing:0}
body.sst-srv .drawer .dgx .dchev{color:var(--muted);transition:transform .18s ease;flex:none}
body.sst-srv .drawer .dgx:not([open]) .dchev{transform:rotate(-90deg)}
body.sst-srv .drawer .dgx .dgi{display:grid;gap:2px;padding:0 6px 8px}
body.sst-srv .drawer .dgx .dn{border-left:0;border-radius:8px;padding:8px 10px 8px 38px;font-size:14px;min-height:38px;position:relative}
body.sst-srv .drawer .dgx .dn::before{content:"";position:absolute;left:18px;top:50%;width:6px;height:6px;border-radius:50%;background:var(--line);transform:translateY(-50%)}
body.sst-srv .drawer .dgx .dn[aria-current="true"]{background:var(--accent-soft,#dfeae4);color:var(--fg);font-weight:700}
body.sst-srv .drawer .dgx .dn[aria-current="true"]::before{background:var(--accent);width:8px;height:8px}
body.sst-srv .drawer .sx-tools{padding:6px 18px 0}
body.sst-srv .drawer .dver{padding:10px 18px 14px;font-size:11.5px;color:var(--muted)}
@media (prefers-reduced-motion:reduce){body.sst-srv .drawer .dgx .dchev{transition:none}}

/* Usuario: fuera del menú lateral, en la caja del botón con las iniciales */
body.sst-srv .drawer .sx-me,body.sst-srv .drawer .sx-mea{display:none}
.sst-usr{padding:0;gap:0;overflow:hidden}
.sst-usr-h{display:flex;align-items:center;gap:12px;padding:14px;background:linear-gradient(135deg,#0d2a22 0%,#174236 55%,#22604b 100%);color:#fff}
.sst-usr-h b{display:block;font-size:15px}
.sst-usr-h small{display:block;font-size:12px;color:rgba(255,255,255,.8);word-break:break-all}
.sst-av{width:40px;height:40px;border-radius:50%;background:#f2c230;color:#1c211f;display:grid;place-items:center;font:700 14px var(--body);flex:none}
.sst-usr-a{display:grid;padding:6px}
.sst-usr-a>*{display:flex;align-items:center;min-height:42px;padding:0 12px;border:0;border-radius:8px;background:none;color:var(--fg);font:500 14px var(--body);text-align:left;text-decoration:none;cursor:pointer}
.sst-usr-a>*:hover{background:var(--sunken)}
.sst-usr-a>*:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
.sst-usr-a .sst-usr-out{color:var(--r-crit,#b0341e);border-top:1px solid var(--line);border-radius:0 0 8px 8px;margin-top:4px}


/* Objetivos: tarjetas plegables */
#objView .panels{align-items:start}
.oacc .oacc-h{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;cursor:pointer;border-radius:8px}
.oacc .oacc-h h3{flex:1;margin:0}
.oacc .oacc-h .status{flex:none}
.oacc .oacc-c{flex:none;color:var(--muted);transition:transform .18s ease}
.oacc.open .oacc-c{transform:rotate(180deg)}
.oacc .oacc-h:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.oacc .oacc-b{display:none}
.oacc.open .oacc-b{display:grid;gap:10px;margin-top:10px}
@media (prefers-reduced-motion:reduce){.oacc .oacc-c{transition:none}}