:root{--bg:#edf0e5;--paper:#fffdf6;--paper2:#f4f0e2;--ink:#2d2b20;--muted:#706c59;--olive:#485a33;--olive2:#6f7e4d;--earth:#7f5b3b;--line:#d7d1bd;--ok:#507345;--bad:#a34c3d;--gold:#b68b43;--shadow:0 16px 35px rgba(63,59,39,.08)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 10% 0,#f7f5e9,transparent 30%),var(--bg);color:var(--ink);font:14px/1.45 system-ui,-apple-system,Segoe UI,sans-serif}.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;background:linear-gradient(110deg,#314126,#56673e);color:#fff;border-bottom:4px solid #9a7b45}.topbar h1{margin:2px 0;font-size:24px}.eyebrow{font-size:10px;letter-spacing:2px;opacity:.7}.userbox{display:flex;gap:16px;align-items:center}.userbox a{color:#fff}.tabs{display:flex;gap:5px;overflow:auto;padding:10px 20px;background:#faf8ef;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}.tabs button{border:0;background:transparent;padding:10px 14px;border-radius:9px;font-weight:700;color:var(--muted);cursor:pointer}.tabs button.active{background:var(--olive);color:#fff}.shell{max-width:1450px;margin:auto;padding:24px}.tab{display:none}.tab.active{display:block}.hero,.section-title{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:18px}.hero{padding:24px;border:1px solid #ccd1bc;border-radius:18px;background:linear-gradient(120deg,rgba(255,253,246,.95),rgba(235,239,220,.9)),repeating-linear-gradient(45deg,transparent,transparent 20px,rgba(72,90,51,.03) 21px,rgba(72,90,51,.03) 22px)}h2{font-size:28px;margin:4px 0}h3{margin:0 0 14px}.leaf{color:var(--olive);font-weight:800;letter-spacing:1.4px;font-size:11px}.grid{display:grid;gap:18px}.grid.two{grid-template-columns:minmax(330px,.8fr) minmax(500px,1.7fr)}.grid.three{grid-template-columns:repeat(3,1fr)}.compact{gap:10px}.card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.card-head{display:flex;justify-content:space-between;align-items:center}.filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:18px}label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:12px}input,select,textarea{width:100%;margin-top:5px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:#fffdf8;color:var(--ink);font:inherit}textarea{resize:vertical}.check{display:flex;gap:8px;align-items:center;padding:10px;background:var(--paper2);border-radius:10px}.check input{width:auto;margin:0}.segmented{display:flex;margin:0 0 14px;background:var(--paper2);padding:4px;border-radius:11px}.segmented button{flex:1;padding:10px;border:0;background:transparent;border-radius:8px;font-weight:800;color:var(--muted);cursor:pointer}.segmented button.active{background:var(--olive);color:#fff}.btn{border:1px solid var(--line);background:#fffdf7;padding:10px 14px;border-radius:9px;font-weight:800;cursor:pointer;color:var(--ink)}.btn.primary{background:var(--olive);color:#fff;border-color:var(--olive)}.btn.danger{color:var(--bad);border-color:#dfbbb4}.btn.small{padding:6px 9px;font-size:12px}.actions{display:flex;gap:8px;flex-wrap:wrap}.metric.preview{padding:11px 13px;background:#edf2e6;border-radius:10px;display:flex;justify-content:space-between;margin:5px 0 14px}.metric strong{color:var(--olive);font-size:20px}.metrics{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin:18px 0}.metric-box{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px}.metric-box span{display:block;font-size:11px;text-transform:uppercase;color:var(--muted);font-weight:800}.metric-box strong{font-size:23px;color:var(--olive)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:650px}th,td{text-align:left;padding:10px;border-bottom:1px solid #e6e0cf;vertical-align:middle}th{font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}.pill{display:inline-block;padding:4px 8px;border-radius:999px;background:#e6eadc;color:var(--olive);font-size:11px;font-weight:800}.pill.off{background:#eee7e3;color:#7d6259}.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}.person-card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px}.person-card b{display:block;margin-bottom:8px}.status-select{margin:0}.toast{position:fixed;right:20px;bottom:20px;background:#2e3827;color:#fff;padding:12px 16px;border-radius:10px;opacity:0;transform:translateY(12px);transition:.2s;pointer-events:none;z-index:20}.toast.show{opacity:1;transform:none}.toast.bad{background:var(--bad)}dialog{border:0;padding:0;border-radius:16px;background:transparent}dialog::backdrop{background:rgba(28,31,23,.45)}.modal-card{min-width:min(520px,92vw);background:var(--paper);padding:20px;border-radius:16px}.modal-head{display:flex;justify-content:space-between}.icon-btn{border:0;background:transparent;font-size:26px;cursor:pointer}.alert{padding:10px;border-radius:9px;margin:10px 0}.alert.ok{background:#e6efe1;color:#355d34}.alert.bad{background:#f4e4df;color:#8f3e34}.login-bg{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#26341f,#66784c)}.login-card{width:min(430px,92vw);background:var(--paper);padding:30px;border-radius:20px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.login-card h1{margin-bottom:4px}.brand-mark{font-size:42px}.login-card .btn{width:100%;margin-bottom:12px}canvas{width:100%;height:auto;background:#fffdf8;border-radius:10px}@media(max-width:900px){.grid.two{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr)}.topbar{padding:14px}.userbox span{display:none}.shell{padding:14px}.hero{align-items:stretch;flex-direction:column}.hero input{max-width:220px}}@media(max-width:560px){.grid.three{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}.tabs{padding:8px}.topbar h1{font-size:19px}}

.auto-number{padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface-alt);display:grid;gap:3px}.auto-number small,.auto-number span{color:var(--ink-soft)}.auto-number strong{font-size:22px;color:var(--brand-dark)}

