
:root{--azul:#1F4E78;--gris:#F2F2F2;--naranja:#FCE4D6;--borde:#BFBFBF;}
*{box-sizing:border-box;}
body{font-family:Segoe UI,Arial,sans-serif;margin:0;color:#222;background:#fafafa;}
header{background:var(--azul);color:#fff;padding:18px 26px;}
header h1{margin:0;font-size:20px;} header p{margin:4px 0 0;font-size:12px;opacity:.9;}
nav{background:#143a5c;padding:8px 26px;display:flex;flex-wrap:wrap;gap:4px 14px;}
nav a{color:#cfe2f3;text-decoration:none;font-size:13px;} nav a:hover{color:#fff;}
nav.nav-docs{background:#0f2d47;padding:6px 26px;gap:4px 18px;border-top:1px solid #1d4a73;}
nav.nav-docs .nav-docs-etq{color:#9db9d4;font-size:12px;font-weight:700;margin-right:6px;}
nav.nav-docs a{color:#ffe08a;font-weight:600;} nav.nav-docs a:hover{color:#fff;}
main{padding:22px 26px;max-width:1700px;margin:auto;}
h2{color:var(--azul);border-bottom:2px solid var(--azul);padding-bottom:6px;}
table{border-collapse:collapse;width:100%;margin:12px 0;font-size:12px;}
th,td{border:1px solid var(--borde);padding:8px 9px;text-align:left;vertical-align:top;}
th{background:var(--azul);color:#fff;}
ul.doclist{margin:0;padding-left:16px;} ul.doclist li{margin:3px 0;}
/* Grid horizontal: distribuye los editables en varias columnas para no estirar la fila */
/* Flex-wrap: reparte los editables a lo ANCHO (no depende de la altura de la celda) */
ul.doclist-grid{list-style:none;padding-left:0;margin:0;display:flex;flex-wrap:wrap;gap:5px;}
ul.doclist-grid li{margin:0;flex:0 0 auto;}
ul.doclist-grid .rel-doc{display:inline-flex;align-items:center;gap:5px;border:1px solid #d6e2ef;
   border-radius:5px;padding:2px 6px;background:#fafcff;font-size:11px;white-space:nowrap;}
ul.doclist-grid .rel-doc .doc{font-size:11px;}
ul.doclist-grid .btn-desc{margin-top:0;padding:0 5px;font-size:9px;}
a.doc{color:#1F4E78;text-decoration:none;border-bottom:1px dotted #1F4E78;cursor:pointer;}
a.doc:hover{color:#0d2d47;border-bottom:1px solid #0d2d47;}
a.doc[data-generada]::after{content:" (vista)";font-size:10px;color:#833C00;}
a.doc.nolink{border-bottom:1px dashed #999;}
a.btn-desc{display:inline-block;margin-top:3px;font-size:10px;background:#1F4E78;color:#fff;
           padding:2px 8px;border-radius:4px;text-decoration:none;}
a.btn-desc:hover{background:#0d2d47;}
.doc-missing{color:#9C0006;font-style:italic;}
.nota{background:var(--naranja);border-left:5px solid #833C00;padding:12px 16px;margin:18px 0;font-size:12px;border-radius:4px;}
table.pend th{background:#833C00;} table.pend td.resol{background:#FFF8E7;min-width:180px;}
.firma-req{color:#833C00;font-weight:600;background:#FFF2CC;padding:4px 8px;border-radius:4px;display:inline-block;}
ul.incisos{margin:0;padding-left:16px;font-size:11px;} ul.incisos li{margin:2px 0;}
/* Configurador de trazabilidad */
.config-bar{display:flex;align-items:center;gap:12px;background:#eef4fa;border:1px solid #cde;
            padding:10px 14px;border-radius:6px;margin:10px 0;}
.switch{position:relative;display:inline-block;width:46px;height:24px;}
.switch input{opacity:0;width:0;height:0;}
.slider{position:absolute;cursor:pointer;inset:0;background:#aaa;border-radius:24px;transition:.2s;}
.slider:before{content:"";position:absolute;height:18px;width:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
.switch input:checked + .slider{background:#1F4E78;}
.switch input:checked + .slider:before{transform:translateX(22px);}
.leyenda{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0;font-size:11px;}
.lg{padding:2px 8px;border-radius:10px;border:1px solid #ccc;}
.lg-sug{background:#FFF2CC;color:#7a5b00;} .lg-conf{background:#C6EFCE;color:#006100;}
.lg-ver{background:#BDD7EE;color:#1F4E78;} .lg-firma{background:#FCE4D6;color:#833C00;}
.inc-selector{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0;}
.inc-btn{background:#fff;border:1px solid #1F4E78;color:#1F4E78;border-radius:5px;padding:5px 12px;cursor:pointer;font-size:13px;}
.inc-btn:hover{background:#eef4fa;} .inc-btn.activo{background:#1F4E78;color:#fff;}
.traza-panel{border:1px solid var(--borde);border-radius:6px;padding:14px 16px;margin:12px 0;background:#fff;min-height:60px;}
.traza-grupo{margin-bottom:12px;} .traza-grupo h4{margin:0 0 6px;color:#1F4E78;font-size:13px;}
.rel{padding:6px 10px;border-radius:5px;margin:4px 0;border-left:4px solid #ccc;background:#fafafa;font-size:12px;}
.rel.sug{border-left-color:#FFC000;} .rel.conf{border-left-color:#2E9B57;} .rel.ver{border-left-color:#1F4E78;}
.rel .meta{color:#666;font-size:11px;} .rel a{color:#1F4E78;}
.rel .firma-tag{background:#FCE4D6;color:#833C00;font-size:10px;padding:1px 6px;border-radius:8px;margin-left:6px;}
.pendiente-consultor{background:#FFF8E7;border:1px dashed #c90;color:#7a5b00;padding:12px;border-radius:6px;}
.banner-firma{background:#FCE4D6;border-left:5px solid #833C00;color:#833C00;padding:10px 14px;margin:10px 0;border-radius:5px;font-size:13px;}
.incisos li.inc-activo{background:#FFF9E6;outline:2px solid #FFC000;border-radius:4px;}
.rel-doc.doc-ilumina{background:#FFF2CC;border-radius:4px;padding:1px 4px;box-shadow:0 0 0 2px #FFC000 inset;}
.aviso-nivel-req{color:#833C00;font-size:11px;font-style:italic;}
.estado-tag{font-size:10px;padding:1px 7px;border-radius:9px;margin-left:6px;}
.estado-sugerida{background:#FFF2CC;color:#7a5b00;} .estado-confirmada{background:#C6EFCE;color:#006100;} .estado-verificada{background:#BDD7EE;color:#1F4E78;}
.rel .meta.aviso{color:#833C00;font-style:italic;}
.rel .meta.subt{color:#1F4E78;font-weight:600;}
.rel .meta.aviso-heur{color:#777;font-style:italic;font-size:10px;}
.lg-gen{background:#D9E1F2;color:#1F4E78;} .lg-inc{background:#FFE699;color:#7a5b00;border:1px dashed #c90;}
.lg-decl{background:#E7DAF2;color:#5B2C8D;}
.persp-btn{background:#fff;border:1px solid #1F4E78;color:#1F4E78;border-radius:5px;padding:5px 14px;cursor:pointer;font-size:13px;margin:0 2px;}
.persp-btn.activo{background:#1F4E78;color:#fff;}
#persp-label{font-size:12px;color:#666;font-style:italic;}
.valoracion-panel{margin:10px 0;}
.val-consultor{background:#F3EEF9;border-left:5px solid #5B2C8D;padding:10px 14px;border-radius:5px;font-size:12px;}
.val-interna{background:#eef4fa;border-left:5px solid #1F4E78;padding:10px 14px;border-radius:5px;font-size:12px;}
.nota-auditor{font-style:italic;color:#444;}
.estado-declarada{background:#E7DAF2;color:#5B2C8D;}
.rel.decl{border-left-color:#5B2C8D;}
.rel-doc.doc-ilumina-decl{background:#EADDF5;border-radius:4px;padding:1px 4px;box-shadow:0 0 0 2px #9B6FC9 inset;}
.grafo-doc{overflow-x:auto;border:1px solid var(--borde);border-radius:6px;background:#fff;margin:10px 0;padding:8px;}
.grafo-svg{display:block;max-width:100%;height:auto;}
.g-colhead{font-size:13px;font-weight:700;fill:#1F4E78;}
.g-node rect{fill:#f7f9fc;stroke:#9cc3e6;stroke-width:1.5;cursor:pointer;}
.g-node:hover rect{stroke:#1F4E78;stroke-width:2.5;}
.g-node.g-rector rect{fill:#DDEBF7;stroke:#1F4E78;}
.g-node.g-matriz_gestion rect{fill:#E2EFDA;stroke:#548235;}
.g-node.g-minuta rect{fill:#FCE4D6;stroke:#c08552;}
.g-node.g-contenedor rect{fill:#EDEDED;stroke:#999;stroke-dasharray:3 2;}
.g-node.g-politica rect{fill:#DDEBF7;stroke:#1F4E78;stroke-width:2;}
.g-node.g-procedimiento rect{fill:#D7E9D3;stroke:#375623;stroke-width:2;}
.g-node.g-formato rect{fill:#FFF2CC;stroke:#bf9000;}
.g-node.g-registro rect{fill:#FCE4D6;stroke:#c08552;}
.g-node.g-nolocal rect{fill:#fff;stroke:#c00000;stroke-dasharray:4 3;}
.g-edge-propuesta{stroke:#c0504d;stroke-dasharray:6 4;stroke-width:2;}
.grafo-titulo{font-size:13px;color:#1F4E78;margin:2px 0 6px;}
.grafo-nota-modal{margin:4px 0 10px;}
.grafo-vista-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:6px 0;font-size:13px;}
.gv-btn{background:#fff;border:1px solid #1F4E78;color:#1F4E78;border-radius:5px;padding:4px 12px;cursor:pointer;font-size:12px;}
.gv-btn.activo{background:#1F4E78;color:#fff;}
.gv-tag{font-size:11px;color:#666;font-style:italic;}
.grafo-leyenda{margin:4px 0 10px;}
.lg-cont{background:#D9E1F2;color:#1F4E78;} .lg-disc{background:#F2DCDB;color:#9C0006;}
.lg-nl{background:#fff;color:#c00000;border:1px dashed #c00000;}
.g-node.g-indep rect{stroke-dasharray:4 3;}
.g-id{font-size:12px;font-weight:700;fill:#222;} .g-nat{font-size:10px;fill:#666;}
.g-nom{font-size:11px;fill:#375623;} .g-colhead-futuro{fill:#999;font-style:italic;}
.g-zona-futuro{fill:#f7f7f7;stroke:#ddd;stroke-dasharray:5 4;}
.g-edge{fill:none;stroke-width:1.8;}
.g-edge-mencion{stroke:#5B9BD5;stroke-dasharray:1 0;}
.grafo-detalle{border:1px solid var(--borde);border-radius:6px;background:#fff;padding:12px 16px;margin:10px 0;font-size:12px;}
.grafo-detalle h4{margin:0 0 6px;color:#1F4E78;} .g-meta{color:#666;font-size:11px;} .g-meta.aviso{color:#833C00;font-style:italic;}
details.pendientes-fold{margin-top:24px;border:1px solid var(--borde);border-radius:6px;background:#fff;padding:6px 12px;}
details.pendientes-fold summary{cursor:pointer;font-weight:700;color:#1F4E78;font-size:15px;padding:6px 0;}
.cards{display:flex;flex-wrap:wrap;gap:12px;} 
.rcard{background:#fff;border:1px solid var(--borde);border-radius:6px;padding:12px 16px;min-width:230px;flex:1;}
.rcard h3{margin:0 0 6px;color:var(--azul);font-size:14px;}
.rcard a{color:#1F4E78;} .rcard small{color:#666;}
#visor-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:50;}
#visor{display:none;position:fixed;top:3%;left:3%;width:94%;height:94%;background:#fff;z-index:51;border-radius:8px;box-shadow:0 8px 30px rgba(0,0,0,.4);flex-direction:column;}
#visor.abierto{display:flex;}
#visor-bar{background:var(--azul);color:#fff;padding:10px 16px;display:flex;align-items:center;gap:14px;border-radius:8px 8px 0 0;}
#visor-bar .titulo{font-size:13px;font-weight:600;flex:1;}
#visor-bar .etq{font-size:11px;background:#833C00;padding:2px 8px;border-radius:10px;}
#visor-bar a,#visor-bar button{color:#fff;background:#2a6099;border:none;padding:6px 12px;border-radius:5px;font-size:12px;cursor:pointer;text-decoration:none;}
#visor-bar button.cerrar{background:#9C0006;}
#visor iframe{flex:1;border:none;border-radius:0 0 8px 8px;width:100%;}
footer{padding:18px 26px;font-size:11px;color:#666;border-top:1px solid #ddd;margin-top:30px;}
