/* Thot Creative · © 2026 Webs Creative LLC · Todos los derechos reservados */
/* Documentos · cualquier documento (D-145 a D-152): filtro por tipo de la bandeja, chips de cada fila y revisión de lo
   que no es una factura (destino, tipo, plazo, doble lectura, datos, nóminas, movimientos, partes y MRZ). Lo común de la
   bandeja y de la revisión de facturas sigue en componentes.css. Prefijo .gc-doc- como el resto del módulo. */

/* ================================================================ color de cada tipo de documento */
/* --e lo usan los chips (.gc-estado); --k, los iconos y tarjetas del tipo. */
.gc-doc-clase--factura { --e: var(--gc-naranja); --k: var(--gc-naranja); }
.gc-doc-clase--nomina { --e: var(--gc-exito); --k: var(--gc-exito); }
.gc-doc-clase--recibo_ss { --e: var(--gc-violeta); --k: var(--gc-violeta); }
.gc-doc-clase--notificacion { --e: var(--gc-peligro); --k: var(--gc-peligro); }
.gc-doc-clase--justificante { --e: var(--gc-violeta); --k: var(--gc-violeta); }
.gc-doc-clase--identidad { --e: var(--gc-cian); --k: var(--gc-cian); }
.gc-doc-clase--certificado { --e: var(--gc-aviso); --k: var(--gc-aviso); }
.gc-doc-clase--extracto, .gc-doc-clase--recibo_banco { --e: var(--gc-info); --k: var(--gc-info); }
.gc-doc-clase--contrato, .gc-doc-clase--escritura, .gc-doc-clase--poliza, .gc-doc-clase--otro { --e: var(--gc-texto-suave); --k: var(--gc-texto-suave); }

/* ================================================================ bandeja: filtro por tipo */
.gc-doc-grupos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--gc-borde); }
.gc-doc-grupo {
  --c: var(--gc-texto-suave); display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: var(--gc-radio-pildora);
  border: 1px solid var(--gc-borde); background: var(--gc-campo); color: var(--gc-texto-suave); font: 600 var(--gc-t-xs)/1.5 var(--gc-fuente); cursor: pointer;
  transition: border-color var(--gc-rapido), background var(--gc-rapido), color var(--gc-rapido), transform var(--gc-rapido), box-shadow var(--gc-normal);
}
.gc-doc-grupos > .gc-doc-grupo:first-child { --c: var(--gc-naranja); }
.gc-doc-grupo--facturas { --c: var(--gc-naranja); }
.gc-doc-grupo--nominas { --c: var(--gc-exito); }
.gc-doc-grupo--notificaciones { --c: var(--gc-peligro); }
.gc-doc-grupo--justificantes { --c: var(--gc-violeta); }
.gc-doc-grupo--identidad { --c: var(--gc-cian); }
.gc-doc-grupo--banco { --c: var(--gc-info); }
.gc-doc-grupo--otros { --c: var(--gc-texto-suave); }
.gc-doc-grupo--extra { --c: var(--gc-violeta); }
.gc-doc-grupo .gc-i { width: 14px; height: 14px; color: var(--gc-texto-c); }
.gc-doc-grupo:hover { color: var(--gc-texto); border-color: color-mix(in srgb, var(--c) 45%, var(--gc-borde)); transform: translateY(-1px); }
.gc-doc-grupo:focus-visible { outline: 2px solid var(--c); outline-offset: 2px; }
.gc-doc-grupo[aria-pressed="true"] {
  color: var(--gc-texto); border-color: color-mix(in srgb, var(--c) 60%, transparent); background: color-mix(in srgb, var(--c) 15%, var(--gc-campo));
  box-shadow: 0 6px 18px -8px color-mix(in srgb, var(--c) 70%, transparent), inset 0 1px 0 rgba(255, 255, 255, .06);
}
.gc-doc-grupo .gc-doc-cuenta { margin-left: 0; background: color-mix(in srgb, var(--c) 20%, transparent); color: var(--gc-texto); }
.gc-doc-grupo--extra .gc-i:last-child { width: 12px; height: 12px; color: var(--gc-texto-suave); }

/* Lotes recientes: un nombre largo se recorta en vez de salirse de la tarjeta. */
.gc-doc-lote > *, .gc-doc-lote .recortar { min-width: 0; }

