/* Reservados, Cumplimiento, Reglamentos, Actividad jurídica y Resumen (§13 a §17).
 *
 * Rediseño GRC Empresarial (18/10/2026). Sólo tokens de lcr.css: ningún
 * color literal (core/tests_estilos.py lo comprueba en todas las hojas grc-*).
 *
 * Todas las clases de esta hoja empiezan por `tb-` (tableros). No es manía:
 * siete grupos escriben hojas a la vez y un `.panel` o un `.agenda` sin
 * prefijo habría pisado —o sido pisado por— el de otra pantalla sin que
 * ninguna prueba lo notara. Lo común (`.indicadores`, `.acciones-lista`,
 * `.desplegable--caja`, `.chip--*`, `.btn--*`) viene de lcr.css y aquí sólo
 * se acomoda.
 *
 * Gráficos: barras en HTML y CSS con el largo calculado en el servidor (el
 * producto no tiene guiones fuera de la app del trabajador). Cada barra lleva
 * su número escrito: el largo solo no se lee, y en blanco y negro menos.
 */

/* ================================================================ común == */
.tb{ display:flex; flex-direction:column; gap:var(--e-5); }
.tb > .pagina-cab{ margin-bottom:0; }

/* Barra de período, corte y descargas: lo primero que se ve, en una línea. */
.tb-barra{
  display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--e-4) var(--e-6);
  background:var(--blanco); border:1px solid var(--gris-200);
  border-top:3px solid var(--azul-700); border-radius:var(--r-lg);
  box-shadow:var(--s-tarjeta); padding:var(--e-4) var(--e-5);
}
.tb-barra__datos{ display:flex; flex-direction:column; gap:2px; min-width:200px; }
.tb-barra__periodo{ margin:0; font-size:var(--t-xl); font-weight:var(--w-bold); color:var(--azul-950); font-variant-numeric:tabular-nums; }
.tb-barra__corte{ margin:0; font-size:var(--t-sm); color:var(--gris-600); }
.tb-barra__form{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--e-3); }
.tb-barra__form .campo{ margin:0; min-width:150px; }
.tb-barra__form label{ font-size:var(--t-xs); font-weight:var(--w-semi); color:var(--gris-700); }
.tb-barra__descargas{ display:flex; flex-wrap:wrap; gap:var(--e-2); margin-left:auto; }
@media (max-width:900px){
  .tb-barra__descargas{ margin-left:0; width:100%; }
}

/* Un bloque del tablero: «en el período» o «hoy», con su alcance escrito. */
.tb-bloque{ display:flex; flex-direction:column; gap:var(--e-4); }
.tb-bloque__cab{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:var(--e-2) var(--e-4);
  padding-bottom:var(--e-2); border-bottom:2px solid var(--azul-100);
}
.tb-bloque__titulo{ margin:0; font-size:var(--t-2xl); font-weight:var(--w-bold); color:var(--azul-950); letter-spacing:-.01em; }
.tb-bloque__titulo::before{
  content:""; display:inline-block; width:10px; height:10px; margin-right:10px;
  border-radius:2px; background:var(--vino-600); vertical-align:middle;
}
.tb-alcance{
  display:inline-flex; align-items:center; gap:6px; padding:3px 10px;
  border-radius:var(--r-full); font-size:var(--t-xs); font-weight:var(--w-semi);
  background:var(--azul-50); color:var(--azul-800); box-shadow:inset 0 0 0 1px var(--azul-100);
}
.tb-alcance--hoy{ background:var(--vino-50); color:var(--vino-700); box-shadow:inset 0 0 0 1px var(--vino-100); }
.tb-bloque--hoy .tb-bloque__cab{ border-bottom-color:var(--vino-100); }

