/* Incidentes, Firmas, Avisos y Asuntos (§9 a §12).
 *
 * 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-*).
 *
 * Esta hoja lleva Incidentes, Avisos y Asuntos; Firmas vive en
 * grc-firmas.css. Todo se apoya en los componentes comunes de lcr.css
 * (franja, chips, botones, datos-lista, estado-vacio); aquí sólo va lo propio
 * de estas pantallas.
 */

/* ================================================================ Asuntos ==
   §12: el botón «Solicitar apoyo legal» como acción principal, las cifras
   arriba con la jerarquía de Inicio y estados más vivos —siempre con su
   palabra al lado—. */
.asuntos-cab{ justify-content:space-between; align-items:center; }
.asuntos-cab__texto{ flex:1 1 320px; min-width:0; }
.asuntos-cab__accion{ display:flex; flex-direction:column; align-items:flex-end; gap:6px; }
.solicitar-apoyo{
  font-size:var(--t-md); padding:12px 22px; gap:10px;
  box-shadow:0 2px 0 var(--vino-800), var(--s-tarjeta);
}
.solicitar-apoyo svg{ width:18px; height:18px; }
.solicitar-apoyo:focus-visible{ outline:3px solid var(--vino-300); outline-offset:2px; }
.asuntos-cab__nota{ font-size:var(--t-sm); color:var(--gris-600); }
@media (max-width:680px){
  .asuntos-cab__accion{ align-items:stretch; width:100%; }
  .solicitar-apoyo{ justify-content:center; }
}

/* Las cifras: la del filtro que se está viendo queda marcada en vino, con
   `aria-current` (no sólo con el color: la cifra elegida también lo dice al
   lector de pantalla). */
.asuntos-franja{ margin-bottom:var(--e-4); }
.asuntos-franja .franja__cifra{ font-size:1.6rem; }
.asuntos-franja .franja__it[aria-current="true"]{
  background:var(--vino-50); box-shadow:inset 0 -3px 0 var(--vino-600);
}
.asuntos-franja .franja__historial{ align-self:center; padding:var(--e-2); text-decoration:none; }
.asuntos-franja .franja__historial:hover,
.asuntos-franja .franja__historial:focus-visible{ color:var(--vino-700); }
.asuntos-aviso{ margin-top:0; }

.asuntos-lista{ border-top:3px solid var(--c-vino-linea); }
.asuntos-lista__consecutivo{ font-weight:var(--w-semi); }

/* ================================================== Solicitar apoyo legal == */
.solicitud{ border-top:3px solid var(--c-vino-linea); }
.solicitud__bloque + .solicitud__bloque{
  margin-top:var(--e-5); padding-top:var(--e-5); border-top:1px solid var(--gris-200);
}
.solicitud__autor{
  margin:0 0 var(--e-4); padding:var(--e-2) var(--e-3); font-size:var(--t-sm);
  background:var(--azul-50); border-left:3px solid var(--azul-600);
  border-radius:0 var(--r-md) var(--r-md) 0;
}
/* «¿Para quién?» en una línea: tres opciones cortas no necesitan tres filas. */
.solicitud-personas [id="id_para_quien"]{ display:flex; flex-wrap:wrap; gap:var(--e-2) var(--e-5); }
.solicitud-personas [id="id_para_quien"] label{
  display:flex; align-items:center; gap:6px; margin:0; font-weight:var(--w-normal);
}
.solicitud-personas [id="id_para_quien"] input[type=radio]{ width:auto; margin:0; }

/* La cantidad de personas, contada sola mientras se marca y sin guion: un
   contador de CSS que suma la principal (si se eligió) y cada casilla
   marcada. Lo que vale es lo que se guarda; la confirmación lo repite. */
.solicitud-personas{ counter-reset:involucradas; }
.solicitud-personas select[name="trabajador"]:has(option:checked:not([value=""])){
  counter-increment:involucradas;
}
.solicitud-personas input[name="personas_involucradas"]:checked{ counter-increment:involucradas; }
.solicitud-personas__cuenta{
  display:inline-flex; align-items:center; gap:8px; margin:0; padding:6px 14px;
  border-radius:var(--r-full); background:var(--vino-50); color:var(--vino-800);
  box-shadow:inset 0 0 0 1px var(--vino-100);
  font-size:var(--t-sm); font-weight:var(--w-semi);
}
.solicitud-personas__n::after{
  content:counter(involucradas); font-size:var(--t-md); font-variant-numeric:tabular-nums;
}

.solicitud__enviar{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--e-3);
  margin-top:var(--e-5); padding-top:var(--e-4); border-top:1px solid var(--gris-200);
}
.solicitud__enviar .btn--pral{ font-size:var(--t-md); padding:12px 26px; }
.solicitud__nota{ flex-basis:100%; margin:0; font-size:var(--t-sm); }

/* La ficha del asunto: quién la pidió, para quién y a quién involucra. */
.asunto-personas{ border-top:3px solid var(--azul-600); }
.asunto-personas__nombre{ display:inline-block; max-width:100%; }
.asunto-personas__cuenta{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:24px; height:24px; padding:0 6px; margin-right:8px;
  border-radius:var(--r-full); background:var(--azul-700); color:var(--blanco);
  font-size:var(--t-xs); font-weight:var(--w-bold); font-variant-numeric:tabular-nums;
}
.asunto-personas__sep{ margin:0 6px; color:var(--gris-400); }
.asunto-personas__lista{ margin:0 0 4px; padding-left:1.1rem; }

/* ============================================================= Incidentes ==
   §9: «Registrar incidente» como acción de la pantalla y la referencia como
   enlace a la ficha del reporte. */
.incidentes-cab{ justify-content:space-between; align-items:center; }
.incidentes-cab__accion{ align-self:center; }
.incidente-ref{
  font-weight:var(--w-semi); text-decoration:none;
  box-shadow:inset 0 -1px 0 var(--azul-300);
}
.incidente-ref:hover,
.incidente-ref:focus-visible{ color:var(--vino-700); box-shadow:inset 0 -2px 0 var(--vino-500); }
.incidente-ficha{ border-top:3px solid var(--c-vino-linea); }
.incidente-ficha__texto{ margin:var(--e-3) 0; font-size:var(--t-md); line-height:1.55; }

/* ================================================================= Avisos ==
   §11: la advertencia que sostiene la frontera con los comunicados, en la
   web. En la aplicación la pinta portal.css; el texto es el mismo fragmento.
   «NO PUBLIQUE AQUÍ» en mayúsculas, negrita y vino, junto a la lista. */
.frontera{
  margin:var(--e-5) 0; padding:var(--e-4) var(--e-5);
  background:var(--amarillo-100); border:1px solid var(--amarillo-400);
  border-left:4px solid var(--vino-600); border-radius:var(--r-lg);
}
.frontera-titulo{ margin:0 0 var(--e-2); font-size:var(--t-lg); color:var(--azul-950); }
.frontera-lista-titulo{ margin:var(--e-3) 0 var(--e-2); }
/* AVI-001 (19/10/2026): el cierre manda a «Solicitar apoyo legal». */
.frontera-cierre{ margin:var(--e-3) 0 0; }
.frontera-cierre a{ font-weight:var(--w-semi); }
.frontera-no-publique{
  display:inline-block; margin-left:4px; color:var(--vino-700);
  font-weight:var(--w-bold); letter-spacing:.06em; text-transform:uppercase;
  box-shadow:inset 0 -2px 0 var(--vino-500);
}