/* =====================================================================
   AUTOREPORTE DE GESTIÓN — Hoja de estilos
   SGC Tecnioriente Energy · Sistema HSEQ
   CSS puro, sin dependencias externas (pensado para durar en el tiempo).
   ===================================================================== */

:root{
  /* Paleta de marca TECNIORIENTE (índigo/violeta + verde-teal del logo) */
  --azul:#2e0b9e;        /* índigo/violeta corporativo (color principal) */
  --azul-osc:#1c0670;    /* índigo profundo */
  --azul-cl:#7d63c9;     /* violeta claro (del resorte del logo) */
  --teal:#2fa886;        /* verde-teal (emblema del logo) */
  --verde:#1f9d6a;       /* verde éxito (familia teal) */
  --naranja:#e8781a;     /* acento */
  --rojo:#c41e3a;        /* rojo de marca (subtítulo del logo) */
  --amarillo:#e0a800;
  --marca-noche:#1a0a52; /* índigo muy oscuro (barra lateral) */
  --gris-900:#1c2733;
  --gris-700:#3c4a59;
  --gris-600:#556270;
  --gris-500:#6b7885;
  --gris-300:#c7d0d9;
  --gris-200:#e3e9ef;
  --gris-100:#f1f5f8;
  --gris-50:#f7fafc;
  --blanco:#ffffff;
  --sombra:0 1px 3px rgba(16,40,64,.08),0 4px 16px rgba(16,40,64,.06);
  --sombra-f:0 8px 30px rgba(16,40,64,.14);
  --radio:12px;
  --radio-s:8px;
  --fuente:'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--fuente);color:var(--gris-900);background:var(--gris-100);line-height:1.5;font-size:15px}
a{color:var(--azul);text-decoration:none}
h1,h2,h3{margin:0 0 .4em;line-height:1.25}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;
  border:1px solid transparent;border-radius:var(--radio-s);padding:10px 18px;
  font-size:14px;font-weight:600;cursor:pointer;transition:.15s;text-decoration:none;
  font-family:inherit;line-height:1}
