/* =========================================================
   Estilos base de Agro Basualdo.
   Componentes listos (cabecera, barra de módulos, padrón,
   ficha, botones, marcas de estado, sello, talón, diálogo,
   avisos con Deshacer) con lectura cómoda de serie: cuerpo de
   17 px, nada por debajo de 15 px, botones de 48 px.
   El mundo visual de cada cliente se define con impeccable:
   se cambian los tokens de :root (y lo que ese mundo pida),
   no se reescriben los componentes.
   Letra: Archivo (OFL), autoalojada. Licencia en assets/fonts/.
   ========================================================= */

@font-face{
  font-family:'Archivo'; font-style:normal; font-weight:100 900; font-stretch:62% 125%; font-display:swap;
  src:url('../fonts/archivo-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face{
  font-family:'Archivo'; font-style:normal; font-weight:100 900; font-stretch:62% 125%; font-display:swap;
  src:url('../fonts/archivo-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root{
  /* La bolsa de semilla: hoja blanca de alto contraste para leer al sol,
     papel madera en la barra de módulos y tinta plana de impresión de bolsa */
  --papel:    #FFFFFF;   /* superficie de trabajo blanca: contraste máximo al sol */
  --hoja:     #FFFFFF;
  --banda:    #EDE6D6;   /* encabezados de tabla y de tarjeta: papel madera muy claro */
  --banda-2:  #E0D5BE;
  --realce:   #FFFDF6;   /* renglón desplegado */
  --kraft:    #C9A46B;   /* papel madera de la bolsa */
  --kraft-2:  #B58F55;

  /* Tinta: negro de impresión, contraste máximo */
  --tinta:    #141414;
  --tinta-2:  #3A362F;   /* 11:1 sobre la hoja: secundario que se lee al sol */
  --tinta-3:  #6B655A;   /* solo trazos y texto grande */
  --filete:   #D3CBB9;
  --filete-2: #8A816D;

  /* Estados: tintas de sello */
  --sello:      #C62828;  --sello-lt:  #FBE4E0;
  --ambar:      #E0A100;  --ambar-lt:  #FFF0C2;  --ambar-tinta:#5E4100;
  --pago:       #2B6A2E;  --pago-lt:   #DFEED7;
  --curso:      #3A362F;  --curso-lt:  #EDE6D6;   /* en curso: tinta sobre papel madera claro */
  --whatsapp:   #1B7F46;

  /* Un color por cultivo, como su bolsa: siempre el mismo en todo el sistema */
  --maiz:    #F2B705;
  --soja:    #3C7A2E;
  --trigo:   #B7791F;
  --girasol: #E36414;

  /* Escala para lectura cómoda: el texto más chico es de 15 px y el cuerpo de 17 px */
  --t-xs:.9375rem; --t-sm:1rem; --t-md:1.0625rem; --t-lg:1.25rem; --t-xl:1.5rem;
  --t-cifra:1.875rem;
  --pad:1.5rem;
  --rapido:140ms; --suave:cubic-bezier(.16,1,.3,1);

  --guilloche:none;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0; background:var(--papel); color:var(--tinta);
  font:400 var(--t-md)/1.6 'Archivo', system-ui, sans-serif; font-stretch:100%;
  font-variant-numeric:tabular-nums; font-feature-settings:'tnum';
}
::selection{ background:var(--tinta); color:var(--hoja); }
h1,h2,h3{ margin:0; color:var(--tinta); line-height:1.15; }
p{ margin:0; }
a{ color:var(--tinta); text-decoration-color:var(--filete-2); text-underline-offset:.2em; }
a:hover{ text-decoration-color:currentColor; }
:focus-visible{ outline:3px solid var(--ambar); outline-offset:2px; box-shadow:0 0 0 5px var(--tinta); }
button, input, select, textarea{ font:inherit; color:inherit; }
[hidden]{ display:none !important; }
.oculto{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.tenue{ color:var(--tinta-2); }
.chico{ font-size:var(--t-sm); }
.num{ text-align:right; white-space:nowrap; }
.fuerte{ font-weight:650; color:var(--tinta); }

/* Rótulo de formulario: versalitas condensadas y espaciadas */
.rotulo, .ficha dt, .kpi__rotulo, .tabla th, .campo > span, .campo > label, .formulario__seccion{
  font-size:var(--t-xs); font-weight:650; font-stretch:96%; letter-spacing:.005em; color:var(--tinta-2);
}

/* =========================================================
   CABECERA DE BOLETA Y MÓDULOS
   ========================================================= */
.app{ min-height:100vh; display:flex; flex-direction:column; }
.boleta-cab{
  display:grid; grid-template-columns:auto 1fr auto; align-items:stretch;
  background:var(--hoja) var(--guilloche); border-bottom:1px solid var(--filete-2);
}
.boleta-cab__marca{ display:flex; align-items:center; gap:.75rem; padding:.875rem 1.25rem; text-decoration:none; border-right:1px solid var(--filete); }
.boleta-cab__marca img{ width:2.75rem; height:2.75rem; }
.boleta-cab__marca b{ display:block; font-size:1.25rem; font-weight:750; font-stretch:88%; letter-spacing:-.005em; line-height:1.1; }
.boleta-cab__marca small{ display:block; font-size:var(--t-xs); color:var(--tinta-2); }
.boleta-cab__datos{ display:flex; margin:0; }
.boleta-cab__datos > div{ padding:.625rem 1.125rem; border-left:1px solid var(--filete); display:grid; align-content:center; gap:.125rem; }
.boleta-cab__datos dt{ font-size:var(--t-xs); font-weight:600; color:var(--tinta-2); }
.boleta-cab__datos dd{ margin:0; font-weight:600; white-space:nowrap; }
.boleta-cab__salir{ background:none; border:0; padding:0; font-size:var(--t-sm); color:var(--tinta-2); text-decoration:underline; text-decoration-color:var(--filete-2); text-underline-offset:.2em; cursor:pointer; }
.boleta-cab__salir:hover{ color:var(--tinta); }

.modulos{
  position:sticky; top:0; z-index:20; display:flex; background:var(--tinta); overflow-x:auto; scrollbar-width:none;
}
.modulos::-webkit-scrollbar{ display:none; }
.modulos a{
  position:relative; display:flex; align-items:center; gap:.625rem; flex:1 0 auto; justify-content:center; min-height:3.75rem; padding:0 1.25rem;
  color:#E3ECE7; text-decoration:none; font-size:1.0625rem; font-weight:650; font-stretch:96%; border-right:1px solid rgba(255,255,255,.1);
  transition:background-color var(--rapido) var(--suave), color var(--rapido) var(--suave);
}
.modulos a:hover{ color:#fff; background:rgba(255,255,255,.06); }
.modulos a[aria-current="page"]{ color:var(--tinta); background:var(--hoja); }
.modulos a[aria-current="page"]::after{ content:''; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:var(--hoja); }
.modulos .icono{ width:1.5rem; height:1.5rem; }
.modulos__cuenta{
  min-width:1.75rem; padding:.0625rem .4375rem; border:0; font-size:var(--t-xs); font-weight:800; text-align:center; line-height:1.5;
  color:#fff; background:var(--sello);
}
.modulos a[aria-current="page"] .modulos__cuenta{ color:#fff; background:var(--sello); }
.modulos a[aria-current="page"]{ box-shadow:inset 0 4px 0 var(--ambar); }

.contenido{ width:100%; max-width:88rem; margin:0 auto; padding:2.25rem 2rem 4rem; flex:1; }
.pie{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 1.5rem; padding:.875rem 1.75rem;
  border-top:1px solid var(--filete); font-size:var(--t-sm); color:var(--tinta-2);
}
.pie button{ background:none; border:0; padding:0; font:inherit; letter-spacing:inherit; text-transform:inherit; color:inherit; text-decoration:underline; text-decoration-color:var(--filete-2); cursor:pointer; }
.pie button:hover{ color:var(--tinta); }

@media (max-width:900px){
  .boleta-cab{ grid-template-columns:1fr auto; }
  .boleta-cab > span:empty{ display:none; }
  .boleta-cab__datos > div:not(:last-child){ display:none; }
  .boleta-cab__datos dt, .boleta-cab__datos .chico{ display:none; }
  .boleta-cab__datos > div{ padding:.5rem 1rem; }
  .boleta-cab__marca{ border-right:0; padding:.625rem 1rem; }
  .boleta-cab__marca small{ display:none; }
  .modulos{ position:static; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); overflow:visible; }
  .modulos a{ flex-direction:column; gap:.25rem; min-height:4.75rem; padding:.5rem .25rem; font-size:.9375rem; line-height:1.15; text-align:center; border-bottom:1px solid rgba(255,255,255,.1); white-space:normal; }
  .modulos a[aria-current="page"]{ box-shadow:inset 0 4px 0 var(--ambar); }
  .modulos__cuenta{ position:absolute; top:.375rem; right:.5rem; }
  .contenido{ padding:1.125rem 1rem 2.5rem; }
  .pie{ padding:.875rem 1rem; }
}

/* Título del formulario */
.encabezado{
  display:flex; align-items:flex-end; justify-content:space-between; gap:1rem 2rem; flex-wrap:wrap;
  padding-bottom:1rem; margin-bottom:1.5rem; border-bottom:2px solid var(--tinta);
}
.encabezado h1{ font-size:clamp(2rem, 1.4rem + 2vw, 2.875rem); font-weight:780; font-stretch:86%; letter-spacing:-.01em; line-height:1.05; text-wrap:balance; }
.encabezado__bajada{ margin-top:.75rem; color:var(--tinta-2); max-width:60ch; font-size:var(--t-lg); line-height:1.5; }
.encabezado__acciones{ display:flex; gap:.5rem; flex-wrap:wrap; }
.migas{ display:flex; gap:.375rem; list-style:none; padding:0; margin:0 0 .75rem; flex-wrap:wrap; font-size:var(--t-sm); font-weight:600; color:var(--tinta-2); }
.migas li + li::before{ content:'/'; margin-right:.375rem; color:var(--filete-2); }
.migas a{ color:var(--tinta-2); }

/* =========================================================
   HOJAS (secciones del formulario)
   ========================================================= */
.grilla{ display:grid; gap:1.25rem; }
.grilla-2{ display:grid; gap:1.25rem; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
.grilla-3-1{ display:grid; gap:1.25rem; grid-template-columns:minmax(0,1.8fr) minmax(0,1fr); align-items:start; }
@media (max-width:1100px){ .grilla-2, .grilla-3-1{ grid-template-columns:minmax(0,1fr); } }
.columna{ display:grid; gap:1.25rem; align-content:start; min-width:0; }

.tarjeta{ background:var(--hoja); border:1px solid var(--filete-2); min-width:0; position:relative; }
.tarjeta__cab{
  display:flex; align-items:center; justify-content:space-between; gap:.5rem 1rem; flex-wrap:wrap;
  padding:.875rem var(--pad); background:var(--banda); border-bottom:1px solid var(--filete-2);
}
.tarjeta__cab > div:first-child{ flex:1 1 14rem; min-width:0; }
.tarjeta__cab h2{ color:var(--tinta); font-size:var(--t-lg); font-weight:750; font-stretch:96%; }
.tarjeta__cab h2 a{ text-decoration:none; }
.tarjeta__cab p{ font-size:var(--t-sm); color:var(--tinta-2); margin-top:.125rem; }
.tarjeta__cuerpo{ padding:var(--pad); }
.tarjeta__pie{ padding:.75rem var(--pad); border-top:1px solid var(--filete); display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.tarjeta--realce{ outline:2px solid var(--tinta); outline-offset:-1px; }

/* Resumen: una sola franja de casillas, como el pie de una boleta */
.kpis{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(13rem, 1fr)); margin-bottom:1.25rem;
  background:var(--hoja); border:1px solid var(--filete-2);
}
.kpi{ padding:.75rem var(--pad) .875rem; display:grid; gap:.25rem; align-content:start; border-right:1px solid var(--filete); color:inherit; text-decoration:none; }
.kpi:last-child{ border-right:0; }
.kpi .icono{ display:none; }
.kpi__valor{ font-size:var(--t-cifra); font-weight:720; font-stretch:92%; letter-spacing:-.01em; line-height:1.1; }
.kpi__detalle{ font-size:var(--t-sm); color:var(--tinta-2); }
.kpi--alerta .kpi__valor{ color:var(--sello); }
@media (max-width:640px){ .kpi{ border-right:0; border-bottom:1px solid var(--filete); } .kpi:last-child{ border-bottom:0; } }

/* =========================================================
   BOTONES: rectángulos de tinta
   ========================================================= */
.boton{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem; min-height:3rem; padding:.5rem 1.125rem;
  border:2px solid var(--tinta); font-size:var(--t-md); border-radius:0; background:var(--hoja); color:var(--tinta);
  font-weight:700; font-stretch:96%; text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background-color var(--rapido) var(--suave), color var(--rapido) var(--suave);
}
.boton:hover{ background:var(--banda); }
.boton:active{ transform:translateY(1px); }
.boton .icono{ width:1.375rem; height:1.375rem; }
.boton--primario{ background:var(--tinta); color:var(--hoja); }
.boton--primario:hover{ background:#0F2621; }
.boton--agua{ background:var(--tinta); color:var(--hoja); }
.boton--agua:hover{ background:#0F2621; }
.boton--whatsapp{ background:var(--whatsapp); border-color:var(--whatsapp); color:#fff; }
.boton--whatsapp:hover{ background:#136636; }
.boton--fantasma{ border-color:transparent; background:transparent; text-decoration:underline; text-decoration-color:var(--filete-2); text-underline-offset:.2em; padding-inline:.25rem; }
.boton--fantasma:hover{ background:transparent; text-decoration-color:currentColor; }
.boton--chico{ min-height:2.625rem; padding:.3125rem .875rem; font-size:var(--t-sm); }
.boton--peligro{ color:var(--sello); border-color:var(--sello); }
.boton--bloque{ width:100%; }
.boton--cargando{ opacity:.6; pointer-events:none; }
.boton[disabled]{ opacity:.45; cursor:not-allowed; }
@media (pointer:coarse){ .boton{ min-height:3.25rem; } .boton--chico{ min-height:3rem; } }

/* Marca de estado: tinta de sello chica, en recuadro */
.pastilla{
  display:inline-flex; align-items:center; padding:.125rem .625rem; border:2px solid currentColor; white-space:nowrap;
  font-size:var(--t-xs); font-weight:750; font-stretch:94%; letter-spacing:.01em; line-height:1.45;
  color:var(--tinta-2); background:transparent;
}
.pastilla--verde{ color:var(--pago); background:var(--pago-lt); }
.pastilla--ambar{ color:var(--ambar-tinta); background:var(--ambar-lt); }
.pastilla--rojo{ color:var(--sello); background:var(--sello-lt); }
.pastilla--azul{ color:var(--curso); background:var(--curso-lt); }
.pastilla--agua{ color:var(--tinta); background:var(--banda); }
.pastilla--gris{ color:var(--tinta-2); }

/* Sello de goma: el momento de la interfaz. Se imprime al marcar pagado, cobrado o enviado. */
.sello{
  display:inline-block; padding:.25rem .625rem; border:3px double currentColor; color:var(--sello);
  font-weight:800; font-stretch:82%; font-size:var(--t-sm); letter-spacing:.08em; text-transform:uppercase; line-height:1.15;
  transform:rotate(-5deg); mix-blend-mode:multiply; opacity:.88; white-space:nowrap;
}
.sello--pago{ color:var(--pago); }
.sello--curso{ color:var(--curso); }
.recien, .sello.recien{ animation:sellar 420ms var(--suave) both; }
@keyframes sellar{
  0%{ transform:rotate(-5deg) scale(1.9); opacity:0; filter:blur(3px); }
  55%{ transform:rotate(-5deg) scale(.94); opacity:1; filter:blur(0); }
  100%{ transform:rotate(-5deg) scale(1); }
}
.pastilla.recien{ animation-name:sellar-chico; }
@keyframes sellar-chico{ 0%{ transform:scale(1.8); opacity:0; filter:blur(2px); } 60%{ transform:scale(.95); opacity:1; filter:blur(0); } 100%{ transform:none; } }

.icono{ display:inline-block; width:1.25rem; height:1.25rem; flex:none; vertical-align:middle; }
.icono svg{ width:100%; height:100%; display:block; stroke-width:1.6; }

/* =========================================================
   TABLAS: padrón con columnas fijas
   ========================================================= */
.tabla-marco{ overflow-x:auto; }
.tabla{ width:100%; border-collapse:collapse; }
.tabla th{ text-align:left; background:var(--banda); padding:.75rem 1rem; border-bottom:1px solid var(--filete-2); white-space:nowrap; }
.tabla td{ padding:1rem; border-bottom:1px solid var(--filete); vertical-align:middle; transition:opacity var(--rapido) var(--suave); }
.tabla th + th, .tabla td + td{ border-left:1px solid color-mix(in srgb, var(--filete) 55%, transparent); }
.tabla tr:last-child td{ border-bottom:0; }
.tabla tbody tr:hover td{ background:color-mix(in srgb, var(--banda) 45%, transparent); }
.tabla .num, .tabla th.num{ text-align:right; }
.tabla td.acciones{ text-align:right; white-space:nowrap; }
.tabla td.acciones .boton + .boton{ margin-left:.375rem; }
.tabla a.fila-enlace{ font-weight:650; text-decoration:none; }
.tabla a.fila-enlace:hover{ text-decoration:underline; }
.tabla small{ display:block; color:var(--tinta-2); font-size:var(--t-sm); }
.tabla tfoot td{ font-weight:750; background:var(--banda); border-top:2px solid var(--tinta); }
.monto-negativo, .tabla small.monto-negativo{ color:var(--sello); }
.tabla tr.fila--rojo td{ background:color-mix(in srgb, var(--sello-lt) 70%, var(--hoja)); }
.tabla tr.fila--ambar td{ background:color-mix(in srgb, var(--ambar-lt) 75%, var(--hoja)); }
.tabla tr.fila--rojo td:first-child{ box-shadow:inset 1px 0 0 var(--sello); }
.tabla tr.fila--ambar td:first-child{ box-shadow:inset 1px 0 0 var(--ambar); }
.tabla td .sello{ font-size:var(--t-xs); padding:.25rem .625rem; }
/* Padrón: el inmueble, el importe y el estado ocupan el mismo lugar en todos los módulos */
.tabla--padron{ table-layout:fixed; min-width:70rem; }
.tabla--padron .col-inmueble{ width:18%; }
.tabla--padron .col-monto{ width:11.5rem; }
.tabla--padron .col-estado{ width:12.5rem; }
.tabla--padron .col-acciones{ width:15.5rem; }
.tabla--padron td.acciones{ white-space:normal; }
.tabla--padron td.acciones .boton{ margin:.125rem 0 .125rem .375rem; }
.tabla--padron td{ overflow-wrap:break-word; }
@media (max-width:767px){ .tabla--padron{ min-width:0; table-layout:auto; } }

/* La fila elegida se despliega en el lugar y el resto baja de tono */
/* Con una fila abierta, las demás no se atenúan: se tienen que poder leer y usar igual */
.tabla tr.abierta td{ background:var(--realce); border-bottom-color:transparent; }
.tabla tr.despliegue td{ background:var(--realce); padding:0 .875rem 1rem; border-bottom:2px solid var(--tinta); }
.desplegar{ display:inline-grid; place-items:center; width:2.75rem; height:2.75rem; margin-right:.375rem; border:1px solid var(--filete-2); background:var(--hoja); cursor:pointer; vertical-align:middle; }
.desplegar .icono{ width:1.25rem; height:1.25rem; transition:transform var(--rapido) var(--suave); }
tr.abierta .desplegar .icono{ transform:rotate(90deg); }
.despliegue__cuerpo{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); border:1px solid var(--filete); animation:desplegar 260ms var(--suave) both; }
.despliegue__cuerpo > div{ padding:.625rem .75rem; border-right:1px solid var(--filete); }
.despliegue__cuerpo > div:last-child{ border-right:0; }
.despliegue__cuerpo dd{ margin:.125rem 0 0; }
.despliegue__pie{ display:flex; justify-content:flex-end; gap:.5rem; padding-top:.75rem; }
@keyframes desplegar{ from{ opacity:0; clip-path:inset(0 0 100% 0); } to{ opacity:1; clip-path:inset(0); } }
@media (max-width:767px){ .despliegue__cuerpo{ grid-template-columns:1fr 1fr; } .despliegue__cuerpo > div:nth-child(2n){ border-right:0; } .despliegue__cuerpo > div{ border-bottom:1px solid var(--filete); } }

@media (max-width:767px){
  .tabla--apilable thead{ display:none; }
  .tabla--apilable, .tabla--apilable tbody, .tabla--apilable tr, .tabla--apilable td{ display:block; width:100%; }
  .tabla--apilable tr{ padding:1.125rem 1.125rem; border-bottom:1px solid var(--filete); }
  .tabla--apilable td{ padding:.375rem 0; border:0 !important; text-align:left !important; }
  .tabla--apilable td[data-rotulo]::before{ content:attr(data-rotulo); display:block; margin-bottom:.125rem; font-size:var(--t-xs); font-weight:650; color:var(--tinta-2); }
  .tabla--apilable td.acciones{ padding-top:.5rem; display:flex; flex-wrap:wrap; gap:.375rem; }
  .tabla--apilable td.acciones .boton + .boton{ margin-left:0; }
  .tabla--apilable tr.despliegue{ padding-top:0; }
  .tabla--apilable .solo-escritorio{ display:none; }
  .tabla--apilable tr.fila--rojo{ background:color-mix(in srgb, var(--sello-lt) 70%, var(--hoja)); box-shadow:inset 3px 0 0 var(--sello); }
  .tabla--apilable tr.fila--ambar{ background:color-mix(in srgb, var(--ambar-lt) 75%, var(--hoja)); box-shadow:inset 3px 0 0 var(--ambar); }
  .tabla--apilable tr.fila--rojo td, .tabla--apilable tr.fila--ambar td{ background:transparent; box-shadow:none !important; }
}

/* =========================================================
   RENGLONES
   ========================================================= */
.renglones{ list-style:none; margin:0; padding:0; }
.renglon{ display:flex; align-items:center; gap:1rem; padding:1rem var(--pad); border-bottom:1px solid var(--filete); text-decoration:none; color:inherit; }
.renglones > li:last-child .renglon, .renglones > .renglon:last-child{ border-bottom:0; }
a.renglon:hover, button.renglon:hover{ background:color-mix(in srgb, var(--banda) 45%, transparent); }
.renglon__icono{ width:2.75rem; height:2.75rem; display:grid; place-items:center; flex:none; border:1px solid var(--filete-2); color:var(--tinta-2); background:var(--hoja); }
.renglon__icono .icono{ width:1.5rem; height:1.5rem; }
.renglon__icono--rojo{ color:var(--sello); border-color:currentColor; background:var(--sello-lt); }
.renglon__icono--ambar{ color:var(--ambar-tinta); border-color:var(--ambar); background:var(--ambar-lt); }
.renglon__icono--azul{ color:var(--curso); border-color:currentColor; background:var(--curso-lt); }
.renglon__icono--verde{ color:var(--pago); border-color:currentColor; background:var(--pago-lt); }
.renglon__icono--agua{ color:var(--tinta); border-color:var(--tinta); }
.renglon__cuerpo{ flex:1; min-width:0; }
.renglon__titulo{ display:block; font-weight:650; color:var(--tinta); }
.renglon__detalle{ display:block; font-size:var(--t-sm); color:var(--tinta-2); }
.renglon__lado{ text-align:right; display:grid; gap:.25rem; justify-items:end; }

.vacio{ padding:2rem var(--pad); text-align:center; color:var(--tinta-2); display:grid; gap:.5rem; justify-items:center; }
.vacio .icono{ width:1.75rem; height:1.75rem; color:var(--tinta-3); }

/* Franja: la banda de vencimiento de la boleta */
.franja{ display:flex; gap:.75rem; align-items:flex-start; padding:.75rem 1rem; border:1px solid var(--filete-2); background:var(--hoja); margin-bottom:1.25rem; }
.franja > .icono{ margin-top:.0625rem; }
.franja__cuerpo{ flex:1; min-width:0; }
.franja__titulo{ font-weight:700; }
.franja--agua{ background:var(--hoja) var(--guilloche); border-color:var(--tinta); }
.franja--ambar{ background:var(--ambar-lt); border-color:var(--ambar); color:var(--ambar-tinta); }
.franja--ambar .franja__titulo{ color:var(--ambar-tinta); }
.franja--rojo{ background:var(--sello-lt); border-color:var(--sello); }
.franja--rojo > .icono, .franja--rojo .franja__titulo{ color:var(--sello); }
.franja .boton{ margin-top:.125rem; }

/* Filtros: casillas contiguas de formulario */
.filtros{ display:flex; flex-wrap:wrap; align-items:center; gap:.375rem; }
.filtros[role="group"]{ gap:0; }
.filtros[role="group"] button{ margin-left:-1px; }
.filtros button{
  display:inline-flex; align-items:center; gap:.375rem; min-height:2.75rem; padding:.375rem 1rem;
  border:2px solid var(--filete-2); border-radius:0; background:var(--hoja); color:var(--tinta);
  font-size:var(--t-sm); font-weight:650; font-stretch:96%; cursor:pointer;
}
.filtros button:hover{ background:var(--banda); }
.filtros button[aria-pressed="true"]{ background:var(--tinta); border-color:var(--tinta); color:var(--hoja); position:relative; z-index:1; }
.filtros button b{ font-weight:700; opacity:.7; }
.filtros button[disabled]{ opacity:.45; cursor:not-allowed; }
.barra-herramientas{ display:flex; gap:.75rem; flex-wrap:wrap; align-items:center; justify-content:space-between; padding:.75rem var(--pad); border-bottom:1px solid var(--filete-2); }
@media (pointer:coarse){ .filtros button{ min-height:3rem; } }

/* =========================================================
   FORMULARIOS: recuadros rotulados
   ========================================================= */
.formulario{ display:grid; gap:1rem; }
.formulario--2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
.formulario--3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
@media (max-width:767px){ .formulario--2, .formulario--3{ grid-template-columns:minmax(0,1fr); } }
.campo{ display:grid; gap:.3125rem; align-content:start; }
.campo--ancho{ grid-column:1 / -1; }
.campo small{ font-size:var(--t-xs); color:var(--tinta-2); }
.entrada, .seleccion, .area{
  width:100%; min-height:3rem; padding:.5rem .875rem; border:2px solid var(--filete-2); border-radius:0; font-size:var(--t-md);
  background:var(--hoja); color:var(--tinta); caret-color:var(--tinta);
}
.entrada::placeholder, .area::placeholder{ color:var(--tinta-3); font-style:italic; }
.entrada:focus, .seleccion:focus, .area:focus{ outline:none; border-color:var(--tinta); box-shadow:inset 0 -2px 0 var(--tinta); }
.entrada[readonly]{ background:var(--banda); }
.seleccion{ appearance:none; -webkit-appearance:none; padding-right:2rem; cursor:pointer;
  background:var(--hoja) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23141414' stroke-width='1.6'%3E%3Cpath d='m3 6 5 5 5-5'/%3E%3C/svg%3E") no-repeat right .625rem center / 12px; }
.area{ min-height:5rem; resize:vertical; line-height:1.5; }
.buscador{ max-width:22rem; }
@media (max-width:767px){ .entrada, .seleccion, .area{ font-size:1rem; min-height:2.75rem; } .buscador{ max-width:none; } }
.formulario__seccion{ grid-column:1 / -1; padding:.625rem 0 0; margin-top:.75rem; border-top:2px solid var(--tinta); color:var(--tinta); font-size:var(--t-lg); font-weight:750; }
.formulario__seccion:first-child{ margin-top:0; }
input[type="file"]::file-selector-button{ font:inherit; font-weight:600; border:1px solid var(--tinta); border-radius:0; background:var(--hoja); color:var(--tinta); padding:.25rem .75rem; margin-right:.625rem; cursor:pointer; }

/* Ficha: pares rótulo / valor en recuadros */
.ficha{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); margin:0; border-top:1px solid var(--filete); border-left:1px solid var(--filete); }
.ficha--3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
@media (max-width:767px){ .ficha, .ficha--3{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); } }
.ficha > div{ padding:.75rem 1rem .875rem; border-right:1px solid var(--filete); border-bottom:1px solid var(--filete); min-width:0; }
.ficha dd{ margin:.1875rem 0 0; color:var(--tinta); font-weight:500; overflow-wrap:anywhere; }

/* Canon: la cifra monumental del legajo */
.canon{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding:1rem var(--pad) 1.125rem; border-bottom:1px solid var(--filete-2); background:var(--hoja) var(--guilloche); }
.canon__valor{ font-size:clamp(2.25rem, 1.6rem + 2.4vw, 3.25rem); font-weight:760; font-stretch:84%; letter-spacing:-.02em; line-height:1; }

/* Talón troquelado */
.talon{ position:relative; margin-top:1.25rem; padding:1rem var(--pad); border-top:1px dashed var(--filete-2); background:var(--hoja); }
.talon::before{
  content:''; position:absolute; top:-.6875rem; left:.75rem; width:1.25rem; height:1.25rem; background:var(--hoja)
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F7B71' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M3 7a3 3 0 1 0 6 0a3 3 0 1 0 -6 0'/%3E%3Cpath d='M3 17a3 3 0 1 0 6 0a3 3 0 1 0 -6 0'/%3E%3Cpath d='M8.6 8.6l10.4 10.4'/%3E%3Cpath d='M8.6 15.4l10.4 -10.4'/%3E%3C/svg%3E") no-repeat center / 1rem;
}
.tarjeta > .talon{ margin-top:0; }
.kpis--pie{ margin:1.25rem 0 0; }
.talon__fila{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.talon__total{ font-size:var(--t-cifra); font-weight:760; font-stretch:86%; letter-spacing:-.01em; }

/* Visor del contrato. En pantallas chicas el PDF no se dibuja dentro de la página: va la primera hoja como vista previa. */
.vista-previa{ display:block; border:1px solid var(--filete-2); background:#fff; }
.vista-previa img{ display:block; width:100%; height:auto; }
.vista-previa__pie{ display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding:.5rem .75rem; border-top:1px dashed var(--filete-2); background:var(--hoja); }
.visor{ width:100%; height:44rem; max-height:78vh; border:1px solid var(--filete-2); background:var(--banda); display:block; }
.archivo{ position:relative; overflow:hidden; }
.archivo input{ position:absolute; inset:0; opacity:0; cursor:pointer; }

/* Línea de actualizaciones */
.linea{ list-style:none; margin:0; padding:0 0 0 1.125rem; border-left:1px solid var(--filete-2); display:grid; gap:.875rem; }
.linea li{ position:relative; }
.linea li::before{ content:''; position:absolute; left:calc(-1.125rem - 5px); top:.3rem; width:9px; height:9px; background:var(--hoja); border:1px solid var(--tinta); }
.linea li.proxima::before{ background:var(--ambar); border-color:var(--ambar-tinta); }

/* Cálculo del aumento: renglones con puntos guía */
.calculo{ display:grid; grid-template-columns:1fr auto; margin:0; font-size:var(--t-sm); border:1px solid var(--filete-2); background:var(--hoja); }
.calculo dt, .calculo dd{ padding:.4375rem .75rem; border-bottom:1px dotted var(--filete-2); }
.calculo dt{ color:var(--tinta-2); }
.calculo dd{ margin:0; text-align:right; font-weight:600; }
.calculo dt:nth-last-of-type(1), .calculo dd:last-of-type{ border-bottom:0; background:var(--banda); }
.calculo .total{ font-size:var(--t-cifra); font-weight:760; font-stretch:86%; }

.progreso{ height:.5rem; border:1px solid var(--filete-2); background:var(--hoja); }
.progreso span{ display:block; height:100%; background:var(--tinta); }

/* =========================================================
   DIÁLOGO Y AVISOS
   ========================================================= */
dialog.dialogo{ width:min(44rem, calc(100vw - 2rem)); max-height:calc(100vh - 2rem); padding:0; border:1px solid var(--tinta); border-radius:0; background:var(--hoja); color:var(--tinta); box-shadow:0 20px 48px -12px rgba(15,35,30,.35); }
dialog.dialogo[open]{ animation:entra-dialogo 220ms var(--suave) both; }
@keyframes entra-dialogo{ from{ opacity:0; transform:translateY(10px); } }
dialog.dialogo::backdrop{ background:rgba(20,20,20,.45); }
.dialogo__cab{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.625rem var(--pad); background:var(--banda); border-bottom:1px solid var(--filete-2); position:sticky; top:0; z-index:1; }
.dialogo__cab h2{ font-size:var(--t-xl); font-weight:780; font-stretch:92%; }
.dialogo__cerrar{ width:3rem; height:3rem; display:grid; place-items:center; border:1px solid transparent; background:none; cursor:pointer; color:var(--tinta); }
.dialogo__cerrar:hover{ border-color:var(--filete-2); }
.dialogo__cuerpo{ padding:var(--pad); display:grid; gap:1rem; }
.dialogo__pie{ display:flex; justify-content:flex-end; gap:.5rem; flex-wrap:wrap; padding:.75rem var(--pad); border-top:1px dashed var(--filete-2); position:sticky; bottom:0; background:var(--hoja); }
.mensaje-previo{ white-space:pre-wrap; padding:.875rem 1rem; border:1px solid var(--filete-2); background:var(--hoja); font-size:var(--t-sm); line-height:1.55; max-height:18rem; overflow:auto; }

.tostadas{ position:fixed; right:1.25rem; bottom:1.25rem; z-index:60; display:grid; gap:.625rem; max-width:min(30rem, calc(100vw - 2rem)); }
@media (max-width:767px){ .tostadas{ left:1rem; right:1rem; bottom:1rem; max-width:none; } }
.tostada{ display:flex; gap:.75rem; align-items:center; padding:1rem 1.125rem; font-size:var(--t-md); line-height:1.4; background:var(--tinta); color:var(--hoja); box-shadow:0 12px 28px -10px rgba(15,35,30,.45); animation:entra-tostada 240ms var(--suave) both; }
.tostada .icono{ color:var(--maiz); width:1.5rem; height:1.5rem; }
.tostada > span:not(.icono){ flex:1; min-width:0; }
.tostada__accion{ flex:none; min-height:2.75rem; padding:.25rem 1rem; border:2px solid var(--hoja); background:transparent; color:var(--hoja); font-weight:750; cursor:pointer; }
.tostada__accion:hover{ background:var(--hoja); color:var(--tinta); }
@keyframes entra-tostada{ from{ transform:translateY(8px); opacity:0; } }
@media (prefers-reduced-motion:reduce){ *, *::before, *::after{ animation:none !important; transition:none !important; } }

/* =========================================================
   LIQUIDACIÓN IMPRIMIBLE
   ========================================================= */
.recibo{ padding:1.5rem; background:var(--hoja) var(--guilloche); border:1px solid var(--tinta); }
.recibo__cab{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; padding-bottom:1rem; margin-bottom:1rem; border-bottom:2px solid var(--tinta); }
.recibo__cab b{ font-size:var(--t-lg); font-stretch:92%; }
.recibo__total{ display:flex; justify-content:space-between; align-items:baseline; margin-top:1.25rem; padding:1rem 0 0; border-top:1px dashed var(--filete-2); }
.recibo__total b{ font-size:var(--t-cifra); font-stretch:86%; }

/* =========================================================
   PÁGINA DE ACCESO
   ========================================================= */
.pagina-acceso{ min-height:100vh; display:grid; place-items:center; padding:2rem 1rem; background:var(--papel) var(--guilloche); }
.acceso{ width:100%; max-width:31rem; display:grid; gap:1rem; }
.acceso__marca{ display:flex; align-items:center; gap:.75rem; }
.acceso__marca b{ display:block; font-size:var(--t-xl); font-weight:760; font-stretch:86%; line-height:1.1; }
.acceso__marca small{ display:block; font-size:var(--t-xs); color:var(--tinta-2); }
.acceso__tarjeta{ padding:1.5rem; display:grid; gap:1rem; border-top:3px solid var(--tinta); }
.acceso__tarjeta h1{ font-size:2rem; font-weight:780; font-stretch:88%; line-height:1.1; }
.acceso__error{ margin:0; color:var(--sello); font-size:var(--t-sm); font-weight:600; }
.acceso__o{ display:flex; align-items:center; gap:.75rem; color:var(--tinta-2); font-size:var(--t-sm); margin:0; }
.acceso__o::before, .acceso__o::after{ content:''; flex:1; border-top:1px dashed var(--filete-2); }
.acceso__pie{ font-size:var(--t-sm); }

@media print{
  .boleta-cab, .modulos, .pie, .encabezado__acciones, .no-imprimir, .tostadas{ display:none !important; }
  body{ background:#fff; }
  .contenido{ padding:0; max-width:none; }
}

/* =========================================================
   MUNDO DE AGRO BASUALDO: LA BOLSA DE SEMILLA
   Capa del cliente sobre la plantilla. Papel madera en la barra
   de módulos, letra condensada pesada de impresión de bolsa,
   un color fijo por cultivo y el rótulo cosido de cada lote.
   ========================================================= */
::selection{ background:var(--maiz); color:var(--tinta); }
html{ scrollbar-color:var(--kraft-2) var(--papel); accent-color:var(--tinta); caret-color:var(--tinta); }
:focus-visible{ outline:3px solid var(--tinta); outline-offset:2px; box-shadow:0 0 0 6px var(--maiz); }

/* Cabecera blanca y barra de módulos de papel madera */
.boleta-cab{ background:var(--hoja); border-bottom:0; }
.boleta-cab__marca{ border-right-color:var(--filete); }
.boleta-cab__marca b{ font-size:1.375rem; font-weight:850; font-stretch:72%; letter-spacing:.01em; text-transform:uppercase; }
.boleta-cab__datos > div{ border-left-color:var(--filete); }
.modulos{ background:var(--kraft); border-top:2px solid var(--tinta); border-bottom:2px solid var(--tinta); }
.modulos a{
  color:var(--tinta); font-weight:850; font-stretch:74%; font-size:1.25rem; letter-spacing:.02em; text-transform:uppercase;
  border-right:1px solid color-mix(in srgb, var(--tinta) 25%, transparent);
}
.modulos a:hover{ color:var(--tinta); background:color-mix(in srgb, #fff 22%, transparent); }
.modulos a[aria-current="page"], .modulos a[aria-current="page"]:hover{ background:var(--tinta); color:#fff; box-shadow:none; }
.modulos a[aria-current="page"]::after{ display:none; }
.modulos .icono svg{ stroke-width:2; }
.modulos__cuenta{ font-stretch:90%; letter-spacing:0; border:2px solid var(--tinta); background:var(--sello); color:#fff; line-height:1.3; }
.modulos a[aria-current="page"] .modulos__cuenta{ border-color:#fff; }
@media (max-width:900px){
  .modulos{ position:sticky; top:0; }
  .modulos a{ font-size:1rem; font-stretch:66%; letter-spacing:0; border-bottom:0; min-width:0; overflow-wrap:anywhere; }
  .modulos a[aria-current="page"]{ box-shadow:none; }
}

/* Títulos: letra de bolsa, condensada y pesada */
.encabezado{ border-bottom:3px solid var(--tinta); }
.encabezado h1{ font-size:clamp(2.375rem, 1.6rem + 2.6vw, 3.625rem); font-weight:880; font-stretch:68%; letter-spacing:.005em; text-transform:uppercase; line-height:.95; }
.encabezado__bajada{ color:var(--tinta-2); }
.tarjeta{ border:1.5px solid var(--tinta); }
.tarjeta__cab{ background:var(--banda); border-bottom:1.5px solid var(--tinta); }
.tarjeta__cab h2{ font-size:1.5rem; font-weight:850; font-stretch:72%; letter-spacing:.01em; text-transform:uppercase; }
.kpis{ border:1.5px solid var(--tinta); }
.kpi{ border-right-color:var(--filete-2); }
.kpi__rotulo{ color:var(--tinta-2); }
.kpi__valor{ font-size:2.125rem; font-weight:850; font-stretch:70%; letter-spacing:0; }
.tabla th{ background:var(--banda); color:var(--tinta); font-weight:750; border-bottom:1.5px solid var(--tinta); }
.tabla td{ border-bottom-color:var(--filete); }
.tabla small{ color:var(--tinta-2); }
.tabla--padron .col-inmueble{ width:23%; }
.boton{ border-width:2px; font-weight:750; }
.boton--primario, .boton--agua{ background:var(--tinta); border-color:var(--tinta); }
.boton--primario:hover, .boton--agua:hover{ background:#000; }
.filtros button{ border-color:var(--tinta); font-weight:700; }
.filtros button[aria-pressed="true"] b{ opacity:.85; }
.franja{ border-width:1.5px; }
.franja a{ color:inherit; font-weight:700; }
.pastilla{ font-stretch:88%; }
.sello{ font-stretch:72%; font-size:var(--t-md); }
dialog.dialogo{ border:2px solid var(--tinta); }
.dialogo__cab{ background:var(--banda); border-bottom:1.5px solid var(--tinta); }
.dialogo__cab h2{ font-weight:880; font-stretch:72%; text-transform:uppercase; letter-spacing:.01em; }
.pie{ border-top:2px solid var(--tinta); }
.progreso{ height:.625rem; border:1.5px solid var(--tinta); }

/* Color del cultivo: cada lote, insumo o grano lo hereda con su clase */
.cultivo--maiz{ --cultivo:var(--maiz); }
.cultivo--soja{ --cultivo:var(--soja); }
.cultivo--trigo{ --cultivo:var(--trigo); }
.cultivo--girasol{ --cultivo:var(--girasol); }

/* El rótulo cosido del lote: ojal, número grande y banda del color del cultivo */
.lote-celda{ display:flex; align-items:center; gap:.75rem; }
.lote-celda__texto{ min-width:0; }
.lote-celda__texto small{ display:block; }
.rotulo-lote{
  position:relative; flex:none; display:grid; justify-items:center; align-content:center;
  width:4.25rem; min-height:4.25rem; padding:.375rem .375rem .75rem 1.125rem;
  background:var(--hoja); border:1.5px solid var(--tinta); color:var(--tinta);
}
.rotulo-lote::before{
  content:''; position:absolute; left:.375rem; top:50%; width:.5rem; height:.5rem; margin-top:-.4375rem;
  border:1.5px solid var(--tinta); border-radius:50%; background:var(--papel);
}
.rotulo-lote::after{
  content:''; position:absolute; left:-1.5px; right:-1.5px; bottom:-1.5px; height:.4375rem;
  background:var(--cultivo, var(--tinta-3)); transform-origin:left center;
}
.rotulo-lote__que{ font-size:.75rem; font-weight:800; font-stretch:80%; letter-spacing:.08em; text-transform:uppercase; line-height:1; }
.rotulo-lote__num{ font-size:2rem; font-weight:900; font-stretch:62%; line-height:.95; font-variant-numeric:tabular-nums; }
.rotulo-lote.recien::after{ animation:coser 520ms var(--suave) both; }
@keyframes coser{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
.chip-cultivo{ display:inline-flex; align-items:center; gap:.375rem; font-weight:650; }
.chip-cultivo::before{ content:''; width:.875rem; height:.875rem; border:1.5px solid var(--tinta); background:var(--cultivo, var(--tinta-3)); flex:none; }

/* Margen de todos los lotes sobre una misma regla */
.regla{ display:block; height:.625rem; margin-top:.375rem; background:var(--banda); position:relative; }
.regla span{ position:absolute; left:0; top:0; bottom:0; background:var(--cultivo, var(--tinta)); border-right:1.5px solid var(--tinta); }
.regla--negativa span{ background:var(--sello); }

/* Calendario de labores a escala real de días */
.calendario{ padding:1rem var(--pad) .75rem; border-bottom:1.5px solid var(--tinta); background:var(--hoja); }
.calendario__titulo{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-weight:750; margin-bottom:.625rem; }
.calendario__pista{ position:relative; height:5.25rem; margin:0 .75rem; border-bottom:2px solid var(--tinta); }
.calendario__hoy{ position:absolute; top:-.25rem; bottom:-.5rem; width:0; border-left:2px dashed var(--tinta); }
.calendario__hoy span{ position:absolute; top:-1.375rem; left:0; transform:translateX(-50%); font-size:var(--t-xs); font-weight:800; font-stretch:80%; text-transform:uppercase; white-space:nowrap; }
.calendario__atraso{ position:absolute; top:0; bottom:0; left:0; background:var(--sello-lt); }
.calendario__marca{
  position:absolute; bottom:0; transform:translateX(-50%); display:grid; justify-items:center; gap:2px;
  background:none; border:0; padding:0 0 0; cursor:pointer; color:var(--tinta);
}
.calendario__marca b{ font-size:.9375rem; font-weight:900; font-stretch:66%; line-height:1; padding:.125rem .25rem; background:var(--hoja); border:1.5px solid var(--tinta); }
.calendario__marca i{ display:block; width:.5rem; background:var(--cultivo, var(--tinta-3)); border:1.5px solid var(--tinta); border-bottom:0; }
.calendario__marca--atrasada b{ background:var(--sello); color:#fff; border-color:var(--sello); }
.calendario__marca:hover b, .calendario__marca:focus-visible b{ background:var(--tinta); color:#fff; }
.calendario__eje{ position:relative; height:1.5rem; margin:0 .75rem; font-size:var(--t-xs); color:var(--tinta-2); }
.calendario__eje span{ position:absolute; top:.25rem; transform:translateX(-50%); white-space:nowrap; }
@media (max-width:767px){ .calendario__marca b{ font-size:.8125rem; } .calendario__pista{ margin:0 .5rem; } }

/* Recorrido de una carga: qué pasa en cada módulo, siempre en el mismo orden */
.recorrido{ list-style:none; margin:0; padding:0; display:grid; border:1.5px solid var(--tinta); }
.recorrido li{ display:flex; gap:.75rem; align-items:flex-start; padding:.625rem .875rem; border-bottom:1px solid var(--filete); }
.recorrido li:last-child{ border-bottom:0; }
.recorrido__modulo{ flex:none; width:9.5rem; font-weight:850; font-stretch:74%; text-transform:uppercase; letter-spacing:.02em; }
.recorrido li > span:last-child{ flex:1; min-width:0; }
@media (max-width:767px){ .recorrido li{ display:grid; gap:.125rem; } .recorrido__modulo{ width:auto; } }

/* En el celular, cada fila es una ficha compacta: el lote arriba, dos datos por renglón y la acción abajo */
@media (max-width:767px){
  .tabla--padron.tabla--apilable tr:not(.despliegue){ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); column-gap:1rem; row-gap:.25rem; }
  .tabla--padron.tabla--apilable tr:not(.despliegue) > td:first-child,
  .tabla--padron.tabla--apilable tr:not(.despliegue) > td.acciones{ grid-column:1 / -1; }
  .tabla--padron.tabla--apilable tr:not(.despliegue) > td.acciones:empty{ display:none; }
  .tabla--padron.tabla--apilable tr:not(.despliegue) > td:first-child{ padding-bottom:.5rem; }
  .tabla--apilable td.acciones .boton{ flex:1 1 auto; }
}

/* Revisión final: lo que el revisor marcó */
dialog.dialogo{ box-shadow:none; }
.tostada{ box-shadow:none; border:2px solid var(--tinta); }
.filtros button b{ opacity:1; color:inherit; }
.tabla--padron th{ white-space:normal; line-height:1.25; }
.tabla--padron td.num{ white-space:normal; }
.tabla--padron td.num .fuerte{ white-space:nowrap; }
.tabla--padron .col-acciones{ width:13.5rem; }
.calendario__titulo{ margin-bottom:1rem; }

/* El rótulo es el botón que despliega la fila */
.rotulo-boton{ flex:none; padding:0; border:0; background:none; cursor:pointer; color:inherit; }
.rotulo-boton[aria-expanded="true"] .rotulo-lote{ background:var(--tinta); color:#fff; }
.rotulo-boton[aria-expanded="true"] .rotulo-lote::before{ border-color:#fff; background:var(--tinta); }
.rotulo-boton:hover .rotulo-lote{ outline:2px solid var(--tinta); outline-offset:1px; }
/* Hecha: el rótulo recibe el sello */
.rotulo-lote__sello{ position:absolute; left:1.125rem; bottom:-1.125rem; width:2.125rem; height:1.75rem; display:grid; place-items:center; color:var(--pago); background:var(--hoja); border:3px double var(--pago); transform:rotate(-10deg); mix-blend-mode:multiply; }
.rotulo-lote__sello .icono{ width:1.125rem; height:1.125rem; }
.rotulo-lote__sello .icono svg{ stroke-width:2.4; }
.rotulo-lote.recien .rotulo-lote__sello{ animation:sellar-chico 420ms var(--suave) both; }

/* Calendario: el lienzo tiene escala fija en el celular y se desplaza de costado */
.calendario__marco{ overflow-x:auto; scrollbar-width:thin; }
.calendario__lienzo{ position:relative; padding-top:.25rem; }
.calendario__eje-hoy{ font-weight:850; font-stretch:80%; text-transform:uppercase; color:var(--tinta); }
@media (max-width:767px){
  .calendario__lienzo{ width:41rem; }
  .calendario{ padding-inline:1rem; }
}

/* Totales al pie, como el pie impreso de la bolsa */
.tabla tfoot tr.pie-bolsa td{ background:var(--kraft); color:var(--tinta); border-top:2px solid var(--tinta); font-weight:800; }
.tabla tfoot tr.pie-bolsa td small{ color:var(--tinta); font-weight:600; }
@media (max-width:767px){
  .tabla--apilable tfoot, .tabla--apilable tfoot tr, .tabla--apilable tfoot td{ display:block; width:100%; }
  .tabla--apilable tfoot tr.pie-bolsa{ padding:.875rem 1.125rem; background:var(--kraft); }
  .tabla--apilable tfoot tr.pie-bolsa td{ border-top:0; padding:.25rem 0; }
  .tabla--apilable tfoot td.solo-escritorio{ display:none; }
}

/* Resumen en una línea, como el renglón impreso de la bolsa */
.resumen{ display:flex; flex-wrap:wrap; align-items:baseline; gap:.25rem .75rem; margin:0 0 1.25rem; padding:.875rem 1.25rem; background:var(--banda); border:1.5px solid var(--tinta); font-size:var(--t-lg); }
.resumen b{ font-weight:900; font-stretch:72%; font-size:1.5rem; }
.resumen > span{ color:var(--tinta-3); }
.resumen small{ flex-basis:100%; font-size:var(--t-xs); color:var(--tinta-2); }

@media (max-width:767px){
  /* Filas de estado: borde completo, sin franja lateral */
  .tabla--apilable tr.fila--rojo{ box-shadow:inset 0 0 0 1.5px var(--sello); }
  .tabla--apilable tr.fila--ambar{ box-shadow:inset 0 0 0 1.5px var(--ambar); }
  /* Pie del diálogo: botones a lo ancho, el principal arriba */
  .dialogo__pie{ flex-direction:column-reverse; }
  .dialogo__pie .boton{ width:100%; }
}

/* ---------------------------------------------------------
   Ronda de pruebas con usuarios (2026-10-30)
   --------------------------------------------------------- */
/* Que se vea siempre que es una prueba con un día fijo */
.boleta-cab__demo{ align-self:center; justify-self:start; display:inline-flex; align-items:center; gap:.5rem; margin:0 1.25rem; padding:.375rem .75rem; font-size:var(--t-sm); font-weight:700; color:var(--tinta); background:var(--ambar-lt); border:1.5px solid var(--tinta); }
.boleta-cab__demo .icono{ width:1.125rem; height:1.125rem; flex:none; }
.boleta-cab__demo-dia{ display:none; }
@media (max-width:900px){
  .boleta-cab__demo{ grid-column:1 / -1; grid-row:2; justify-self:stretch; margin:0; border-width:1.5px 0 0; }
  .boleta-cab__demo-dia{ display:inline; font-weight:600; }
  /* En el celular la barra de módulos no queda fija: devuelve espacio a la pantalla */
  .modulos{ position:static; }
}
/* El número de cada módulo dice qué cuenta */
.modulos__cuenta-texto{ font-weight:600; }
@media (max-width:900px){ .modulos__cuenta-texto{ display:none; } }
/* Salir: objetivo cómodo para el dedo */
.boleta-cab__salir{ min-height:2.75rem; min-width:2.75rem; padding:0 .25rem; }
/* Errores de los formularios, debajo del campo */
.campo__error{ display:block; margin-top:.25rem; font-size:var(--t-sm); font-weight:650; color:var(--sello); }
.campo [aria-invalid="true"]{ border-color:var(--sello); box-shadow:0 0 0 1px var(--sello); }
/* Nombres de labores en los avisos: llevan a su fila */
.enlace-fila{ display:inline-block; min-height:0; padding:.375rem 0; margin:-.375rem 0; background:none; border:0; font:inherit; font-weight:700; color:inherit; text-decoration:underline; text-underline-offset:.2em; cursor:pointer; }
.enlace-fila:hover{ text-decoration-thickness:2px; }
/* Avisos: abajo a la izquierda en la computadora, para no tapar los botones de las filas; con cruz para cerrarlos */
@media (min-width:768px){ .tostadas{ right:auto; left:1.25rem; } }
.tostada__cerrar{ flex:none; display:grid; place-items:center; width:2.75rem; height:2.75rem; padding:0; background:none; border:0; color:var(--hoja); cursor:pointer; }
.tostada__cerrar .icono{ color:inherit; width:1.25rem; height:1.25rem; }
/* Columna de acciones: el botón entra entero, sin cortarse contra el borde */
.tabla--padron .col-acciones{ width:15.5rem; }
.tabla--padron td.acciones{ padding-left:.625rem; padding-right:.75rem; }
.tabla--padron td.acciones .boton{ max-width:100%; white-space:normal; margin-left:0; }
/* Marcas del calendario: más superficie para tocar sin cambiar el dibujo */
.calendario__marca{ min-width:2.75rem; padding-top:.5rem; }
.calendario__marca b{ min-width:1.75rem; text-align:center; }
@media (max-width:767px){ .calendario__marca b{ font-size:.9375rem; padding:.25rem .375rem; } }
/* Lo hecho se sigue leyendo al sol: sello verde más firme */
.sello--pago{ opacity:1; mix-blend-mode:normal; }
/* Mientras cargan los datos */
.cargando{ padding:2rem 0; font-size:var(--t-lg); color:var(--tinta-2); }
/* Segunda ronda de pruebas */
.rotulo-lote__sello{ z-index:1; }
@media (max-width:767px){
  /* La tabla del detalle desplegado conserva sus encabezados en el celular */
  .tabla--apilable .despliegue .tabla thead{ display:table-header-group; }
  .tabla--apilable .despliegue .tabla{ display:table; }
  .tabla--apilable .despliegue .tabla tbody{ display:table-row-group; }
  .tabla--apilable .despliegue .tabla tr{ display:table-row; padding:0; }
  .tabla--apilable .despliegue .tabla th, .tabla--apilable .despliegue .tabla td{ display:table-cell; width:auto; padding:.375rem .5rem; font-size:var(--t-sm); white-space:normal; }
  /* Avisos compactos: no tapan un cuarto de la pantalla */
  .tostada{ padding:.625rem .75rem; font-size:var(--t-sm); gap:.5rem; }
  .tostada__accion{ min-height:2.75rem; padding:.25rem .75rem; }
  /* Enlaces de los avisos: renglones de 44 px, así cada enlace tiene su zona sin pisar al de arriba */
  .franja__cuerpo p:has(.enlace-fila){ line-height:2.75rem; }
  .enlace-fila{ padding:0; margin:0; line-height:inherit; }
}
/* Tercera ronda de pruebas */
.boleta-cab__demo > span{ display:grid; }
.boleta-cab__demo-por{ font-size:var(--t-xs); font-weight:600; color:var(--tinta-2); }
@media (max-width:900px){ .boleta-cab__demo > span{ display:inline; } .boleta-cab__demo-por{ display:none; } }
.pie button{ min-height:2.75rem; }
.sello{ opacity:1; mix-blend-mode:normal; }
@media (max-width:767px){
  .tabla--apilable tr.despliegue td{ overflow-x:auto; }
  .tabla--apilable .despliegue .tabla td.num{ white-space:nowrap; }
}