.tb-rejilla{ display:grid; gap:var(--e-4); align-items:stretch; }
.tb-rejilla--dos{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
@media (max-width:900px){ .tb-rejilla--dos{ grid-template-columns:minmax(0, 1fr); } }

/* Panel: una tarjeta con su título, sus cifras y, si informa, su gráfico. */
.tb-panel{
  display:flex; flex-direction:column; gap:var(--e-3); min-width:0;
  background:var(--blanco); border:1px solid var(--gris-200); border-radius:var(--r-lg);
  box-shadow:var(--s-tarjeta); padding:var(--e-4) var(--e-5);
}
.tb-panel--vino{ border-top:3px solid var(--vino-500); }
.tb-panel--azul{ border-top:3px solid var(--azul-600); }
.tb-panel--compacto{ padding:var(--e-3) var(--e-5); background:var(--g-suave-azul); }
.tb-panel--ancho{ width:100%; border-top:3px solid var(--azul-300); }
.tb-panel__titulo{ margin:0; font-size:var(--t-lg); font-weight:var(--w-semi); color:var(--azul-950); }
.tb-panel__sub{ margin:0; font-size:var(--t-sm); font-weight:var(--w-semi); color:var(--gris-700); }
.tb-panel__pie{ margin:0; font-size:var(--t-xs); color:var(--c-texto-tenue); }
.tb-panel__vacio{
  margin:0; padding:var(--e-3) var(--e-4); border-radius:var(--r-md);
  background:var(--gris-50); border:1px dashed var(--gris-300);
  font-size:var(--t-sm); color:var(--gris-600);
}

/* Cifras grandes con su palabra al lado. */
.tb-cifras{ display:flex; flex-wrap:wrap; gap:var(--e-2) var(--e-6); }
.tb-cifra{ display:flex; align-items:baseline; gap:8px; margin:0; }
.tb-cifra__n{
  font-size:2rem; font-weight:var(--w-bold); line-height:1; color:var(--azul-800);
  font-variant-numeric:tabular-nums;
}
.tb-panel--vino .tb-cifra__n,.tb-area--vino .tb-cifra__n{ color:var(--vino-700); }
.tb-cifra__et{ font-size:var(--t-sm); font-weight:var(--w-semi); color:var(--gris-700); }
.tb-cifra--dinero .tb-cifra__n{ font-size:1.6rem; }

/* Lista de valores en dos columnas, compacta. */
.tb-lista{ display:flex; flex-direction:column; gap:0; margin:0; }
.tb-lista > div{
  display:flex; justify-content:space-between; align-items:baseline; gap:var(--e-4);
  padding:6px 0; border-bottom:1px solid var(--gris-100);
}
.tb-lista > div:last-child{ border-bottom:0; }
.tb-lista dt{ font-size:var(--t-sm); color:var(--gris-700); }
.tb-lista dd{ margin:0; font-weight:var(--w-semi); color:var(--azul-950); font-variant-numeric:tabular-nums; white-space:nowrap; }
.tb-lista__total dt,.tb-lista__total dd{ font-weight:var(--w-bold); color:var(--vino-700); }

/* Gráfico de barras horizontales: etiqueta, pista y número. */
.tb-grafico{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--e-2); }
.tb-grafico__fila{
  display:grid; grid-template-columns:minmax(110px, 44%) minmax(60px, 1fr) 4ch;
  align-items:center; gap:var(--e-3);
}
.tb-grafico__et{ font-size:var(--t-sm); color:var(--azul-950); line-height:1.3; overflow-wrap:anywhere; }
.tb-grafico__pista{ height:12px; border-radius:var(--r-full); background:var(--azul-50); overflow:hidden; box-shadow:inset 0 0 0 1px var(--azul-100); }
.tb-grafico__barra{
  display:block; height:100%; min-width:0; border-radius:var(--r-full);
  background:linear-gradient(90deg, var(--azul-700), var(--azul-500));
}
.tb-grafico--azul .tb-grafico__barra{ background:linear-gradient(90deg, var(--azul-800), var(--azul-500)); }
.tb-grafico--vino .tb-grafico__barra{ background:linear-gradient(90deg, var(--vino-700), var(--vino-500)); }
.tb-grafico--vino .tb-grafico__pista{ background:var(--vino-50); box-shadow:inset 0 0 0 1px var(--vino-100); }
.tb-grafico__n{ text-align:right; font-weight:var(--w-bold); color:var(--azul-950); font-variant-numeric:tabular-nums; }

/* Columnas por mes: reutiliza `.barras` (el mismo marcado que vigilan las
   pruebas: `barras__cifra`) con la paleta azul. */
.tb-columnas{ height:190px; padding-top:var(--e-2); gap:var(--e-2); }
.tb-columnas .barras__col{ min-width:38px; flex:1 1 0; max-width:72px; }
.tb-columnas .barras__barra{ background:linear-gradient(to top, var(--azul-800), var(--azul-500)); border-radius:4px 4px 0 0; }
.tb-columnas .barras__cifra{ font-size:var(--t-xs); font-weight:var(--w-bold); color:var(--azul-900); }
.tb-columnas .barras__pie{ font-size:var(--t-2xs); color:var(--gris-600); border-top-color:var(--azul-100); }