/* ================================================================ revisión de cualquier documento */
.gc-doc-tipo { display: flex; flex-direction: column; gap: 12px; min-width: 0; }

/* ---------------------------------------------------------------- destino */
.gc-doc-destino {
  --d: var(--gc-violeta);
  border-color: color-mix(in srgb, var(--d) 45%, var(--gc-borde));
  background: linear-gradient(140deg, color-mix(in srgb, var(--d) 13%, var(--gc-superficie)), var(--gc-superficie) 72%);
}
.gc-doc-destino--conflicto { --d: var(--gc-aviso); }
.gc-doc-destino--bloqueado, .gc-doc-destino--error { --d: var(--gc-peligro); }
.gc-doc-destino--aplicado { --d: var(--gc-exito); }
.gc-doc-destino--descartado { --d: var(--gc-texto-tenue); }
.gc-doc-destino__cabecera { display: flex; align-items: center; gap: 12px; }
.gc-doc-destino__icono {
  flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; color: var(--gc-sobre-color);
  background: linear-gradient(135deg, var(--d), color-mix(in srgb, var(--d) 50%, var(--gc-cian)));
  box-shadow: 0 10px 24px -8px color-mix(in srgb, var(--d) 75%, transparent), inset 0 -3px 0 rgba(0, 0, 0, .14);
  transform: perspective(240px) rotateY(-10deg);
}
.gc-doc-destino__icono .gc-i { width: 20px; height: 20px; }
.gc-doc-destino__titulo { display: block; font-family: var(--gc-fuente-titulos); font-size: var(--gc-t-l); line-height: 1.3; }
.gc-doc-destino__detalle { margin: 0; padding-left: 18px; display: grid; gap: 3px; font-size: 13px; line-height: 1.45; color: var(--gc-texto-suave); }
.gc-doc-destino__motivo { display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px; border-radius: var(--gc-radio-s); background: color-mix(in srgb, currentColor 9%, transparent); font-size: 13px; line-height: 1.45; }
.gc-doc-destino__motivo .gc-i { flex: none; margin-top: 2px; }
.gc-doc-destino__acciones { gap: 10px; align-items: center; }
.gc-doc-destino__acciones:empty { display: none; }

/* ---------------------------------------------------------------- tipo («Cambiar tipo») */
.gc-doc-tipo__icono {
  flex: none; display: grid; place-items: center; width: 38px; height: 44px; border-radius: 10px; color: var(--k, var(--gc-naranja));
  background: color-mix(in srgb, var(--k, var(--gc-naranja)) 14%, var(--gc-campo)); box-shadow: inset 0 -3px 0 color-mix(in srgb, var(--k, var(--gc-naranja)) 25%, transparent);
  transform: perspective(200px) rotateY(-8deg);
}
.gc-doc-tipo__icono .gc-i { width: 20px; height: 20px; }
.gc-doc-tipo__cambio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto; gap: 8px; align-items: center; margin-top: 6px; padding-top: 10px; border-top: 1px dashed var(--gc-borde); }

/* ---------------------------------------------------------------- plazo de una notificación */
.gc-doc-plazo {
  --p: var(--gc-info);
  border-color: color-mix(in srgb, var(--p) 40%, var(--gc-borde));
  background: linear-gradient(140deg, color-mix(in srgb, var(--p) 11%, var(--gc-superficie)), var(--gc-superficie) 70%);
}
.gc-doc-plazo--peligro { --p: var(--gc-peligro); }
.gc-doc-plazo--aviso { --p: var(--gc-aviso); }
.gc-doc-plazo--exito { --p: var(--gc-exito); }
.gc-doc-plazo .gc-revisar__titulo > .gc-i { color: var(--p); }
.gc-doc-plazo__fecha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
.gc-doc-plazo__fecha b { font-family: var(--gc-fuente-titulos); font-size: var(--gc-t-xl); line-height: 1.2; letter-spacing: -.01em; }
.gc-doc-plazo__fecha b::first-letter { text-transform: uppercase; }

