:root{--azul-profundo:#12314e;--turquesa:#176a7c;--dorado:#d7a745;--crema:#f7f2e9;--tinta:#243746;--atenuado:#6d7c87;--linea:#dce4e8;--blanco:#fff;--rojo:#a51f2d;--ambar:#a66d14;--azul:#16859e;--sombra:0 14px 35px rgba(18,49,78,.10)}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--tinta);background:#f4f6f4}
a{color:inherit}
button,input,select,textarea{font:inherit}
.barra-demo{height:30px;background:#c9a75f;color:#24372f;font-size:11px;font-weight:800;letter-spacing:.08em;text-align:center;padding:8px}
.estructura-aplicacion{min-height:calc(100vh - 30px);display:grid;grid-template-columns:250px 1fr}
.barra-lateral{background:var(--azul-profundo);color:white;padding:24px 16px;display:flex;flex-direction:column;position:sticky;top:0;height:calc(100vh - 30px);z-index:5}
.marca-principal{display:flex;gap:12px;align-items:center;text-decoration:none;padding:0 8px 25px;border-bottom:1px solid rgba(255,255,255,.12)}
.marca-principal>span,.marca-redonda{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--dorado);color:var(--azul-profundo);font-weight:900}
.marca-principal div{display:flex;flex-direction:column}
.marca-principal small,.cuenta-usuario small{opacity:.72;margin-top:4px}
.barra-lateral nav{display:grid;gap:5px;margin-top:26px}
.barra-lateral nav a{padding:12px;border-radius:9px;text-decoration:none;display:flex;gap:12px;align-items:center;color:#dce8e3}
.barra-lateral nav a:hover{background:rgba(255,255,255,.10);color:#fff}
.barra-lateral nav a.activo{background:linear-gradient(90deg,rgba(165,31,45,.55),rgba(165,31,45,.12));box-shadow:inset 3px 0 var(--dorado);color:#fff}
.barra-lateral nav i{font-style:normal;width:20px;text-align:center}
.cuenta-usuario{margin-top:auto;border-top:1px solid rgba(255,255,255,.12);padding:18px 4px 0;display:grid;grid-template-columns:38px 1fr auto;gap:9px;align-items:center}
.cuenta-usuario>span{background:#e7ddc8;color:var(--azul-profundo);width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:800}
.cuenta-usuario div{display:flex;flex-direction:column;min-width:0}
.cuenta-usuario b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cuenta-usuario button{background:none;border:0;color:#fff;font-size:22px;cursor:pointer}
.principal{padding:0 32px 50px;min-width:0}
.principal>header{height:90px;display:flex;align-items:center;gap:14px}
.principal>header h1{font-size:25px;margin:0}
.principal>header p{color:var(--atenuado);margin:5px 0 0}
.boton-menu{display:none;border:0;background:white;border-radius:8px;padding:8px}
.notificaciones{margin-left:auto;position:relative}
.notificaciones summary{list-style:none;cursor:pointer;background:white;padding:11px 14px;border:1px solid var(--linea);border-radius:10px}
.notificaciones summary::-webkit-details-marker{display:none}
.panel-notificaciones{position:absolute;right:0;top:50px;width:340px;background:white;border:1px solid var(--linea);box-shadow:var(--sombra);border-radius:12px;padding:16px;z-index:10}
.panel-notificaciones h3{margin-top:0}
.panel-notificaciones article{border-top:1px solid var(--linea);padding:12px 0}
.panel-notificaciones p{font-size:13px!important}
.panel-notificaciones small{color:var(--atenuado)}
.portada{position:relative;overflow:hidden;background:linear-gradient(120deg,var(--azul-profundo),var(--turquesa));color:white;border-radius:18px;padding:31px 34px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--sombra)}
.portada h2{font-size:30px;margin:5px 0 9px}
.portada p{color:#d8e7e0;margin:0;max-width:650px}
.sobretitulo{font-size:11px!important;font-weight:900;letter-spacing:.15em;color:var(--dorado)!important;margin:0}
.estadisticas{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:18px 0}
.estadisticas article,.panel,.tarjeta-compania{background:white;border:1px solid var(--linea);border-radius:14px;box-shadow:0 5px 18px rgba(28,60,49,.04)}
.estadisticas article{padding:20px;display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto}
.estadisticas span{grid-row:1/3;width:38px;height:38px;border-radius:10px;background:#e5f1f3;color:var(--azul-profundo);display:grid;place-items:center;font-weight:bold}
.estadisticas b{font-size:24px}
.estadisticas p{margin:3px 0;color:var(--atenuado);font-size:13px}
.cuadricula{display:grid;gap:18px}
.cuadricula.dos{grid-template-columns:1.35fr 1fr}
.cuadricula-detalle{grid-template-columns:minmax(0,1.7fr) minmax(280px,.7fr)}
.panel{padding:22px;margin-bottom:18px}
.encabezado-panel,.acciones{display:flex;align-items:center;justify-content:space-between;gap:15px}
.encabezado-panel h2,.acciones h2{margin:0}
.encabezado-panel p,.acciones p{margin:5px 0;color:var(--atenuado)}
.encabezado-panel a,.enlace-tabla{color:var(--turquesa);font-weight:700;text-decoration:none}
.acciones{margin:7px 0 20px}
.boton{display:inline-flex;justify-content:center;align-items:center;border:1px solid transparent;border-radius:9px;padding:10px 15px;text-decoration:none;font-weight:750;cursor:pointer}
.boton.primario{background:var(--azul-profundo);color:white}
.boton.claro{background:white;color:var(--azul-profundo)}
.boton.secundario{background:white;color:var(--azul-profundo);border-color:#bdccd3}
.boton.exito{background:#2f785b;color:white}
.boton.peligro{background:#9f3c3c;color:white}
.boton.completo{width:100%}
.fila-botones{display:flex;gap:8px;flex-wrap:wrap}
.contenedor-tabla{overflow:auto;margin-top:16px}
table{width:100%;border-collapse:collapse;min-width:690px}
th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--atenuado);padding:10px;border-bottom:1px solid var(--linea)}
td{padding:13px 10px;border-bottom:1px solid #edf0ee;font-size:14px}
td small{display:block;color:var(--atenuado);margin-top:4px}
.estado{font-size:11px;font-weight:800;border-radius:999px;padding:6px 9px;display:inline-block}
.estado.verde{background:#dff1e8;color:#267052}
.estado.rojo{background:#f8dfdf;color:#943838}
.estado.ambar{background:#f7ead0;color:#8b5e16}
.estado.azul{background:#e0edf5;color:#28628b}
.actividad article{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid var(--linea)}
.actividad article>span{color:var(--dorado)}
.actividad p{margin:4px 0;color:var(--atenuado);font-size:13px}
.tarjetas{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tarjeta-compania{padding:22px}
.tarjeta-compania h2{font-size:19px;margin:17px 0 5px}
.tarjeta-compania>p{color:var(--atenuado)}
.encabezado-tarjeta{display:flex;justify-content:space-between}
.encabezado-tarjeta>span{width:48px;height:48px;border-radius:12px;background:var(--azul-profundo);color:white;display:grid;place-items:center;font-weight:bold}
.encabezado-tarjeta em{font-style:normal;color:#267052;background:#dff1e8;height:max-content;padding:5px 8px;border-radius:999px;font-size:11px}
.tarjeta-compania dl,.metadatos dl{display:grid;gap:9px}
.tarjeta-compania dl div,.metadatos dl div{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid var(--linea);padding-bottom:8px}
.tarjeta-compania dt,.metadatos dt{color:var(--atenuado)}
.tarjeta-compania dd,.metadatos dd{margin:0;text-align:right}
.tarjeta-compania>a{color:var(--azul-profundo);font-weight:bold;text-decoration:none}
.panel-formulario summary{cursor:pointer;font-weight:800}
.cuadricula-formulario{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:22px}
.cuadricula-formulario label,.formulario-revision label{display:grid;gap:7px;font-weight:700;font-size:13px}
.cuadricula-formulario input,.cuadricula-formulario select,.formulario-revision textarea{width:100%;border:1px solid #cfd8d3;border-radius:8px;padding:11px;background:#fff}
.cuadricula-formulario fieldset{border:1px solid var(--linea);border-radius:9px;display:flex;gap:18px}
.cuadricula-formulario fieldset label{display:flex;align-items:center;gap:6px;font-weight:500}
.cuadricula-formulario fieldset input{width:auto}
.tarjeta-carga{max-width:880px}
.campo-archivo{grid-column:1/-1;border:2px dashed #bdccc5;border-radius:12px;padding:22px}
.campo-archivo span{font-weight:400;color:var(--atenuado)}
.caja-resumen{background:#f2f5f3;padding:14px;border-radius:10px;display:flex;flex-direction:column;gap:4px}
.visor{padding:10px;height:670px}
.visor iframe{border:0;width:100%;height:100%;border-radius:8px;background:#ddd}
.metadatos{height:max-content}
.metadatos>.estado{margin-bottom:18px}
.rechazo{background:#fff0f0;border-left:4px solid var(--rojo);padding:12px;margin:15px 0}
.rechazo p{margin:5px 0 0}
.formulario-revision{border-top:1px solid var(--linea);padding-top:16px;margin-top:16px}
.formulario-revision .fila-botones{margin-top:10px}
.formulario-eliminar{text-align:center;margin-top:17px}
.enlace-peligro{border:0;background:none;color:var(--rojo);text-decoration:underline;cursor:pointer}
.arbol-carpetas details{padding:9px 0}
.arbol-carpetas summary{cursor:pointer;font-weight:800}
.rama-arbol{margin:8px 0 5px 26px;padding-left:15px;border-left:2px solid #d8e2dd;display:grid;gap:8px}
.rama-arbol a{color:var(--turquesa);text-decoration:none;padding:6px}
.rama-arbol small{color:var(--atenuado)}
.lista-requisitos article{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--linea)}
.lista-requisitos article div{display:flex;flex-direction:column}
.lista-requisitos small{color:var(--atenuado);margin-top:3px}
.vacio{color:var(--atenuado);text-align:center;padding:18px}
.flash{padding:12px 15px;border-radius:9px;margin:0 0 15px}
.flash.exito{background:#dff1e8;color:#1d684b}
.flash.error{background:#f8dfdf;color:#8c3030}
.cuerpo-ingreso{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#24798a,var(--azul-profundo) 60%);padding:20px}
.tarjeta-ingreso{width:min(440px,100%);background:white;border-radius:18px;padding:35px;box-shadow:0 25px 60px rgba(0,0,0,.25)}
.tarjeta-ingreso .marca-redonda{margin-bottom:18px}
.tarjeta-ingreso h1{margin:5px 0}
.atenuado{color:var(--atenuado)}
.pila{display:grid;gap:15px;margin:24px 0}
.pila label{display:grid;gap:7px;font-weight:700}
.pila input{padding:12px;border:1px solid #cfd8d3;border-radius:8px}
.acceso-demo{background:var(--crema);padding:12px;border-radius:9px;font-size:13px}
.acceso-demo p{margin:8px 0}
@media(max-width:1050px){.tarjetas{grid-template-columns:repeat(2,1fr)}
.cuadricula.dos{grid-template-columns:1fr}
.cuadricula-detalle{grid-template-columns:1fr}
.visor{height:550px}
}
@media(max-width:780px){.estructura-aplicacion{grid-template-columns:1fr}
.barra-lateral{position:fixed;left:-270px;width:250px;transition:.2s}
.barra-lateral.abierto{left:0}
.principal{padding:0 15px 35px}
.boton-menu{display:block}
.principal>header{height:80px}
.principal>header p{display:none}
.estadisticas{grid-template-columns:repeat(2,1fr)}
.tarjetas{grid-template-columns:1fr}
.cuadricula-formulario{grid-template-columns:1fr}
.campo-archivo{grid-column:auto}
.portada{padding:25px;display:block}
.portada .boton{margin-top:18px}
.panel-notificaciones{right:-5px;width:min(340px,88vw)}
}

.migas-carpetas{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;margin:0 0 16px;padding:0 4px;color:var(--atenuado);font-size:.88rem}
.migas-carpetas a{color:var(--turquesa);font-weight:750;text-decoration:none}
.migas-carpetas a:hover{text-decoration:underline}
.migas-carpetas span{color:#9ba8a2}
.encabezado-explorador{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:22px}
.encabezado-explorador h2{margin:4px 0 6px;font-size:1.35rem}
.encabezado-explorador p{margin:0;color:var(--atenuado)}
.panel-carpetas{overflow:hidden}
.rejilla-carpetas{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.carpeta-documental{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 18px;min-height:82px;align-items:center;gap:13px;padding:13px 14px;border:1px solid var(--linea);border-radius:10px;color:var(--tinta);background:#fff;text-decoration:none;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}
.carpeta-documental:hover{border-color:#aac3cd;color:var(--azul-profundo);background:#f7fafb;box-shadow:0 5px 15px rgba(18,49,78,.08)}
.carpeta-documental:focus-visible{outline:3px solid rgba(200,164,91,.38);outline-offset:2px}
.carpeta-documental.destacada{background:#f7faf5;border-color:#cbdabf}
.carpeta-documental>span:not(.icono-carpeta){min-width:0}
.carpeta-documental strong,.carpeta-documental small{display:block}
.carpeta-documental strong{line-height:1.25}
.carpeta-documental small{margin-top:6px;color:var(--atenuado);font-size:.78rem;line-height:1.4}
.carpeta-documental>i{color:#98a39e;font-size:1.25rem;font-style:normal;text-align:right}
.icono-carpeta{position:relative;display:block;width:43px;height:32px;margin-top:7px;border-radius:4px 5px 6px 6px;background:#d5ae55;box-shadow:inset 0 -3px 0 rgba(99,70,15,.08);font-size:0}
.icono-carpeta::before{content:"";position:absolute;left:2px;top:-7px;width:20px;height:10px;border-radius:5px 5px 0 0;background:#d5ae55}
.icono-carpeta::after{position:absolute;right:-4px;bottom:-7px;min-width:22px;padding:2px 4px;border:2px solid #fff;border-radius:999px;color:#fff;background:var(--turquesa);font-size:.52rem;font-weight:900;letter-spacing:.03em;line-height:1;text-align:center}
.icono-carpeta.empresa::after{content:"EMP"}
.icono-carpeta.trabajador::after{content:"PER";background:#3f735f}
.icono-carpeta.tipo::after{content:"DOC";background:#9a6a1f}
.carpeta-abierta{font-size:1.5rem}
.acciones-tabla{display:flex;align-items:center;gap:6px;white-space:nowrap}
.acciones-tabla a{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border:1px solid var(--linea);border-radius:7px;color:var(--turquesa);background:#fff;font-size:.78rem;font-weight:750;text-decoration:none}
.acciones-tabla a:hover{border-color:#9ebc68;background:#f6f9f3}
@media(max-width:780px){
.encabezado-explorador{align-items:flex-start;flex-direction:column}
.rejilla-carpetas{grid-template-columns:1fr}
.encabezado-explorador>.boton,.encabezado-explorador>.fila-botones{width:100%}
.encabezado-explorador>.fila-botones .boton{flex:1}
.acciones-tabla a span{display:none}
}

.nota-seguridad{margin:18px 0 0;color:var(--atenuado);font-size:.78rem;line-height:1.5;text-align:center}
.tarjeta-2fa{width:min(560px,100%)}
.qr-activacion{display:block;width:250px;max-width:100%;margin:20px auto;border:1px solid var(--linea);border-radius:12px;background:#fff}
.secreto-manual{margin:14px 0;padding:12px;border:1px solid var(--linea);border-radius:9px;background:#f7fafb}
.secreto-manual summary{cursor:pointer;font-weight:750}
.secreto-manual code{display:block;margin-top:10px;overflow-wrap:anywhere;letter-spacing:.08em}
.cuerpo-consulta-qr{min-height:100vh;padding:24px;background:linear-gradient(145deg,#edf3f5,#f8f5ee)}
.consulta-qr{width:min(760px,100%);margin:0 auto}
.consulta-qr>header{display:flex;align-items:center;gap:16px;padding:22px;margin-bottom:16px;border-radius:16px;color:#fff;background:linear-gradient(125deg,var(--azul-profundo),var(--turquesa));box-shadow:var(--sombra)}
.consulta-qr h1{margin:4px 0;font-size:1.45rem}
.consulta-qr header p{margin:0;color:#d6e6eb}
.estados-qr{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.estados-qr article{padding:18px;border:1px solid var(--linea);border-radius:13px;background:#fff;box-shadow:var(--sombra)}
.estados-qr h2{margin:14px 0 5px;font-size:1rem}
.estados-qr p,.ultimo-acceso p,.leyenda-qr{margin:0;color:var(--atenuado);font-size:.82rem}
.ultimo-acceso{margin-top:14px}
.ultimo-acceso h2{margin-top:0}
.ultimo-acceso strong{display:block;margin-bottom:5px;color:var(--turquesa);font-size:1.2rem}
.leyenda-qr{padding:12px;text-align:center}
.estado-credencial-invalida{text-align:center;margin-top:12vh}
.estado-credencial-invalida .marca-redonda{margin:0 auto;background:var(--rojo);color:#fff}
.lista-credenciales{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin-top:18px}
.lista-credenciales a{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;padding:13px;border:1px solid var(--linea);border-radius:10px;text-decoration:none}
.lista-credenciales a>span{display:grid;width:42px;height:42px;place-items:center;border-radius:10px;color:#fff;background:var(--turquesa);font-weight:800}
.lista-credenciales b,.lista-credenciales small{display:block}
.lista-credenciales small{margin-top:4px;color:var(--atenuado)}
.lista-credenciales i{font-style:normal;color:var(--atenuado)}
.credencial-trabajador{width:min(820px,100%);margin:0 auto;overflow:hidden;border-radius:18px;color:#fff;background:linear-gradient(135deg,#12314e,#176a7c);box-shadow:0 22px 50px rgba(18,49,78,.28)}
.credencial-trabajador>header{display:flex;justify-content:space-between;padding:14px 24px;background:var(--rojo);letter-spacing:.08em}
.credencial-trabajador>header small{color:#f3d9dc}
.credencial-cuerpo{display:grid;grid-template-columns:1fr 230px;align-items:center;gap:24px;padding:28px}
.datos-credencial{display:grid;grid-template-columns:90px 1fr;column-gap:18px;align-items:center}
.foto-credencial{grid-row:1/6;display:grid;width:90px;height:110px;place-items:center;border:2px solid rgba(255,255,255,.65);border-radius:12px;color:var(--azul-profundo);background:#dcebed;font-size:1.5rem;font-weight:900}
.datos-credencial h2{margin:0 0 4px;font-size:1.4rem}
.datos-credencial p,.datos-credencial small{margin:3px 0;color:#d1e2e7}
.qr-credencial{padding:12px;border-radius:12px;color:var(--azul-profundo);background:#fff;text-align:center}
.qr-credencial img{display:block;width:190px;max-width:100%;margin:auto}
.qr-credencial b{font-size:.75rem}
.credencial-trabajador>footer{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.18)}
.credencial-trabajador>footer span{padding:13px 18px;border-right:1px solid rgba(255,255,255,.18);font-size:.75rem}
.credencial-trabajador>footer b{display:block;margin-bottom:3px;color:#f1d999}
.aviso-codigos{margin:18px 0;padding:14px;border-left:4px solid var(--dorado);background:#fff8e9}
.token-dispositivo{display:block;margin-top:8px;overflow-wrap:anywhere;font-size:.82rem;font-weight:500}
.form-dispositivo{display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:12px;margin:18px 0}
.form-dispositivo label{display:grid;gap:7px;font-size:.8rem;font-weight:700}
.form-dispositivo input,.form-dispositivo select{min-height:41px;padding:9px 11px;border:1px solid #cbd7dd;border-radius:8px;background:#fff}
.rejilla-codigos{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:18px 0}
.rejilla-codigos code{padding:10px;border:1px solid var(--linea);border-radius:8px;background:#f7fafb;text-align:center;letter-spacing:.08em}
@media(max-width:680px){.estados-qr{grid-template-columns:1fr}.credencial-cuerpo{grid-template-columns:1fr}.qr-credencial{width:min(230px,100%);margin:auto}.datos-credencial{grid-template-columns:65px 1fr}.foto-credencial{width:65px;height:85px}.credencial-trabajador>footer{grid-template-columns:1fr}.rejilla-codigos,.form-dispositivo{grid-template-columns:1fr}}
@media print{.barra-demo,.barra-lateral,.principal>header,.acciones,.notificaciones{display:none!important}.estructura-aplicacion{display:block}.principal{padding:0}.credencial-trabajador{margin-top:30px;box-shadow:none;print-color-adjust:exact;-webkit-print-color-adjust:exact}.panel-codigos{box-shadow:none}}
