/* Trabajadores y Empresa (§6, §18).
 *
 * 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-*).
 *
 * Tres pantallas: el listado de expedientes de trabajadores, el expediente
 * de una persona y el expediente de la empresa. Las dos últimas comparten
 * composición —cabecera compacta con foto o logo a la derecha, pestañas
 * reales y tarjetas compactas— con los componentes comunes de lcr.css
 * (.expediente-cab, .foto-pasaporte, .pestanas, .rejilla-tarjetas,
 * .datos-lista, .desplegable--caja). Aquí sólo va lo propio, y todo cuelga
 * de `.personas` o de `.expediente`, porque esta hoja se carga en todas las
 * pantallas y no debe tocar las de otro grupo.
 */

/* ============================================ LISTADO DE EXPEDIENTES == */

.personas{ min-width:0; }

/* «Registrar una persona» arriba, junto al resumen (§6.1), con la nota
   corta que sustituye al bloque explicativo de abajo. */
.personas-acciones{
  flex:0 1 440px; flex-wrap:wrap; justify-content:flex-end; align-items:center;
  max-width:100%;
}
.personas-acciones__nota{
  flex-basis:100%; margin:0; text-align:right;
  font-size:var(--t-xs); color:var(--c-texto-tenue);
}

@media (max-width:680px){
  .personas-acciones{ flex-basis:100%; justify-content:flex-start; }
  .personas-acciones__nota{ text-align:left; }
}

/* Las cinco cifras en una sola caja; la que corresponde al filtro puesto
   se marca con la línea vino de abajo, además de con su rótulo. */
.personas-indicadores{ margin-bottom:var(--e-5); }
.personas-indicadores a.indicadores__it[aria-current="true"]{
  background:var(--azul-50); box-shadow:inset 0 -3px 0 var(--vino-600);
}
.personas-indicadores a.indicadores__it[aria-current="true"] .indicadores__et{ color:var(--azul-950); }
.personas-indicadores .indicadores__it--atencion .indicadores__et{ color:var(--azul-950); }
.personas-indicadores .indicadores__it--atencion{ box-shadow:inset 0 3px 0 var(--vino-500); }
.personas-indicadores .indicadores__nota{ max-width:24ch; line-height:1.35; }
.personas-indicadores a.indicadores__it--atencion[aria-current="true"]{
  background:var(--amarillo-100);
  box-shadow:inset 0 3px 0 var(--vino-500), inset 0 -3px 0 var(--vino-600);
}