.btn-primario{background:var(--azul);color:#fff}
.btn-primario:hover{background:var(--azul-osc)}
.btn-ghost{background:#fff;border-color:var(--gris-300);color:var(--gris-700)}
.btn-ghost:hover{background:var(--gris-100);border-color:var(--gris-500)}
.btn-peligro{background:#fff;border-color:#e3b4ae;color:var(--rojo)}
.btn-peligro:hover{background:var(--rojo);color:#fff;border-color:var(--rojo)}
.btn-lg{padding:13px 26px;font-size:15px}
.btn-sm{padding:7px 13px;font-size:13px}
.btn-xs{padding:5px 10px;font-size:12px}
.btn-full{width:100%}

/* ---------- Marca / logo ---------- */
.marca{display:flex;align-items:center;gap:12px}
.marca__logo{background:linear-gradient(135deg,var(--azul),var(--teal));color:#fff;
  font-weight:800;letter-spacing:.5px;padding:10px 12px;border-radius:10px;font-size:15px}
.marca__logo.grande{font-size:22px;padding:16px 20px}
.marca__t{font-weight:700;font-size:17px;color:var(--gris-900)}
.marca__s{font-size:12.5px;color:var(--gris-500)}

/* Logo de la empresa */
.logo-img{display:block;height:auto;max-width:100%}
.logo-pub{max-height:50px}
.logo-login{max-height:104px;margin:0 auto 10px}
.logo-gracias{max-height:84px;margin:0 auto 12px}
.logo-side{max-height:52px;background:#fff;padding:6px 9px;border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.25)}

/* ---------- Alertas ---------- */
.alert{padding:12px 16px;border-radius:var(--radio-s);margin-bottom:18px;font-size:14px;border:1px solid}
.alert-ok{background:#e9f7ef;border-color:#a9dcbf;color:#166b3a}
.alert-error{background:#fdecea;border-color:#f2b8b1;color:#a3271b}
.alert-info{background:#e8f1fa;border-color:#b6d3ee;color:#134b82}

/* =====================================================================
   PORTAL PÚBLICO
   ===================================================================== */
body.pub{background:linear-gradient(180deg,var(--gris-100),#e8eef4)}
.pub-header{background:#fff;border-bottom:3px solid var(--azul);box-shadow:var(--sombra)}
.pub-header__in{max-width:900px;margin:0 auto;padding:14px 20px;display:flex;
  align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.pub-main{max-width:900px;margin:0 auto;padding:26px 18px 50px}
.pub-main.centrado{min-height:80vh;display:flex;flex-direction:column;justify-content:center;align-items:center}
.form-card{background:#fff;border-radius:var(--radio);box-shadow:var(--sombra);overflow:hidden}
.form-intro{background:linear-gradient(135deg,var(--azul),var(--azul-osc));color:#fff;padding:28px 30px}
.form-intro h1{font-size:24px;margin:0 0 6px}
.form-intro p{margin:0;opacity:.92;font-size:14.5px;max-width:640px}
.req{color:var(--naranja);font-weight:700}

.bloque{border:none;border-top:1px solid var(--gris-200);margin:0;padding:26px 30px}
.bloque:first-of-type{border-top:none}
.bloque legend{font-weight:700;font-size:16px;color:var(--azul-osc);padding:0;
  display:flex;align-items:center;gap:10px;margin-bottom:18px}
.num{background:var(--azul);color:#fff;width:26px;height:26px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex:none}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.campo{margin-bottom:16px}
.campo:last-child{margin-bottom:0}
.campo label{display:block;font-weight:600;font-size:13.5px;color:var(--gris-700);margin-bottom:6px}
.hint{font-weight:400;color:var(--gris-500);font-size:12.5px}
input[type=text],input[type=email],input[type=password],input[type=date],
input[type=time],input[type=search],input[type=number],select,textarea{
  width:100%;padding:10px 12px;border:1px solid var(--gris-300);border-radius:var(--radio-s);
  font-size:14.5px;font-family:inherit;color:var(--gris-900);background:#fff;transition:.15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--azul-cl);
  box-shadow:0 0 0 3px rgba(58,123,184,.15)}
input:disabled,select:disabled,textarea:disabled{background:var(--gris-100);color:var(--gris-700)}
textarea{resize:vertical}

.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.check,.radio{display:flex;align-items:flex-start;gap:8px;font-size:14px;color:var(--gris-700);
  cursor:pointer;padding:8px 10px;border:1px solid var(--gris-200);border-radius:var(--radio-s);background:var(--gris-50)}
.check:hover,.radio:hover{border-color:var(--azul-cl)}
.check input,.radio input{margin-top:2px;accent-color:var(--azul)}
.radios{display:flex;gap:12px}
.radio{padding:8px 18px}
.oculto{display:none}

.form-acciones{padding:24px 30px;background:var(--gris-50);border-top:1px solid var(--gris-200);text-align:right}
.pie-pub{text-align:center;color:var(--gris-500);font-size:13px;margin-top:24px}

/* Gracias */
.gracias-card{background:#fff;border-radius:var(--radio);box-shadow:var(--sombra);
  padding:44px 40px;text-align:center;max-width:480px}
.check-ok{width:74px;height:74px;border-radius:50%;background:var(--verde);color:#fff;
  font-size:42px;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.gracias-card h1{color:var(--azul-osc)}
.folio{background:var(--gris-100);border-radius:var(--radio-s);padding:10px;margin:16px 0}

/* =====================================================================
   LOGIN
   ===================================================================== */
.login-body{min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--azul-osc),var(--teal));padding:20px}
.login-card{background:#fff;border-radius:16px;box-shadow:var(--sombra-f);padding:38px 34px;width:100%;max-width:400px}
.login-brand{text-align:center;margin-bottom:24px}
.login-brand .marca__logo{display:inline-block;margin-bottom:14px}
.login-brand h1{font-size:20px;color:var(--azul-osc);margin:0 0 4px}
.login-brand p{color:var(--gris-500);font-size:13.5px;margin:0}
.login-form .campo{margin-bottom:16px}
.login-volver{display:block;text-align:center;margin-top:18px;font-size:13px;color:var(--gris-500)}
.login-olvide{display:block;text-align:center;margin-top:16px;font-size:13.5px;color:var(--azul);font-weight:600;text-decoration:none}
.login-olvide:hover{text-decoration:underline}

/* =====================================================================
   PORTAL ADMIN
   ===================================================================== */
.adm-shell{display:flex;min-height:100vh}
.adm-side{width:250px;background:var(--marca-noche);color:#d6d2ec;display:flex;flex-direction:column;
  position:fixed;top:0;bottom:0;left:0;z-index:40}
.adm-brand{display:flex;align-items:center;gap:11px;padding:20px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.adm-brand__t{font-weight:700;color:#fff;font-size:15px}
.adm-brand__s{font-size:11.5px;color:#8595a6}
.adm-nav{flex:1;padding:14px 10px;display:flex;flex-direction:column;gap:3px}
.adm-nav a{display:flex;align-items:center;gap:11px;padding:11px 14px;border-radius:var(--radio-s);
  color:#cfd8e2;font-size:14.5px;font-weight:500;transition:.15s}
.adm-nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.adm-nav a.activo{background:var(--azul);color:#fff}
.adm-nav .ic{font-size:15px;width:18px;text-align:center;opacity:.9}
.adm-side__pie{padding:16px;border-top:1px solid rgba(255,255,255,.08)}
.adm-side__pie .btn-ghost{background:transparent;color:#cfd8e2;border-color:rgba(255,255,255,.2);width:100%;font-size:12.5px}
.adm-side__pie .btn-ghost:hover{background:rgba(255,255,255,.1)}

.adm-main{flex:1;min-width:0;margin-left:250px;display:flex;flex-direction:column;min-height:100vh}
.adm-top{background:#fff;border-bottom:1px solid var(--gris-200);padding:14px 26px;
  display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:30}
.adm-top__t{font-size:18px;font-weight:700;color:var(--gris-900);flex:1}
.adm-burger{display:none;background:none;border:none;font-size:22px;cursor:pointer;color:var(--gris-700)}
.adm-user{display:flex;align-items:center;gap:12px}
.adm-user__n{font-weight:600;font-size:13.5px;text-align:right}
.adm-user__r{font-size:11.5px;color:var(--gris-500);text-align:right}
.adm-user__av{width:38px;height:38px;border-radius:50%;background:var(--teal);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px}
.adm-contenido{flex:1;min-width:0;padding:26px}
.adm-pie{padding:16px 26px;color:var(--gris-500);font-size:12.5px;border-top:1px solid var(--gris-200);background:#fff}

/* Paneles */
.panel{background:#fff;border-radius:var(--radio);box-shadow:var(--sombra);padding:22px 24px;margin-bottom:20px}
.panel__t{font-size:16px;color:var(--gris-900);margin:0 0 16px}
.panel__cab{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.panel__cab .panel__t{margin:0}
.panel--sticky{position:sticky;top:84px}
.mini-t{font-size:13px;text-transform:uppercase;letter-spacing:.4px;color:var(--gris-500);margin:14px 0 8px}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}
.kpi{background:#fff;border-radius:var(--radio);box-shadow:var(--sombra);padding:20px 22px;
  border-left:4px solid var(--azul)}
.kpi--warn{border-left-color:var(--amarillo)}
.kpi--info{border-left-color:var(--teal)}
.kpi--ok{border-left-color:var(--verde)}
.kpi__n{font-size:34px;font-weight:800;color:var(--gris-900);line-height:1}
.kpi__l{color:var(--gris-500);font-size:13px;margin-top:6px}

/* Grid de paneles del dashboard */
.grid-paneles{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid-paneles .panel{margin-bottom:0}
.panel--ancho{grid-column:1 / -1}

/* Barras verticales (altura en px por fila, robusto en todos los navegadores) */
.barras-v{display:flex;align-items:flex-end;gap:8px;min-height:200px;padding-top:10px;overflow-x:auto}
.barra-v{flex:1 0 auto;min-width:24px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}
.barra-v__col{width:100%;max-width:40px;min-width:14px;background:linear-gradient(180deg,var(--azul-cl),var(--azul));
  border-radius:6px 6px 0 0;min-height:4px}
.barra-v__val{font-size:12px;font-weight:700;color:var(--gris-700);margin-bottom:4px}
.barra-v__etq{font-size:11px;color:var(--gris-500);margin-top:7px;white-space:nowrap}

/* Barras horizontales */
.barras-h{display:flex;flex-direction:column;gap:9px}
.barra-h{display:grid;grid-template-columns:150px 1fr 34px;align-items:center;gap:10px}
.barra-h__et{font-size:12.5px;color:var(--gris-700);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.barra-h__track{background:var(--gris-200);border-radius:20px;height:16px;overflow:hidden}
.barra-h__fill{height:100%;background:linear-gradient(90deg,var(--teal),var(--azul-cl));border-radius:20px}
.barra-h__n{font-size:12.5px;font-weight:700;color:var(--gris-700)}

/* Filas de progreso (estados) */
.fila-prog{margin-bottom:14px}
.fila-prog__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.fila-prog__n{font-size:13px;color:var(--gris-500);font-weight:600}
.prog{background:var(--gris-200);border-radius:20px;height:9px;overflow:hidden}
.prog__b{height:100%;border-radius:20px;background:var(--azul)}
.prog__b.badge-pend{background:var(--amarillo)}
.prog__b.badge-inv{background:var(--teal)}
.prog__b.badge-inc{background:var(--naranja)}
.prog__b.badge-ok{background:var(--verde)}

.dos-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.lista-lin{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px dashed var(--gris-200);font-size:13.5px}
.lista-lin b{color:var(--azul-osc)}

/* Badges */
.badge{display:inline-block;padding:4px 11px;border-radius:20px;font-size:12px;font-weight:700;
  background:var(--gris-200);color:var(--gris-700);white-space:nowrap}
.badge.grande{font-size:13px;padding:6px 14px}
.badge-pend{background:#fdf3d7;color:#8a6d0b}
.badge-inv{background:#d7f0ef;color:#0a5b5a}
.badge-inc{background:#fce3cf;color:#a4530f}
.badge-ok{background:#d9f2e3;color:#146b38}
.badge-neutro{background:var(--gris-200);color:var(--gris-700)}

.pill{display:inline-block;padding:3px 9px;border-radius:6px;font-size:11.5px;font-weight:600}
.pill-ok{background:#d9f2e3;color:#146b38}
.pill-pend{background:#fdf3d7;color:#8a6d0b}

/* Tablas */
.tabla-wrap{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}
.tabla{width:100%;border-collapse:collapse;font-size:13.5px}
.tabla th{text-align:left;padding:11px 12px;color:var(--gris-500);font-size:12px;
  text-transform:uppercase;letter-spacing:.3px;border-bottom:2px solid var(--gris-200);white-space:nowrap}
.tabla td{padding:11px 12px;border-bottom:1px solid var(--gris-200);vertical-align:middle}
.tabla tr:hover td{background:var(--gris-50)}
.cel-fuerte{font-weight:600;color:var(--gris-900)}
.cel-sub{font-size:12px;color:var(--gris-500)}
.tabla-cab{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.vacio{color:var(--gris-500);text-align:center;padding:22px;font-style:italic}

/* Filtros */
.filtros{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;background:#fff;
  padding:16px;border-radius:var(--radio);box-shadow:var(--sombra)}
.filtros input[type=search]{flex:1;min-width:220px}
.filtros select{min-width:150px;flex:0 1 auto}

/* Paginación */
.paginacion{display:flex;gap:6px;flex-wrap:wrap;margin-top:18px;justify-content:center}
.pg{display:inline-flex;min-width:36px;height:36px;align-items:center;justify-content:center;
  border-radius:var(--radio-s);border:1px solid var(--gris-300);background:#fff;color:var(--gris-700);font-size:13.5px;font-weight:600}
.pg:hover{border-color:var(--azul)}
.pg-act{background:var(--azul);color:#fff;border-color:var(--azul)}

/* Detalle del reporte */
.rp-top{display:flex;align-items:center;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.rp-meta{color:var(--gris-500);font-size:13px}
.rp-cols{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start}
.rp-main{min-width:0}

.acciones-lista{display:flex;flex-direction:column;gap:12px}
.accion-item{border:1px solid var(--gris-200);border-radius:var(--radio-s);padding:14px 16px;background:var(--gris-50)}
.accion-item__cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.accion-del{color:var(--rojo);font-size:12.5px;font-weight:600}
.accion-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px;font-size:13.5px}
.accion-grid .et{color:var(--gris-500);font-weight:600}
.cuenta{color:var(--gris-500);font-size:13px}
.agregar-accion{margin-top:16px;border:1px dashed var(--gris-300);border-radius:var(--radio-s);padding:6px 14px}
.agregar-accion summary{cursor:pointer;font-weight:600;color:var(--azul);padding:8px 0}
.form-accion{padding:10px 0 14px}

/* Fotos */
.fotos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}
.foto-item{position:relative;border-radius:var(--radio-s);overflow:hidden;border:1px solid var(--gris-200);aspect-ratio:1;background:var(--gris-100)}
.foto-item img{width:100%;height:100%;object-fit:cover;display:block}
.foto-pdf,.foto-ref{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;
  justify-content:center;color:var(--gris-500);gap:6px;font-size:13px}
.foto-pdf{font-weight:800;color:var(--rojo)}
.foto-ref small{font-size:10.5px;padding:0 6px;text-align:center;word-break:break-all}
.foto-del{position:absolute;top:5px;right:5px;background:rgba(192,57,43,.92);color:#fff;
  width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700;line-height:1}
.foto-open{cursor:zoom-in;display:block;width:100%;height:100%}
/* Barra de acciones sobre cada adjunto (ver / descargar / eliminar) */
.foto-tools{position:absolute;left:0;right:0;bottom:0;display:flex;gap:6px;justify-content:center;
  padding:7px 6px;background:linear-gradient(transparent,rgba(16,10,50,.72));
  opacity:0;transform:translateY(6px);transition:.15s;pointer-events:none}
.foto-item:hover .foto-tools,.foto-item:focus-within .foto-tools{opacity:1;transform:none;pointer-events:auto}
.foto-tool{width:32px;height:32px;border-radius:8px;background:rgba(255,255,255,.94);color:#1a0a52;
  display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:15px;
  cursor:pointer;border:none;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.foto-tool:hover{background:#fff}
.foto-tool--del{background:rgba(196,30,58,.94);color:#fff}
.foto-tool--del:hover{background:#c41e3a}
/* En móvil/táctil no hay "hover": mostrar siempre la barra */
@media(hover:none){.foto-tools{opacity:1;transform:none;pointer-events:auto}}

/* Visor emergente de adjuntos (imágenes y PDF) */
.visor-overlay{position:fixed;inset:0;z-index:1000;background:rgba(16,10,50,.82);
  display:flex;align-items:center;justify-content:center;padding:24px}
.visor-caja{background:#fff;border-radius:12px;overflow:hidden;max-width:min(1000px,95vw);
  max-height:92vh;width:100%;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.4)}
.visor-barra{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 14px;background:var(--marca-noche,#1a0a52);color:#fff}
.visor-tit{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.visor-btn{color:#fff;text-decoration:none;font-size:13px;border:1px solid rgba(255,255,255,.5);
  padding:5px 12px;border-radius:7px;margin-right:8px}
.visor-btn:hover{background:rgba(255,255,255,.12)}
.visor-cerrar{background:transparent;border:none;color:#fff;font-size:20px;cursor:pointer;line-height:1;padding:2px 6px}
.visor-cuerpo{flex:1;overflow:auto;background:#f1f5f8;display:flex;align-items:center;justify-content:center;min-height:0}
.visor-img{max-width:100%;max-height:86vh;display:block;object-fit:contain}
.visor-pdf{width:min(1000px,95vw);height:86vh;border:none;background:#fff}

/* Barra de acción para eliminación masiva */
.bulk-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:#fdeef0;border:1px solid #f3c6cd;border-radius:10px;padding:10px 14px;margin-bottom:12px}
.bulk-bar span{font-size:13.5px;color:#7a2a34}
.sel-todo,.sel-item{width:17px;height:17px;cursor:pointer}

/* Menú "Acciones" */
.tabla-cab__acc{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.acciones-menu{position:relative}
.acciones-lista{position:absolute;z-index:50;top:calc(100% + 5px);right:0;min-width:230px;max-height:70vh;overflow:auto;
  background:#fff;border:1px solid var(--gris-200);border-radius:10px;box-shadow:0 14px 34px rgba(26,10,82,.18);padding:6px}
.acciones-lista[hidden]{display:none}
.am-sec{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--gris-500);padding:8px 12px 4px;font-weight:700}
.am-sep{height:1px;background:var(--gris-200);margin:6px 4px}
.am-item{display:block;width:100%;text-align:left;background:none;border:none;cursor:pointer;
  padding:9px 12px;border-radius:7px;font-size:14px;color:var(--gris-800,#2a2440);font-family:inherit}
.am-item:hover{background:var(--azul-50,#f2effc)}
.am-item--del{color:var(--rojo,#c41e3a);font-weight:600}
.am-item--del:hover{background:#fdeef0}

/* Encabezado ordenable + fila no leída */
.th-ord{color:inherit;text-decoration:none;cursor:pointer;white-space:nowrap;display:inline-block}
.th-ord:hover{color:var(--azul)}
.fila-noleido td{background:#f6f4fd}
.fila-noleido .cel-fuerte{font-weight:800}
.dot-noleido{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--azul,#2e0b9e);margin-right:6px;vertical-align:middle}

/* Iconos de acción por fila (ver / editar) */
.cel-acc{white-space:nowrap}
.ic-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;
  border:1px solid var(--gris-200);background:#fff;text-decoration:none;font-size:15px;margin-left:4px;line-height:1}
.ic-btn:hover{background:var(--gris-50);border-color:var(--gris-300)}
.ic-btn--edit:hover{border-color:var(--azul-cl)}

/* Sub-secciones "Datos" (Tabla / Informes / Galería / Descargas) */
.datos-tabs{display:flex;align-items:flex-end;gap:4px 12px;flex-wrap:wrap;margin-bottom:18px;border-bottom:2px solid var(--gris-200);padding-bottom:0}
.datos-tabs__lbl{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:12.5px;letter-spacing:.3px;
  text-transform:uppercase;color:var(--gris-600);padding:0 4px 11px 2px}
.dt-lbl-ic{font-size:15px;color:var(--azul)}
.datos-tabs__grupo{display:flex;gap:6px;flex-wrap:wrap;align-items:flex-end}
.datos-tab{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:9px 9px 0 0;
  text-decoration:none;color:var(--gris-600);font-weight:600;font-size:14px;border:2px solid transparent;border-bottom:none;
  margin-bottom:-2px}
.datos-tab:hover{background:var(--gris-50);color:var(--azul)}
.datos-tab.activo{background:#fff;color:var(--azul);border-color:var(--gris-200);border-bottom:2px solid #fff}
.dt-ic{font-size:15px}

/* Galería */
.galeria-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.gal-item{margin:0;background:#fff;border:1px solid var(--gris-200);border-radius:10px;overflow:hidden}
.gal-open{display:block;aspect-ratio:1;background:var(--gris-100);cursor:zoom-in}
.gal-open img{width:100%;height:100%;object-fit:cover;display:block}
.gal-pdf{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--rojo);font-weight:800}
.gal-cap{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 10px;font-size:12.5px}
.gal-cap a{color:var(--azul);text-decoration:none;font-weight:600}
.gal-dl{font-size:15px}

/* Galería de Papelería: mosaico de constancias (PDF) */
.const-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px}
.const-card{margin:0;background:#fff;border:1px solid var(--gris-200);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.const-doc{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;aspect-ratio:16/9;
  background:linear-gradient(135deg,#f3f0fb,#e7f4f1);text-decoration:none}
.const-pdf{background:var(--rojo);color:#fff;font-weight:800;font-size:12px;padding:5px 9px;border-radius:7px;letter-spacing:.5px}
.const-num{font-size:22px;font-weight:800;color:var(--azul)}
.const-cap{padding:10px 12px;display:flex;flex-direction:column;gap:6px}
.const-nom{font-weight:700;font-size:13.5px;color:#1c2733;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.const-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--gris-600)}
.const-fecha{font-size:12px;color:var(--gris-600)}
.const-acc{display:flex;gap:8px;margin-top:2px;flex-wrap:wrap}
.tabla td.c,.tabla th.c{text-align:center}

/* Permisos por usuario (editor) */
.perm-lista{display:grid;gap:6px;margin-top:8px;transition:.15s}
.perm-lista .check{padding:7px 10px;font-size:13px}

/* Timeline */
.timeline{list-style:none;margin:0;padding:0}
.timeline li{padding:9px 0 9px 16px;border-left:2px solid var(--gris-200);position:relative;margin-left:6px}
.timeline li:before{content:'';position:absolute;left:-6px;top:14px;width:10px;height:10px;
  border-radius:50%;background:var(--azul-cl);border:2px solid #fff}
.tl-fecha{display:block;font-size:11.5px;color:var(--gris-500)}
.tl-txt{font-size:13.5px}

.roles-info{margin-top:18px;padding-top:16px;border-top:1px solid var(--gris-200);font-size:12.5px;color:var(--gris-600)}
.roles-info p{margin:6px 0;color:var(--gris-700)}
.datos-cuenta .lista-lin{font-size:14.5px;padding:11px 0}

/* =====================================================================
   PORTAL INICIAL (landing)
   ===================================================================== */
body.portal-body{background:linear-gradient(160deg,var(--gris-100),#e6ecf4);min-height:100vh}
.portal-top{background:#fff;border-bottom:3px solid var(--azul);box-shadow:var(--sombra);
  display:flex;align-items:center;gap:14px;padding:14px 24px}
.logo-portal{max-height:52px}
.portal-top__t{flex:1}
.portal-top__1{font-weight:700;font-size:17px;color:var(--gris-900)}
.portal-top__2{font-size:12.5px;color:var(--gris-500)}
.portal-main{max-width:1040px;margin:0 auto;padding:44px 20px 60px}
.portal-hero{text-align:center;margin-bottom:34px}
.portal-hero h1{font-size:30px;color:var(--azul-osc);margin-bottom:8px}
.portal-hero p{color:var(--gris-600);font-size:16px}
.portal-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:22px}
.pcard{display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:var(--sombra);
  padding:28px 24px;text-decoration:none;color:var(--gris-900);border-top:5px solid var(--azul);transition:.18s}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--sombra-f)}
.pcard--pap{border-top-color:var(--teal)}
.pcard--med{border-top-color:var(--naranja)}
.pcard--epp{border-top-color:var(--rojo,#c41e3a)}
.pcard--ti{border-top-color:#0e97b7}
.pcard__ic{font-size:40px;margin-bottom:12px;line-height:1}
.pcard__t{font-size:19px;font-weight:700;color:var(--azul-osc);margin-bottom:8px}
.pcard--pap .pcard__t{color:#0a5b5a}
.pcard--med .pcard__t{color:#a4530f}
.pcard--epp .pcard__t{color:#a11a30}
.pcard--ti .pcard__t{color:#0a6b82}
.pcard__d{font-size:14px;color:var(--gris-600);line-height:1.55;flex:1}
.pcard__go{margin-top:16px;font-weight:700;color:var(--azul)}
.pcard--pap .pcard__go{color:var(--teal)}
.pcard--med .pcard__go{color:var(--naranja)}
.pcard--epp .pcard__go{color:var(--rojo,#c41e3a)}
.pcard--ti .pcard__go{color:#0e97b7}
.pcard--bi{border-top-color:#e0a800}
.pcard--bi .pcard__t{color:#8a6d0b}
.pcard--bi .pcard__go{color:#b8860b}
.pcard--sal{border-top-color:#1f9d6a}
.pcard--sal .pcard__t{color:#0f6b47}
.pcard--sal .pcard__go{color:#1f9d6a}
.pcard--mail{border-top-color:#2b6cb0}
.pcard--mail .pcard__t{color:#1e4e79}
.pcard--mail .pcard__go{color:#2b6cb0}
.pcard--izaje{border-top-color:#7c3aed}
.pcard--izaje .pcard__t{color:#5b21b6}
.pcard--izaje .pcard__go{color:#7c3aed}
.portal-pie{text-align:center;color:var(--gris-500);font-size:13px;padding:20px}
@media(max-width:820px){.portal-hero h1{font-size:24px}}

/* Papelería */
.form-intro--pap{background:linear-gradient(135deg,var(--teal),#0a5b5a)}
.pap-item{border:1px solid var(--gris-200);border-radius:var(--radio-s);padding:12px 14px;margin-bottom:10px;background:var(--gris-50);position:relative}
.pap-item__grid{display:grid;grid-template-columns:130px 1fr 130px 100px;gap:10px;align-items:end}
.pap-item__grid .campo{margin-bottom:0}
.pap-item__del{position:absolute;top:8px;right:8px;background:rgba(192,57,43,.92);color:#fff;border:none;
  width:22px;height:22px;border-radius:50%;cursor:pointer;font-size:15px;line-height:1;font-weight:700}
.pap-items-tabla{width:100%;border-collapse:collapse;font-size:13.5px;margin-top:6px}
.pap-items-tabla th{text-align:left;padding:8px 10px;color:var(--gris-500);font-size:12px;text-transform:uppercase;border-bottom:2px solid var(--gris-200)}
.pap-items-tabla td{padding:8px 10px;border-bottom:1px solid var(--gris-200)}
.pill-int{background:#e8e1f7;color:#43206b}.pill-ext{background:#d7f0ef;color:#0a5b5a}
@media(max-width:620px){.pap-item__grid{grid-template-columns:1fr 1fr}.pap-item__nombre{grid-column:1/-1}}

/* Buscador de formatos (autocompletado) */
.ac-wrap{position:relative}
.ac-box{position:absolute;z-index:40;top:calc(100% + 4px);left:0;right:0;max-height:300px;overflow-y:auto;
  background:#fff;border:1px solid var(--gris-200);border-radius:var(--radio-s);
  box-shadow:0 12px 30px rgba(26,10,82,.16)}
.ac-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;
  cursor:pointer;border-bottom:1px solid var(--gris-100);font-size:13.5px}
.ac-item:last-child{border-bottom:none}
.ac-item:hover,.ac-item.ac-on{background:var(--azul-50,#f2effc)}
.ac-txt{color:var(--gris-700,#2a2440);line-height:1.3}
.ac-cod{display:inline-block;margin-left:8px;font-size:11px;color:var(--gris-400,#9aa2b1);font-variant-numeric:tabular-nums}
.ac-tag{flex:0 0 auto;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;
  padding:2px 8px;border-radius:999px;white-space:nowrap}
.ac-tag--int{background:#e8e1f7;color:#43206b}
.ac-tag--ext{background:#d7f0ef;color:#0a5b5a}

/* Tabla de uso de papelería (dashboard) */
.tabla-pap-uso{min-width:760px;font-size:13px}
.tabla-pap-uso th.c,.tabla-pap-uso td.c{text-align:center}
.tabla-pap-uso td.cel-0{color:var(--gris-300,#c7ccd6)}
.tabla-pap-uso tfoot td{border-top:2px solid var(--gris-200);background:var(--gris-50);font-size:12.5px}
.tabla-pap-uso th:last-child,.tabla-pap-uso td:last-child{background:rgba(47,168,134,.06)}

/* Selector de período (dashboard/informes) */
.periodo-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.periodo-lbl{font-size:13px;color:var(--gris-500);font-weight:600}
.periodo-chip{padding:7px 15px;border-radius:20px;border:1px solid var(--gris-300);background:#fff;
  color:var(--gris-700);font-size:13px;font-weight:600;text-decoration:none}
.periodo-chip:hover{border-color:var(--azul-cl)}
.periodo-chip.on{background:var(--azul);color:#fff;border-color:var(--azul)}
.periodo-info{font-size:12.5px;color:var(--gris-500);margin-left:6px}

/* Informes */
.btn-pdf{background:#c0392b;color:#fff}.btn-pdf:hover{background:#a3271b}
.btn-excel{background:#1f9d6a;color:#fff}.btn-excel:hover{background:#177a52}
.informe-cab{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.informe-btns{display:flex;gap:10px;flex-wrap:wrap}
.aviso-informe{background:#f3f0fb;border:1px solid #ddd2f2;border-radius:12px;padding:14px 18px;
  font-size:13.5px;color:#43206b;margin-top:6px}

/* Tarjetas del portal público (incentivo al reporte) */
.impacto{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0 4px}
.impacto__c{background:#fff;border-radius:14px;box-shadow:var(--sombra);padding:18px 20px;border-top:4px solid var(--azul)}
.impacto__c:nth-child(2){border-top-color:var(--teal)}
.impacto__c:nth-child(3){border-top-color:var(--naranja)}
.impacto__n{font-size:28px;font-weight:800;color:var(--azul);line-height:1}
.impacto__c:nth-child(2) .impacto__n{color:var(--teal)}
.impacto__c:nth-child(3) .impacto__n{color:var(--naranja)}
.impacto__l{font-size:13px;color:var(--gris-600);margin-top:4px}
.pub-hero-msg{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:10px 14px;margin-top:16px;font-size:13.5px}

/* Medidor tipo gauge para tasa de cierre */
.gauge{display:flex;align-items:center;gap:16px}
.gauge__circ{width:104px;height:104px;flex:none}
.gauge__info .g-n{font-size:30px;font-weight:800;line-height:1}
.gauge__info .g-l{font-size:12.5px;color:var(--gris-500)}

/* Mini-tarjetas de indicadores secundarios */
.mini-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:4px}
.mini-kpi{background:var(--gris-50);border:1px solid var(--gris-200);border-radius:10px;padding:12px 14px}
.mini-kpi .n{font-size:20px;font-weight:800;color:var(--gris-900)}
.mini-kpi .l{font-size:11.5px;color:var(--gris-500);margin-top:2px}
.trend-up{color:var(--verde);font-weight:700}.trend-down{color:var(--rojo);font-weight:700}

/* Ranking de reporteros */
.ranking{display:flex;flex-direction:column;gap:8px}
.rank-row{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;font-size:13.5px}
.rank-pos{width:24px;height:24px;border-radius:50%;background:var(--gris-200);color:var(--gris-700);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px}
.rank-row:nth-child(1) .rank-pos{background:#f6c945;color:#6b4e00}
.rank-row:nth-child(2) .rank-pos{background:#cfd6de;color:#3c4a59}
.rank-row:nth-child(3) .rank-pos{background:#e3b98c;color:#6b3d10}
.rank-bar{height:8px;background:var(--gris-200);border-radius:20px;overflow:hidden;margin-top:3px}
.rank-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--azul));border-radius:20px}
.rank-n{font-weight:700;color:var(--azul)}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media(max-width:1000px){
  .grid-paneles{grid-template-columns:1fr}
  .rp-cols{grid-template-columns:1fr}
  .panel--sticky{position:static}
  .kpis{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
  .adm-side{transform:translateX(-100%);transition:.25s;box-shadow:var(--sombra-f)}
  .adm-side.abierto{transform:translateX(0)}
  .adm-main{margin-left:0}
  .adm-burger{display:block}
  .adm-contenido{padding:18px}
  .mini-kpis{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .grid-2,.grid-3{grid-template-columns:1fr}
  .kpis{grid-template-columns:1fr 1fr}
  .mini-kpis{grid-template-columns:1fr 1fr}
  .accion-grid{grid-template-columns:1fr}
  .dos-col{grid-template-columns:1fr;gap:14px}
  .barra-h{grid-template-columns:92px 1fr 30px;gap:8px}
  .adm-user__i{display:none}
  .form-intro,.bloque,.form-acciones{padding-left:16px;padding-right:16px}
  .gauge{flex-wrap:wrap;justify-content:center;text-align:center}
  .impacto{grid-template-columns:1fr}
  .kpi__n{font-size:28px}
  .panel{padding:18px 16px}
  .adm-contenido{padding:14px}
  .adm-top{padding:12px 14px;gap:10px}
  .adm-top__t{font-size:16px}
  .pub-main{padding:18px 12px 40px}
  .pub-header__in{padding:12px 14px}
  .informe-cab{flex-direction:column;align-items:flex-start}
  .checks{grid-template-columns:1fr}
  .filtros{padding:12px}
  .filtros input[type=search]{min-width:0;flex:1 1 100%}
  .filtros select,.filtros .btn{flex:1 1 46%;min-width:0}
  /* Barras por mes más compactas para que quepan en móvil */
  .barras-v{gap:4px;min-height:170px}
  .barra-v{min-width:15px}
  .barra-v__col{min-width:8px}
  .barra-v__val{font-size:9px;margin-bottom:2px}
  .barra-v__etq{font-size:8.5px;margin-top:4px}
}
@media(max-width:420px){
  .kpis{grid-template-columns:1fr}
  .barra-h{grid-template-columns:76px 1fr 26px}
  .badge{font-size:11px;padding:3px 8px}
  .marca__t{font-size:15px}
  .form-intro h1{font-size:20px}
}

/* ===================== CONSTRUCTOR DE FORMULARIOS ===================== */
.fb-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.fb-top__t{font-weight:800;font-size:18px;color:var(--azul-osc);flex:1;min-width:0}
.fb-top__acc{display:flex;gap:8px;flex-wrap:wrap}
.fb-meta__row{margin-bottom:12px}
.fb-meta__row input[type=text],.fb-meta__row textarea{width:100%}
.fb-meta__flags{display:flex;gap:18px;flex-wrap:wrap;margin:6px 0 14px;font-size:14px}
.fc-lbl{display:block;font-weight:600;font-size:13px;margin:10px 0 4px;color:var(--gris-700,#374151)}
.fb-campos{display:flex;flex-direction:column;gap:14px}
.fc-card{background:#fff;border:1px solid var(--gris-200);border-left:4px solid var(--azul);border-radius:12px;padding:14px 16px}
.fc-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.fc-tipo{display:inline-flex;align-items:center;gap:7px;font-weight:700;color:var(--azul);font-size:14px}
.fc-tipo__ic{font-size:16px}
.fc-nombre{color:var(--gris-500,#6b7280);font-size:12px}
.fc-nombre code{background:var(--gris-100);padding:1px 6px;border-radius:5px}
.fc-mover{margin-left:auto}
.fc-mover form{display:inline-flex;gap:4px}
.fc-body input[type=text],.fc-body textarea{width:100%}
.fc-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fc-3col{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.fc-3col input{width:100%}
.fc-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;flex-wrap:wrap}
.fc-req{font-size:14px;font-weight:600}
.fc-del{margin-top:8px;text-align:right}
.fc-del-btn{color:var(--rojo)}
/* Modal selector de tipos */
/* Bloque condicional de "Gestión de la acción" */
.acc-cond{border-left:3px solid var(--teal);background:#f6fbf9;border-radius:0 10px 10px 0;padding:14px 16px;margin-top:6px}
.acc-cond[hidden]{display:none}
.acc-alerta{background:#fde8e8;border:1px solid #f3b4b4;color:#9a1f1f;border-radius:8px;padding:9px 12px;font-size:13.5px;margin-bottom:12px;font-weight:600}
.badge-abierta{background:#fdf3d7;color:#8a6d0b}
.badge-cerrada{background:#d9f2e3;color:#146b38}
.badge-vencida{background:#fce3cf;color:#a4530f}

/* Tarjetas de acciones (lista) */
.acc-cards{display:flex;flex-direction:column;gap:10px;margin:6px 0 14px}
.acc-card{border:1px solid var(--gris-200);border-left:4px solid var(--teal);border-radius:10px;padding:11px 14px;background:#fff}
.acc-card__cab{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.acc-card__cab>span:first-child{font-size:14.5px}
.acc-card__acc{margin-left:auto;display:inline-flex;gap:4px}
.acc-card__body{font-size:13.5px;color:var(--gris-700,#374151);display:flex;flex-direction:column;gap:5px}
.acc-card__meta{display:flex;flex-wrap:wrap;gap:4px 18px;font-size:12.5px;color:var(--gris-600)}
.acc-card__body .et{color:var(--gris-500,#6b7280);font-weight:600}

.fb-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-start;justify-content:center;padding:5vh 16px}
.fb-modal[hidden]{display:none}
.fb-nuevo{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.fb-nuevo[hidden]{display:none}
.fb-modal__bg{position:absolute;inset:0;background:rgba(17,20,40,.55)}
.fb-modal__caja{position:relative;background:#fff;border-radius:14px;max-width:900px;width:100%;max-height:90vh;overflow:auto;padding:22px 24px;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.fb-modal__x{position:absolute;top:12px;right:14px;border:none;background:none;font-size:20px;cursor:pointer;color:var(--gris-500,#6b7280)}
.fb-modal__t{margin:0 0 2px;color:var(--azul-osc)}
.fb-modal__s{margin:0 0 14px;color:var(--gris-600);font-size:14px}
.fb-tipos__g{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;color:var(--teal);margin:14px 0 8px}
.fb-tipos__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}
.fb-tipo-btn{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--gris-200);border-radius:10px;background:#fff;cursor:pointer;text-align:left;transition:.15s}
.fb-tipo-btn:hover{border-color:var(--azul);background:var(--gris-50);transform:translateY(-1px)}
.fb-tipo-btn__ic{font-size:18px;width:26px;text-align:center;color:var(--azul)}
.fb-tipo-btn__t{font-size:13.5px;font-weight:600;color:#1c2733}

/* ===================== FORMULARIO PÚBLICO (render) ===================== */
.f-ayuda{font-size:13px;color:var(--gris-600);margin:2px 0 6px}
.f-err{color:var(--rojo);font-size:13px;font-weight:600;margin-top:4px}
.campo--err input,.campo--err textarea,.campo--err select{border-color:var(--rojo)!important}
.f-opciones{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.f-op{display:flex;align-items:flex-start;gap:9px;padding:9px 12px;border:1px solid var(--gris-200);border-radius:9px;cursor:pointer;font-size:14.5px}
.f-op:hover{background:var(--gris-50);border-color:var(--azul)}
.f-op input{margin-top:2px}
.f-rating{display:flex;gap:8px;flex-wrap:wrap}
.f-rating label{display:inline-flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;font-size:12px;color:var(--gris-600)}
.f-rating label span{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gris-200);border-radius:8px;font-weight:700}
.f-rating input{position:absolute;opacity:0;width:0;height:0}
.f-rating input:checked + span{background:var(--azul);color:#fff;border-color:var(--azul)}
.f-rango{display:flex;align-items:center;gap:12px}
.f-rango input[type=range]{flex:1}
.f-rango output{font-weight:700;color:var(--azul);min-width:32px;text-align:center}
.f-geo{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start}
.f-geo input[type=text],.f-geo textarea{flex:1;min-width:180px}
.f-matriz{width:100%;border-collapse:collapse;font-size:13.5px}
.f-matriz th,.f-matriz td{border:1px solid var(--gris-200);padding:8px 10px;text-align:center}
.f-matriz thead th{background:var(--gris-50);font-size:12px}
.f-matriz tbody th{text-align:left;font-weight:600}
.f-rank ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.f-rank li{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid var(--gris-200);border-radius:9px;background:#fff;font-size:14px}
.f-rank-h{color:var(--gris-400,#9ca3af);cursor:default}
.f-rank-btns{margin-left:auto;display:flex;gap:4px}
.f-rank-btns button{border:1px solid var(--gris-200);background:#fff;border-radius:6px;cursor:pointer;width:26px;height:26px}
.f-nota{background:#f2f6ff;border-left:4px solid var(--azul);border-radius:8px;padding:12px 14px;margin:14px 0}
.f-calc{background:var(--gris-50)}
.f-arch-actual{font-size:12.5px;color:var(--gris-600);margin-top:4px}
.form-acc{margin-top:22px}
.form-exito{text-align:center;padding:26px 10px}
.form-exito__ic{width:64px;height:64px;border-radius:50%;background:var(--teal);color:#fff;font-size:34px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.form-exito h1{color:var(--azul-osc);font-size:22px;margin:0 0 6px}

/* ===================== DETALLE DE RESPUESTA ===================== */
.meta-linea{display:flex;gap:22px;flex-wrap:wrap;font-size:13px;color:var(--gris-600);margin-bottom:14px}
.resp-detalle{display:flex;flex-direction:column;gap:2px}
.resp-fila{display:grid;grid-template-columns:260px 1fr;gap:16px;padding:11px 0;border-bottom:1px solid var(--gris-100)}
.resp-etq{font-weight:600;color:#1c2733}
.resp-tipo{display:block;font-weight:400;font-size:11.5px;color:var(--gris-500,#6b7280)}
.resp-val{font-size:14.5px;word-break:break-word}
.resp-img{max-width:220px;border-radius:8px;display:block}
@media(max-width:820px){
  .fc-2col,.fc-3col{grid-template-columns:1fr}
  .resp-fila{grid-template-columns:1fr;gap:2px}
  .fb-tipos__grid{grid-template-columns:1fr 1fr}
}

/* ═══════════════════════════════════════════════════════════════
   MÓDULO CONTROL DE IZAJES
   ═══════════════════════════════════════════════════════════════ */
.alert-warn{background:#fff8e1;border-color:#ffe082;color:#8a6d0b}

/* Formulario en cuadrícula */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.form-campo{display:flex;flex-direction:column;gap:6px}
.form-campo--full{grid-column:1 / -1}
.form-campo>label{font-weight:600;font-size:13.5px;color:var(--gris-700)}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}

/* Badges de estado del elemento */
.badge-vigente{background:#d9f2e3;color:#146b38}
.badge-porvencer{background:#fdf3d7;color:#8a6d0b}
.badge-vencido{background:#fdecea;color:#a3271b}

/* Buscador + chips de filtro */
.izj-buscador{display:flex;flex-direction:column;gap:10px}
.izj-chips{display:flex;gap:8px;flex-wrap:wrap}
.izj-chip{cursor:pointer;padding:6px 13px;border-radius:20px;border:1px solid var(--gris-300);
  background:var(--gris-50);color:var(--gris-700);font-size:12.5px;font-weight:600;
  display:inline-flex;align-items:center;gap:6px;font-family:inherit}
.izj-chip:hover{border-color:var(--azul-cl);color:var(--azul)}
.izj-chip.activo{background:var(--azul);border-color:var(--azul);color:#fff}
.izj-dot{width:8px;height:8px;border-radius:50%}
.dot-g{background:var(--verde)}.dot-y{background:var(--amarillo)}.dot-r{background:var(--rojo)}
.izj-count{font-size:13px;color:var(--gris-500);font-weight:600}

/* Precintos */
.izj-precintos{display:flex;flex-wrap:wrap;gap:3px;max-width:230px}
.izj-precinto{display:inline-block;background:#fffde7;border:1px solid #fdd835;color:#795548;
  border-radius:4px;padding:1px 6px;font-size:11.5px;font-weight:600;font-family:'Courier New',monospace;white-space:nowrap}
.izj-tabla td.izj-elem{max-width:230px;font-size:12.5px;color:var(--gris-700)}
.izj-acc{white-space:nowrap}
.izj-cert-actual{font-size:13px;background:var(--gris-50);border:1px solid var(--gris-200);
  border-radius:var(--radio-s);padding:8px 11px;margin-bottom:8px}

/* Historial documental */
.izj-docs{display:flex;flex-direction:column;gap:10px}
.izj-doc{display:flex;align-items:center;gap:12px;border:1px solid var(--gris-200);
  border-radius:var(--radio-s);padding:11px 14px;background:var(--gris-50)}
.izj-doc__ic{font-size:20px}
.izj-doc__main{flex:1;min-width:0}
.izj-doc__t{font-weight:600;font-size:13.5px;color:var(--gris-900);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.izj-doc__s{font-size:12px;color:var(--gris-500)}
.izj-doc__acc{display:flex;gap:6px;flex-shrink:0}

/* Vistas por pestaña */
.izj-view{display:none}
.izj-view.activo{display:block}

/* ═══ Accesos rápidos del panel ═══ */
.acc-modulos{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.acc-mod{display:flex;flex-direction:column;gap:7px;background:#fff;border:1px solid var(--gris-200);
  border-left:4px solid var(--azul);border-radius:var(--radio-s);padding:14px 15px;text-decoration:none;
  color:var(--gris-900);transition:transform .12s ease,box-shadow .12s ease}
.acc-mod:hover{transform:translateY(-2px);box-shadow:var(--sombra-f);border-color:var(--gris-300)}
.acc-mod__top{display:flex;align-items:center;gap:9px}
.acc-mod__ic{font-size:20px;line-height:1;width:22px;text-align:center}
.acc-mod__t{font-weight:700;font-size:14.5px}
.acc-mod__m{font-size:12.5px;color:var(--gris-500)}
.acc-mod__m b{color:var(--gris-900);font-size:13.5px}
.acc-mod__m.alerta b{color:var(--rojo)}
.acc-mod--rep{border-left-color:#2e0b9e}
.acc-mod--izaje{border-left-color:#7c3aed}
.acc-mod--pap{border-left-color:#e8781a}
.acc-mod--form{border-left-color:#2fa886}
.acc-mod--inf{border-left-color:#e0a800}
.acc-mod--gal{border-left-color:#2b6cb0}
.acc-mod--exp{border-left-color:#1f9d6a}
.acc-mod--not{border-left-color:#0e97b7}
