:root {
  --bg: #eef2f5;
  --card: #ffffff;
  --text: #263445;
  --muted: #6b7b8c;
  --border: #dce3ea;
  --primary: #1a3c5e;
  --primary2: #2c5f8a;
  --accent: #e8a817;
  --danger: #c0392b;
  --success: #27ae60;
  --warning: #e67e22;
  --shadow: rgba(0,0,0,.08);
  --input: #f9fbfd;
  --sidebar: #1a3c5e;
}

/* Pantalla institucional exclusiva del arranque de la PWA. */
.siged-startup-splash{
position:fixed;
inset:0;
z-index:150000;
display:grid;
place-items:center;
min-height:100dvh;
padding:max(24px,env(safe-area-inset-top)) 22px max(24px,env(safe-area-inset-bottom));
overflow:hidden;
color:#fff;
background:
radial-gradient(circle at 50% 36%,rgba(194,153,58,.22),transparent 32%),
linear-gradient(145deg,#171614 0%,#29241d 56%,#473719 100%);
opacity:1;
visibility:visible;
transition:opacity .42s ease,visibility .42s ease;
}
.siged-startup-splash.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
.siged-startup-splash::before,.siged-startup-splash::after{
content:"";
position:absolute;
width:46vw;
aspect-ratio:1;
border:1px solid rgba(214,177,83,.13);
transform:rotate(32deg);
}
.siged-startup-splash::before{left:-24vw;top:-25vw}
.siged-startup-splash::after{right:-25vw;bottom:-27vw}
.siged-startup-halo{
position:absolute;
width:min(72vw,580px);
aspect-ratio:1;
border-radius:50%;
background:radial-gradient(circle,rgba(210,172,75,.13),transparent 67%);
animation:sigedStartupHalo 2.8s ease-in-out infinite;
}
.siged-startup-card{
position:relative;
z-index:1;
width:min(460px,100%);
text-align:center;
}
.siged-startup-logo{
display:block;
width:clamp(112px,24vw,164px);
height:clamp(112px,24vw,164px);
object-fit:contain;
margin:0 auto 18px;
padding:12px;
border:1px solid rgba(224,199,121,.32);
border-radius:28px;
background:rgba(255,255,255,.93);
box-shadow:0 14px 34px rgba(0,0,0,.26);
animation:sigedStartupLogo .8s cubic-bezier(.2,.8,.2,1) both;
}
.siged-startup-kicker{
margin:0 0 10px;
color:#e0c779;
font-size:clamp(.7rem,2.2vw,.82rem);
font-weight:850;
letter-spacing:.14em;
text-transform:uppercase;
}
.siged-startup-card h1{
margin:0;
color:#fff;
font-size:clamp(2.5rem,10vw,4.25rem);
line-height:1;
letter-spacing:.09em;
}
.siged-startup-name{
max-width:390px;
margin:12px auto 27px;
color:rgba(255,255,255,.78);
font-size:clamp(.88rem,3vw,1rem);
font-weight:650;
line-height:1.45;
}
.siged-startup-progress{
width:min(270px,72vw);
height:4px;
margin:0 auto 14px;
overflow:hidden;
border-radius:999px;
background:rgba(255,255,255,.13);
}
.siged-startup-progress span{
display:block;
width:42%;
height:100%;
border-radius:inherit;
background:linear-gradient(90deg,#a87b19,#f0d57e,#b58823);
animation:sigedStartupProgress 1.25s ease-in-out infinite;
}
.siged-startup-status{margin:0;color:#f2e8c9;font-size:.83rem;font-weight:700}
.siged-startup-version{margin-top:16px;color:rgba(255,255,255,.44);font-size:.68rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
@keyframes sigedStartupProgress{0%{transform:translateX(-115%)}100%{transform:translateX(340%)}}
@keyframes sigedStartupLogo{from{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:none}}
@keyframes sigedStartupHalo{50%{transform:scale(1.08);opacity:.72}}
@media(max-width:520px){.siged-startup-card{transform:translateY(-2vh)}.siged-startup-name{margin-bottom:23px}}
@media(prefers-reduced-motion:reduce){
.siged-startup-splash,.siged-startup-logo,.siged-startup-halo,.siged-startup-progress span{animation:none!important;transition:none!important}
.siged-startup-progress span{width:68%;margin:auto}
}

#app.siged-session-enter{animation:sigedSessionEnter .38s cubic-bezier(.2,.75,.25,1) both}
@keyframes sigedSessionEnter{from{opacity:.72;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#app.siged-session-enter{animation:none!important}}

/* Identificación inequívoca del ambiente de pruebas. */
.siged-environment-banner[hidden]{display:none!important}
.siged-environment-banner{position:fixed;z-index:14000;top:max(8px,env(safe-area-inset-top));right:10px;min-width:76px;padding:7px 12px;border-radius:999px;background:#fbbf24;color:#3b2200;text-align:center;font-size:12px;font-weight:900;letter-spacing:.06em;box-shadow:0 4px 16px rgba(0,0,0,.2);pointer-events:none}
.siged-environment-banner.production{background:#dff6e8;color:#145a35;border:1px solid #92d5ae}
.siged-version-chip{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:rgba(127,127,127,.1);color:var(--muted);font-size:.72rem;font-weight:800;white-space:nowrap}
.siged-maintenance-screen[hidden]{display:none!important}.siged-maintenance-screen{position:fixed;z-index:13950;inset:0;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,rgba(15,29,39,.97),rgba(48,38,16,.96))}.siged-maintenance-card{width:min(560px,100%);padding:32px;border-radius:24px;background:#fff;color:#20242a;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.45)}.siged-maintenance-icon{font-size:3rem}.siged-maintenance-card h1{margin:8px 0}.siged-maintenance-card p{line-height:1.55}.siged-maintenance-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:12px}.siged-maintenance-card button{margin-top:0}
body.siged-staging{padding-top:30px}
body.siged-staging .sidebar{top:30px;height:calc(100dvh - 30px)}
@media(max-width:850px){.siged-environment-banner{font-size:10px;top:max(5px,env(safe-area-inset-top));right:6px;min-width:62px;padding:5px 9px}.siged-version-chip{display:none}}

.dark-mode {
  --bg: #111827;
  --card: #1f2937;
  --text: #f3f4f6;
  --muted: #cbd5e1;
  --border: #374151;
  --primary: #2563eb;
  --primary2: #3b82f6;
  --accent: #facc15;
  --danger: #ef4444;
  --success: #22c55e;
  --warning: #f97316;
  --shadow: rgba(0,0,0,.25);
  --input: #111827;
  --sidebar: #0f172a;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
}

button, input, select, textarea {
  font-family: inherit;
}

.offline-banner {
  display: none;
  background: var(--danger);
  color: #fff;
  text-align: center;
  padding: 8px 12px;
  font-weight: 700;
  font-size: .85rem;
}

.offline-banner.show {
  display: block;
}

.login-screen {
  min-height: 100vh;
  background: linear-gradient(135deg, var(--primary), var(--primary2));
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.login-box {
  width: 100%;
  max-width: 420px;
  background: var(--card);
  border-radius: 28px;
  padding: 28px 22px;
  box-shadow: 0 20px 40px var(--shadow);
}

.login-box h1 {
  text-align: center;
  margin-bottom: 20px;
  font-size: 1.7rem;
}

label {
  display: block;
  font-weight: 700;
  margin: 12px 0 6px;
  color: var(--text);
}

input, select, textarea {
  width: 100%;
  border: 2px solid var(--border);
  border-radius: 15px;
  padding: 13px 14px;
  background: var(--input);
  color: var(--text);
  font-size: 1rem;
  margin-bottom: 8px;
}

textarea {
  resize: vertical;
}

.btn, button {
  border: 0;
  border-radius: 22px;
  padding: 11px 16px;
  cursor: pointer;
  font-weight: 800;
  background: var(--primary);
  color: #fff;
  transition: transform .15s, opacity .15s;
}

.btn:hover, button:hover {
  opacity: .92;
  transform: translateY(-1px);
}

.btn.full {
  width: 100%;
  margin-top: 12px;
  padding: 15px;
  font-size: 1rem;
}

.btn.small, button.small {
  padding: 7px 11px;
  font-size: .78rem;
  border-radius: 16px;
  margin: 2px;
}

.accent {
  background: var(--accent);
  color: #111;
}

.success {
  background: var(--success);
  color: #fff;
}

.danger {
  background: var(--danger);
  color: #fff;
}

.warning {
  background: var(--warning);
  color: #fff;
}

.error {
  display: none;
  color: var(--danger);
  text-align: center;
  font-weight: 700;
  margin-top: 10px;
}

.app {
  display: none;
  min-height: 100vh;
}

.sidebar {
  width: 280px;
  background: var(--sidebar);
  color: #fff;
  padding: 18px 0;
  flex-shrink: 0;
  box-shadow: 4px 0 20px var(--shadow);
}

.sidebar-header {
  padding: 0 18px 18px;
  border-bottom: 1px solid rgba(255,255,255,.2);
}

.sidebar-header h2 {
  font-size: 1.2rem;
  margin-bottom: 4px;
}

.user-badge {
  background: rgba(255,255,255,.16);
  padding: 10px 18px;
  margin: 12px 0;
  font-weight: 700;
}

.nav-item {
  margin: 6px 12px;
  padding: 13px 16px;
  border-radius: 14px;
  cursor: pointer;
  display: flex;
  gap: 10px;
  align-items: center;
  font-weight: 700;
}

.nav-item.active {
  background: rgba(255,255,255,.2);
}

.badge {
  margin-left: auto;
  background: var(--danger);
  color: #fff;
  padding: 2px 9px;
  border-radius: 999px;
  font-size: .75rem;
  display: none;
}

.main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.topbar {
  background: var(--card);
  box-shadow: 0 2px 12px var(--shadow);
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.topbar h2 {
  font-size: 1.2rem;
}

.topbar-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.icon-btn {
  background: transparent;
  color: var(--text);
  font-size: 1.2rem;
  padding: 5px 8px;
}

.connection-status {
  font-size: .78rem;
  font-weight: 800;
  padding: 5px 9px;
  border-radius: 999px;
  white-space: nowrap;
}

.online {
  background: #d4edda;
  color: #155724;
}

.offline {
  background: #f8d7da;
  color: #721c24;
}

.content {
  flex: 1;
  padding: 20px;
  overflow: auto;
}

.card {
  background: var(--card);
  border-radius: 20px;
  padding: 18px;
  margin-bottom: 18px;
  box-shadow: 0 4px 18px var(--shadow);
}

.card h3 {
  margin-bottom: 12px;
  font-size: 1.1rem;
}

.grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.oficios-bandejas {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.oficios-bandejas > .card {
  min-width: 0;
  width: 100%;
}

.filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.filtros input,
.filtros select {
  width: auto;
  min-width: 140px;
  padding: 9px 10px;
  border-radius: 12px;
  font-size: .9rem;
}

.check-list {
  max-height: 180px;
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 10px;
  background: var(--input);
}

.check-list label {
  font-weight: 500;
  margin: 6px 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.check-list input {
  width: auto;
  margin: 0;
}

.file-upload-area {
  border: 2px dashed var(--border);
  background: var(--input);
  padding: 18px;
  border-radius: 16px;
  text-align: center;
  cursor: pointer;
  margin: 8px 0 12px;
}

.file-upload-area strong {
  display: block;
  margin-top: 5px;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: .84rem;
}

th, td {
  border-bottom: 1px solid var(--border);
  padding: 9px 7px;
  text-align: left;
  vertical-align: top;
}

th {
  background: rgba(127,127,127,.08);
  font-weight: 900;
}

.table-wrap {
  overflow: auto;
}

.status {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.pendiente {
  background: #fff3cd;
  color: #856404;
}

.sellado {
  background: #d4edda;
  color: #155724;
}

.archivado {
  background: #e2e3e5;
  color: #495057;
}

.recibido {
  background: #d4edda;
  color: #155724;
}

.devuelto {
  background: #fde2e2;
  color: #8b1111;
}

.corregido {
  background: #e8e5ff;
  color: #4c3f91;
}

.siged-kpi-area-table td,
.siged-kpi-area-table th {
  white-space: nowrap;
}

.siged-metric-bar-row {
  display: grid;
  grid-template-columns: minmax(85px, 130px) 1fr 44px;
  gap: 9px;
  align-items: center;
  margin: 8px 0;
  font-size: .82rem;
  font-weight: 750;
}

.siged-metric-bar-track {
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(127,127,127,.18);
}

.siged-metric-bar-fill {
  height: 100%;
  min-width: 2px;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--primary2), var(--gold-dark));
}

.siged-return-box {
  margin-top: 7px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid rgba(183,28,28,.25);
  background: rgba(253,226,226,.55);
  color: #7f1111;
  font-size: .78rem;
  line-height: 1.35;
}

.en_espera {
  background: #fff3cd;
  color: #856404;
}

.atendiendo {
  background: #dbeafe;
  color: #1d4ed8;
}

.pendiente_firma {
  background: #fef3c7;
  color: #92400e;
}

.finalizado {
  background: #d4edda;
  color: #155724;
}

.ticket-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.firma-mini {
  max-width: 95px;
  max-height: 34px;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 6px;
  margin-top: 4px;
}

.acuse-code {
  display: inline-block;
  margin-top: 6px;
  background: #effaf0;
  color: #155724;
  padding: 3px 8px;
  border-radius: 9px;
  font-family: monospace;
  font-weight: 900;
}

.hint {
  color: var(--muted);
  font-size: .88rem;
  line-height: 1.35;
}

.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(0,0,0,.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

.modal-box {
  background: var(--card);
  color: var(--text);
  width: 100%;
  max-width: 480px;
  border-radius: 22px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 20px 40px rgba(0,0,0,.25);
}

canvas {
  width: 100%;
  height: auto;
  border: 2px solid var(--border);
  border-radius: 14px;
  background: #fff;
  touch-action: none;
}

.chat-container {
  max-height: 360px;
  overflow: auto;
  border: 1px solid var(--border);
  background: var(--input);
  border-radius: 14px;
  padding: 10px;
  margin-bottom: 10px;
}

.chat-msg {
  max-width: 82%;
  padding: 9px 11px;
  border-radius: 15px;
  margin: 6px 0;
  word-break: break-word;
}

.chat-msg.mio {
  background: var(--primary);
  color: #fff;
  margin-left: auto;
}

.chat-msg.otro {
  background: rgba(127,127,127,.18);
  color: var(--text);
  margin-right: auto;
}

.mobile-menu {
  display: none;
}

.folder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.folder-card {
  border: 1px solid var(--border);
  background: var(--input);
  border-radius: 16px;
  padding: 12px;
}

.folder-card strong {
  display: block;
  margin-bottom: 6px;
  word-break: break-word;
}

@media (max-width: 850px) {
  .sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: -285px;
    z-index: 1000;
    transition: left .2s;
  }

  .sidebar.open {
    left: 0;
  }

  .mobile-menu {
    display: inline-flex;
  }

  .grid-2 {
    grid-template-columns: 1fr;
  }

  .content {
    padding: 14px;
  }

  .topbar {
    padding: 12px;
  }

  .topbar h2 {
    font-size: 1rem;
  }

  .connection-status {
    display: none;
  }

  .filtros input,
  .filtros select {
    width: 100%;
  }
}


/* ============================================================
   DISEÑO INSTITUCIONAL LXIV - APLICADO DESDE REFERENCIA
   Paleta dorado / gris, logo institucional y fondo con marca.
   Requiere logo.png y logo1.jpg en la misma carpeta del HTML.
   ============================================================ */
:root {
  --bg: #f4f4f4;
  --card: rgba(255,255,255,.96);
  --text: #1f2328;
  --muted: #68707a;
  --border: #e2e2e2;
  --primary: #b88b2a;
  --primary2: #d4af37;
  --accent: #d4af37;
  --danger: #b71c1c;
  --success: #5a6268;
  --warning: #f5a623;
  --shadow: rgba(0,0,0,.18);
  --input: #ffffff;
  --sidebar: #242424;
  --gold-dark: #8d6818;
  --gold-soft: #f6e8ba;
  --gray-dark: #333333;
  --gray-mid: #6c757d;
}
body { background: linear-gradient(135deg, rgba(44,44,44,.06), rgba(212,175,55,.12)), #f4f4f4; color: var(--text); }
.dark-mode { --bg:#101010; --card:rgba(31,31,31,.96); --text:#f7f7f7; --muted:#c9c9c9; --border:#454545; --primary:#d4af37; --primary2:#b8860b; --accent:#f5c542; --sidebar:#111111; --input:#181818; --shadow:rgba(0,0,0,.35); }
.login-screen { min-height:100vh; position:relative; overflow:hidden; background: linear-gradient(0deg, rgba(255,255,255,.90), rgba(255,255,255,.86)), url("logo1.jpg") center/cover no-repeat; display:flex; align-items:center; justify-content:center; padding:24px; }
.login-screen::before { content:''; position:absolute; inset:0; background: radial-gradient(circle at center, rgba(212,175,55,.20), transparent 38%), linear-gradient(135deg, rgba(44,44,44,.05), rgba(212,175,55,.08)); pointer-events:none; }
.login-box { position:relative; z-index:1; width:100%; max-width:460px; background:rgba(255,255,255,.91); border:1px solid rgba(184,139,42,.40); border-top:8px solid var(--primary); border-radius:22px; padding:30px 24px 26px; box-shadow:0 24px 70px rgba(0,0,0,.24); backdrop-filter:blur(10px); overflow:hidden; }
.login-box::before { content:''; display:block; width:min(260px,88%); height:126px; margin:0 auto 6px; background:url("logo.png") center/contain no-repeat; filter:drop-shadow(0 5px 12px rgba(0,0,0,.18)); }
.login-box::after { content:''; position:absolute; inset:auto -30px -80px -30px; height:160px; background:linear-gradient(135deg, rgba(212,175,55,.16), rgba(108,117,125,.08)); transform:skewY(-4deg); z-index:-1; }
.login-box h1 { font-size:1.35rem; letter-spacing:.05em; text-transform:uppercase; color:#111; margin-bottom:8px; }
.login-box h1::after { content:'Sistema Integral de Gestión y Evolución Digital'; display:block; color:var(--muted); font-size:.78rem; font-weight:700; text-transform:none; letter-spacing:.02em; margin-top:6px; }
.siged-account-entry-actions { display:flex; justify-content:center; gap:8px 16px; flex-wrap:wrap; margin:12px 0 4px; }
.siged-login-divider { display:flex; align-items:center; gap:10px; color:#7b828a; margin:13px 0; font-size:.82rem; }
.siged-login-divider::before,.siged-login-divider::after { content:""; height:1px; background:rgba(127,127,127,.28); flex:1; }
.siged-google-button { background:#fff!important; color:#24272b!important; border:1px solid #cfd4da!important; box-shadow:0 3px 12px rgba(0,0,0,.08)!important; display:flex!important; align-items:center; justify-content:center; gap:10px; }
.siged-google-button span { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; color:#4285f4; font-weight:900; background:#f4f7ff; }
.siged-login-link { appearance:none; border:0; background:transparent; color:#77570b; padding:5px 2px; font:inherit; font-weight:800; text-decoration:underline; text-underline-offset:3px; cursor:pointer; box-shadow:none; }
.siged-login-link:hover, .siged-login-link:focus-visible { color:#124d43; background:transparent; transform:none; outline:2px solid rgba(184,139,42,.38); outline-offset:3px; }
.siged-account-overlay { z-index:14000; padding:18px; overflow:auto; align-items:flex-start; }
.siged-account-card { position:relative; width:min(760px,100%); margin:auto; background:#fff; border-radius:22px; border-top:7px solid var(--primary); padding:26px; box-shadow:0 26px 80px rgba(0,0,0,.32); color:#20252a; }
.siged-account-card-compact { width:min(520px,100%); }
.siged-account-card-simple { width:min(640px,100%); }
.siged-account-card h2 { text-align:center; margin:0 36px 8px; }
.siged-account-icon { text-align:center; font-size:2.2rem; margin-bottom:5px; }
.siged-account-close { position:absolute; right:14px; top:13px; width:40px; height:40px; border-radius:50%; padding:0; background:#eef0f2; color:#30343a; box-shadow:none; font-size:1.55rem; line-height:1; }
.siged-account-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 16px; margin-top:18px; }
.siged-account-wide { grid-column:1/-1; }
.siged-account-card label { display:block; font-weight:800; }
.siged-account-card input, .siged-account-card select, .siged-account-card textarea { width:100%; margin-top:5px; }
.siged-code-input { text-align:center; font-size:1.6rem; font-weight:900; letter-spacing:.28em; font-variant-numeric:tabular-nums; }
.siged-password-rule, .siged-account-privacy { margin:8px 0 14px; color:#606872; font-size:.88rem; }
.siged-account-privacy { text-align:center; margin-bottom:0; }
.siged-account-message { margin:12px 0; padding:11px 13px; border-radius:12px; background:#fde8e8; border:1px solid #e8a3a3; color:#851a1a; font-weight:750; }
.siged-account-message:not([hidden]) { display:block; }
.siged-account-message[hidden] { display:none !important; }
.siged-account-message.success { background:#e4f5ea; border-color:#8bcaa1; color:#145b32; }
.siged-account-field-hint { display:block; margin:-2px 0 6px; color:#65707b; font-size:.8rem; font-weight:600; line-height:1.35; }
.siged-account-invalid { border-color:#c0392b !important; box-shadow:0 0 0 3px rgba(192,57,43,.14) !important; }
.siged-account-secondary-actions { display:flex; justify-content:center; gap:18px; flex-wrap:wrap; margin-top:12px; }
.siged-account-folio { padding:12px; border-radius:12px; text-align:center; background:#f5ecd1; color:#57400d; }
.siged-account-intro { max-width:560px; margin-left:auto; margin-right:auto; text-align:center; }
.siged-login-remember { display:flex; align-items:center; gap:9px; margin:10px 0 2px; font-size:.9rem; font-weight:700; cursor:pointer; }
.siged-login-remember input { width:20px; height:20px; margin:0; flex:0 0 auto; accent-color:var(--primary2); }
.siged-password-manager-hint { margin:3px 0 12px; color:#68717b; font-size:.8rem; line-height:1.35; }
.siged-login-password-wrap { position:relative; width:100%; margin-bottom:3px; }
.siged-login-password-wrap input { width:100%; margin:0; padding-right:48px !important; }
.siged-login-password-eye { position:absolute; right:6px; top:50%; transform:translateY(-50%); width:38px; height:36px; padding:0; border:0; border-radius:10px; background:transparent; color:var(--text); box-shadow:none; font-size:1.05rem; display:grid; place-items:center; }
.siged-login-password-eye:hover,.siged-login-password-eye:focus-visible,.siged-login-password-eye:active { background:rgba(120,120,120,.12); transform:translateY(-50%) !important; box-shadow:none !important; }
.siged-access-admin-heading { display:flex; justify-content:space-between; gap:12px; align-items:start; flex-wrap:wrap; }
.siged-access-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:16px 0; }
.siged-access-summary > div { padding:15px; border:1px solid var(--border); border-radius:15px; background:var(--card); box-shadow:0 5px 16px rgba(0,0,0,.06); }
.siged-access-summary strong { display:block; font-size:1.55rem; color:var(--primary2); font-variant-numeric:tabular-nums; }
.siged-access-summary span { display:block; margin-top:2px; color:var(--muted); font-size:.84rem; font-weight:750; }
.siged-access-select-all { display:flex; justify-content:flex-end; margin:2px 0 10px; }
.siged-access-select-all label { display:flex; align-items:center; gap:8px; font-weight:800; }
.siged-access-select-all input, .siged-access-request-person > input { width:20px; height:20px; margin:0; accent-color:var(--primary2); }
.siged-access-request-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,430px),1fr)); gap:14px; }
.siged-access-request-card { border:1px solid var(--border); border-left:5px solid var(--primary); border-radius:17px; padding:16px; background:var(--card); box-shadow:0 8px 22px rgba(0,0,0,.07); }
.siged-access-request-person { display:flex; align-items:flex-start; gap:11px; }
.siged-access-request-person > div { min-width:0; }
.siged-access-request-person strong, .siged-access-request-person small { display:block; overflow-wrap:anywhere; }
.siged-access-request-person span { display:inline-block; margin:4px 0; padding:3px 8px; border-radius:999px; background:#e3f5e9; color:#17663a; font-size:.76rem; font-weight:850; }
.siged-access-request-meta { display:flex; gap:7px 18px; flex-wrap:wrap; margin:12px 0; color:var(--muted); font-size:.82rem; }
.siged-access-request-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.siged-access-request-fields label { font-size:.82rem; font-weight:800; }
.siged-access-request-fields label:last-child { grid-column:1/-1; }
.siged-access-request-fields input, .siged-access-request-fields select { width:100%; margin-top:4px; }
.siged-access-request-actions, .siged-access-bulk-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:13px; }
@media (max-width:640px) { .siged-account-overlay{padding:8px}.siged-account-card{padding:22px 16px;border-radius:17px}.siged-account-grid{grid-template-columns:1fr}.siged-account-wide{grid-column:auto}.siged-access-summary{grid-template-columns:1fr}.siged-access-request-fields{grid-template-columns:1fr}.siged-access-request-fields label:last-child{grid-column:auto}.siged-access-request-actions button,.siged-access-bulk-actions button{width:100%} }
label { color:#2c2c2c; letter-spacing:.01em; }
input, select, textarea { background:rgba(255,255,255,.96); border:2px solid #dedede; border-radius:12px; box-shadow:0 3px 10px rgba(0,0,0,.03); }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 4px rgba(212,175,55,.15); }
.btn, button { background:linear-gradient(135deg, var(--primary2), var(--gold-dark)); color:#fff; border-radius:14px; box-shadow:0 7px 18px rgba(184,139,42,.28); letter-spacing:.01em; }
.btn:hover, button:hover { opacity:.96; transform:translateY(-2px); box-shadow:0 10px 26px rgba(184,139,42,.34); }
.btn.full { padding:16px; font-size:1.04rem; }
.accent { background:linear-gradient(135deg,#d4af37,#b8860b)!important; color:#fff!important; }
.success { background:linear-gradient(135deg,#6c757d,#444b52)!important; color:#fff!important; }
.warning { background:linear-gradient(135deg,#f5a623,#b8860b)!important; color:#fff!important; }
.danger { background:linear-gradient(135deg,#b71c1c,#7f1111)!important; color:#fff!important; }
.sidebar { background:linear-gradient(180deg,#202020,#343434 52%,#1c1c1c); border-right:6px solid var(--primary); box-shadow:8px 0 30px rgba(0,0,0,.18); }
.sidebar-header { padding-top:12px; text-align:center; border-bottom:1px solid rgba(212,175,55,.35); }
.sidebar-header::before { content:''; display:block; width:190px; max-width:92%; height:95px; margin:0 auto 8px; background:url("logo.png") center/contain no-repeat; filter:drop-shadow(0 5px 12px rgba(0,0,0,.35)); }
.sidebar-header h2 { color:#fff; letter-spacing:.08em; text-transform:uppercase; }
.user-badge { background:rgba(212,175,55,.18); border-top:1px solid rgba(212,175,55,.25); border-bottom:1px solid rgba(212,175,55,.25); }
.nav-item { border-radius:12px; border:1px solid transparent; transition:.18s ease; }
.nav-item:hover { background:rgba(212,175,55,.14); border-color:rgba(212,175,55,.25); transform:translateX(3px); }
.nav-item.active { background:linear-gradient(135deg,rgba(212,175,55,.95),rgba(184,134,11,.92)); color:#fff; box-shadow:0 8px 20px rgba(0,0,0,.20); }
.main { background:linear-gradient(0deg, rgba(255,255,255,.92), rgba(255,255,255,.92)), url("logo1.jpg") center/cover fixed no-repeat; }
.topbar { background:rgba(255,255,255,.94); border-bottom:4px solid var(--primary); backdrop-filter:blur(8px); box-shadow:0 8px 24px rgba(0,0,0,.08); }
.topbar h2 { color:#111; letter-spacing:.01em; }
.content { padding:24px; }
.card { background:rgba(255,255,255,.95); border:1px solid rgba(184,139,42,.20); border-radius:18px; box-shadow:0 12px 32px rgba(0,0,0,.10); }
.card h3 { color:#111; }
table { border-radius:14px; overflow:hidden; border:1px solid rgba(184,139,42,.18); }
th { background:linear-gradient(135deg,#343434,#565656)!important; color:#fff!important; }
tr:nth-child(even) td { background:rgba(212,175,55,.045); }
.connection-status.online, .online { background:rgba(212,175,55,.18); color:#6d4f06; border:1px solid rgba(212,175,55,.30); }
.connection-status.offline, .offline { background:#fde2e2; color:#8b1111; border:1px solid #f3b3b3; }
.offline-banner { background:linear-gradient(135deg,#b71c1c,#7f1111); }
.hint { color:var(--muted); }
@media (max-width:760px) { .login-screen { padding:16px; } .login-box { border-radius:18px; } .sidebar-header::before { width:150px; height:72px; } .content { padding:14px; } }

/* ============================================================
   PANTALLA DE CARGA GLOBAL SIGED
   Muestra mensajes durante acciones pesadas sin cambiar lógica del sistema.
   ============================================================ */
.siged-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(8,15,24,.18);
  -webkit-backdrop-filter: blur(1.5px);
  backdrop-filter: blur(1.5px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .22s ease,visibility 0s linear .22s;
}

.siged-loading-overlay.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.siged-loading-card {
  width: min(92vw, 380px);
  background: rgba(255,255,255,.96);
  color: #1f2328;
  border-radius: 22px;
  padding: 26px 22px;
  text-align: center;
  border: 1px solid rgba(212,175,55,.55);
  border-top: 7px solid var(--primary);
  box-shadow: 0 22px 60px rgba(0,0,0,.30);
  opacity: .98;
  transform: translateY(7px) scale(.985);
  transition: transform .24s ease,opacity .24s ease;
}

.siged-loading-overlay.show .siged-loading-card {
  opacity: 1;
  transform: translateY(0) scale(1);
}

@media (pointer:coarse) {
  .siged-loading-overlay {
    background: rgba(8,15,24,.13);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@media (prefers-reduced-motion:reduce) {
  .siged-loading-overlay,.siged-loading-card { transition:none; }
}

.dark-mode .siged-loading-card {
  background: rgba(31,31,31,.96);
  color: #f7f7f7;
}

.siged-loading-spinner {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  border: 5px solid rgba(212,175,55,.23);
  border-top-color: var(--primary2);
  margin: 0 auto 15px;
  animation: sigedSpin .85s linear infinite;
}

.siged-loading-title {
  font-weight: 900;
  font-size: 1.08rem;
  margin-bottom: 6px;
}

.siged-loading-subtitle {
  color: var(--muted);
  font-weight: 700;
  font-size: .88rem;
  line-height: 1.35;
}

.siged-loading-dots::after {
  content: '';
  animation: sigedDots 1.2s steps(4, end) infinite;
}

body.siged-busy {
  cursor: progress;
}


/* Indicador pequeño para login, cambios de módulo y actualización de información.
   No bloquea toda la pantalla; solo avisa que el sistema está actualizando. */
.siged-mini-status {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99998;
  display: none;
  align-items: center;
  gap: 9px;
  max-width: min(88vw, 340px);
  padding: 11px 14px;
  border-radius: 999px;
  background: rgba(36,36,36,.92);
  color: #fff;
  border: 1px solid rgba(212,175,55,.55);
  box-shadow: 0 12px 34px rgba(0,0,0,.24);
  font-weight: 900;
  font-size: .86rem;
  backdrop-filter: blur(8px);
}

.siged-mini-status.show {
  display: flex;
}

.siged-mini-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--primary2);
  box-shadow: 0 0 0 0 rgba(212,175,55,.65);
  animation: sigedPulseMini 1.15s infinite;
  flex-shrink: 0;
}

@keyframes sigedPulseMini {
  0% { box-shadow: 0 0 0 0 rgba(212,175,55,.65); transform: scale(.95); }
  70% { box-shadow: 0 0 0 10px rgba(212,175,55,0); transform: scale(1); }
  100% { box-shadow: 0 0 0 0 rgba(212,175,55,0); transform: scale(.95); }
}



/* ============================================================
   MEJORAS UX SIGED: TOASTS, CONFIRMACIÓN, RESUMEN, FILTROS RÁPIDOS
   ============================================================ */
.siged-toast-stack {
  position: fixed;
  right: 18px;
  top: 18px;
  z-index: 100000;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(92vw, 380px);
  pointer-events: none;
}

.siged-toast {
  pointer-events: auto;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: start;
  gap: 10px;
  background: rgba(255,255,255,.96);
  color: #1f2328;
  border-radius: 16px;
  padding: 13px 14px;
  border: 1px solid rgba(212,175,55,.45);
  border-left: 6px solid var(--primary2);
  box-shadow: 0 14px 34px rgba(0,0,0,.18);
  animation: sigedToastIn .22s ease both;
  backdrop-filter: blur(8px);
}

.dark-mode .siged-toast { background: rgba(31,31,31,.97); color: #f7f7f7; }
.siged-toast.success { border-left-color: #27ae60; }
.siged-toast.error { border-left-color: #b71c1c; }
.siged-toast.warning { border-left-color: #f5a623; }
.siged-toast.info { border-left-color: var(--primary2); }
.siged-toast-icon { font-size: 1.1rem; line-height: 1.2; }
.siged-toast-title { font-weight: 900; margin-bottom: 2px; }
.siged-toast-message { font-weight: 650; color: var(--muted); white-space: pre-line; line-height: 1.25; font-size: .9rem; }
.siged-toast-close { background: transparent!important; box-shadow: none!important; color: var(--muted)!important; padding: 0 3px!important; border-radius: 8px!important; font-size: 1.1rem!important; }

.siged-confirm-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 18px;
}

.siged-confirm-icon {
  width: 58px;
  height: 58px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  margin: 0 auto 12px;
  background: rgba(212,175,55,.18);
  border: 1px solid rgba(212,175,55,.45);
  font-size: 1.7rem;
}

.siged-progress-wrap {
  margin-top: 15px;
  display: none;
  text-align: left;
}

.siged-progress-wrap.show { display: block; }

.siged-progress-track {
  width: 100%;
  height: 9px;
  background: rgba(127,127,127,.16);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 10px;
  border: 1px solid rgba(212,175,55,.22);
}

.siged-progress-bar {
  width: 0%;
  height: 100%;
  background: linear-gradient(135deg, var(--primary2), var(--gold-dark));
  transition: width .26s ease;
}

.siged-progress-steps {
  display: grid;
  gap: 5px;
  font-size: .82rem;
  font-weight: 800;
  color: var(--muted);
}

.siged-progress-step.done { color: #277a3e; }
.siged-progress-step.active { color: var(--primary); }

.siged-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.siged-summary-card {
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(246,232,186,.45));
  border: 1px solid rgba(184,139,42,.22);
  border-radius: 16px;
  padding: 13px;
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
}

.siged-summary-number {
  font-size: 1.55rem;
  font-weight: 950;
  color: var(--primary);
  line-height: 1;
}

.siged-summary-label {
  color: var(--muted);
  font-weight: 850;
  font-size: .82rem;
  margin-top: 4px;
}

.siged-quick-filters {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  margin: 8px 0 12px;
}

.siged-chip {
  border: 1px solid rgba(184,139,42,.28)!important;
  background: rgba(255,255,255,.88)!important;
  color: #333!important;
  box-shadow: 0 4px 12px rgba(0,0,0,.06)!important;
  padding: 7px 11px!important;
  border-radius: 999px!important;
  font-size: .78rem!important;
}

.siged-chip.active {
  background: linear-gradient(135deg, var(--primary2), var(--gold-dark))!important;
  color: #fff!important;
}

.siged-timeline {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  text-align: left;
}

.siged-timeline-item {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 10px;
  align-items: start;
}

.siged-timeline-dot {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(212,175,55,.18);
  border: 1px solid rgba(212,175,55,.38);
  font-size: .82rem;
  font-weight: 900;
}

.siged-timeline-body {
  border: 1px solid var(--border);
  background: var(--input);
  border-radius: 14px;
  padding: 10px;
}

.siged-timeline-title { font-weight: 900; }
.siged-timeline-meta { color: var(--muted); font-size: .82rem; margin-top: 2px; }

.nav-item.siged-new-pulse {
  animation: sigedNewPulse 1.05s ease-in-out 0s 4;
}

.siged-retry-box {
  border: 2px solid rgba(183,28,28,.30);
  background: rgba(253,226,226,.68);
}

@keyframes sigedToastIn {
  from { opacity: 0; transform: translateY(-8px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes sigedNewPulse {
  0%, 100% { box-shadow: none; }
  50% { box-shadow: 0 0 0 4px rgba(212,175,55,.35), 0 0 22px rgba(212,175,55,.38); }
}
@keyframes sigedSpin {
  to { transform: rotate(360deg); }
}

@keyframes sigedDots {
  0% { content: ''; }
  25% { content: '.'; }
  50% { content: '..'; }
  75%, 100% { content: '...'; }
}



/* ============================================================
   OPTIMIZACIÓN RESPONSIVA SIGED - MÓVIL / TABLET / KIOSCO
   Mantiene el diseño institucional y mejora la usabilidad táctil.
   ============================================================ */
:root { --tap-size: 44px; }

html {
  min-height: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-font-smoothing: antialiased;
}

.app { min-height: 100dvh; }

button,
.btn,
.nav-item,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

button,
.btn,
.nav-item,
.icon-btn {
  min-height: var(--tap-size);
}

input,
select,
textarea {
  font-size: 16px;
}

.sidebar {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.sidebar::-webkit-scrollbar { display: none; }

.main {
  min-width: 0;
  min-height: 100dvh;
}

.topbar {
  position: sticky;
  top: 0;
  z-index: 90;
  padding-top: calc(12px + env(safe-area-inset-top));
}

.content,
.table-wrap,
.chat-container,
.check-list {
  -webkit-overflow-scrolling: touch;
}

.table-wrap {
  border-radius: 14px;
  max-width: 100%;
}

.table-wrap table {
  min-width: 760px;
}

.modal-overlay {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.modal-box {
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.siged-loading-overlay {
  padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
}

.siged-loading-card {
  width: min(440px, calc(100vw - 28px));
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
}

.siged-toast-stack {
  max-width: min(420px, calc(100vw - 24px));
}

.siged-toast {
  width: 100%;
}

@media (pointer: coarse) {
  .btn:hover,
  button:hover,
  .nav-item:hover {
    transform: none;
  }
}

@media (min-width: 851px) and (max-width: 1180px) {
  .sidebar { width: 250px; }
  .sidebar-header::before { width: 160px; height: 78px; }
  .content { padding: 18px; }
  .grid-2 { grid-template-columns: 1fr; }
  .siged-summary-grid { grid-template-columns: repeat(3, 1fr); }
  .folder-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
  .topbar h2 { font-size: 1.08rem; }
}

@media (max-width: 850px) {
  /* El cajón móvil queda por encima del contenido sin fondo desenfocado. Las
     capas con backdrop-filter bloquean los toques en algunas tablets Android. */
  body.sidebar-open::after { content: none; }

  .siged-sidebar-backdrop {
    display: none !important;
    pointer-events: none !important;
  }

  .sidebar {
    width: min(86vw, 320px);
    left: calc(-1 * min(86vw, 320px));
    z-index: 1001;
    padding-bottom: calc(20px + env(safe-area-inset-bottom));
  }

  .sidebar.open { left: 0; }

  .sidebar-header::before { width: 150px; height: 70px; }

  .main { width: 100%; }

  .topbar {
    gap: 8px;
    padding: calc(10px + env(safe-area-inset-top)) 10px 10px;
  }

  .topbar h2 {
    min-width: 0;
    flex: 1;
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .topbar-actions {
    gap: 4px;
    flex-shrink: 0;
  }

  .icon-btn {
    min-width: var(--tap-size);
    padding: 6px 8px;
    font-size: 1.08rem;
  }

  .content {
    padding: 12px;
    padding-bottom: calc(18px + env(safe-area-inset-bottom));
  }

  .card {
    padding: 14px;
    border-radius: 16px;
    margin-bottom: 14px;
  }

  .card h3 { font-size: 1rem; }

  .grid-2 { grid-template-columns: 1fr; gap: 12px; }

  .filtros {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }

  .filtros input,
  .filtros select,
  .filtros button {
    width: 100%;
    min-width: 0;
  }

  .check-list {
    max-height: 240px;
  }

  .file-upload-area {
    padding: 16px 12px;
  }

  .folder-grid {
    grid-template-columns: 1fr;
  }

  .folder-card {
    padding: 12px;
  }

  .ticket-actions {
    gap: 6px;
  }

  .ticket-actions .small,
  .folder-card .small {
    min-height: 40px;
  }

  .modal-overlay {
    align-items: flex-start;
    padding: calc(14px + env(safe-area-inset-top)) 12px calc(14px + env(safe-area-inset-bottom));
  }

  .modal-box {
    border-radius: 18px;
    padding: 16px;
    max-width: 100%;
  }

  .siged-summary-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }

  .siged-summary-card {
    padding: 12px 10px;
  }

  .siged-summary-number { font-size: 1.45rem; }
  .siged-summary-label { font-size: .74rem; }

  .siged-quick-filters {
    gap: 6px;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
  }

  .siged-chip {
    flex: 0 0 auto;
    min-height: 38px;
    white-space: nowrap;
  }

  .siged-toast-stack {
    left: 12px;
    right: 12px;
    top: auto;
    bottom: calc(12px + env(safe-area-inset-bottom));
    max-width: none;
  }

  .siged-toast {
    grid-template-columns: 28px 1fr 28px;
    padding: 12px;
  }

  .siged-confirm-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .siged-confirm-actions button {
    width: 100%;
  }
}

@media (max-width: 560px) {
  .login-screen {
    padding: 14px;
    align-items: stretch;
  }

  .login-box {
    align-self: center;
    border-radius: 18px;
    padding: 22px 16px 18px;
    max-width: 100%;
  }

  .login-box::before {
    height: 88px;
    width: min(220px, 88%);
  }

  .login-box h1 {
    font-size: 1.1rem;
  }

  label {
    font-size: .92rem;
  }

  input,
  select,
  textarea {
    padding: 12px 12px;
    border-radius: 12px;
  }

  .btn.full {
    padding: 14px;
  }

  .table-wrap table {
    min-width: 700px;
    font-size: .78rem;
  }

  th,
  td {
    padding: 8px 6px;
  }

  .filtros {
    grid-template-columns: 1fr;
  }

  .siged-summary-grid {
    grid-template-columns: 1fr 1fr;
  }

  .siged-loading-card {
    padding: 18px 14px;
    border-radius: 18px;
  }

  .siged-loading-title {
    font-size: 1rem;
  }

  .siged-loading-subtitle {
    font-size: .86rem;
  }
}

@media (max-width: 380px) {
  .topbar h2 { font-size: .92rem; }
  .icon-btn { min-width: 40px; padding: 5px; }
  .siged-summary-grid { grid-template-columns: 1fr; }
  .siged-chip { font-size: .74rem!important; padding: 7px 9px!important; }
}


/* ============================================================
MEJORAS EXTRA SIGED: TOUCH, OFFLINE LIGERO, PLANTILLAS,
EXPEDIENTES POR AÑO/MES Y VISTA PREVIA PDF
============================================================ */
.touch-action-row, .siged-touch-actions {
display: flex;
gap: 10px;
flex-wrap: wrap;
align-items: center;
}

.siged-touch-actions button,
.touch-action-row button,
.ticket-actions button,
.folder-card button,
.filtros button,
.topbar-actions button {
min-height: 42px;
min-width: 42px;
touch-action: manipulation;
}

@media (pointer: coarse) {
.btn, button, .btn.small, button.small {
min-height: 46px;
padding: 12px 15px;
font-size: .94rem;
}

.nav-item {
min-height: 52px;
}

.ticket-actions {
gap: 8px;
}

.ticket-actions .small {
flex: 1 1 118px;
}
}

.siged-template-panel,
.siged-expediente-panel,
.siged-offline-panel {
background: linear-gradient(135deg, rgba(212,175,55,.11), rgba(108,117,125,.07));
border: 1px solid rgba(184,139,42,.24);
border-radius: 16px;
padding: 12px;
margin: 12px 0;
}

.siged-template-buttons,
.siged-suggestion-buttons,
.siged-expediente-buttons {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin-top: 8px;
}

.siged-chip {
border-radius: 999px !important;
font-size: .82rem !important;
padding: 8px 12px !important;
min-height: 38px !important;
}

.siged-offline-note {
display: none;
background: #fff8e1;
color: #6d4f06;
border: 1px solid rgba(212,175,55,.45);
border-radius: 12px;
padding: 9px 12px;
font-weight: 800;
margin: 10px 0;
}

body.siged-offline-cache .siged-offline-note {
display: block;
}

@media (max-width: 760px) {
.siged-desktop-label {
display: none;
}

.siged-template-buttons button,
.siged-suggestion-buttons button,
.siged-expediente-buttons button {
width: 100%;
}

.topbar-actions {
gap: 4px;
}
}


/* ============================================================
FIX SIGED - SCROLL PC/TABLET/MÓVIL + TABLAS
Evita que el dashboard quede sin deslizamiento y fuerza el scroll
dentro del área de contenido, no en toda la ventana.
============================================================ */
html, body {
width: 100%;
max-width: 100%;
}

body {
overflow-x: hidden !important;
overflow-y: auto;
}

/* ============================================================
ACCESO RESPONSIVO SIN RECORTES
El formulario puede crecer al habilitar Google, recuperación y
registro. El propio acceso conserva scroll y centra la tarjeta
solamente cuando cabe completa en la ventana.
============================================================ */
.login-screen {
width: 100%;
height: 100dvh;
min-height: 100dvh;
overflow-x: hidden !important;
overflow-y: auto !important;
align-items: flex-start !important;
overscroll-behavior-y: contain;
-webkit-overflow-scrolling: touch;
scrollbar-gutter: stable;
padding:
max(24px, env(safe-area-inset-top))
max(24px, env(safe-area-inset-right))
max(24px, env(safe-area-inset-bottom))
max(24px, env(safe-area-inset-left));
}

body.siged-staging .login-screen {
height: calc(100dvh - 30px);
min-height: calc(100dvh - 30px);
}

.login-screen .login-box {
flex: 0 0 auto;
margin-block: auto;
margin-inline: 0;
}

@media (max-height: 900px) {
.login-screen {
padding-top: max(12px, env(safe-area-inset-top));
padding-bottom: max(16px, env(safe-area-inset-bottom));
}

.login-screen .login-box {
padding: 18px 22px 16px;
border-radius: 18px;
}

.login-screen .login-box::before {
width: min(210px, 78%);
height: 76px;
margin-bottom: 2px;
}

.login-screen .login-box h1 {
margin-bottom: 5px;
font-size: 1.15rem;
}

.login-screen .login-box h1::after {
margin-top: 3px;
font-size: .72rem;
}

.login-screen .login-box > label:not(.siged-login-remember) {
margin: 7px 0 4px;
}

.login-screen .login-box > input,
.login-screen .login-box > select,
.login-screen .siged-login-password-wrap input {
margin-bottom: 3px;
padding: 10px 12px;
}

.login-screen .siged-login-remember {
margin-top: 7px;
font-size: .84rem;
}

.login-screen .siged-password-manager-hint {
margin: 2px 0 7px;
font-size: .74rem;
}

.login-screen .btn.full {
margin-top: 7px;
padding: 11px;
}

.login-screen .siged-login-divider {
margin: 7px 0;
}

.login-screen .siged-account-entry-actions {
margin: 7px 0 2px;
}

.login-screen .login-box > .hint {
margin-top: 8px !important;
font-size: .74rem;
}
}

@media (max-width: 560px) {
.login-screen {
padding-right: max(12px, env(safe-area-inset-right));
padding-left: max(12px, env(safe-area-inset-left));
}

.login-screen .login-box {
align-self: auto;
margin-block: auto;
}
}

.app {
height: 100dvh !important;
min-height: 100dvh !important;
max-height: 100dvh !important;
overflow: hidden !important;
align-items: stretch;
}

.main {
height: 100dvh !important;
min-height: 0 !important;
max-height: 100dvh !important;
overflow: hidden !important;
}

.content {
flex: 1 1 auto !important;
min-height: 0 !important;
height: auto !important;
overflow-y: auto !important;
overflow-x: hidden !important;
-webkit-overflow-scrolling: touch !important;
overscroll-behavior-y: contain;
touch-action: pan-y;
}

.sidebar {
height: 100dvh;
max-height: 100dvh;
overflow-y: auto !important;
-webkit-overflow-scrolling: touch !important;
}

.table-wrap {
max-width: 100%;
overflow-x: auto !important;
overflow-y: visible !important;
-webkit-overflow-scrolling: touch !important;
touch-action: pan-x pan-y;
}

.visitas-table-wrap,.alm-table-wrap,.inventario-table-wrap,.vehiculos-table-wrap,
.rrhh-table-wrap,.pre-table-wrap,.cpsp-table-wrap,.ali-table-wrap,.od-table-wrap,.med-table-wrap {
max-width: 100%;
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important;
touch-action: pan-x pan-y !important;
}

.modal-box,
.siged-loading-card {
touch-action: pan-y;
}

.siged-limit-info {
border: 1px solid rgba(212,175,55,.28);
background: rgba(212,175,55,.08);
border-radius: 12px;
padding: 8px 10px;
margin: 8px 0 10px;
}

@media (max-width: 850px) {
.app,
.main {
height: 100dvh !important;
min-height: 100dvh !important;
}

.content {
padding-bottom: calc(24px + env(safe-area-inset-bottom)) !important;
}

.sidebar {
height: 100dvh;
max-height: 100dvh;
}
}

@media (max-width: 760px), (orientation: portrait) and (min-width: 761px) and (max-width: 1024px) {
table.siged-responsive-table {
width: 100% !important;
min-width: 0 !important;
border-collapse: separate;
border-spacing: 0 10px;
}

table.siged-responsive-table thead {
position: absolute !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
white-space: nowrap !important;
}
table.siged-responsive-table tbody,
table.siged-responsive-table tr,
table.siged-responsive-table td {
display: block;
width: 100% !important;
}
table.siged-responsive-table tbody tr {
padding: 6px 10px;
background: var(--card);
border: 1px solid var(--border);
border-radius: 14px;
box-shadow: 0 5px 14px var(--shadow);
}
table.siged-responsive-table tbody td {
display: grid;
grid-template-columns: minmax(104px,.8fr) minmax(0,1.35fr);
gap: 10px;
align-items: start;
padding: 9px 4px !important;
border: 0 !important;
border-bottom: 1px solid var(--border) !important;
overflow-wrap: anywhere;
white-space: normal !important;
}
table.siged-responsive-table tbody td:last-child { border-bottom: 0 !important; }
table.siged-responsive-table tbody td::before {
content: attr(data-label);
color: var(--muted);
font-size: .76rem;
font-weight: 900;
letter-spacing: .025em;
text-transform: uppercase;
}
table.siged-responsive-table tbody td[data-label=""]::before { display: none; }
table.siged-responsive-table tbody td[colspan] { display: block; }
}

@media (orientation: portrait) and (min-width: 761px) and (max-width: 1024px) {
  .content { padding:14px !important; }
  .card { max-width:100%; }
  .siged-user-form-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .table-wrap,.table-responsive { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .modal-box { width:min(92vw,760px); max-height:92dvh; overflow:auto; }
  .topbar { gap:8px; }
  input,select,textarea { font-size:16px; }
}


/* ============================================================
   ÁREA SEGURIDAD · SUPER USUARIO
   Gestión de usuarios y control institucional.
   ============================================================ */
.siged-user-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 10px;
  align-items: end;
}

.siged-user-form-grid label {
  margin: 0 0 4px;
  font-size: .82rem;
}

.siged-user-form-grid input,
.siged-user-form-grid select {
  margin-bottom: 0;
}

.siged-user-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.siged-super-note {
  background: rgba(212,175,55,.12);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 14px;
  padding: 10px 12px;
  font-weight: 800;
  color: #5f4607;
  margin-top: 10px;
}

@media (max-width: 900px) {
  .siged-user-form-grid { grid-template-columns: 1fr; }
}




/* Módulos institucionales visibles para todas las áreas. */
.nav-item.siged-module-locked {
  opacity: .62;
  cursor: not-allowed;
  border-style: dashed;
}
.nav-item.siged-module-locked::after {
  content: '';
  margin-left: auto;
  font-size: .66rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
body.siged-permissions-ready .nav-item.siged-module-locked::after { content: ''; }
/* Seguridad visual: un módulo sin permiso nunca se muestra en el menú, ni durante la carga inicial. */
.nav-item.siged-module-locked,
.nav-item[aria-disabled="true"] { display:none !important; }

.siged-module-emoji { display:inline-grid;place-items:center;width:1.55rem;min-width:1.55rem;font-size:1.12rem;line-height:1;filter:saturate(1.08); }
.nav-item.siged-module-locked:hover {
  transform: none;
  background: rgba(127,127,127,.10);
  border-color: rgba(127,127,127,.22);
}
.nav-item.siged-module-authorized::after {
  content: '✓';
  margin-left: auto;
  opacity: .62;
  font-size: .78rem;
}

/* Área Administrador: oculta módulos operativos y deja solo el panel administrativo */
body.area-administrador .sidebar .nav-item:not([data-module="seguridad"]):not([data-module="directorio"]):not([data-module="autorizaciones_visitas"]):not([data-module="alimentacion"]):not([data-module="visitas"]):not([data-module="vehiculos"]):not([data-module="inventarios"]):not([data-module="almacen"]):not([data-module="rrhh"]):not([data-module="credencializacion"]):not([data-module="medico"]):not([data-module="contratos_psp"]) {
  display: none !important;
}
.siged-nav-section{padding:14px 18px 6px;color:rgba(255,255,255,.58);font-size:.69rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
body.area-administrador.rol-super-usuario #navVisitasSIGED,
body.area-administrador.rol-super-usuario #navVehiculosSIGED,
body.area-administrador.rol-super-usuario #navInventariosSIGED,
body.area-administrador.rol-super-usuario #navAlmacenSIGED,
body.area-administrador.rol-super-usuario #navRRHHSIGED,
body.area-administrador.rol-super-usuario #navCredencializacionSIGED,
body.area-administrador.rol-super-usuario #navMedicoSIGED,
body.area-administrador.rol-super-usuario #navContratosPSP,
body.area-administrador #navDirectorioSIGED {
  display: flex !important;
}
body.area-administrador #navSeguridadSIGED {
  display: flex !important;
}
body.area-administrador .topbar h2::after {
  content: ' · Administrador';
  color: var(--muted);
  font-size: .82rem;
  font-weight: 800;
}
body.area-administrador.rol-super-usuario .topbar h2::after { content: ' · Super usuario'; }
.ticket-maintenance-fields{margin:14px 0;padding:14px;border:1px solid rgba(212,175,55,.45);border-radius:14px;background:rgba(212,175,55,.08)}
.ticket-maintenance-title{font-weight:900;margin-bottom:10px;color:var(--primary)}
.ticket-maintenance-detail{margin-top:9px;padding:8px 10px;border:1px solid rgba(127,127,127,.25);border-radius:10px;background:rgba(127,127,127,.06)}
.ticket-maintenance-detail summary{cursor:pointer;font-weight:800}
.ticket-maintenance-detail>div{margin-top:6px}
.ticket-maintenance-photos{display:flex;gap:8px;flex-wrap:wrap}
.ticket-maintenance-photos a{display:inline-flex;padding:5px 8px;border-radius:8px;background:rgba(18,92,125,.12);font-weight:800;text-decoration:none}
.siged-area-admin-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  align-items: end;
}
.siged-area-admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.visitas-shell { display:grid; gap:16px; }
.visitas-hero {
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding:20px; border-radius:18px; color:#fff;
  background:linear-gradient(135deg,#1a3c5e 0%,#285f88 62%,#b8860b 100%);
  box-shadow:0 14px 32px rgba(26,60,94,.2);
}
.visitas-hero h3 { margin:0 0 5px; font-size:1.4rem; }
.visitas-hero p { margin:0; max-width:720px; opacity:.9; }
.visitas-actions { display:flex; gap:8px; flex-wrap:wrap; }
.visitas-actions button { border:1px solid rgba(255,255,255,.28); }
.visitas-tabs { display:flex; gap:8px; flex-wrap:wrap; }
.visitas-tab {
  border:1px solid var(--border); background:var(--card); color:var(--text);
  border-radius:999px; padding:9px 14px; cursor:pointer; font-weight:700;
}
.visitas-tab.active { background:var(--primary); color:#fff; border-color:var(--primary); }
.visitas-summary { display:grid; grid-template-columns:repeat(5,minmax(130px,1fr)); gap:12px; }
.visitas-stat { background:var(--card); border:1px solid var(--border); border-radius:16px; padding:15px; box-shadow:0 8px 20px var(--shadow); }
.visitas-stat strong { display:block; font-size:1.65rem; color:var(--primary2); }
.visitas-stat span { color:var(--muted); font-size:.84rem; }
.visitas-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.visitas-card { background:var(--card); border:1px solid var(--border); border-radius:16px; padding:18px; box-shadow:0 8px 20px var(--shadow); }
.visitas-card h3 { margin:0 0 12px; }
.visitas-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.visitas-field { display:grid; gap:6px; }
.visitas-field.full { grid-column:1/-1; }
.visitas-field label { font-weight:700; font-size:.88rem; }
.visitas-field input,.visitas-field select,.visitas-field textarea {
  width:100%; border:1px solid var(--border); background:var(--input); color:var(--text);
  border-radius:10px; padding:11px 12px; font-size:.95rem;
}
.visitas-field textarea { min-height:84px; resize:vertical; touch-action:auto; user-select:text; -webkit-user-select:text; }
.visitas-check { display:flex; align-items:flex-start; gap:9px; padding:10px; border:1px solid var(--border); border-radius:10px; background:var(--input); }
.visitas-check input { width:auto; margin-top:3px; }
.visitas-camera { display:grid; gap:10px; text-align:center; }
.visitas-camera video,.visitas-photo-preview {
  width:100%; max-width:420px; min-height:220px; max-height:320px; margin:auto;
  object-fit:cover; border-radius:14px; background:#0b1320; border:1px solid var(--border);
}
.visitas-photo-preview { min-height:0; }
.visitas-signature { width:100%; height:150px; touch-action:none; background:#fff; border:2px dashed #aab6c3; border-radius:12px; }
.visitas-table-wrap { overflow:auto; border:1px solid var(--border); border-radius:12px; }
.visitas-table { width:100%; border-collapse:collapse; min-width:840px; }
.visitas-table th,.visitas-table td { padding:10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
.visitas-table th { background:var(--input); position:sticky; top:0; z-index:1; font-size:.82rem; }
.visitas-table td { font-size:.88rem; }
.visitas-status { display:inline-flex; align-items:center; padding:4px 8px; border-radius:999px; font-size:.75rem; font-weight:800; }
.visitas-status.activo { background:#fff0c2; color:#7a5100; }
.visitas-status.finalizado,.visitas-status.aprobado { background:#d9f7e5; color:#17683b; }
.visitas-status.pendiente,.visitas-status.pendiente_autorizacion { background:#fff0c2; color:#7a5100; }
.visitas-status.cancelado,.visitas-status.denegado,.visitas-status.rechazado { background:#fde2df; color:#912b20; }
.visitas-empty { padding:28px; text-align:center; color:var(--muted); }
.visitas-pagination { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:12px; flex-wrap:wrap; }
.visitas-modal {
  position:fixed; inset:0; z-index:11000; display:flex; align-items:center; justify-content:center;
  padding:18px; background:rgba(6,15,26,.78); backdrop-filter:blur(4px);
}
.visitas-modal-card { width:min(760px,100%); max-height:92vh; overflow:auto; background:var(--card); color:var(--text); border-radius:18px; padding:20px; box-shadow:0 24px 70px rgba(0,0,0,.38); }
.visitas-detail-grid { display:grid; grid-template-columns:180px 1fr; gap:18px; }
.visitas-detail-grid img { width:180px; height:180px; object-fit:cover; border-radius:14px; border:1px solid var(--border); }
.visitas-detail-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 14px; }
.visitas-detail-list p { margin:0; padding-bottom:6px; border-bottom:1px solid var(--border); }
.visitas-destinos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:460px; overflow:auto; }
.visitas-destino { display:flex; justify-content:space-between; gap:8px; align-items:center; border:1px solid var(--border); border-radius:10px; padding:9px; }
body.area-administrador.rol-super-usuario #navVisitasSIGED { display:flex !important; }
@media (max-width:1050px) { .visitas-summary { grid-template-columns:repeat(3,minmax(130px,1fr)); } }
@media (max-width:760px) {
  .visitas-grid,.visitas-form-grid,.visitas-detail-grid { grid-template-columns:1fr; }
  .visitas-summary { grid-template-columns:repeat(2,minmax(120px,1fr)); }
  .visitas-detail-grid img { width:100%; height:auto; max-height:280px; }
  .visitas-detail-list,.visitas-destinos { grid-template-columns:1fr; }
}

/* ============================================================
ADMINISTRADOR SIGED · NAVEGACIÓN SIMPLE POR SECCIONES
============================================================ */
.siged-admin-shell { display:grid; gap:16px; }
.siged-admin-hero {
display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
padding:22px; border-radius:20px; color:#fff;
background:linear-gradient(135deg,#173b50 0%,#1d685c 58%,#a77a10 100%);
box-shadow:0 16px 36px rgba(20,54,65,.20);
}
.siged-admin-hero h3 { margin:4px 0 7px; color:#fff; font-size:clamp(1.35rem,2.2vw,1.85rem); }
.siged-admin-hero p { margin:0; max-width:800px; color:rgba(255,255,255,.88); line-height:1.5; }
.siged-admin-eyebrow { font-size:.72rem; font-weight:950; letter-spacing:.13em; color:#f7d879; }
.siged-admin-refresh { background:rgba(255,255,255,.96)!important; color:#173b50!important; box-shadow:none!important; white-space:nowrap; }
.siged-admin-nav {
position:relative; z-index:1; display:flex; gap:7px; overflow-x:auto;
padding:8px; border:1px solid rgba(184,139,42,.22); border-radius:17px;
background:rgba(255,255,255,.94); box-shadow:0 8px 24px rgba(0,0,0,.09);
backdrop-filter:blur(12px); scrollbar-width:thin;
}
.siged-admin-nav button {
display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:max-content;
padding:10px 13px; border:1px solid transparent; border-radius:12px;
background:transparent!important; color:#3b434a!important; box-shadow:none!important; font-weight:850;
}
.siged-admin-nav button:hover { transform:none; background:rgba(184,139,42,.09)!important; }
.siged-admin-nav button.active { background:linear-gradient(135deg,#1b665a,#164d68)!important; color:#fff!important; }
.siged-admin-nav button b { min-width:21px; padding:2px 6px; border-radius:999px; background:#b71c1c; color:#fff; font-size:.72rem; }
.siged-admin-section { display:grid; gap:15px; min-width:0; }
.siged-admin-section[hidden] { display:none!important; }
.siged-admin-section-heading {
display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap;
padding:3px 4px;
}
.siged-admin-section-heading h3 { margin:0 0 3px; font-size:1.28rem; }
.siged-admin-section-heading p { margin:0; color:var(--muted); }
.siged-admin-section-actions,.siged-admin-card-heading { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.siged-admin-card-heading { justify-content:space-between; align-items:flex-start; }
.siged-admin-card-heading h3,.siged-admin-card-heading p { margin-top:0; }
.siged-admin-overview { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.siged-admin-overview > div {
padding:17px; border-radius:17px; background:var(--card); border:1px solid rgba(184,139,42,.22);
box-shadow:0 8px 20px rgba(0,0,0,.07);
}
.siged-admin-overview strong { display:block; color:#176357; font-size:1.75rem; line-height:1; font-variant-numeric:tabular-nums; }
.siged-admin-overview span { display:block; margin-top:6px; color:var(--muted); font-size:.84rem; font-weight:800; }
.siged-admin-task-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.siged-admin-task-grid button {
display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:10px;
padding:15px; text-align:left; color:var(--text)!important; background:var(--card)!important;
border:1px solid var(--border); box-shadow:0 8px 20px rgba(0,0,0,.07)!important;
}
.siged-admin-task-grid button:hover { transform:translateY(-2px); border-color:var(--primary); }
.siged-admin-task-grid button > span { grid-row:1/3; font-size:1.45rem; }
.siged-admin-task-grid button strong { align-self:end; overflow-wrap:anywhere; }
.siged-admin-task-grid button small { color:var(--muted); font-weight:700; }
.siged-admin-task-grid button.attention { border-color:rgba(183,28,28,.35); background:linear-gradient(135deg,#fff,#fff1ef)!important; }
.siged-admin-editor { border:1px solid rgba(184,139,42,.28); border-radius:17px; background:var(--card); overflow:hidden; }
.siged-admin-editor > summary { cursor:pointer; padding:15px 17px; font-weight:900; color:#57400d; list-style-position:inside; }
.siged-admin-editor[open] > summary { border-bottom:1px solid var(--border); background:rgba(212,175,55,.08); }
.siged-admin-editor-body { padding:14px; }
.siged-admin-editor-body > .card { margin:0; box-shadow:none; border:0; padding:4px; background:transparent; }
.siged-admin-toolbar { display:grid; grid-template-columns:minmax(240px,1fr) minmax(150px,220px); gap:10px; margin:13px 0; }
.siged-admin-toolbar label { margin:0; }
.siged-admin-toolbar input,.siged-admin-toolbar select { width:100%; margin-top:5px; }
.siged-admin-count { display:inline-flex; align-items:center; min-height:32px; padding:5px 10px; border-radius:999px; background:rgba(23,99,87,.1); color:#176357; font-weight:850; }
.siged-admin-check { display:flex!important; align-items:center; gap:8px; min-height:46px; }
.siged-admin-check input { width:20px!important; height:20px; margin:0!important; accent-color:var(--primary); }

@media (max-width:1050px) {
.siged-admin-overview,.siged-admin-task-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:850px) {
.siged-admin-nav { margin-inline:-4px; border-radius:14px; }
.siged-admin-nav button { padding:10px 12px; }
.siged-admin-hero { padding:18px; align-items:flex-start; }
.siged-admin-refresh { width:100%; }
.siged-admin-section-heading { align-items:flex-start; }
.siged-admin-section-actions { width:100%; }
.siged-admin-section-actions button { flex:1 1 180px; }
.siged-admin-toolbar { grid-template-columns:1fr; }
}
@media (max-width:560px) {
.siged-admin-overview,.siged-admin-task-grid { grid-template-columns:1fr 1fr; }
.siged-admin-overview > div { padding:13px; }
.siged-admin-overview strong { font-size:1.45rem; }
.siged-admin-task-grid button { grid-template-columns:1fr; grid-template-rows:auto; gap:4px; padding:13px; }
.siged-admin-task-grid button > span { grid-row:auto; }
.siged-admin-card-heading > button { width:100%; }
}
@media (max-width:380px) {
.siged-admin-overview,.siged-admin-task-grid { grid-template-columns:1fr; }
}

/* Barra superior compacta y estable. Evita saltos, textos duplicados y
controles que invaden el contenido al cambiar de módulo. */
.topbar {
min-height:68px;
padding:10px 16px;
justify-content:flex-start;
gap:10px;
overflow:hidden;
}
.topbar > h2 {
flex:1 1 auto;
min-width:110px;
margin:0;
font-size:clamp(1rem,1.6vw,1.22rem);
line-height:1.2;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.topbar-actions {
flex:0 1 auto;
min-width:0;
margin-left:auto;
gap:6px;
overflow-x:auto;
overscroll-behavior-inline:contain;
scrollbar-width:none;
}
.topbar-actions::-webkit-scrollbar { display:none; }
.topbar-actions .icon-btn,
#btnReporteMensualSIGED {
width:auto!important;
min-width:auto;
min-height:38px;
padding:8px 11px!important;
border:1px solid rgba(184,139,42,.16);
border-radius:12px;
font-size:.82rem!important;
line-height:1.1;
white-space:nowrap;
box-shadow:0 5px 14px rgba(0,0,0,.06);
}
#btnReporteMensualSIGED {
color:#173b50!important;
background:linear-gradient(180deg,#fff,#f6f3eb)!important;
font-weight:850;
}
.topbar-actions > * { flex:0 0 auto; }
.topbar-actions .siged-sync-indicator,
.topbar-actions .siged-session-indicator {
min-height:34px;
border-radius:999px;
box-shadow:none;
}
.topbar-actions .connection-status,
.topbar-actions .siged-version-chip {
flex:0 0 auto;
min-height:30px;
display:inline-flex;
align-items:center;
padding:5px 9px;
font-size:.72rem;
}

@media (max-width:1180px) {
#btnReporteMensualSIGED { display:none!important; }
.topbar-actions .siged-version-chip { display:none!important; }
}
@media (max-width:850px) {
.topbar { min-height:62px; padding:calc(8px + env(safe-area-inset-top)) 9px 8px; }
.topbar > h2 { min-width:0; font-size:.96rem; }
.topbar-actions .icon-btn { min-width:40px; padding:8px!important; font-size:0!important; }
.topbar-actions .icon-btn::before { font-size:1rem; line-height:1; }
.topbar-actions button[title*="tema" i]::before { content:'A'; font-weight:900; }
.topbar-actions button[title*="Actualizar" i]::before { content:'\21BB'; font-weight:900; }
#btnPreregistroVisitaSIGED::before { content:'C'; font-weight:900; }
.topbar-actions .connection-status { max-width:74px; overflow:hidden; text-overflow:ellipsis; }
}
@media (max-width:560px) {
.topbar-actions .connection-status { display:none; }
.topbar > h2::after { display:none!important; }
}

/* Filtros de estado de usuarios: evita el selector nativo problemático en móvil. */
.siged-admin-status-filters{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.siged-admin-status-filters button[aria-pressed="true"]{font-weight:800;box-shadow:0 0 0 2px currentColor inset}


/* SIGED UX FINAL · barra superior limpia + iconografía contextual */
.topbar-actions{gap:8px!important}
.topbar-actions .siged-version-chip,#btnReporteMensualSIGED{display:none!important}
.topbar-actions .connection-status{font-weight:850;letter-spacing:.01em}
.topbar-actions .siged-theme-toggle{min-width:auto!important;padding:8px 12px!important}
.siged-session-clock[hidden],.siged-sync-state[hidden]{display:none!important}

.nav-item[data-module]::before{
  width:25px;min-width:25px;text-align:center;margin-right:8px;
  font-size:1.05rem;line-height:1;filter:none!important;opacity:1!important;
}
.nav-item[data-module="oficios"]::before{content:"📨"}
.nav-item[data-module="tickets"]::before{content:"🎫"}
.nav-item[data-module="archivo"]::before{content:"🗂️"}
.nav-item[data-module="chat"]::before{content:"💬"}
.nav-item[data-module="calendario"]::before{content:"📅"}
.nav-item[data-module="autorizaciones_visitas"]::before{content:"🚪"}
.nav-item[data-module="auditoria"]::before{content:"🧾"}
.nav-item[data-module="ajustes"]::before{content:"⚙️"}
.nav-item[data-module="directorio"]::before{content:"👥"}
.nav-item[data-module="salas"]::before{content:"🏛️"}
.nav-item[data-module="alimentacion"]::before{content:"🍽️"}
.nav-item[data-module="seguridad"]::before{content:"🛡️"}
.nav-item[data-module="jefatura"]::before{content:"📊"}
.nav-item[data-module="visitas"]::before{content:"🚪"}
.nav-item[data-module="vehiculos"]::before{content:"🚗"}
.nav-item[data-module="inventarios"]::before{content:"📦"}
.nav-item[data-module="almacen"]::before{content:"🏬"}
.nav-item[data-module="rrhh"]::before{content:"👥"}
.nav-item[data-module="credencializacion"]::before{content:"🪪"}
.nav-item[data-module="control_personal"]::before{content:"🚶"}
.nav-item[data-module="medico"]::before{content:"🩺"}
.nav-item[data-module="contratos_psp"]::before{content:"📑"}


/* ============================================================
   SIGED móvil · oficios, permisos y cabecera compacta 2026-09-24
   ============================================================ */
.oficio-actions{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.oficio-acuse-meta{margin-top:5px;line-height:1.45}
.oficio-firma-mini{max-width:110px;max-height:34px;object-fit:contain;border:1px solid var(--border);border-radius:6px;background:#fff}

.siged-context-menu{display:none;appearance:none;border:0;background:linear-gradient(135deg,var(--primary2),var(--gold-dark));color:#fff;min-width:42px;min-height:42px;padding:6px 10px;border-radius:11px;font-size:1.25rem;font-weight:900;line-height:1;box-shadow:0 4px 12px rgba(0,0,0,.12)}

@media (max-width:850px){
  .main > .topbar{display:none!important}
  .siged-context-menu{display:inline-grid;place-items:center;flex:0 0 auto}
  .content{padding-top:12px!important}
  body.siged-alerta-activa .content{padding-top:calc(12px + var(--siged-alert-height,0px))!important}
  .siged-context-bar{
    position:sticky!important;
    top:var(--siged-alert-height,0px)!important;
    z-index:130!important;
    background:var(--card)!important;
    box-shadow:0 4px 16px rgba(0,0,0,.08)!important;
  }
}

/* SIGED 2026-09-27 · cajón lateral de altura completa.
   En ambiente DEV/STAGING existía una reserva superior de 30 px para la
   etiqueta de entorno. En tablet esa reserva dejaba una franja blanca y,
   combinada con 100dvh, empujaba el final del menú fuera de la pantalla. */
@media (max-width:850px){
  body .sidebar,
  body.siged-staging .sidebar,
  body.siged-development .sidebar{
    position:fixed!important;
    top:0!important;
    bottom:0!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    box-sizing:border-box!important;
    padding-top:max(18px,env(safe-area-inset-top,0px))!important;
    padding-bottom:max(20px,env(safe-area-inset-bottom,0px))!important;
    overflow-y:auto!important;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch!important;
  }
}

@media (max-width:760px){
  .oficios-bandejas .table-wrap{overflow-x:hidden!important;touch-action:pan-y!important}
  .oficios-bandejas table.siged-responsive-table tbody td{
    grid-template-columns:minmax(82px,.7fr) minmax(0,1.65fr)!important;
  }
  .oficios-bandejas table.siged-responsive-table tbody td[data-label="Acciones"]{
    display:block!important;
    width:100%!important;
  }
  .oficios-bandejas table.siged-responsive-table tbody td[data-label="Acciones"]::before{
    display:block!important;
    margin-bottom:8px;
  }
  .oficio-actions{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
  .oficio-actions button{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:9px 7px!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
  }
  .oficio-acuse-meta{width:100%;margin-top:10px;overflow-wrap:anywhere}
  .acuse-code{max-width:100%;white-space:normal;overflow-wrap:anywhere}

  table.siged-permission-matrix{width:100%!important;min-width:0!important;border-collapse:separate!important;border-spacing:0 10px!important}
  table.siged-permission-matrix thead{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
  table.siged-permission-matrix tbody,table.siged-permission-matrix tr,table.siged-permission-matrix td{display:block!important;width:100%!important}
  table.siged-permission-matrix tbody tr{padding:9px 11px;background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 12px var(--shadow);opacity:1!important}
  table.siged-permission-matrix tbody td{display:grid!important;grid-template-columns:minmax(105px,.9fr) minmax(0,1.1fr)!important;gap:10px;align-items:center;padding:9px 2px!important;border:0!important;border-bottom:1px solid var(--border)!important;white-space:normal!important;overflow-wrap:anywhere}
  table.siged-permission-matrix tbody td:last-child{border-bottom:0!important}
  table.siged-permission-matrix tbody td::before{content:attr(data-label);color:var(--muted);font-size:.74rem;font-weight:900;text-transform:uppercase}
  table.siged-permission-matrix input[type="checkbox"]{justify-self:end;transform:scale(1.08)}
  table.siged-permission-matrix input[type="datetime-local"]{min-width:0!important;width:100%!important}
  .modal-box:has(table.siged-permission-matrix){padding:14px!important;max-width:calc(100vw - 18px)!important}
}

/* ============================================================
   SIGED · menú lateral plegable 2026-09-29
   ============================================================ */
.sidebar-header{position:relative}
.siged-sidebar-collapse,.siged-sidebar-restore{display:none}

@media (min-width:851px){
  #sidebar{
    transition:width .24s ease,opacity .18s ease,transform .24s ease,padding .24s ease,border-width .24s ease,box-shadow .24s ease;
    will-change:width,transform,opacity;
  }
  .siged-sidebar-collapse{
    position:absolute;
    top:2px;
    right:8px;
    z-index:3;
    display:grid;
    place-items:center;
    width:38px;
    min-width:38px;
    height:38px;
    min-height:38px;
    padding:0;
    border:1px solid rgba(255,255,255,.28);
    border-radius:12px;
    background:rgba(0,0,0,.28);
    color:#fff;
    font-size:1.8rem;
    line-height:1;
    box-shadow:0 5px 14px rgba(0,0,0,.18);
  }
  .siged-sidebar-collapse:hover{background:rgba(212,175,55,.3)}
  body.siged-sidebar-collapsed #sidebar{
    width:0!important;
    min-width:0!important;
    padding-left:0!important;
    padding-right:0!important;
    border-right-width:0!important;
    box-shadow:none!important;
    opacity:0;
    transform:translateX(-100%);
    pointer-events:none;
    overflow:hidden!important;
  }
  body.siged-sidebar-collapsed .siged-sidebar-restore{
    display:inline-grid;
    place-items:center;
    flex:0 0 auto;
    background:linear-gradient(135deg,var(--primary2),var(--gold-dark));
    color:#fff;
    border:0;
    box-shadow:0 5px 15px rgba(0,0,0,.16);
  }
  body.siged-sidebar-collapsed .main{width:100%}
}

@media (max-width:850px){
  .siged-sidebar-collapse,.siged-sidebar-restore{display:none!important}
  body.siged-sidebar-collapsed #sidebar{visibility:visible;pointer-events:auto}
}

@media (prefers-reduced-motion:reduce){
  #sidebar{transition:none!important}
}


/* ============================================================
   SIGED móvil v3 · cabecera fija, safe-area y Oficios enviados
   2026-09-24
   ============================================================ */
:root{--siged-safe-top:env(safe-area-inset-top,0px);--siged-mobile-context-height:72px}
@media (max-width:850px){
  html,body{max-width:100%;overflow-x:hidden!important}
  #moduleContent{max-width:100%;overflow-x:hidden!important}
  .main>.topbar{display:none!important}

  /* La barra del módulo queda siempre fija en Android/iPhone. En iPhone respeta
     la isla/notch mediante safe-area y baja automáticamente si hay una alerta. */
  .siged-context-bar{
    position:fixed!important;
    top:calc(var(--siged-safe-top) + var(--siged-alert-height,0px))!important;
    left:8px!important;
    right:8px!important;
    width:auto!important;
    min-height:var(--siged-mobile-context-height)!important;
    margin:0!important;
    z-index:900!important;
    background:color-mix(in srgb,var(--card) 97%,var(--primary) 3%)!important;
    border:1px solid var(--border)!important;
    border-radius:0 0 15px 15px!important;
    box-shadow:0 7px 20px rgba(0,0,0,.12)!important;
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }
  .siged-context-bar .siged-breadcrumb{flex:1 1 auto;justify-content:center;min-width:0}
  .siged-context-bar .siged-breadcrumb strong{max-width:100%;text-align:center}
  .siged-context-menu,.siged-context-more{flex:0 0 auto!important}

  /* Reserva física para la barra fija; ya no cubre botones ni contenido al
     desplazarse. El alto de una alerta se suma en tiempo real. */
  .content{
    padding-top:calc(var(--siged-safe-top) + var(--siged-alert-height,0px) + var(--siged-mobile-context-height) + 12px)!important;
    scroll-padding-top:calc(var(--siged-safe-top) + var(--siged-alert-height,0px) + var(--siged-mobile-context-height) + 12px)!important;
  }
  body.siged-alerta-activa .content{
    padding-top:calc(var(--siged-safe-top) + var(--siged-alert-height,0px) + var(--siged-mobile-context-height) + 12px)!important;
  }
}

@media (max-width:760px){
  /* Historial de envíos: el contenido jamás ensancha la página. Las acciones
     se apilan a ancho completo para que Ver/Historial/Acuse/Eliminar no queden
     cortadas a la derecha. La bandeja recibida conserva su distribución actual. */
  #tablaSalida,
  #tablaSalida .table-wrap,
  #tablaSalida table.siged-responsive-table,
  #tablaSalida table.siged-responsive-table tbody,
  #tablaSalida table.siged-responsive-table tr,
  #tablaSalida table.siged-responsive-table td{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
  }
  #tablaSalida{contain:inline-size;overflow:hidden!important}
  #tablaSalida table.oficios-table-salida{display:block!important;border-spacing:0 10px!important}
  #tablaSalida table.oficios-table-salida tbody tr{display:block!important;margin:0!important;padding:8px!important}
  #tablaSalida table.oficios-table-salida tbody td{display:grid!important;grid-template-columns:minmax(82px,.7fr) minmax(0,1.65fr)!important;gap:10px!important;padding:9px 4px!important}
  #tablaSalida table.siged-responsive-table tbody td[data-label="Acciones"]{
    display:block!important;
    padding-inline:4px!important;
  }
  #tablaSalida .oficio-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
  }
  #tablaSalida .oficio-actions button{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    box-sizing:border-box!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}