/* ---------------------------------------------------------------- doble lectura */
.gc-doc-dl p { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.45; }
.gc-doc-dl p > .gc-i { flex: none; margin-top: 2px; }
.gc-doc-dl--coincide { border-color: color-mix(in srgb, var(--gc-exito) 40%, var(--gc-borde)); }
.gc-doc-dl--coincide .gc-revisar__titulo > .gc-i { color: var(--gc-exito); }
.gc-doc-dl--difiere { border-color: color-mix(in srgb, var(--gc-peligro) 45%, var(--gc-borde)); background: linear-gradient(140deg, color-mix(in srgb, var(--gc-peligro) 9%, var(--gc-superficie)), var(--gc-superficie) 70%); }
.gc-doc-dl--difiere .gc-revisar__titulo > .gc-i { color: var(--gc-peligro); }
.gc-doc-dl--incompleta .gc-revisar__titulo > .gc-i { color: var(--gc-aviso); }

/* ---------------------------------------------------------------- datos del documento */
.gc-revisar__rejilla .ancho-2 { grid-column: span 2; }
.gc-revisar__rejilla .ancho-3 { grid-column: span 3; }
.gc-revisar__rejilla .ancho-12 { grid-column: span 12; }
.gc-doc-tipo .gc-revisar__campo, .gc-doc-tipo .gc-revisar__campo > .gc-entrada { min-width: 0; }
.gc-doc-tipo .gc-revisar__campo > .gc-entrada { align-self: start; }
/* Etiqueta, control y nota de cada campo comparten filas con los de al lado (subgrid): una etiqueta de dos líneas o una
   nota debajo de un campo no descuadran los controles de la misma fila. */