.detalle-registro{display:flex;flex-wrap:wrap;gap:.35rem .9rem;line-height:1.45}
.detalle-registro span{white-space:nowrap}
.detalle-registro b{font-weight:700;color:#4b5538}

.resumen-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.9fr);gap:18px;margin:18px 0}
.resumen-panel{margin-bottom:18px}
.resumen-titulo{margin:-18px -18px 14px;padding:13px 18px;background:#dfe9d4;color:var(--olive);border-radius:15px 15px 0 0;font-size:22px;font-weight:900;letter-spacing:.5px;text-align:center}
.tabla-resumen{min-width:0}
.tabla-resumen td{font-size:14px}
.tabla-resumen td:last-child{text-align:right}
.tabla-resumen strong{font-size:18px;color:var(--olive)}
.tabla-total-planta td:nth-child(2),.tabla-total-planta th:nth-child(2){text-align:right}
.tabla-total-planta td:nth-child(3),.tabla-total-planta th:nth-child(3){text-align:center;width:90px}
.tabla-total-planta small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.texto-ayuda{color:var(--muted);margin-top:-8px}
@media(max-width:900px){.resumen-grid{grid-template-columns:1fr}}

.jornada-editor{display:grid;grid-template-columns:minmax(220px,1.4fr) minmax(180px,1fr) minmax(220px,1fr) auto;gap:14px;align-items:end;margin-bottom:18px}
.jornada-persona{font:inherit;text-align:left;width:100%;cursor:pointer;border:1px solid #ded8c5;background:#fff}
.jornada-persona.no-trabaja{background:#f4eee5}
.jornada-persona:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(63,72,45,.08)}
@media(max-width:760px){.jornada-editor{grid-template-columns:1fr}}

.importador{display:flex;gap:14px;align-items:end;flex-wrap:wrap}
.importador label{min-width:min(100%,430px);flex:1}
.excel-hoja{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:12px 0;border-bottom:1px solid #e5dfcd}
.excel-hoja>div{display:flex;flex-direction:column;gap:4px}
.excel-hoja span{color:var(--muted);font-size:13px}
.excel-hoja label{min-width:190px}
@media(max-width:760px){.excel-hoja{align-items:stretch;flex-direction:column}.excel-hoja label{width:100%}}

.excel-hoja.excel-ignorada{opacity:.72;background:#f5f1e8;padding:12px;border-radius:10px;margin:6px 0}


/* Responsive integral: evita desbordes y mantiene todos los controles utilizables. */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%}
.shell,.tab,.card,.grid>*{min-width:0}
.table-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{max-width:none}
.sin-porcentaje{color:var(--muted);font-weight:700}

@media(max-width:900px){
  .section-title{align-items:stretch;flex-direction:column}
  .section-title>.btn{align-self:flex-start}
  .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}
  .filters label{min-width:0;margin-bottom:0}
  .filters>.btn{width:100%}
  .card-head{gap:10px;flex-wrap:wrap}
}

@media(max-width:640px){
  body{font-size:14px}
  .topbar{padding:11px 12px;gap:10px}
  .topbar h1{font-size:18px;line-height:1.15}
  .eyebrow{font-size:9px}
  .userbox{gap:8px;flex:0 0 auto}
  .userbox a{display:inline-flex;align-items:center;min-height:40px;padding:0 4px}

  .tabs{gap:4px;padding:7px 8px;scrollbar-width:thin;overscroll-behavior-x:contain}
  .tabs button{flex:0 0 auto;min-height:42px;padding:9px 11px;white-space:nowrap}

  .shell{width:100%;padding:10px}
  .hero{padding:16px;border-radius:14px;margin-bottom:12px;gap:10px}
  .hero h2,.section-title h2{font-size:23px}
  .hero p,.section-title p{margin-bottom:0}
  .hero input,.section-title input{width:100%;max-width:none}
  .section-title{gap:10px;margin-bottom:12px}
  .section-title>.btn{width:100%;align-self:stretch}

  .card{padding:13px;border-radius:13px}
  .resumen-titulo{margin:-13px -13px 12px;padding:11px 12px;border-radius:12px 12px 0 0;font-size:19px}
  .grid.two,.grid.three,.resumen-grid,.jornada-editor{grid-template-columns:minmax(0,1fr)}
  .grid{gap:12px}
  .compact{gap:8px}

  label{margin-bottom:10px}
  input,select,textarea{min-height:44px;font-size:16px;padding:10px}
  textarea{min-height:84px}
  input[type=checkbox]{min-height:auto}
  .segmented button,.btn{min-height:44px}
  .actions{display:grid;grid-template-columns:1fr}
  .actions .btn{width:100%}
  .metric.preview{gap:12px;align-items:center}
  .metric.preview strong{font-size:19px}

  .filters{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding:13px}
  .filters label{width:100%;margin:0}
  .filters>.btn{width:100%}

  .people-grid{grid-template-columns:minmax(0,1fr)}
  .person-card{padding:12px}
  .jornada-persona{min-height:54px}

  .tabla-resumen{width:100%;min-width:0}
  .tabla-resumen th,.tabla-resumen td{padding:9px 6px}
  .tabla-total-planta th:first-child,.tabla-total-planta td:first-child{width:auto}
  .tabla-total-planta th:nth-child(2),.tabla-total-planta td:nth-child(2){width:120px}
  .tabla-total-planta th:nth-child(3),.tabla-total-planta td:nth-child(3){width:62px}
  .tabla-resumen strong{font-size:16px}

  /* Las tablas de detalle se desplazan dentro de su tarjeta, nunca la página completa. */
  .table-wrap{margin-left:0;margin-right:0;border-radius:8px}
  .table-wrap table:not(.tabla-resumen){min-width:620px}
  th,td{padding:9px 8px}
  .detalle-registro{gap:.25rem .65rem}

  .importador{display:grid;grid-template-columns:1fr;align-items:stretch}
  .importador label{min-width:0;width:100%}
  .importador .btn{width:100%}
  .excel-hoja{gap:10px}

  dialog{width:100%;max-width:100%;margin:auto;padding:8px}
  .modal-card{width:100%;min-width:0;max-width:100%;max-height:calc(100dvh - 16px);overflow:auto;padding:16px}
  .modal-head{gap:12px;align-items:flex-start}
  .icon-btn{min-width:44px;min-height:44px}

  .toast{left:10px;right:10px;bottom:10px;text-align:center}
  .login-card{width:calc(100% - 20px);padding:22px 16px}
}

@media(max-width:380px){
  .shell{padding:7px}
  .card{padding:11px}
  .resumen-titulo{margin:-11px -11px 10px}
  .topbar h1{font-size:16px}
  .tabla-total-planta th:nth-child(2),.tabla-total-planta td:nth-child(2){width:108px}
  .tabla-total-planta th:nth-child(3),.tabla-total-planta td:nth-child(3){width:54px}
  .tabla-total-planta td{font-size:12px}
  .tabla-total-planta strong{font-size:15px}
}


/* =========================================================
   TABLAS RESPONSIVE EN MÓVIL -> TARJETAS
   En escritorio se mantienen las tablas tradicionales.
   ========================================================= */
@media (max-width: 760px) {
  .tabla-responsive-cards {
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
  }

  .tabla-responsive-cards table,
  table.tabla-mobile-cards {
    display: block;
    width: 100%;
    min-width: 0 !important;
    border: 0;
    background: transparent;
  }

  .tabla-responsive-cards thead,
  table.tabla-mobile-cards thead {
    display: none;
  }

  .tabla-responsive-cards tbody,
  table.tabla-mobile-cards tbody {
    display: grid;
    gap: .85rem;
    width: 100%;
  }

  .tabla-responsive-cards tr,
  table.tabla-mobile-cards tr {
    display: block;
    width: 100%;
    padding: .85rem .9rem;
    border: 1px solid rgba(91, 94, 53, .22);
    border-radius: 14px;
    background: var(--crema, #fffdf3);
    box-shadow: 0 2px 8px rgba(0,0,0,.045);
  }

  .tabla-responsive-cards td,
  table.tabla-mobile-cards td {
    display: grid;
    grid-template-columns: minmax(7.5rem, 42%) minmax(0, 1fr);
    gap: .6rem;
    align-items: start;
    width: 100% !important;
    max-width: none !important;
    padding: .42rem 0 !important;
    border: 0 !important;
    border-bottom: 1px dashed rgba(91, 94, 53, .16) !important;
    white-space: normal !important;
    text-align: right !important;
    overflow-wrap: anywhere;
  }

  .tabla-responsive-cards td:last-child,
  table.tabla-mobile-cards td:last-child {
    border-bottom: 0 !important;
  }

  .tabla-responsive-cards td::before,
  table.tabla-mobile-cards td::before {
    content: attr(data-label);
    font-weight: 700;
    color: var(--oliva-oscuro, #51552c);
    text-align: left;
    line-height: 1.25;
  }

  .tabla-responsive-cards td[data-label=""],
  table.tabla-mobile-cards td[data-label=""] {
    grid-template-columns: 1fr;
  }

  .tabla-responsive-cards td[data-label=""]::before,
  table.tabla-mobile-cards td[data-label=""]::before {
    display: none;
  }

  .tabla-responsive-cards td.acciones,
  .tabla-responsive-cards td[data-label="Acciones"],
  table.tabla-mobile-cards td.acciones,
  table.tabla-mobile-cards td[data-label="Acciones"] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .45rem;
    padding-top: .65rem !important;
  }

  .tabla-responsive-cards td.acciones::before,
  .tabla-responsive-cards td[data-label="Acciones"]::before,
  table.tabla-mobile-cards td.acciones::before,
  table.tabla-mobile-cards td[data-label="Acciones"]::before {
    width: 100%;
    flex: 0 0 100%;
  }

  .tabla-responsive-cards td.acciones button,
  .tabla-responsive-cards td.acciones a,
  .tabla-responsive-cards td[data-label="Acciones"] button,
  .tabla-responsive-cards td[data-label="Acciones"] a,
  table.tabla-mobile-cards td.acciones button,
  table.tabla-mobile-cards td.acciones a {
    min-height: 42px;
  }

  /* Evita scroll horizontal residual en las secciones convertidas a tarjetas. */
  .tabla-responsive-cards,
  .tabla-responsive-cards table,
  .tabla-responsive-cards tbody,
  .tabla-responsive-cards tr,
  .tabla-responsive-cards td {
    max-width: 100%;
    box-sizing: border-box;
  }
}

.selector-trabajador{display:grid;grid-template-columns:minmax(160px,.75fr) minmax(220px,1.25fr);gap:.75rem;align-items:end}
.grupo-trabajadores{margin-top:.75rem;border:1px solid rgba(91,94,53,.25);border-radius:12px;padding:.8rem}
.grupo-trabajadores legend{font-weight:700;padding:0 .35rem}
.asignacion-acciones{display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:.7rem}
.lista-asignaciones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem .75rem;max-height:310px;overflow:auto;padding:.2rem}
.asignacion-trabajador{margin:0!important;align-items:center}
@media(max-width:760px){.selector-trabajador{grid-template-columns:1fr}.lista-asignaciones{grid-template-columns:1fr;max-height:42vh}}


/* Gráficas de bandejas por trabajador en Resúmenes */
.graficas-trabajadores-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:.75rem;
}
.grafica-trabajador-panel{
  min-width:0;
  padding:.8rem;
  border:1px solid rgba(91,94,53,.2);
  border-radius:12px;
  background:rgba(255,255,255,.26);
}
.grafica-trabajador-panel h4{margin:.1rem 0 .2rem}
.grafica-trabajador-panel canvas{
  display:block;
  width:100%;
  max-width:100%;
}
@media(max-width:900px){
  .graficas-trabajadores-grid{grid-template-columns:1fr}
}


/* Resumen: gráfica combinada y totales finales */
.grafica-trabajador-total{
  grid-column:1 / -1;
}
.totales-finales-resumen{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-top:1rem;
}
.total-final-card{
  min-width:0;
  padding:1rem;
  border:1px solid rgba(91,94,53,.22);
  border-radius:14px;
  background:rgba(255,255,255,.3);
  display:flex;
  flex-direction:column;
  gap:.2rem;
}
.total-final-card span{
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.total-final-card strong{
  font-size:clamp(1.7rem,4vw,2.6rem);
  line-height:1.05;
  overflow-wrap:anywhere;
}
.total-final-card small{
  color:#706c59;
  line-height:1.3;
}
@media(max-width:900px){
  .grafica-trabajador-total{grid-column:auto}
}
@media(max-width:760px){
  .totales-finales-resumen{grid-template-columns:1fr}
  .grafica-trabajador-panel{
    padding:.65rem;
    overflow:hidden;
  }
  .grafica-trabajador-panel canvas{
    width:100%!important;
    max-width:100%;
  }
  .total-final-card{
    padding:.85rem;
  }
}


/* Informe profesional de impresión / PDF */

.resumen-acciones{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.etiquetas-trabajadas{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.etiqueta-chip{display:inline-flex;align-items:center;min-height:30px;padding:5px 10px;border:1px solid #cfd3bd;border-radius:999px;background:#f1f3e8;color:var(--olive);font-weight:800;font-size:12px}

.reporte-impresion{display:none}

@media print{
  @page{size:A4 portrait;margin:12mm 11mm 14mm}

  *{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
  }

  html,body{
    margin:0!important;
    padding:0!important;
    background:#fff!important;
    color:#23251c!important;
    font-family:Arial,Helvetica,sans-serif!important;
    font-size:9pt!important;
  }

  body.imprimiendo-resumen > .topbar,
  body.imprimiendo-resumen > .tabs,
  body.imprimiendo-resumen > dialog,
  body.imprimiendo-resumen > #toast{
    display:none!important;
  }

  /* El informe vive dentro de main.shell: no ocultar el contenedor completo. */
  body.imprimiendo-resumen > .shell{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
  }

  /* Ocultar todas las pestañas normales y mostrar únicamente el informe. */
  body.imprimiendo-resumen > .shell > .tab{
    display:none!important;
  }

  body.imprimiendo-resumen > .shell > .reporte-impresion{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    color:#23251c!important;
  }

  .ri-cabecera{
    display:grid!important;
    grid-template-columns:1fr auto;
    gap:10mm;
    align-items:end;
    padding:0 0 5mm;
    margin:0 0 6mm;
    border-bottom:2px solid #62683e;
  }
  .ri-marca{
    font-size:8pt;
    font-weight:700;
    letter-spacing:1.2px;
    color:#62683e;
  }
  .ri-cabecera h1{
    margin:1mm 0 0!important;
    font-size:20pt!important;
    line-height:1.05!important;
    color:#292d1c!important;
  }
  .ri-meta{
    text-align:right;
    font-size:8pt;
    line-height:1.45;
    color:#55584a;
  }

  .ri-seccion{
    margin:0 0 7mm;
  }
  .ri-seccion h2{
    margin:0 0 3mm!important;
    padding:0 0 1.5mm;
    font-size:13pt!important;
    color:#343824!important;
    border-bottom:1px solid #a9ac91;
  }
  .ri-seccion h3{
    margin:0 0 2mm!important;
    font-size:10pt!important;
    color:#343824!important;
  }
  .ri-nota{
    margin:-1mm 0 3mm;
    font-size:7.8pt;
    color:#67695d;
  }

  .ri-kpis{
    display:grid!important;
    grid-template-columns:repeat(4,1fr);
    gap:3mm;
    margin-bottom:4mm;
  }
  .ri-kpis > div{
    min-width:0;
    padding:3mm;
    border:1px solid #b8baa5;
    border-top:3px solid #767b4d;
    border-radius:2mm;
    background:#f7f5eb!important;
  }
  .ri-kpis span{
    display:block;
    margin-bottom:1mm;
    font-size:7pt;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.3px;
    color:#666956;
  }
  .ri-kpis strong{
    display:block;
    font-size:17pt;
    line-height:1;
    color:#252817;
  }
  .ri-kpis small{
    display:block;
    margin-top:1.5mm;
    font-size:6.7pt;
    line-height:1.2;
    color:#707263;
  }

  .ri-dos-columnas{
    display:grid!important;
    grid-template-columns:60% 36%;
    gap:4%;
    align-items:start;
    width:100%;
  }

  .ri-dos-columnas > div{
    min-width:0!important;
    width:100%!important;
  }

  .ri-tabla{
    width:100%!important;
    border-collapse:collapse!important;
    table-layout:auto!important;
    font-size:8pt!important;
  }
  .ri-tabla thead{display:table-header-group!important}
  .ri-tabla tr{break-inside:avoid!important;page-break-inside:avoid!important}
  .ri-tabla th{
    padding:2mm 1.8mm!important;
    text-align:left!important;
    font-size:7.2pt!important;
    font-weight:700!important;
    text-transform:uppercase;
    letter-spacing:.2px;
    background:#e8e5d5!important;
    color:#303326!important;
    border:1px solid #b9baa9!important;
  }
  .ri-tabla td{
    padding:1.7mm 1.8mm!important;
    vertical-align:middle!important;
    border:1px solid #c9cabd!important;
    background:#fff!important;
  }
  .ri-tabla tbody tr:nth-child(even) td{background:#f7f6f0!important}
  .ri-tabla .num{text-align:right!important;font-variant-numeric:tabular-nums}

  /* Actividad se imprime como filas independientes, no como tabla.
     Evita que Chrome/Edge colapse la columna de valores. */
  .ri-actividad-lista{
    display:block!important;
    width:92%!important;
    max-width:72mm!important;
    margin:0 6mm 0 0!important;
    border:1px solid #c9cabd;
    box-sizing:border-box!important;
  }
  .ri-actividad-fila{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 17mm!important;
    align-items:center!important;
    width:100%!important;
    min-height:7.2mm!important;
    box-sizing:border-box!important;
    border-bottom:1px solid #c9cabd;
    background:#fff!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }
  .ri-actividad-fila:nth-child(even){
    background:#f7f6f0!important;
  }
  .ri-actividad-fila:last-child{
    border-bottom:0;
  }
  .ri-actividad-fila span{
    display:block!important;
    min-width:0!important;
    padding:1.4mm 1.6mm!important;
    font-size:7.2pt!important;
    line-height:1.2!important;
    overflow-wrap:anywhere!important;
  }
  .ri-actividad-fila strong{
    display:block!important;
    width:17mm!important;
    min-width:17mm!important;
    box-sizing:border-box!important;
    padding:1.4mm 2.5mm 1.4mm 1mm!important;
    border-left:1px solid #c9cabd;
    text-align:right!important;
    white-space:nowrap!important;
    font-size:8pt!important;
    line-height:1!important;
    color:#252817!important;
    font-variant-numeric:tabular-nums!important;
  }

  /* La tabla Actividad necesita reservar explícitamente espacio para el valor.
     Sin esto algunos motores de impresión encogen la segunda columna hasta ocultarla. */
  .ri-tabla-actividad{
    table-layout:fixed!important;
    width:100%!important;
  }
  .ri-tabla-actividad td:first-child{
    width:72%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .ri-tabla-actividad td:last-child{
    width:28%!important;
    min-width:18mm!important;
    text-align:right!important;
    white-space:nowrap!important;
    font-size:9pt!important;
    padding-left:2mm!important;
    padding-right:2mm!important;
  }
  .ri-tabla-actividad td:last-child strong{
    display:block!important;
    width:100%!important;
    text-align:right!important;
    font-size:9.5pt!important;
    color:#252817!important;
  }

  .ri-etiquetas-bloque{
    margin-top:4mm;
    padding-top:3mm;
    border-top:1px solid #d0d1c4;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }
  .ri-etiquetas{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:1.5mm!important;
  }
  .ri-etiquetas > span{
    display:inline-block!important;
    padding:1.1mm 2mm!important;
    border:1px solid #c5c7b5!important;
    border-radius:8mm!important;
    background:#f3f2e9!important;
    font-size:7.4pt!important;
    font-weight:700!important;
    color:#343824!important;
    white-space:nowrap!important;
  }
  .ri-etiquetas > .ri-etiqueta-vacia{
    border:0!important;
    padding:0!important;
    background:transparent!important;
    color:#77796e!important;
    font-weight:400!important;
    white-space:normal!important;
  }

  .ri-tabla-detalle{font-size:7.4pt!important}
  .ri-tabla-detalle th,.ri-tabla-detalle td{padding:1.45mm 1.3mm!important}

  .ri-graficas{
    display:grid!important;
    grid-template-columns:1fr 1fr;
    gap:4mm;
  }
  .ri-graficas figure{
    margin:0!important;
    padding:3mm;
    border:1px solid #c0c1b3;
    border-radius:2mm;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }
  .ri-graficas figcaption{
    margin-bottom:2mm;
    font-size:9pt;
    font-weight:700;
    color:#343824;
  }
  .ri-graficas img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:105mm!important;
    object-fit:contain;
  }
  .ri-grafica-completa{
    grid-column:1 / -1;
  }
  .ri-grafica-completa img{max-height:130mm!important}
  .ri-evolucion{
    display:block!important;
    width:100%!important;
    max-height:105mm!important;
    object-fit:contain;
    border:1px solid #c0c1b3;
    padding:2mm;
    box-sizing:border-box;
  }

  .ri-salto-pagina{
    break-before:page!important;
    page-break-before:always!important;
  }

  .ri-pie{
    margin-top:7mm;
    padding-top:2mm;
    display:flex!important;
    justify-content:space-between;
    gap:6mm;
    border-top:1px solid #b7b9a7;
    color:#77796e;
    font-size:6.8pt;
  }

  [hidden]{display:none!important}
}

@media(max-width:640px){
  .resumen-acciones{width:100%;display:grid;grid-template-columns:1fr}
  .resumen-acciones .pill{justify-self:start}
  .resumen-acciones .btn{width:100%}
}

.brand-area{display:flex;align-items:center;gap:16px;min-width:0}
.brand-logo{display:block;width:auto;max-width:150px;max-height:58px;object-fit:contain;flex:0 0 auto}
.login-logo{display:block;width:auto;max-width:190px;max-height:82px;object-fit:contain;margin:0 auto 18px}
@media(max-width:900px){
  .brand-logo{max-width:128px;max-height:48px}
  .brand-area{gap:10px}
}
@media(max-width:560px){
  .brand-logo{max-width:105px;max-height:42px}
  .login-logo{max-width:160px;max-height:70px}
}

/* Fondo de contraste para el logotipo blanco*/
.login-logo{
  box-sizing:content-box;
  background:#66713f;
  padding:14px 22px;
  border-radius:14px;
  box-shadow:0 6px 18px rgba(47,54,30,.16);
}
.brand-logo{
  box-sizing:content-box;
  background:#66713f;
  padding:7px 12px;
  border-radius:10px;
}

/* Login e instalador: tarjeta completa verde para integrar el logotipo blanco */
.login-card{
  background:#66713f!important;
  color:#fff!important;
  border-color:#596336!important;
}
.login-card h1,
.login-card p,
.login-card small{
  color:#fff!important;
}
.login-card label{
  color:#f7f8f0!important;
}
.login-card input{
  background:#fff!important;
  color:#252817!important;
  border-color:#d9dccb!important;
}
.login-card .login-logo{
  background:transparent!important;
  padding:0!important;
  box-shadow:none!important;
  border-radius:0!important;
}
/* En la cabecera interior, el logo mantiene contraste sobre el fondo claro. */
.brand-area .brand-logo{
  background:#66713f;
}

/* Logo en la aplicación: PNG original directamente sobre el banner */
.brand-area .brand-logo{
  background:transparent!important;
  padding:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

/* Login e instalador: combinación suave salvia/crema */
.login-bg{
  background:#eef1e5!important;
}
.login-card{
  background:#7d8760!important;
  color:#fff!important;
  border-color:#737d57!important;
  box-shadow:0 18px 45px rgba(55,64,38,.13)!important;
}
.login-card h1{
  color:#fff!important;
}
.login-card p,
.login-card small{
  color:#f3f5eb!important;
}
.login-card label{
  color:#fafbf6!important;
}
.login-card input{
  background:#fbfcf7!important;
  color:#2f3525!important;
  border-color:#dfe3d3!important;
}
.login-card input:focus{
  border-color:#cfd6b9!important;
  box-shadow:0 0 0 3px rgba(238,241,229,.22)!important;
}
.login-card .btn.primary{
  background:#f0f2e7!important;
  color:#46502f!important;
  border-color:#f0f2e7!important;
}
.login-card .btn.primary:hover{
  background:#fff!important;
  border-color:#fff!important;
}

/* Paleta unificada: salvia + crema */
:root{
  --olive:#596343;
  --olive-2:#7d8760;
  --olive-soft:#aeb79a;
  --cream:#eef1e5;
  --paper:#fbfcf7;
  --earth:#737d57;
  --line:#dfe3d3;
}

/* Fondo general de la aplicación */
body:not(.login-bg){
  background:#eef1e5!important;
}

/* Banner principal */
.topbar{
  background:#7d8760!important;
  border-bottom-color:#737d57!important;
  box-shadow:0 5px 18px rgba(55,64,38,.10)!important;
}
.topbar,
.topbar .userbox,
.topbar .userbox strong,
.topbar .userbox span{
  color:#fff!important;
}

/* Navegación */
.tabs,
.nav-tabs{
  background:#f5f7ef!important;
  border-color:#dfe3d3!important;
}
.tabs button,
.nav-tabs button{
  color:#596343!important;
}
.tabs button.active,
.nav-tabs button.active{
  background:#7d8760!important;
  color:#fff!important;
  border-color:#7d8760!important;
}

/* Tarjetas y paneles */
.card,
.resumen-panel{
  background:#fbfcf7!important;
  border-color:#dfe3d3!important;
  box-shadow:0 7px 22px rgba(55,64,38,.07)!important;
}
.section-title h2,
.card h2,
.card h3{
  color:#596343!important;
}

/* Botones principales */
.btn.primary{
  background:#7d8760!important;
  border-color:#7d8760!important;
  color:#fff!important;
}
.btn.primary:hover{
  background:#6f7955!important;
  border-color:#6f7955!important;
}

/* Inputs y selects */
input,
select,
textarea{
  border-color:#d9decc!important;
}
input:focus,
select:focus,
textarea:focus{
  border-color:#aeb79a!important;
  box-shadow:0 0 0 3px rgba(125,135,96,.12)!important;
}

/* Indicadores y chips */
.pill,
.etiqueta-chip{
  background:#eef1e5!important;
  border-color:#d4dac5!important;
  color:#596343!important;
}

/* Tablas */
table thead th{
  background:#eef1e5!important;
  color:#596343!important;
}
table tbody tr:hover{
  background:#f5f7ef!important;
}

/* El login conserva su versión suave */
.login-bg{
  background:#eef1e5!important;
}
.login-card{
  background:#7d8760!important;
}

/* Paleta elegida: 3 · Salvia claro + salvia medio */
:root{
  --olive:#4e5a45;
  --olive-2:#8d9a70;
  --olive-soft:#b9c5a7;
  --cream:#dde5d3;
  --paper:#f3f6ef;
  --earth:#748063;
  --line:#d5ddcc;
}
body,
body:not(.login-bg),
.login-bg{
  background:#dde5d3!important;
}
.login-card{
  background:#8d9a70!important;
  border-color:#829066!important;
  box-shadow:0 18px 45px rgba(78,90,69,.12)!important;
}
.login-card h1{
  text-align:center!important;
  width:100%!important;
  color:#fff!important;
}
.login-card p,
.login-card small{color:#f3f6ef!important}
.login-card label{color:#fff!important}
.login-card input{
  background:#f3f6ef!important;
  color:#4e5a45!important;
  border-color:#dce3d5!important;
}
.login-card .btn.primary{
  background:#f3f6ef!important;
  color:#4e5a45!important;
  border-color:#f3f6ef!important;
}
.login-card .btn.primary:hover{
  background:#fff!important;
  border-color:#fff!important;
}
.topbar{
  background:#8d9a70!important;
  border-bottom-color:#829066!important;
}
.tabs,
.nav-tabs{background:#f3f6ef!important;border-color:#d5ddcc!important}
.tabs button,
.nav-tabs button{color:#4e5a45!important}
.tabs button.active,
.nav-tabs button.active{
  background:#8d9a70!important;
  color:#fff!important;
  border-color:#8d9a70!important;
}
.card,
.resumen-panel{
  background:#f3f6ef!important;
  border-color:#d5ddcc!important;
}
.section-title h2,
.card h2,
.card h3{color:#4e5a45!important}
.btn.primary{
  background:#8d9a70!important;
  border-color:#8d9a70!important;
  color:#fff!important;
}
.btn.primary:hover{
  background:#7f8c63!important;
  border-color:#7f8c63!important;
}
input,
select,
textarea{border-color:#d5ddcc!important}
input:focus,
select:focus,
textarea:focus{
  border-color:#b9c5a7!important;
  box-shadow:0 0 0 3px rgba(141,154,112,.13)!important;
}
.pill,
.etiqueta-chip{
  background:#e7edde!important;
  border-color:#ccd6c1!important;
  color:#4e5a45!important;
}
table thead th{
  background:#e7edde!important;
  color:#4e5a45!important;
}
table tbody tr:hover{background:#edf2e8!important}

.titulo-acceso{
  text-align:center!important;
  width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Controles numéricos cómodos en móvil.
   En escritorio se conserva el input normal; en móvil aparecen ▲ / ▼ grandes. */
.mobile-stepper{
  position:relative;
  width:100%;
}
.mobile-stepper > input{
  width:100%;
}
.mobile-stepper-controls{
  display:none;
}

@media(max-width:760px){
  .mobile-stepper{
    display:grid;
    grid-template-columns:minmax(0,1fr) 48px;
    gap:7px;
    align-items:stretch;
  }
  .mobile-stepper > input{
    min-height:52px!important;
    font-size:18px!important;
    text-align:center;
    font-variant-numeric:tabular-nums;
  }
  .mobile-stepper-controls{
    display:grid;
    grid-template-rows:1fr 1fr;
    gap:4px;
    min-height:52px;
  }
  .mobile-stepper-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:48px;
    min-height:24px;
    margin:0;
    padding:0;
    border:1px solid #b9c5a7;
    border-radius:8px;
    background:#e7edde;
    color:#4e5a45;
    font-size:15px;
    font-weight:900;
    line-height:1;
    touch-action:manipulation;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  .mobile-stepper-btn:active{
    background:#8d9a70;
    color:#fff;
    transform:scale(.98);
  }
  /* Evita depender de las diminutas flechas nativas del navegador móvil. */
  input[data-stepper-mobile="1"]::-webkit-inner-spin-button,
  input[data-stepper-mobile="1"]::-webkit-outer-spin-button{
    -webkit-appearance:none;
    margin:0;
  }
}

/* Navegación móvil desplegable */
.mobile-nav{
  display:none;
}
@media(max-width:760px){
  .tabs{
    display:none!important;
  }
  .mobile-nav{
    display:block;
    position:sticky;
    top:0;
    z-index:70;
    padding:8px 12px;
    background:#dde5d3;
    border-bottom:1px solid #ccd6c1;
  }
  .mobile-menu-toggle{
    width:100%;
    min-height:50px;
    display:grid;
    grid-template-columns:auto auto 1fr auto;
    align-items:center;
    gap:9px;
    padding:9px 13px;
    border:1px solid #829066;
    border-radius:12px;
    background:#8d9a70;
    color:#fff;
    font:inherit;
    font-weight:800;
    text-align:left;
    box-shadow:0 4px 14px rgba(78,90,69,.10);
    touch-action:manipulation;
  }
  .mobile-menu-icon{
    font-size:22px;
    line-height:1;
  }
  .mobile-menu-toggle strong{
    justify-self:end;
    min-width:0;
    max-width:48vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
    font-weight:700;
    color:#f3f6ef;
  }
  .mobile-menu-chevron{
    font-size:20px;
    line-height:1;
    transition:transform .18s ease;
  }
  .mobile-menu-toggle[aria-expanded="true"] .mobile-menu-chevron{
    transform:rotate(180deg);
  }
  .mobile-menu-panel{
    position:absolute;
    left:12px;
    right:12px;
    top:calc(100% - 2px);
    padding:7px;
    border:1px solid #ccd6c1;
    border-radius:0 0 14px 14px;
    background:#f3f6ef;
    box-shadow:0 15px 30px rgba(78,90,69,.17);
    max-height:calc(100vh - 145px);
    overflow-y:auto;
  }
  .mobile-menu-panel[hidden]{
    display:none!important;
  }
  .mobile-menu-panel button{
    width:100%;
    min-height:48px;
    display:flex;
    align-items:center;
    padding:10px 13px;
    border:0;
    border-bottom:1px solid #dde5d3;
    border-radius:9px;
    background:transparent;
    color:#4e5a45;
    font:inherit;
    font-weight:700;
    text-align:left;
    touch-action:manipulation;
  }
  .mobile-menu-panel button:last-child{
    border-bottom:0;
  }
  .mobile-menu-panel button.active{
    background:#e2e9da;
    color:#4e5a45;
    box-shadow:inset 4px 0 0 #8d9a70;
  }
  .mobile-menu-panel button:active{
    background:#d8e1cf;
  }
  .topbar{
    min-height:66px;
  }
  .topbar .userbox{
    gap:8px;
  }
  .topbar .userbox span{
    max-width:42vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}

/* Validación visible del registro */
.aviso-registro{
  margin:0 0 14px;
  padding:11px 13px;
  border:1px solid #b98072;
  border-radius:10px;
  background:#fff1ed;
  color:#743c31;
  font-weight:800;
  line-height:1.35;
}
.aviso-registro[hidden]{
  display:none!important;
}
#formularioRegistro input.campo-error{
  border-color:#a65f50!important;
  box-shadow:0 0 0 3px rgba(166,95,80,.15)!important;
}
@media(max-width:760px){
  .aviso-registro{
    position:relative;
    z-index:2;
    font-size:15px;
    margin-bottom:12px;
  }
}


:root{
  --bg:#edf3e9;
  --paper:#ffffff;
  --paper2:#f4f7f0;
  --ink:#243126;
  --muted:#667267;
  --olive:#25562f;
  --olive2:#4f7b39;
  --olive-2:#4f7b39;
  --olive-soft:#9db48c;
  --cream:#edf3e9;
  --earth:#5f6d45;
  --line:#d7e1d1;
  --ok:#3f723d;
  --shadow:0 10px 28px rgba(37,86,47,.08);
}
body,
body:not(.login-bg),
.login-bg{
  background:#edf3e9!important;
  color:#243126!important;
}
.topbar{
  background:linear-gradient(115deg,#173e22 0%,#25562f 58%,#4f7b39 100%)!important;
  border-bottom-color:#7e9e59!important;
  box-shadow:0 5px 18px rgba(23,62,34,.16)!important;
}
.topbar,
.topbar .userbox,
.topbar .userbox strong,
.topbar .userbox span,
.topbar .userbox a{color:#fff!important}
.tabs,
.nav-tabs{
  background:#fff!important;
  border-color:#d7e1d1!important;
}
.tabs button,
.nav-tabs button{color:#315b36!important}
.tabs button.active,
.nav-tabs button.active{
  background:#25562f!important;
  color:#fff!important;
  border-color:#25562f!important;
}
.hero{
  background:linear-gradient(120deg,#ffffff 0%,#f2f7ee 100%)!important;
  border-color:#d3dfcd!important;
}
.card,
.resumen-panel,
.metric-box,
.person-card,
.modal-card{
  background:#fff!important;
  border-color:#d7e1d1!important;
  box-shadow:0 8px 24px rgba(37,86,47,.07)!important;
}
.section-title h2,
.card h2,
.card h3,
.leaf,
.metric strong,
.metric-box strong{color:#25562f!important}
.btn.primary{
  background:#25562f!important;
  border-color:#25562f!important;
  color:#fff!important;
}
.btn.primary:hover{
  background:#1c4727!important;
  border-color:#1c4727!important;
}
input,
select,
textarea{
  background:#fff!important;
  color:#243126!important;
  border-color:#cfdccb!important;
}
input:focus,
select:focus,
textarea:focus{
  border-color:#70945c!important;
  box-shadow:0 0 0 3px rgba(79,123,57,.14)!important;
}
.pill,
.etiqueta-chip,
.metric.preview{
  background:#eaf2e5!important;
  border-color:#cbd9c4!important;
  color:#25562f!important;
}
table thead th{
  background:#e8f0e3!important;
  color:#25562f!important;
}
table tbody tr:hover{background:#f3f7f0!important}
.resumen-titulo{
  background:#dfead8!important;
  color:#25562f!important;
}
.segmented{background:#edf3e9!important}
.segmented button.active{
  background:#25562f!important;
  color:#fff!important;
}
.check{background:#f2f6ef!important}
.login-bg{
  background:linear-gradient(135deg,#173e22 0%,#25562f 55%,#557c3d 100%)!important;
}
.login-card{
  background:#fff!important;
  border:1px solid rgba(255,255,255,.35)!important;
  box-shadow:0 24px 65px rgba(16,48,24,.25)!important;
}
.login-card h1,
.login-card label{color:#25562f!important}
.login-card p,
.login-card small{color:#667267!important}
.login-card input{
  background:#f9fbf7!important;
  color:#243126!important;
  border-color:#d2dfcd!important;
}
.login-card .btn.primary{
  background:#25562f!important;
  color:#fff!important;
  border-color:#25562f!important;
}
.login-card .btn.primary:hover{
  background:#1c4727!important;
  border-color:#1c4727!important;
}
.toast{background:#173e22!important}

@media(max-width:760px){
  .mobile-nav{
    background:#edf3e9!important;
    border-bottom-color:#cbd9c4!important;
  }
  .mobile-menu-toggle{
    background:#25562f!important;
    border-color:#1c4727!important;
    box-shadow:0 4px 14px rgba(23,62,34,.14)!important;
  }
  .mobile-menu-toggle strong{color:#f5f8f2!important}
  .mobile-menu-panel{
    background:#fff!important;
    border-color:#cbd9c4!important;
    box-shadow:0 15px 30px rgba(23,62,34,.16)!important;
  }
  .mobile-menu-panel button{
    color:#25562f!important;
    border-bottom-color:#e2eadc!important;
  }
  .mobile-menu-panel button.active{
    background:#e5efe0!important;
    color:#25562f!important;
    box-shadow:inset 4px 0 0 #4f7b39!important;
  }
  .mobile-menu-panel button:active{background:#dce9d5!important}
  .mobile-stepper-btn{
    border-color:#9db48c!important;
    background:#eaf2e5!important;
    color:#25562f!important;
  }
  .mobile-stepper-btn:active{
    background:#25562f!important;
    color:#fff!important;
  }
}

/* Login e instalador: el logotipo es blanco, por lo que necesita fondo verde. */
.login-card{
  background:linear-gradient(155deg,#25562f 0%,#173e22 100%)!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:0 24px 65px rgba(16,48,24,.32)!important;
}
.login-card .login-logo{
  display:block!important;
  max-width:210px!important;
  max-height:90px!important;
  margin:0 auto 20px!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.login-card h1,
.login-card label{color:#fff!important}
.login-card p,
.login-card small{color:#e3ecdf!important}
.login-card input{
  background:#fff!important;
  color:#243126!important;
  border-color:#d2dfcd!important;
}
.login-card .btn.primary{
  background:#fff!important;
  color:#25562f!important;
  border-color:#fff!important;
}
.login-card .btn.primary:hover{
  background:#edf3e9!important;
  color:#173e22!important;
  border-color:#edf3e9!important;
}
.login-card .alert.ok{background:#e6efe1!important;color:#355d34!important}
.login-card .alert.bad{background:#f7e7e2!important;color:#8f3e34!important}

/* Acceso e instalador: tarjeta oliva con fondo claro para aumentar el contraste. */
.login-bg{
  background:#eef3e9!important;
}

/* Registro rápido: número de trabajador + selector sincronizado. */
.selector-trabajador-directo{grid-template-columns:minmax(110px,.35fr) minmax(240px,1.65fr)}
.selector-trabajador-directo #r_trabajador_numero{font-weight:800;font-size:16px}
@media(max-width:760px){.selector-trabajador-directo{grid-template-columns:minmax(95px,.42fr) minmax(0,1.58fr);gap:10px}.selector-trabajador-directo label{margin-bottom:8px}}
@media(max-width:430px){.selector-trabajador-directo{grid-template-columns:1fr}}


/* Registro rápido: actualización multi-equipo y optimización móvil */
.registro-fecha-acciones{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.registro-fecha-acciones input[type="date"]{min-width:155px}
.actualizar-dia{white-space:nowrap}
.toggle-registros-movil{display:none}
.registros-dia-bloque{min-width:0}

@media(max-width:760px){
  #tab-registro .registro-hero{
    padding:10px 12px!important;
    gap:8px!important;
    align-items:center!important;
  }
  #tab-registro .registro-hero .leaf,
  #tab-registro .registro-hero p{display:none!important}
  #tab-registro .registro-hero h2{font-size:19px!important;margin:0!important}
  #tab-registro .registro-fecha-acciones{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:7px;
  }
  #tab-registro .registro-fecha-acciones input[type="date"],
  #tab-registro .registro-fecha-acciones .btn{min-height:42px!important;margin:0!important}
  #tab-registro .actualizar-dia{padding:8px 10px!important;font-size:13px!important}

  /* El formulario se compacta para que la inserción requiera el mínimo desplazamiento. */
  #tab-registro .grid.two{display:block!important}
  #formularioRegistro{
    padding:10px!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:7px 8px!important;
  }
  #formularioRegistro > h3{display:none!important}
  #formularioRegistro > #avisoRegistro,
  #formularioRegistro > .selector-trabajador,
  #formularioRegistro > .segmented,
  #formularioRegistro > #camposPinchado,
  #formularioRegistro > #camposSeleccion,
  #formularioRegistro > .actions{grid-column:1/-1}
  #formularioRegistro > .observaciones-registro{grid-column:1/-1}
  #formularioRegistro > label{margin:0!important}
  #formularioRegistro label{font-size:12px!important;gap:3px!important}
  #formularioRegistro input,
  #formularioRegistro select,
  #formularioRegistro textarea{min-height:42px!important;padding:7px 9px!important;font-size:16px!important}
  #formularioRegistro textarea{height:42px!important;min-height:42px!important;resize:vertical}
  #formularioRegistro .selector-trabajador-directo{
    display:grid!important;
    grid-template-columns:92px minmax(0,1fr)!important;
    gap:7px!important;
  }
  #formularioRegistro .segmented{margin:0!important;gap:5px!important}
  #formularioRegistro .segmented button{min-height:42px!important;padding:7px!important}
  #camposPinchado{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:end}
  #camposPinchado .metric{min-height:42px!important;padding:6px 8px!important;margin:0!important}
  #camposPinchado .metric span{font-size:11px!important}
  #camposPinchado .metric strong{font-size:18px!important}
  #camposSeleccion .grid.three{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:5px!important}
  #camposSeleccion .metric{padding:5px 7px!important;margin-top:5px!important;min-height:38px!important}
  #camposSeleccion .metric span{font-size:10px!important}
  #camposSeleccion .metric strong{font-size:17px!important}
  #formularioRegistro .mobile-stepper{grid-template-columns:minmax(0,1fr) 38px!important;gap:4px!important}
  #formularioRegistro .mobile-stepper > input{min-height:42px!important;font-size:16px!important}
  #formularioRegistro .mobile-stepper-controls{min-height:42px!important;gap:2px!important}
  #formularioRegistro .mobile-stepper-btn{min-width:38px!important;min-height:20px!important;border-radius:6px!important;font-size:12px!important}
  #formularioRegistro .actions{
    position:sticky;
    bottom:0;
    z-index:25;
    display:grid!important;
    grid-template-columns:1fr auto;
    gap:6px!important;
    padding:7px 0 0!important;
    margin:0!important;
    background:linear-gradient(to bottom,rgba(243,246,239,0),#f3f6ef 25%);
  }
  #formularioRegistro .actions .btn{min-height:46px!important;margin:0!important}

  /* Los registros del día quedan plegados por defecto; el usuario decide cuándo verlos. */
  .registros-dia-bloque{margin-top:8px}
  .toggle-registros-movil{display:block!important;width:100%;min-height:44px;margin:0!important}
  .card-registros-dia{margin-top:7px!important}
  .card-registros-dia[hidden]{display:none!important}
}

/* Corregir visibilidad de campos según tipo en móvil */
@media(max-width:760px){
  #camposPinchado[hidden],
  #camposSeleccion[hidden]{display:none!important;}
}


/* Ajustes de escritorio: fecha y Actualizar siempre en la misma línea. */
.registro-fecha-acciones{flex-wrap:nowrap!important;white-space:nowrap}
.registro-fecha-acciones input[type="date"]{width:auto!important;flex:0 0 auto}
.registro-fecha-acciones .actualizar-dia{flex:0 0 auto}

/* Jornada y resumen: número directo + desplegable, compactos y alineados. */
.jornada-selector-directo,.resumen-selector-directo{display:grid;grid-template-columns:110px minmax(190px,1fr);gap:10px;align-items:end}
.jornada-selector-directo label,.resumen-selector-directo label{margin-bottom:0}
.jornada-editor{grid-template-columns:minmax(320px,1.55fr) minmax(180px,.8fr) minmax(220px,1fr) auto;align-items:end}
.resumen-selector-directo{min-width:310px}
.filters>.resumen-selector-directo{align-self:end}

@media(max-width:760px){
  .registro-fecha-acciones{white-space:normal}
  .jornada-selector-directo,.resumen-selector-directo{grid-template-columns:92px minmax(0,1fr);min-width:0;width:100%}
  .jornada-editor{grid-template-columns:1fr}
  .filters>.resumen-selector-directo{width:100%}
}


/* Jornada diaria: alineación uniforme en escritorio.
   Los label directos tenían margen inferior y el selector doble no,
   por eso Estado/Trabajo auxiliar quedaban más arriba. */
@media(min-width:761px){
  .jornada-editor > label{
    margin-bottom:0!important;
  }
  .jornada-editor > .jornada-selector-directo{
    align-self:end;
  }
  .jornada-editor > .btn{
    align-self:end;
  }
  .jornada-editor input,
  .jornada-editor select,
  .jornada-editor .btn{
    min-height:42px;
  }
}


/* Jornada: recuperar contraste visual de los estados no trabajados.
   Las reglas generales de .pill de la nueva paleta estaban anulando .pill.off. */
.jornada-persona.no-trabaja{
  background:#f6ece6!important;
  border-color:#dfc1b4!important;
}
.jornada-persona .pill.off{
  background:#ead4ca!important;
  border-color:#d7ad9c!important;
  color:#743f32!important;
}

/* Jornada: trabajo auxiliar en la misma línea que el estado. */
.jornada-persona .trabajo-aux-inline{
  display:inline-block;
  margin-left:6px;
  font-size:12px;
  color:var(--text);
  vertical-align:middle;
}
.jornada-persona .trabajo-aux-inline b{
  font-weight:800;
}

/* Resúmenes: alinear todos los filtros y el botón en escritorio. */
@media(min-width:761px){
  #tab-resumen .filters{
    align-items:end!important;
  }
  #tab-resumen .filters > label,
  #tab-resumen .filters > .resumen-selector-directo{
    margin-bottom:0!important;
    align-self:end;
  }
  #tab-resumen .filters > .btn{
    align-self:end;
    margin-bottom:0!important;
  }
  #tab-resumen .filters input,
  #tab-resumen .filters select,
  #tab-resumen .filters > .btn{
    min-height:42px;
    height:42px;
  }
  #tab-resumen .resumen-selector-directo{
    align-items:end;
  }
}

/* Menú móvil simplificado: solo icono hamburguesa + texto Menú. */
@media(max-width:760px){
  .mobile-menu-toggle{
    justify-content:flex-start!important;
    gap:10px!important;
  }
  #mobileMenuActual,
  .mobile-menu-chevron{
    display:none!important;
  }
}

/* Mensajes flotantes: siempre centrados y por encima de toda la interfaz */
#toast.toast{
  position:fixed!important;
  top:50%!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  width:max-content!important;
  max-width:min(560px,calc(100vw - 32px))!important;
  min-width:min(320px,calc(100vw - 32px))!important;
  padding:15px 20px!important;
  border-radius:12px!important;
  text-align:center!important;
  font-weight:800!important;
  line-height:1.4!important;
  box-shadow:0 18px 55px rgba(0,0,0,.32)!important;
  z-index:2147483647!important;
  opacity:0!important;
  transform:translate(-50%,-50%) scale(.96)!important;
  transition:opacity .18s ease,transform .18s ease!important;
  pointer-events:none!important;
}
#toast.toast.show{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
}
#toast.toast.bad{
  background:#a33d32!important;
  color:#fff!important;
}


/* Confirmaciones correctas: discretas, semitransparentes y breves en la parte inferior.
   Los errores (.bad) mantienen el aviso centrado y por encima de toda la interfaz. */
#toast.toast.ok{
  top:auto!important;
  left:50%!important;
  right:auto!important;
  bottom:22px!important;
  width:max-content!important;
  min-width:0!important;
  max-width:min(520px,calc(100vw - 28px))!important;
  padding:9px 14px!important;
  border-radius:10px!important;
  background:rgba(23,62,34,.78)!important;
  color:#fff!important;
  font-weight:700!important;
  box-shadow:0 8px 24px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
  transform:translate(-50%,10px)!important;
}
#toast.toast.ok.show{
  opacity:.88!important;
  transform:translate(-50%,0)!important;
}
@media(max-width:760px){
  #toast.toast.ok{bottom:14px!important;max-width:calc(100vw - 20px)!important;}
}

/* Jornada diaria: el Nº de trabajador usa el mismo stepper compacto que Registro.
   Así los números de dos o más cifras conservan espacio visible en móvil. */
@media(max-width:760px){
  .jornada-selector-directo .mobile-stepper{
    grid-template-columns:minmax(0,1fr) 38px!important;
    gap:4px!important;
  }
  .jornada-selector-directo .mobile-stepper > input{
    min-height:42px!important;
    padding-left:5px!important;
    padding-right:5px!important;
    font-size:16px!important;
  }
  .jornada-selector-directo .mobile-stepper-controls{
    min-height:42px!important;
    gap:2px!important;
  }
  .jornada-selector-directo .mobile-stepper-btn{
    min-width:38px!important;
    min-height:20px!important;
    border-radius:6px!important;
    font-size:12px!important;
  }
}



/* Identificación de versión de la aplicación. */
.app-version{
  padding:12px 16px 16px;
  text-align:center;
  font-size:12px;
  color:#6d786d;
  opacity:.82;
}
.version-login{
  margin-top:18px;
  text-align:center;
  font-size:11px;
  line-height:1.3;
  opacity:.68;
}


/* =========================================================
   v1.1.0 · Ajustes táctiles, Jornada y Resúmenes
   ========================================================= */
/* Plantas por bandeja: editable por teclado, sin flechas nativas ni stepper táctil. */
input.sin-flechas-numero{
  appearance:textfield;
  -moz-appearance:textfield;
}
input.sin-flechas-numero::-webkit-inner-spin-button,
input.sin-flechas-numero::-webkit-outer-spin-button{
  -webkit-appearance:none;
  margin:0;
}

/* Jornada por tarjetas: el editor se abre al tocar directamente al trabajador. */
.jornada-persona{
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;
}
.jornada-persona.estado-trabajando{border-left:5px solid #6f8d55!important}
.jornada-persona.estado-ausente{border-left:5px solid #c08a61!important}
.jornada-persona.estado-baja{border-left:5px solid #a15c55!important;background:#f3e6e3!important}
.modal-jornada-dialog{border:0;padding:0;border-radius:18px;background:transparent}
.jornada-modal-card{width:min(520px,calc(100vw - 24px));min-width:0}
.jornada-modal-card .modal-head small{display:block;color:var(--muted);font-weight:800;margin-bottom:2px}
.jornada-estados-tactiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}
.jornada-estados-tactiles button{
  min-height:54px;border:1px solid #b9c5a7;border-radius:12px;background:#eef3e9;color:#344431;
  font:inherit;font-weight:800;cursor:pointer;touch-action:manipulation
}
.jornada-estados-tactiles button.active{background:#4f7b39;color:#fff;border-color:#4f7b39;box-shadow:0 0 0 3px rgba(79,123,57,.14)}
.jornada-modal-ayuda{margin:-3px 0 12px;color:#8c5b4f;font-size:12px;font-weight:700}
.jornada-modal-actions{margin-top:12px}

/* Resumen: el número directo gana espacio, especialmente en táctil. */
.resumen-selector-directo{grid-template-columns:135px minmax(190px,1fr)!important;min-width:335px}
.resumen-selector-directo #s_trabajador_numero{font-size:17px;font-weight:800}

@media(max-width:760px){
  /* Barra superior de Registro: fecha y actualización quedan fuera de la tarjeta,
     liberando el hero y evitando cambios accidentales durante el registro. */
  .mobile-nav{padding:7px 8px!important}
  .mobile-nav-bar{display:flex;align-items:center;gap:7px;width:100%}
  .mobile-menu-toggle{width:auto!important;min-width:92px;min-height:48px!important;grid-template-columns:auto auto!important;flex:0 0 auto;padding:8px 11px!important}
  .mobile-registro-tools{display:none;align-items:center;gap:6px;min-width:0;flex:1}
  body[data-tab-activa="registro"] .mobile-registro-tools{display:flex}
  .mobile-registro-tools input[type="date"]{
    min-width:0;width:100%;height:48px;min-height:48px;padding:7px 6px;border:1px solid #829066;border-radius:10px;
    background:#f8faf5;color:#263522;font-size:14px;font-weight:800
  }
  .mobile-refresh-dia{
    flex:0 0 48px;width:48px;height:48px;border:1px solid #829066;border-radius:10px;background:#8d9a70;color:#fff;
    font-size:25px;font-weight:900;line-height:1;touch-action:manipulation
  }
  .mobile-refresh-dia:active{transform:scale(.96);background:#6f7e4d}
  #tab-registro .registro-fecha-acciones{display:none!important}
  #tab-registro .registro-hero{padding:9px 12px!important;margin-bottom:8px!important;min-height:0!important}
  #tab-registro .registro-hero>div:first-child{width:100%}
  #tab-registro .registro-hero h2{font-size:20px!important;text-align:left}

  /* Todos los steppers móviles usan una zona táctil mayor y homogénea. */
  .mobile-stepper,
  #formularioRegistro .mobile-stepper,
  .resumen-selector-directo .mobile-stepper{
    grid-template-columns:minmax(0,1fr) 52px!important;
    gap:6px!important;
  }
  .mobile-stepper > input,
  #formularioRegistro .mobile-stepper > input{
    min-height:54px!important;
    height:54px!important;
    font-size:18px!important;
    padding:7px!important;
  }
  .mobile-stepper-controls,
  #formularioRegistro .mobile-stepper-controls{
    min-height:54px!important;
    height:54px!important;
    gap:4px!important;
  }
  .mobile-stepper-btn,
  #formularioRegistro .mobile-stepper-btn{
    min-width:52px!important;
    min-height:25px!important;
    border-radius:8px!important;
    font-size:16px!important;
  }
  /* Nº trabajador de Registro dispone de más anchura para dos o más cifras. */
  #formularioRegistro .selector-trabajador-directo{grid-template-columns:122px minmax(0,1fr)!important}
  /* Resúmenes: Nº trabajador más ancho pero sin sacrificar el desplegable. */
  .resumen-selector-directo{grid-template-columns:128px minmax(0,1fr)!important;min-width:0;width:100%}

  /* Jornada: tarjetas realmente táctiles y modal tipo panel. */
  .jornada-cabecera{display:grid!important;grid-template-columns:1fr;gap:8px!important}
  .jornada-cabecera input[type="date"]{min-height:48px;font-weight:800}
  .people-grid{gap:9px!important}
  .jornada-persona{min-height:66px!important;padding:11px 12px!important}
  .jornada-persona b{font-size:15px;margin-bottom:6px}
  .jornada-persona .trabajo-aux-inline{display:block!important;margin:5px 0 0!important}
  .jornada-modal-card{padding:16px!important}
  .jornada-estados-tactiles{grid-template-columns:1fr;gap:7px}
  .jornada-estados-tactiles button{min-height:52px;font-size:16px}
  .jornada-modal-actions{grid-template-columns:1fr 1fr!important}
}

@media(max-width:390px){
  .mobile-menu-toggle{min-width:82px!important;padding:8px!important;gap:6px!important}
  .mobile-registro-tools input[type="date"]{font-size:13px;padding-left:3px;padding-right:3px}
  .mobile-refresh-dia{flex-basis:44px;width:44px}
  #formularioRegistro .selector-trabajador-directo{grid-template-columns:116px minmax(0,1fr)!important}
}


/* v1.1.1 · Afinado táctil de controles móviles */
@media(max-width:760px){
  /* Mismo verde que los botones principales y el botón Menú. */
  .mobile-refresh-dia{
    background:#25562f!important;
    border-color:#1c4727!important;
    color:#fff!important;
    box-shadow:0 4px 14px rgba(23,62,34,.14)!important;
  }
  .mobile-refresh-dia:active{background:#1c4727!important}

  /* Campo y botonera forman un único control visual, alto y centrado. */
  .mobile-stepper,
  #formularioRegistro .mobile-stepper,
  .resumen-selector-directo .mobile-stepper{
    grid-template-columns:minmax(0,1fr) 54px!important;
    gap:6px!important;
    align-items:center!important;
    min-height:62px!important;
  }
  .mobile-stepper > input,
  #formularioRegistro .mobile-stepper > input,
  .resumen-selector-directo .mobile-stepper > input{
    height:62px!important;
    min-height:62px!important;
    margin-top:0!important;
    align-self:center!important;
    text-align:center!important;
  }
  .mobile-stepper-controls,
  #formularioRegistro .mobile-stepper-controls,
  .resumen-selector-directo .mobile-stepper-controls{
    height:62px!important;
    min-height:62px!important;
    gap:4px!important;
    align-self:center!important;
  }
  .mobile-stepper-btn,
  #formularioRegistro .mobile-stepper-btn,
  .resumen-selector-directo .mobile-stepper-btn{
    min-width:54px!important;
    width:54px!important;
    min-height:29px!important;
    height:29px!important;
    border-radius:8px!important;
    font-size:17px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  /* Alinea entre sí los campos de las filas compactas de Registro. */
  #formularioRegistro label{vertical-align:top}
  #formularioRegistro .grid.three.compact{align-items:start!important}
}

/* v1.1.2 · Alineación táctil y barra móvil contextual */
@media(max-width:760px){
  /* Fuera de Registro, la barra Menú vuelve a ocupar todo el ancho. */
  body:not([data-tab-activa="registro"]) .mobile-menu-toggle{
    width:100%!important;
    flex:1 1 auto!important;
    grid-template-columns:auto auto 1fr auto!important;
  }

  /* Flechas grandes sin agrandar innecesariamente el campo numérico. */
  .mobile-stepper,
  #formularioRegistro .mobile-stepper,
  .resumen-selector-directo .mobile-stepper{
    grid-template-columns:minmax(0,1fr) 54px!important;
    min-height:62px!important;
    height:62px!important;
    gap:6px!important;
    align-items:center!important;
    margin-top:5px!important;
  }
  .mobile-stepper > input,
  #formularioRegistro .mobile-stepper > input,
  .resumen-selector-directo .mobile-stepper > input{
    height:42px!important;
    min-height:42px!important;
    padding:7px 8px!important;
    margin:0!important;
    align-self:center!important;
    font-size:16px!important;
  }
  .mobile-stepper-controls,
  #formularioRegistro .mobile-stepper-controls,
  .resumen-selector-directo .mobile-stepper-controls{
    height:62px!important;
    min-height:62px!important;
    gap:4px!important;
  }
  .mobile-stepper-btn,
  #formularioRegistro .mobile-stepper-btn,
  .resumen-selector-directo .mobile-stepper-btn{
    width:54px!important;
    min-width:54px!important;
    height:29px!important;
    min-height:29px!important;
    font-size:17px!important;
  }

  /* Registro: Nº compacto; selector y botonera quedan centrados en la misma línea visual. */
  #formularioRegistro .selector-trabajador-directo{
    grid-template-columns:124px minmax(0,1fr)!important;
    gap:7px!important;
    align-items:start!important;
  }
  #formularioRegistro .selector-trabajador-directo select{
    height:42px!important;
    min-height:42px!important;
    margin-top:15px!important;
  }

  /* Pinchado: la tarjeta calculada queda centrada respecto al control táctil de bandejas. */
  #camposPinchado{align-items:end!important}
  #camposPinchado .metric.preview{
    min-height:42px!important;
    height:42px!important;
    transform:translateY(-15px);
    align-items:center!important;
  }

  /* Los tres controles de Selección comparten exactamente la misma geometría. */
  #camposSeleccion .grid.three.compact{align-items:start!important}
}
@media(max-width:390px){
  #formularioRegistro .selector-trabajador-directo{grid-template-columns:124px minmax(0,1fr)!important}
}

/* Ajuste visual v1.1.2: controles alineados y estado de jornada con verde principal. */
#formularioRegistro .selector-trabajador-directo input,
#formularioRegistro .selector-trabajador-directo select{
  height:44px;
  min-height:44px;
  padding-top:9px;
  padding-bottom:9px;
  line-height:1.2;
  box-sizing:border-box;
}
.jornada-estados-tactiles button.active{
  background:#25562f!important;
  border-color:#25562f!important;
  color:#fff!important;
  box-shadow:0 0 0 3px rgba(37,86,47,.14)!important;
}
@media(max-width:760px){
  #formularioRegistro .selector-trabajador-directo input,
  #formularioRegistro .selector-trabajador-directo select{
    height:42px!important;
    min-height:42px!important;
    padding-top:7px!important;
    padding-bottom:7px!important;
    margin-bottom:0!important;
    align-self:center!important;
  }
}

/* v1.1.2 · Resúmenes móvil: alinear visualmente Nº trabajador y Trabajador. */
@media(max-width:760px){
  .resumen-selector-directo{align-items:start!important}
  .resumen-selector-directo > label:last-child select{
    height:42px!important;
    min-height:42px!important;
    margin-top:15px!important;
    padding-top:7px!important;
    padding-bottom:7px!important;
    box-sizing:border-box!important;
  }
}

/* v1.1.2 · Jornada diaria: fecha compacta en escritorio, coherente con el resto de filtros. */
@media(min-width:761px){
  #tab-jornada .jornada-cabecera{
    align-items:end;
  }
  #tab-jornada .jornada-cabecera #a_fecha{
    width:190px!important;
    min-width:190px!important;
    max-width:190px!important;
    flex:0 0 190px!important;
  }
}