/* Una cifra dicha en una frase cuando un gráfico no informaría. */
.tb-frase{ margin:0; font-size:var(--t-md); color:var(--gris-700); }
.tb-frase__n{ font-size:1.6rem; font-weight:var(--w-bold); color:var(--azul-800); margin-right:4px; font-variant-numeric:tabular-nums; }

.tb-nota{ margin:0; font-size:var(--t-xs); color:var(--gris-600); }
.tb-nota a{ font-weight:var(--w-semi); margin-left:6px; }
.tb-pie{
  margin:0; padding:var(--e-3) var(--e-4); border-left:3px solid var(--azul-300);
  background:var(--azul-50); border-radius:0 var(--r-md) var(--r-md) 0;
  font-size:var(--t-xs); color:var(--gris-700);
}

/* Desplegable del detalle de origen: secundario, debajo de todo. */
.tb-detalle .tabla td.num{ font-weight:var(--w-semi); }

/* Autoridades admitidas, todas, con su número: una en cero también dice algo. */
.tb-autoridades{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--e-2) var(--e-3); }
.tb-autoridades__titulo{ margin:0; font-size:var(--t-xs); font-weight:var(--w-semi); letter-spacing:var(--ls-eyebrow); text-transform:uppercase; color:var(--gris-600); }
.tb-autoridades__lista{ display:flex; flex-wrap:wrap; gap:6px; list-style:none; margin:0; padding:0; }
.tb-autoridades__it{
  display:inline-flex; align-items:center; gap:6px; padding:3px 10px 3px 4px;
  border-radius:var(--r-full); font-size:var(--t-xs); font-weight:var(--w-semi);
  background:var(--azul-50); color:var(--azul-900); box-shadow:inset 0 0 0 1px var(--azul-100);
}
.tb-autoridades__n{
  display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px;
  padding:0 6px; border-radius:var(--r-full); background:var(--azul-700); color:var(--blanco);
  font-variant-numeric:tabular-nums;
}
.tb-autoridades__it--cero{ background:var(--gris-50); color:var(--gris-600); box-shadow:inset 0 0 0 1px var(--gris-200); }
.tb-autoridades__it--cero .tb-autoridades__n{ background:var(--gris-200); color:var(--gris-700); }

/* ============================================================ resumen == */
/* Las áreas de la empresa en el período: una rejilla de tarjetas parejas. */
.tb-areas{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap:var(--e-4); }
.tb-area{
  display:flex; flex-direction:column; gap:var(--e-3); min-width:0;
  background:var(--g-suave-azul); border:1px solid var(--gris-200);
  border-top:3px solid var(--azul-300); border-radius:var(--r-lg);
  box-shadow:var(--s-tarjeta); padding:var(--e-4);
}
.tb-area--azul{ border-top-color:var(--azul-700); }
.tb-area--vino{ background:var(--g-suave-vino); border-top-color:var(--vino-500); }
.tb-area__titulo{
  margin:0; font-size:var(--t-xs); font-weight:var(--w-bold); letter-spacing:var(--ls-eyebrow);
  text-transform:uppercase; color:var(--azul-800);
}
.tb-area--vino .tb-area__titulo{ color:var(--vino-700); }
.tb-area__cifras{ display:flex; flex-wrap:wrap; gap:var(--e-2) var(--e-5); }
.tb-area__pie{ margin:0; margin-top:auto; font-size:var(--t-xs); color:var(--c-texto-tenue); }
.tb-area__vacio{ margin:0; font-size:var(--t-sm); color:var(--gris-600); }

/* ======================================================= cumplimiento == */
/* Qué requiere atención: cifras que se superponen —se dice—, autoridades y
   la agenda con plazo y siguiente paso. Reemplaza los cuatro cuadros. */