/* La búsqueda primero, en una franja propia: texto ancho y tres filtros. */
.personas-filtros{
  display:grid; gap:var(--e-3) var(--e-4); align-items:start;
  grid-template-columns:minmax(240px, 2.2fr) repeat(3, minmax(140px, 1fr)) auto;
  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); margin-bottom:var(--e-5);
}
.personas-filtros .campo{ margin:0; min-width:0; }
.personas-filtros label{ margin-bottom:0; color:var(--azul-950); }
.personas-filtros .tenue{ font-size:var(--t-xs); margin:2px 0 0; }
.personas-filtros input[type=search]{ min-height:40px; }
.personas-filtros select{ min-height:40px; }
.personas-filtros__botones{ display:flex; gap:var(--e-2); flex-wrap:wrap; margin-top:calc(var(--t-sm) * 1.5 + var(--e-1)); }
.personas-filtros__botones .btn{ min-height:40px; }
@media (max-width:1100px){
  .personas-filtros{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
  .personas-filtros__texto{ grid-column:1 / -1; }
  .personas-filtros__botones{ grid-column:1 / -1; margin-top:0; }
}
@media (max-width:620px){
  .personas-filtros{ grid-template-columns:minmax(0, 1fr); padding:var(--e-4); }
}

/* La tabla, sin fotos (§6.1): nombre que abre el expediente y, debajo, la
   identificación enmascarada. Ancha: se desplaza dentro de su caja. */
.personas-tabla{ min-width:780px; }
.personas-tabla td{ vertical-align:middle; }
.personas-tabla__nombre{ display:block; font-weight:var(--w-semi); color:var(--azul-800); }
.personas-tabla__nombre:hover{ color:var(--vino-700); }
.personas-tabla__id{ display:block; margin-top:2px; }
.personas-tabla .faltantes{ min-width:200px; }
.personas-lista .estado-vacio p{ margin:0; }

/* ====================================== EXPEDIENTE (persona y empresa) == */

.expediente .expediente-cab__nombre{ margin:0; line-height:1.15; }
.expediente .expediente-cab .eyebrow{ margin-bottom:var(--e-1); }
.expediente .expediente-cab__linea,
.expediente .expediente-cab__datos{ margin-bottom:0; }
.expediente .expediente-cab__lado{ position:relative; }

/* Poner, cambiar o retirar la foto: un plegable pequeño bajo la foto, que
   se abre en una caja flotante para no ensanchar la cabecera. */
.foto-gestion{ position:relative; text-align:center; }
.foto-gestion > summary{
  list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  font-size:var(--t-sm); font-weight:var(--w-semi); color:var(--azul-800);
  padding:4px 8px; border-radius:var(--r-md);
}
.foto-gestion > summary::-webkit-details-marker{ display:none; }
.foto-gestion > summary::before{ content:"✎"; color:var(--vino-600); }
.foto-gestion > summary:hover{ color:var(--vino-700); box-shadow:inset 0 -2px 0 var(--vino-500); }
.foto-gestion > summary:focus-visible{ outline:2px solid var(--c-vino-relleno); outline-offset:2px; }
.foto-gestion__caja{
  position:absolute; right:0; top:calc(100% + 6px); z-index:30; width:min(320px, 82vw);
  text-align:left; background:var(--blanco); border:1px solid var(--gris-200);
  border-top:3px solid var(--c-vino-linea); border-radius:var(--r-lg);
  box-shadow:var(--s-2); padding:var(--e-4);
  display:flex; flex-direction:column; gap:var(--e-4);
}
.foto-gestion__caja form{ display:flex; flex-direction:column; gap:var(--e-2); margin:0; }
.foto-gestion__caja label{ margin:0; }
.foto-gestion__caja input[type=file]{ font-size:var(--t-sm); max-width:100%; }
.foto-gestion__caja .tenue{ font-size:var(--t-xs); margin:0; }
.foto-gestion__retirar{ border-top:1px solid var(--gris-200); padding-top:var(--e-3); }
@media (max-width:680px){
  .foto-gestion{ text-align:left; }
  .foto-gestion__caja{ position:static; width:auto; margin-top:var(--e-2); box-shadow:none; }
}

/* «Lo que falta», amarillo vivo con acento vino (lcr.css: .banda--atencion). */
.expediente-faltan{ margin-bottom:var(--e-5); align-items:flex-start; }
.expediente-faltan .banda__titulo{ font-size:var(--t-md); margin:0 0 var(--e-1); }
.expediente-faltan .faltantes{ columns:2 280px; column-gap:var(--e-6); }
.expediente-faltan .faltante{ break-inside:avoid; }
.expediente-faltan .faltante a{ color:var(--vino-700); }
.expediente-faltan .faltante a:hover{ color:var(--azul-900); }

/* Las pestañas: la lista pegada a las tarjetas y con su fondo. */
.expediente-pestanas .pestanas__lista{ margin-bottom:var(--e-4); }
.expediente-pestanas .pestanas__tab{ font-size:var(--t-md); padding:var(--e-3) var(--e-4); }

/* El título de cada panel: lo leen el lector de pantalla y la impresión;
   en pantalla ya lo dice la pestaña elegida. */
.expediente-panel__titulo{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; margin:0; padding:0;
}
@media print{
  .expediente-panel__titulo{
    position:static; width:auto; height:auto; overflow:visible; clip:auto;
    font-size:var(--t-lg); margin:var(--e-5) 0 var(--e-2);
    border-bottom:2px solid var(--c-vino-linea);
  }
}

/* Tarjetas compactas (§6.2): menos relleno y títulos de una línea. */
.expediente .rejilla-tarjetas{ grid-template-columns:repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.expediente .card__cab{ padding:var(--e-3) var(--e-5); flex-wrap:wrap; gap:var(--e-1) var(--e-3); }
.expediente .card__titulo{ margin:0; font-size:var(--t-md); }
.expediente .card__sub{ margin:0; }
.expediente .card__cuerpo{ padding:var(--e-4) var(--e-5); }
.expediente .card__cuerpo > :first-child{ margin-top:0; }
.expediente .card__cuerpo > :last-child{ margin-bottom:0; }
.expediente .card .vacio{ padding:var(--e-5) var(--e-4); }
.expediente .card .aviso{ margin:0 0 var(--e-3); }
.expediente .card .solo-lectura{ margin-top:var(--e-3); }
.expediente .card .datos-lista + *{ margin-top:var(--e-3); }
.expediente-tarjeta--ancha{ grid-column:1 / -1; }
.expediente .rejilla-tarjetas > details.desplegable{ margin-top:0; }
.expediente .card details.desplegable{ margin-top:var(--e-2); }
.expediente-subtitulo{
  display:flex; align-items:center; flex-wrap:wrap; gap:var(--e-2);
  font-size:var(--t-sm); font-weight:var(--w-semi); color:var(--azul-950);
  margin:var(--e-4) 0 var(--e-2);
}
.expediente-subtitulo:first-child{ margin-top:0; }

/* Las listas largas con desplazamiento propio y razonable (§6.2). */
.expediente .expediente-caja{ max-height:min(55vh, 420px); }

/* Llegar por un enlace a un formulario concreto lo señala, en vino. */
.expediente .card:target,
.expediente details:target{
  box-shadow:0 0 0 3px var(--vino-100), var(--s-tarjeta);
  scroll-margin-top:var(--e-12);
}

.expediente-bloque{ margin-top:var(--e-4); }
.expediente-intro{ margin:0 0 var(--e-4); max-width:78ch; color:var(--c-texto-medio); font-size:var(--t-sm); }

/* ============================================ EXPEDIENTE DE LA EMPRESA == */

.empresa-logo{
  display:block; max-width:180px; height:64px; width:auto; object-fit:contain;
  background:var(--blanco); border:1px solid var(--gris-200);
  border-radius:var(--r-md); padding:6px; box-shadow:var(--s-1);
}
.empresa-sigla{
  display:flex; align-items:center; justify-content:center;
  width:72px; height:72px; border-radius:var(--r-lg);
  background:var(--vino-700); color:var(--blanco);
  font-size:var(--t-lg); font-weight:var(--w-bold); letter-spacing:.08em;
  box-shadow:0 0 0 3px var(--blanco), 0 0 0 4px var(--vino-100);
}
.empresa-codigo{ max-width:8rem; }
.empresa-asignacion + form,
.empresa-asignacion + form + form{ margin-top:var(--e-2); }
.empresa-asignacion ~ .empresa-asignacion{
  border-top:1px solid var(--gris-200); padding-top:var(--e-3); margin-top:var(--e-3);
}
.expediente--empresa .bloque-facultad{ margin:0; }
.expediente--empresa .tabla-env{ max-width:100%; }

/* ======================================== REPRESENTACIÓN LEGAL (19/10) == */

/* Cada persona: nombre y chip de vigencia en una línea; debajo, su papel y
   su identificación enmascarada; y, para quien puede, corregir o retirar. */
.representacion-lista{ margin:0 0 var(--e-3); }
.representacion-persona{ display:flex; flex-direction:column; gap:2px; }
.representacion-persona__cab{
  display:flex; align-items:center; flex-wrap:wrap; gap:var(--e-2);
  color:var(--azul-950);
}
.representacion-persona__acciones{ display:flex; flex-wrap:wrap; gap:0 var(--e-4); }
.representacion-persona__acciones details.desplegable{ margin-top:var(--e-1); }
.representacion-persona__acciones details[open]{ flex-basis:100%; }

/* El alta de una empresa, por bloques: la empresa, su representación
   legal, quienes la comparten y su primer administrador. */
.incorporar{ margin:0; }
.incorporar__grupo{
  border:1px solid var(--gris-200); border-top:3px solid var(--c-vino-linea);
  border-radius:var(--r-lg); padding:var(--e-3) var(--e-5) var(--e-2);
  margin:0 0 var(--e-4); background:var(--blanco);
}
.incorporar__titulo{
  padding:0 var(--e-2); font-weight:var(--w-semi); color:var(--azul-950);
}
.incorporar__campos{
  display:grid; gap:0 var(--e-4);
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 240px), 1fr));
}
.incorporar__grupo > .tenue{ margin:0 0 var(--e-2); }

@media print{
  .expediente .rejilla-tarjetas{ display:block; }
  .expediente .card{ break-inside:avoid; margin-bottom:var(--e-3); box-shadow:none; }
}