@supports (grid-template-rows: subgrid) {
  .gc-doc-tipo .gc-revisar__rejilla { row-gap: 0; }
  .gc-doc-tipo .gc-revisar__campo { grid-row: span 3; grid-template-rows: subgrid; row-gap: 4px; margin-bottom: 10px; }
  .gc-doc-tipo .gc-revisar__campo > span:first-child { align-self: end; }
}
@supports not (grid-template-rows: subgrid) {
  .gc-doc-tipo .gc-revisar__rejilla { align-items: start; }
}
.gc-doc-campo--dif .gc-entrada { border-color: color-mix(in srgb, var(--gc-violeta) 75%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gc-violeta) 18%, transparent); }
.gc-doc-campo--error .gc-entrada { border-color: var(--gc-peligro); box-shadow: 0 0 0 3px color-mix(in srgb, var(--gc-peligro) 15%, transparent); }
.gc-doc-campo--aviso .gc-entrada { border-color: color-mix(in srgb, var(--gc-aviso) 70%, transparent); }
.gc-doc-campo__nota { display: block; font-size: 11.5px; font-weight: 500; line-height: 1.35; }
.gc-doc-campo__nota--dif { color: var(--gc-violeta); }
[data-tema="claro"] .gc-doc-campo__nota--dif { color: color-mix(in srgb, var(--gc-violeta) 60%, #111); }
.gc-doc-campo__nota .gc-i { width: 12px; height: 12px; vertical-align: -2px; }

.gc-doc-nomina { display: grid; gap: 10px; padding: 12px; border-radius: var(--gc-radio); border: 1px solid var(--gc-borde); background: color-mix(in srgb, var(--gc-exito) 4%, var(--gc-campo)); }
.gc-doc-nomina + .gc-doc-nomina { margin-top: 4px; }
.gc-doc-cuadre { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 8px 10px; border-radius: var(--gc-radio-s); background: color-mix(in srgb, currentColor 9%, transparent); font-size: 13px; font-weight: 600; line-height: 1.4; }
.gc-doc-cuadre .gc-i { flex: none; margin-top: 1px; }

.gc-doc-movs { display: grid; gap: 4px; max-height: 440px; overflow: auto; padding-right: 2px; container-type: inline-size; }
.gc-doc-movs__fila { display: grid; grid-template-columns: 140px minmax(0, 1fr) 112px; gap: 6px; align-items: center; }
html[data-vista="experta"] .gc-doc-movs__fila { grid-template-columns: 140px minmax(0, 1fr) 112px 92px; }
/* Panel estrecho en la vista experta: el saldo de cada movimiento va debajo de su importe y el concepto conserva sitio. */
@container (max-width: 560px) {
  html[data-vista="experta"] .gc-doc-movs__fila { grid-template-columns: 132px minmax(0, 1fr) 108px; row-gap: 0; }
  html[data-vista="experta"] .gc-doc-movs__fila > span.cifra { grid-column: 3; padding-right: 8px; font-size: 11px; line-height: 1.4; }
  html[data-vista="experta"] .gc-doc-movs__cabecera > span:nth-child(4) { display: none; }
}
.gc-doc-movs__cabecera { position: sticky; top: 0; z-index: 1; padding: 2px 0 4px; background: var(--gc-superficie); font-size: 11px; font-weight: 600; color: var(--gc-texto-tenue); text-transform: uppercase; letter-spacing: .03em; }
.gc-doc-movs__cabecera > span:nth-child(n+3) { text-align: right; }
.gc-doc-movs__fila .gc-entrada { min-height: 32px; padding: 4px 8px; font-size: 13px; }
.gc-doc-movs__fila .cifra { text-align: right; }
.gc-doc-movs__fila > span.cifra { font-size: 12px; }
.gc-doc-movs__cargo { color: var(--gc-peligro); }
.gc-doc-movs__cargo .gc-entrada { color: var(--gc-peligro); }
.gc-doc-movs__fila.gc-doc-campo--error .gc-entrada { border-color: var(--gc-peligro); }

.gc-doc-parte { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
.gc-doc-mrz { display: grid; gap: 4px; padding: 10px 12px; border-radius: var(--gc-radio-s); border: 1px dashed var(--gc-borde-fuerte); background: var(--gc-campo); }
.gc-doc-mrz code { display: block; overflow-x: auto; font: 600 12.5px/1.5 var(--gc-fuente-mono); letter-spacing: .12em; white-space: pre; color: var(--gc-texto); }
.gc-doc-mrz.texto-peligro code { color: var(--gc-peligro); }

/* ================================================================ ajustes de la lectura */
.gc-doc-ajustes__titulo { display: flex; align-items: center; gap: 8px; margin: 6px 0 0; padding-top: 14px; border-top: 1px solid var(--gc-borde); font: 600 var(--gc-t-m)/1.3 var(--gc-fuente-titulos); }
.gc-doc-ajustes__titulo .gc-i { color: var(--gc-enlace); }
.gc-doc-ajustes__texto { margin: 0; font-size: var(--gc-t-s); line-height: 1.5; }
.gc-doc-ajustes__destinos { display: grid; gap: 10px; padding: 12px; border-radius: var(--gc-radio); border: 1px solid var(--gc-borde); background: var(--gc-campo); }
.gc-doc-ajustes .solo-experto { display: grid; gap: 12px; }

/* ================================================================ pantallas estrechas */
@media (max-width: 760px) {
  .gc-revisar__rejilla [class*="ancho-"] { grid-column: span 12; }
  .gc-doc-tipo__cambio { grid-template-columns: 1fr; }
  .gc-doc-movs__fila, html[data-vista="experta"] .gc-doc-movs__fila { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .gc-doc-movs__fila > :nth-child(2) { grid-column: 1 / -1; order: -1; }
  .gc-doc-movs__cabecera { display: none; }
  .gc-doc-parte { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .gc-doc-parte > :first-child { grid-column: 1 / -1; }
}

/* Nóminas y seguros sociales sin el permiso de nóminas (D-376): en vez del visor, un aviso claro de que el contenido está reservado. */
.gc-revisar__visor.gc-doc-reservado { position: static; height: auto; min-height: 0; padding: 28px 16px; justify-content: center; }
.gc-doc-reservado .gc-vacio { padding: 0; }
.gc-doc-reservado .gc-vacio p { max-width: 46ch; margin-inline: auto; }
.gc-doc-reservado .gc-vacio .fila { flex-direction: column; text-align: center; }

/* Deshacer el destino ya aplicado (D-433): lo que se deshace, lo que no se toca y el motivo. */
.gc-doc-deshacer { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.gc-doc-deshacer li { display: flex; align-items: flex-start; gap: 10px; padding: 9px 12px; border-radius: var(--gc-radio-s); background: var(--gc-superficie-2); font-size: 13.5px; line-height: 1.5; }
.gc-doc-deshacer li .gc-i { flex: none; margin-top: 2px; }
.gc-doc-deshacer--quita li .gc-i { color: var(--gc-exito); }
.gc-doc-deshacer--queda li .gc-i { color: var(--gc-aviso); }
.gc-doc-deshacer__titulo { margin: 4px 0 6px; font-size: var(--gc-t-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--gc-texto-tenue); }
.gc-doc-deshacer__motivo { display: grid; gap: 6px; margin-top: 4px; font-size: 13px; color: var(--gc-texto-suave); }

/* ---------------------------------------------------------------- importes compactos en la revisión de facturas (D-430)
   Las dos cajas de los totales miden lo mismo (la del total lleva letra mayor) y, en pantalla ancha, el vencimiento deja sitio al importe
   y pasa el IBAN a una segunda línea. */
.gc-revisar__totales .gc-entrada-grupo { min-height: 40px; }
.gc-revisar__totales .gc-entrada { font-size: 14px; }
.gc-revisar__totales .gc-revisar__total .gc-entrada { font-size: 1.15rem; font-weight: 700; }
@media (min-width: 761px) {
  .gc-revisar__tabla-fila--vencimiento { grid-template-columns: 128px minmax(104px, 1fr) minmax(0, 1fr) 32px; }
  .gc-revisar__tabla-fila--vencimiento > :nth-child(4) { grid-column: 1 / 4; grid-row: 2; }
  .gc-revisar__tabla-fila--vencimiento > :nth-child(5) { grid-column: 4; grid-row: 1; }
}
/* La barra de acciones de la revisión en el móvil: sin la pista del teclado (no hay) ni el texto de estado (lo dicen las comprobaciones
   de encima), para que quepan «Descartar» y el botón principal. */
@media (max-width: 760px) {
  .gc-revisar__acciones > .crece { display: none; }
  .gc-revisar__acciones > .gc-boton--fantasma { flex: none; }
  .gc-revisar__acciones > .gc-boton--primario { flex: 1 1 0; min-width: 0; justify-content: center; white-space: normal; line-height: 1.2; text-align: center; }
}

/* ================================================================ de dónde sale cada dato (D-441, origen-datos.js) */
/* Una fila por dato: nombre y valor a la izquierda; de dónde sale (texto del PDF, OCR, QR…), su confianza y, si no llega al umbral
   del Lector, «Revísalo» a la derecha. En el móvil la procedencia baja debajo del valor. */
.gc-origen__nota { margin: 8px 0 10px; font-size: var(--gc-t-s); line-height: 1.45; max-width: 68ch; }
.gc-origen__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.gc-origen__fila { border-radius: var(--gc-radio-s); border: 1px solid transparent; transition: background var(--gc-rapido), border-color var(--gc-rapido); }
.gc-origen__boton { display: grid; grid-template-columns: minmax(0, 9.5rem) minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; width: 100%; padding: 7px 10px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; border-radius: inherit; }
.gc-origen__fila:hover, .gc-origen__fila--activa { background: var(--gc-superficie-2); }
.gc-origen__fila--activa { border-color: color-mix(in srgb, var(--gc-naranja) 55%, var(--gc-borde)); }
.gc-origen__fila--dudosa { background: color-mix(in srgb, var(--gc-aviso) 9%, transparent); border-color: color-mix(in srgb, var(--gc-aviso) 38%, var(--gc-borde)); }
.gc-origen__boton:focus-visible { outline: 2px solid var(--gc-naranja); outline-offset: 1px; }
.gc-origen__nombre { font-size: var(--gc-t-s); color: var(--gc-texto-suave); }
.gc-origen__valor { font-weight: 600; min-width: 0; }
.gc-origen__fuente { display: inline-flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.gc-origen__confianza { font-size: var(--gc-t-s); color: var(--gc-texto-suave); min-width: 2.6em; text-align: right; }
.gc-origen__revisar { display: inline-flex; align-items: center; gap: 4px; font-size: var(--gc-t-s); font-weight: 600; color: var(--gc-aviso); }
.gc-origen__revisar .gc-i { width: 14px; height: 14px; }
@media (max-width: 560px) {
  .gc-origen__boton { grid-template-columns: minmax(0, 1fr) auto; }
  .gc-origen__nombre { grid-column: 1 / -1; }
  .gc-origen__fuente { grid-column: 1 / -1; justify-content: flex-start; }
  .gc-origen__confianza { text-align: left; min-width: 0; }
}