.tb-atencion{
  background:var(--blanco); border:1px solid var(--gris-200); border-top:3px solid var(--vino-500);
  border-radius:var(--r-lg); box-shadow:var(--s-tarjeta); overflow:hidden;
}
.tb-atencion__cab{
  display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:var(--e-2);
  padding:var(--e-4) var(--e-5) var(--e-2);
}
.tb-atencion__titulo{ margin:0; font-size:var(--t-xl); font-weight:var(--w-bold); color:var(--azul-950); }
.tb-atencion__cifras{
  display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:0;
  border-top:1px solid var(--gris-100); border-bottom:1px solid var(--gris-100);
}
.tb-atencion__it{
  display:flex; flex-direction:column; gap:2px; padding:var(--e-3) var(--e-5);
  border-left:1px solid var(--gris-100); color:var(--azul-950); text-decoration:none;
  transition:background var(--m-rapido) var(--m-curva), box-shadow var(--m-rapido) var(--m-curva);
}
.tb-atencion__it:first-child{ border-left:0; }
a.tb-atencion__it:hover,a.tb-atencion__it:focus-visible{ background:var(--azul-50); text-decoration:none; box-shadow:inset 0 -2px 0 var(--vino-500); }
.tb-atencion__et{ font-size:var(--t-xs); font-weight:var(--w-semi); letter-spacing:var(--ls-eyebrow); text-transform:uppercase; color:var(--gris-600); }
.tb-atencion__n{ font-size:1.75rem; font-weight:var(--w-bold); line-height:1.1; color:var(--azul-800); font-variant-numeric:tabular-nums; }
.tb-atencion__n small{ font-size:var(--t-sm); font-weight:var(--w-semi); color:var(--gris-700); }
.tb-atencion__det{ font-size:var(--t-xs); color:var(--gris-700); }
.tb-atencion__it--vino .tb-atencion__n{ color:var(--vino-700); }
.tb-atencion__it--atencion{ background:var(--amarillo-100); }
.tb-atencion__it--atencion .tb-atencion__n{ color:var(--oro-800); }
.tb-atencion__cuerpo{ display:flex; flex-direction:column; gap:var(--e-3); padding:var(--e-3) var(--e-5) var(--e-4); }
@media (max-width:900px){
  .tb-atencion__cifras{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .tb-atencion__it{ border-left:0; border-top:1px solid var(--gris-100); }
}

/* La agenda: `.acciones-lista` de lcr.css con el plazo y el paso siguiente. */
.tb-agenda{ border:1px solid var(--gris-100); border-radius:var(--r-md); }
.tb-agenda .acciones-lista__it{ padding:var(--e-2) var(--e-4); gap:var(--e-3); }
.tb-agenda .acciones-lista__texto{ font-size:var(--t-md); }
.tb-agenda__paso{ display:block; margin-top:2px; font-size:var(--t-sm); color:var(--azul-800); }
.tb-agenda__paso b{ color:var(--vino-700); font-weight:var(--w-semi); }
.tb-agenda__ir{ flex-shrink:0; font-size:var(--t-sm); font-weight:var(--w-semi); white-space:nowrap; }
.tb-agenda__ir::after{ content:" →"; }
.tb-agenda__mas{ margin:0; font-size:var(--t-xs); color:var(--gris-600); }

/* Cada actuación, en su tarjeta, con su plegable de registro debajo. */
.tb-actuaciones{ list-style:none; margin:0 0 var(--e-4); padding:0; display:flex; flex-direction:column; gap:var(--e-3); }
.tb-actuacion{
  border:1px solid var(--gris-200); border-left:4px solid var(--azul-600);
  border-radius:var(--r-md); padding:var(--e-3) var(--e-4); background:var(--blanco);
}
.tb-actuacion--vencida{ border-left-color:var(--vino-600); background:var(--g-suave-vino); }
.tb-actuacion:target{ box-shadow:0 0 0 2px var(--vino-300); }
/* CUM-005 (19/10/2026): la que cuelga de un caso reservado que quien mira no
   puede ver. Rayada y con candado de palabra, no de color: sólo dice que
   existe, su plazo y si vence. */
.tb-actuacion--reservada{
  border-left-style:dashed;
  background:repeating-linear-gradient(135deg, var(--gris-50) 0 8px, var(--blanco) 8px 16px);
}
.tb-actuacion--reservada .tb-actuacion__que{ color:var(--vino-700); }
.tb-autoridades__it--reservada{ background:var(--vino-50); color:var(--vino-700); box-shadow:inset 0 0 0 1px var(--vino-100); }
.tb-autoridades__it--reservada .tb-autoridades__n{ background:var(--vino-700); }
.tb-actuacion__cab{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--e-2) var(--e-3); }
.tb-actuacion__que{ font-weight:var(--w-semi); color:var(--azul-950); }
.tb-actuacion__datos{ margin:4px 0 0; font-size:var(--t-sm); color:var(--gris-700); }
.tb-actuacion__desc{ margin:6px 0 0; font-size:var(--t-sm); color:var(--azul-950); }
.tb-actuacion details.desplegable{ margin-top:var(--e-2); }
.tb-actuacion form + form{ margin-top:var(--e-3); padding-top:var(--e-3); border-top:1px dashed var(--gris-200); }

.tb-seccion-titulo{ margin:var(--e-2) 0 var(--e-3); font-size:var(--t-md); font-weight:var(--w-semi); color:var(--azul-900); }

/* Títulos de sección sueltos (Solicitudes del personal, §19.7): el mismo
   cuadradito vino de las tarjetas, sin cambiar el orden de la pantalla. */
.tb-subtitulo{
  margin:var(--e-6) 0 var(--e-3); padding-bottom:var(--e-2); border-bottom:1px solid var(--azul-100);
  font-size:var(--t-xl); font-weight:var(--w-semi); color:var(--azul-950);
}
.tb-subtitulo::before{
  content:""; display:inline-block; width:10px; height:10px; margin-right:10px;
  border-radius:2px; background:var(--vino-600); vertical-align:middle;
}

/* ========================================================= reservados == */
.tb-reservado-aviso{
  display:flex; align-items:flex-start; gap:var(--e-4);
  background:var(--g-suave-vino); border:1px solid var(--vino-100);
  border-left:4px solid var(--vino-600); border-radius:var(--r-lg); padding:var(--e-4) var(--e-5);
}
.tb-reservado-aviso__icono{ flex-shrink:0; width:28px; height:28px; color:var(--vino-700); }
.tb-reservado-aviso__titulo{ margin:0 0 4px; font-weight:var(--w-semi); color:var(--azul-950); }
.tb-reservado-aviso__texto{ margin:0; font-size:var(--t-sm); color:var(--gris-700); }
.tb-reservados{ border-top-color:var(--vino-500); }
.tb-reservados .tabla td:first-child{ font-weight:var(--w-semi); color:var(--azul-950); font-variant-numeric:tabular-nums; }
.tb-reservados__abrir{ font-weight:var(--w-semi); white-space:nowrap; }
.tb-reservados__abrir::after{ content:" →"; }

/* ======================================================= reglamentos == */
.tb-normas-estado{ display:grid; grid-template-columns:repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap:var(--e-3); }
.tb-norma{
  background:var(--blanco); border:1px solid var(--gris-200); border-top:3px solid var(--azul-600);
  border-radius:var(--r-lg); box-shadow:var(--s-tarjeta); overflow:hidden;
}
.tb-norma--reglamento{ border-top-color:var(--vino-500); }
.tb-norma:target{ box-shadow:0 0 0 2px var(--vino-300), var(--s-tarjeta); }
.tb-norma__cab{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--e-2) var(--e-4);
  padding:var(--e-4) var(--e-5); background:var(--g-suave-azul); border-bottom:1px solid var(--gris-100);
}
.tb-norma__tipo{ margin:0; font-size:var(--t-xs); font-weight:var(--w-bold); letter-spacing:var(--ls-eyebrow); text-transform:uppercase; color:var(--vino-700); }
.tb-norma__titulo{ margin:2px 0 0; font-size:var(--t-xl); font-weight:var(--w-bold); color:var(--azul-950); }
.tb-norma__cuerpo{ display:flex; flex-direction:column; gap:var(--e-3); padding:var(--e-4) var(--e-5); }
.tb-norma__linea{ margin:0; display:flex; flex-wrap:wrap; align-items:center; gap:6px var(--e-3); font-size:var(--t-sm); color:var(--gris-700); }
.tb-norma__linea a{ font-weight:var(--w-semi); }
.tb-norma__curso{
  border:1px solid var(--amarillo-400); border-left:4px solid var(--vino-500);
  background:var(--amarillo-100); border-radius:var(--r-md); padding:var(--e-3) var(--e-4);
}
.tb-norma__curso p{ margin:0 0 var(--e-2); }
.tb-norma__paso{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--e-3); }
.tb-norma__paso .campo{ margin:0; }
.tb-norma__mas{ display:flex; flex-direction:column; gap:var(--e-2); }
.tb-norma__mas details.desplegable{ border-top:1px solid var(--gris-100); padding-top:var(--e-2); }
.tb-norma__historia{ margin:var(--e-2) 0 0; }

/* ========================================================== impresión == */
@media print{
  .tb{ gap:10pt; }
  .tb-panel,.tb-area,.tb-atencion,.tb-norma{ box-shadow:none; break-inside:avoid; }
  .tb-grafico__pista,.tb-grafico__barra,.tb-columnas .barras__barra,.tb-autoridades__n{
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
}
