/* Agua y Riego · tema v2 — colores y tipografía de aguayriego.mx; estilo limpio con tarjetas y barra lateral */
:root{
--az:#0095BF;--az-h:#0083a8;--az-o:#005066;--az2:#00bbf0;--az-50:#f5fdff;--az-100:#e0f8ff;--az-200:#b8efff;
--marino:#0E1932;--marino2:#222D46;--fondo:#F5F7FA;--sup:#fff;--sup2:#EEF2F6;--borde:#E2E7ED;--borde2:#C5CDD8;
--txt:#111418;--gris:#566070;--verde:#1F7A4D;--verde-s:#E3F4EA;--rojo:#E53E3E;--ambar:#FFC20E;
--sombra:0 8px 24px -10px rgba(16,24,40,.14);--sombra-s:0 1px 2px rgba(16,24,40,.05);
--r:16px;--r-s:10px;--lat:248px}
*{box-sizing:border-box}
body{margin:0;font-family:Roboto,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--fondo);color:var(--txt);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--az);text-underline-offset:2px}a:hover{color:var(--az-h)}
h1,h2,h3{font-family:Roboto,sans-serif;letter-spacing:-.01em;color:var(--marino)}
h1{font-size:1.6rem;font-weight:700;margin:.4em 0 .6em}h2{font-size:1.2rem;font-weight:700}h3{font-size:1.05rem;font-weight:600;margin:1em 0 .4em}
/* --- Barra lateral (escritorio) / barra superior (móvil) --- */
.top{background:var(--sup);color:var(--txt);display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem;position:sticky;top:0;z-index:1000;flex-wrap:wrap;border-bottom:1px solid var(--borde)}
.marca{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--marino);font-weight:700}
.marca .logo{height:38px;width:auto;display:block}
.marca small{font-weight:500;font-size:.78rem;color:var(--gris);background:var(--sup2);padding:.15rem .55rem;border-radius:999px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top nav{display:flex;gap:.15rem;flex-wrap:wrap}
.top nav a{color:var(--gris);text-decoration:none;padding:.55rem .8rem;border-radius:var(--r-s);font-size:.95rem;font-weight:500;display:flex;align-items:center;gap:.55rem}
.top nav a:hover{background:var(--sup2);color:var(--marino)}
.top nav a.act{background:var(--az-100);color:var(--az-o);font-weight:700}
.top nav a.salir{color:var(--rojo)}
.nav-tit{display:none;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--borde2);padding:.6rem .8rem .2rem}
.nav-sep{flex:1}
.avatar{width:28px;height:28px;border-radius:999px;background:var(--az);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;flex:none}
.menu-btn{display:none;background:var(--sup2);border:0;color:var(--marino);font-size:1.3rem;width:42px;height:42px;border-radius:12px;cursor:pointer}
@media(min-width:861px){
 body.con-menu{padding-left:var(--lat)}
 body.con-menu .top{position:fixed;left:0;top:0;bottom:0;width:var(--lat);flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;border-bottom:0;border-right:1px solid var(--borde);padding:1.1rem .8rem;overflow-y:auto}
 body.con-menu .marca{flex-direction:column;align-items:flex-start;gap:.5rem;padding:0 .4rem 1rem;border-bottom:1px solid var(--borde);margin-bottom:.6rem}
 body.con-menu .marca .logo{height:52px}
 body.con-menu .top nav{flex-direction:column;flex-wrap:nowrap;flex:1;gap:.1rem}
 body.con-menu .nav-tit{display:block}
 body.con-menu .top nav a.usr{border-top:1px solid var(--borde);border-radius:0;padding-top:.9rem;margin-top:.4rem}
}
@media(max-width:860px){.menu-btn{display:block}.top nav{display:none;width:100%;flex-direction:column;padding:.5rem 0 .3rem}.top nav.abierto{display:flex}.top nav a{padding:.8rem}.nav-sep{display:none}.marca .logo{height:32px}}
.cont{max-width:1180px;margin:0 auto;padding:1.4rem 1.2rem}
@media(max-width:600px){.cont{padding:1rem .8rem}h1{font-size:1.35rem}}
/* --- Tarjetas --- */
.card{background:var(--sup);border:1px solid var(--borde);border-radius:var(--r);box-shadow:var(--sombra-s);padding:1.2rem;margin-bottom:1rem}
.card>h2:first-child,.card>h3:first-child{margin-top:0}
.angosta{max-width:580px;margin-left:auto;margin-right:auto}
body.sin-menu{min-height:100vh;background:radial-gradient(1200px 500px at 50% -10%,var(--az-100),transparent 70%),var(--fondo);background-attachment:fixed}
.login{max-width:420px;margin:2.5rem auto;padding:2rem 1.6rem;box-shadow:var(--sombra)}
.login-marca{text-align:center;margin-bottom:.4rem}.login-marca img{height:72px;width:auto}
.login h1{text-align:center;color:var(--marino);font-size:1.35rem}.login h1 small{display:block;font-size:.9rem;font-weight:400;color:var(--gris);margin-top:.3rem}
/* --- Formularios --- */
label{display:block;margin:.7rem 0;font-weight:600;font-size:.9rem;color:var(--marino2)}label small{font-weight:400;color:var(--gris)}
input,select,textarea{width:100%;padding:.7rem .8rem;border:1px solid var(--borde2);border-radius:12px;font-size:1rem;margin-top:.3rem;font-family:inherit;background:#fff;color:var(--txt);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--az);box-shadow:0 0 0 4px rgba(0,149,191,.15)}
textarea{min-height:80px}fieldset{border:0;padding:0;margin:0}
/* --- Botones (píldora) --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;background:var(--az);color:#fff;border:0;border-radius:999px;padding:.68rem 1.25rem;font-size:.98rem;font-weight:600;cursor:pointer;text-decoration:none;margin:.2rem 0;font-family:inherit;box-shadow:0 1px 2px rgba(0,80,102,.2);transition:background .15s,transform .05s}
.btn:hover{background:var(--az-h);color:#fff}.btn:active{transform:translateY(1px)}
.btn.chico{padding:.38rem .8rem;font-size:.85rem}.btn.grande{width:100%;padding:.95rem;font-size:1.08rem}
.btn.gris{background:var(--sup2);color:var(--marino2);box-shadow:none}.btn.gris:hover{background:var(--borde)}
.btn.verde{background:var(--verde)}.btn.verde:hover{background:#17603c}.btn.rojo{background:var(--rojo)}.btn.rojo:hover{background:#c53030}
.acciones{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;margin:.6rem 0}.acciones input{width:auto;flex:1;min-width:180px}
.inline{display:inline}.inline input{width:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1rem}@media(max-width:700px){.grid2{grid-template-columns:1fr}}
/* --- Avisos y etiquetas --- */
.aviso{background:var(--az-50);border:1px solid var(--az-200);color:var(--az-o);padding:.85rem 1rem;border-radius:12px;margin-bottom:1rem}.aviso pre{white-space:pre-wrap;background:#fff;padding:.5rem;border-radius:8px}
.error{background:#FDECEC;color:#9B1C1C;border:1px solid #F8C9C9;padding:.7rem .9rem;border-radius:12px;margin:.5rem 0}
.banner{padding:.7rem 1rem;text-align:center;font-size:.93rem;border-bottom:1px solid var(--borde)}.banner.gracia{background:#FFF7DB}.banner.solo_lectura,.banner.pausada{background:#FDECEC}.banner.pendiente{background:var(--az-100)}.banner.activa{background:var(--verde-s)}
.etq{display:inline-block;padding:.15rem .6rem;border-radius:999px;font-size:.76rem;font-weight:600;background:var(--sup2);color:var(--marino2)}.etq.pagado,.etq.activa{background:var(--verde-s);color:var(--verde)}.etq.pendiente,.etq.gracia{background:#FFF3C4;color:#7a5a00}.etq.pausada,.etq.solo_lectura{background:#FDE0E0;color:#9B1C1C}
.mini{font-size:.85rem;color:var(--gris)}.centro{text-align:center}
/* --- Listas --- */
.lista .item{display:block;text-decoration:none;color:inherit;margin-bottom:.6rem;transition:border-color .15s,box-shadow .15s}
.lista a.item:hover{border-color:var(--az-200);box-shadow:var(--sombra)}
.item.hecha{border-left:5px solid var(--verde)}.item.inactivo{opacity:.55}
.fila-tit{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.4rem}.fila-tit h1{margin:.2em 0}
.filtros{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}.filtros input,.filtros select{width:auto;flex:1;min-width:140px;margin-top:0}
.dias{display:flex;gap:.35rem;flex-wrap:wrap;margin:.3rem 0}.chip{display:inline-flex;align-items:center;gap:.3rem;background:var(--sup2);border:1px solid var(--borde);padding:.38rem .7rem;border-radius:999px;font-weight:500;margin:0}.chip input{width:auto;margin:0}
.chk{display:flex;align-items:center;gap:.5rem}.chk input{width:auto;margin:0;accent-color:var(--az)}.chk.grande{background:var(--sup2);padding:.8rem;border-radius:12px;font-size:1rem}.checks{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
input[type=checkbox],input[type=radio]{accent-color:var(--az)}
.mapa{height:320px;border-radius:14px;margin:.5rem 0;z-index:1;border:1px solid var(--borde)}.mapa.grande{height:420px}
/* --- Tablas --- */
table{width:100%;border-collapse:separate;border-spacing:0;font-size:.92rem}th,td{padding:.6rem .55rem;border-bottom:1px solid var(--borde);text-align:left;vertical-align:top}
th{background:var(--sup2);color:var(--gris);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}th:first-child{border-top-left-radius:10px}th:last-child{border-top-right-radius:10px}
tbody tr:hover td{background:var(--az-50)}
.tabla-scroll{overflow-x:auto}td.mal,tr.mal td{color:var(--rojo);font-weight:600}tr.sin td{color:#999}.mal{color:var(--rojo)}
/* --- Indicadores --- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.9rem;margin-bottom:1rem}
.kpi{background:var(--sup);border:1px solid var(--borde);border-radius:var(--r);padding:1.1rem 1.2rem;box-shadow:var(--sombra-s);color:var(--gris);font-size:.88rem;font-weight:500;position:relative;overflow:hidden}
.kpi:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--az)}
.kpi b{display:block;font-size:1.75rem;font-weight:700;color:var(--marino);letter-spacing:-.02em}.kpi a{text-decoration:none;color:inherit}
.barras{display:flex;gap:.5rem;height:150px;align-items:flex-end}.barra{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;text-decoration:none;color:var(--gris);font-size:.8rem}.barra span{width:100%;background:linear-gradient(180deg,var(--az2),var(--az));border-radius:8px 8px 3px 3px;min-height:3px}
.alerta{background:#FFF8E1;border:1px solid #FDE7A6;border-radius:12px;padding:.6rem .8rem;margin:.35rem 0}
.semana{display:grid;grid-template-columns:repeat(6,1fr);gap:.6rem}@media(max-width:900px){.semana{grid-template-columns:1fr 1fr}}@media(max-width:480px){.semana{grid-template-columns:1fr}}
.dia h3{margin-top:0}.pild{display:block;border-left:4px solid;background:var(--sup2);padding:.45rem .6rem;margin:.35rem 0;border-radius:10px;text-decoration:none;color:var(--txt);font-size:.9rem}.pild small{display:block;color:var(--gris)}
.asig{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.asig select{width:auto}
.paradas{padding-left:1.2rem}.paradas li{padding:.3rem .4rem;border-radius:8px}.paradas li.hecha{border-left:4px solid var(--verde);background:var(--verde-s)}
.lecturas{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}@media(max-width:600px){.lecturas{grid-template-columns:1fr 1fr}}
input.fuera{border-color:var(--rojo);background:#fff3f3}
.dosis{background:var(--verde-s);border:1px solid #C6E8D3;border-radius:14px;padding:.9rem;margin:.6rem 0}
.quim{display:grid;grid-template-columns:2fr 2fr 1fr 1fr;gap:.35rem;margin:.3rem 0}@media(max-width:600px){.quim{grid-template-columns:1fr 1fr}}
.previas{display:flex;flex-wrap:wrap;gap:.45rem}.previas figure{margin:0;position:relative}.previas img{width:90px;height:90px;object-fit:cover;border-radius:12px}.previas figcaption{font-size:.7rem;text-align:center}
.galeria{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}.galeria img{width:100%;height:150px;object-fit:cover;border-radius:12px}.galeria figure{margin:0}.galeria figcaption{font-size:.8rem;color:var(--gris)}
.lect-tabla tr.bien td:nth-child(2){color:var(--verde);font-weight:600}.resumen{background:var(--verde-s);padding:.8rem;border-radius:12px}.checklist{list-style:none;padding:0}
.publico{max-width:720px;margin:1rem auto}
.tabs{display:inline-flex;gap:.2rem;margin-bottom:.9rem;background:var(--sup2);padding:.25rem;border-radius:999px;flex-wrap:wrap}.tabs a{padding:.42rem 1rem;border-radius:999px;text-decoration:none;color:var(--gris);font-weight:500}.tabs a.act{background:var(--sup);color:var(--az-o);box-shadow:var(--sombra-s);font-weight:700}
.log code{font-size:.75rem;word-break:break-all}.cambios{max-width:420px}
.terminos{background:var(--sup2);padding:.7rem;border-radius:12px;font-size:.9rem}
.pie{text-align:center;color:var(--gris);font-size:.8rem;padding:1.5rem}.pie-logo{height:26px;opacity:.7;margin-bottom:.3rem}
/* Panel v3 */
.pn-tit{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}.pn-tit small{font-size:.95rem;font-weight:400;color:var(--gris)}
.pn-et{display:block;font-size:.72rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--gris);margin-bottom:.25rem}
.pn-jornada{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}.pn-jornada b{font-size:1.05rem;font-weight:500}.pn-jornada form{margin:0}
.pn-ind{display:grid;grid-template-columns:repeat(5,1fr);background:var(--sup);border:1px solid var(--borde);border-radius:var(--r);box-shadow:var(--sombra-s);margin-bottom:1rem}
.pn-ind>div{padding:1.1rem 1.2rem;border-left:1px solid var(--borde)}.pn-ind>div:first-child{border-left:0}
.pn-num{display:block;font-size:1.8rem;font-weight:500;color:var(--marino);font-variant-numeric:tabular-nums;margin:.15rem 0}.pn-num.rojo{color:var(--rojo)}
.pn-ind small{color:var(--gris)}
.pn-barra{height:6px;background:var(--sup2);border-radius:3px;overflow:hidden;margin-top:.5rem}.pn-barra span{display:block;height:100%;background:var(--az);border-radius:3px}
.pn-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.pn-grid .card{margin-bottom:0}.pn-grid+.card{margin-top:1rem}
.pn-cab{display:flex;justify-content:space-between;align-items:center;margin-bottom:.6rem}.pn-cab h2{margin:0;font-size:1.05rem}.pn-cab a{font-size:.88rem}.pn-pct{color:var(--marino)}
.pn-vacio{text-align:center;color:var(--gris);padding:1.6rem .5rem;margin:0}
.pn-lista{list-style:none;margin:0;padding:0}.pn-lista li{display:flex;align-items:center;gap:.7rem;padding:.55rem 0;border-top:1px solid var(--borde)}.pn-lista li:first-child{border-top:0}
.pn-lista li>div{flex:1;min-width:0}.pn-lista small{display:block;color:var(--gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn-punto{width:10px;height:10px;border-radius:50%;flex:none}.pn-ok{color:var(--verde);font-weight:500;text-decoration:none;font-size:.9rem}.pn-cnt{font-weight:500;font-variant-numeric:tabular-nums}
.pn-lista .avatar{width:32px;height:32px;border-radius:50%;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:500;flex:none}
.pn-graf{display:flex;gap:.6rem;align-items:flex-end;height:180px;padding-top:.4rem}
.pn-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:.3rem;height:100%}.pn-col small{color:var(--gris);font-size:.75rem;min-height:1em}
.pn-tubo{flex:1;width:100%;max-width:42px;background:var(--sup2);border-radius:6px;display:flex;align-items:flex-end;overflow:hidden}.pn-tubo span{display:block;width:100%;background:var(--az);border-radius:6px 6px 0 0}
.pn-col b{font-size:.8rem;font-weight:500;color:var(--gris)}.pn-col.hoy b{color:var(--az)}
@media(max-width:860px){.pn-ind{grid-template-columns:1fr 1fr}.pn-ind>div:nth-child(3){border-left:0}.pn-ind>div:nth-child(n+3){border-top:1px solid var(--borde)}.pn-grid{grid-template-columns:1fr}}
@media(max-width:520px){.pn-ind{grid-template-columns:1fr}.pn-ind>div{border-left:0;border-top:1px solid var(--borde)}.pn-ind>div:first-child{border-top:0}.pn-jornada .btn{width:100%}.pn-jornada form{width:100%}}

/* v4: firma, incidencias, rangos */
.firma-caja canvas{width:100%;max-width:600px;height:auto;aspect-ratio:3/1;border:2px dashed #9fc9d9;border-radius:10px;background:#fff;touch-action:none;display:block}
figure.firma img{max-width:320px;width:100%;border:1px solid #e3e8ee;border-radius:8px;background:#fff}
.etq.sev-alta{background:#fde2e1;color:#b42318}.etq.sev-media{background:#fff4d6;color:#8a5a00}.etq.sev-baja{background:#e6f4ea;color:#1e7b34}
.etq.est-abierta{background:#fde2e1;color:#b42318}.etq.est-en_proceso{background:#e0f2fb;color:#0077a3}.etq.est-resuelta{background:#e6f4ea;color:#1e7b34}
.chips-filtro{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.chips-filtro a{padding:6px 12px;border-radius:999px;background:#eef6fa;color:#005f7f;text-decoration:none;font-size:.9rem}.chips-filtro a.act{background:#0095BF;color:#fff}
.ficha-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:6px 14px;font-size:.92rem}
/* ===== v5: Ventas, Reportes, Lista de compras ===== */
.nav-grupo{display:block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--borde2);padding:.75rem .8rem .2rem}
@media(min-width:861px){body:not(.con-menu) .nav-grupo{display:none}}
.tablero{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:.8rem;overflow-x:auto;padding-bottom:.5rem}
.tab-col{background:var(--sup2);border-radius:var(--r-s);padding:.6rem;min-height:120px}
.tab-col h3{margin:.1rem 0 .6rem;font-size:.95rem;display:flex;justify-content:space-between}
.tab-item{display:block;background:#fff;border:1px solid var(--borde);border-radius:var(--r-s);padding:.6rem .7rem;margin-bottom:.5rem;color:inherit;text-decoration:none}
.tab-item:hover{border-color:var(--az-o)}
@media(max-width:860px){.tablero{grid-template-columns:repeat(4,80vw);scroll-snap-type:x mandatory}.tab-col{scroll-snap-align:start}}
table.partidas{width:100%;border-collapse:collapse}
table.partidas td,table.partidas th{padding:.35rem;border-bottom:1px solid var(--borde);text-align:left}
table.partidas input{width:100%;min-width:0}
table.partidas td.num,table.partidas th.num{text-align:right;white-space:nowrap}
table.partidas tfoot td{font-weight:700;font-size:1.05rem}
.cot-fijo{background:var(--az-100);border-left:4px solid var(--az-o);padding:.6rem .8rem;border-radius:var(--r-s);font-size:.9rem}
.contrato-texto{white-space:pre-wrap;font-family:Georgia,serif;line-height:1.55;background:#fff;border:1px solid var(--borde);border-radius:var(--r-s);padding:1rem;max-height:60vh;overflow:auto}
textarea.contrato-texto{width:100%;min-height:340px;max-height:none}
.etq.cot-borrador,.etq.con-borrador,.etq.pro-nuevo,.etq.lc-necesario{background:#eef2f6;color:#475569}
.etq.cot-enviada,.etq.con-enviado,.etq.pro-contactado{background:#e0f2fe;color:#0369a1}
.etq.cot-aceptada,.etq.con-firmado,.etq.pro-convertido{background:#dcfce7;color:#15803d}
.etq.cot-rechazada,.etq.con-cancelado,.etq.pro-cerrado{background:#fee2e2;color:#b91c1c}
.etq.cot-vencida{background:#fef3c7;color:#92400e}
.card.lc-camioneta{border-left:4px solid #0ea5e9}.card.lc-comprado{opacity:.7;border-left:4px solid #22c55e}.card.lc-necesario{border-left:4px solid #f59e0b}
.rep-ind small{display:block;color:var(--gris);font-size:.78rem;margin-top:.2rem}
.verde-t{color:#15803d}b.rojo,td.rojo,.pn-num.rojo{color:var(--rojo)}
tr.neg td{background:#fff5f5}
.mrr-graf .pn-col small{font-size:.7rem}
@media(min-width:861px){.pn-ind.rep-ind{grid-template-columns:repeat(4,1fr)}}
/* v6 · fase 3: gráficas, perfil cliente y "Mi ruta de hoy" */
.graficas{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.8rem;margin:.4rem 0 1rem}
.graf-caja{background:var(--sup);border:1px solid var(--sup2);border-radius:12px;padding:.6rem .7rem;box-shadow:var(--sombra-s)}
.graf-caja h3{margin:0 0 .3rem;font-size:.92rem}.graf-caja canvas{width:100%;height:150px;display:block}
.cli-top{display:flex;align-items:center;gap:.6rem;justify-content:space-between;margin-bottom:.6rem}.cli-top form{margin:0}
.cli-tabs{display:flex;overflow-x:auto;flex-wrap:nowrap;max-width:100%}.cli-tabs a{white-space:nowrap}
.barra-prog{height:8px;background:var(--sup2);border-radius:99px;overflow:hidden;margin:.2rem 0 .9rem}.barra-prog span{display:block;height:100%;background:#2e9e5b}
.ruta-hoy{display:grid;gap:.8rem}.parada-tit{display:flex;gap:.7rem;align-items:flex-start}
.parada .num{flex:0 0 2.2rem;height:2.2rem;border-radius:50%;background:var(--az-o);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900}
.parada.lista-ok{opacity:.65}.parada.lista-ok .num{background:#2e9e5b}
.botones-grandes{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.7rem}.botones-grandes form{margin:0}
.botones-grandes .btn{width:100%;min-height:3.2rem;font-size:1.02rem;justify-content:center;text-align:center}
.btn.naranja{background:#f08a24;color:#fff}
@media(max-width:420px){.botones-grandes{grid-template-columns:1fr}}
.graf-caja{margin:0}
/* v7: rutas de todos los técnicos */
.leyenda-rutas{display:flex;flex-wrap:wrap;gap:.5rem;margin:.5rem 0}.leyenda-rutas .ley{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;background:#fff;border:1px solid var(--borde);border-radius:12px;padding:.45rem .7rem;text-decoration:none;color:inherit;min-width:180px}
.ley-color{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0003;margin-right:.35rem;vertical-align:middle}
.leyenda-rutas .mini-barra{flex-basis:100%;height:6px;margin:.2rem 0 0}.leyenda-rutas .total{align-self:center;padding:.3rem .5rem}
.grupo-ruta{border-left:4px solid var(--c,#0095BF);padding-left:.7rem;margin:1rem 0}.grupo-ruta h2{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:1.1rem}
/* Instalar app (PWA) */
.nav-instalar{background:var(--sup2);color:var(--marino);border:0;border-radius:12px;padding:.6rem .8rem;font:inherit;font-weight:600;cursor:pointer;text-align:left}
.nav-instalar:hover{background:var(--borde)}
.inst-fondo{position:fixed;inset:0;background:rgba(0,40,60,.55);display:flex;align-items:center;justify-content:center;padding:1rem;z-index:2000}
.inst-modal{background:#fff;border-radius:18px;max-width:440px;width:100%;max-height:90vh;overflow-y:auto;padding:1.3rem 1.2rem;position:relative;box-shadow:0 10px 40px rgba(0,40,60,.3)}
.inst-modal h2{margin:0 2rem .8rem 0;color:var(--marino)}
.inst-cerrar{position:absolute;top:.6rem;right:.6rem;width:42px;height:42px;border:0;border-radius:50%;background:var(--sup2);font-size:1.3rem;cursor:pointer;color:var(--marino)}
.inst-sec{border:2px solid var(--borde);border-radius:14px;padding:.7rem .9rem;margin:.6rem 0}
.inst-sec.activa{border-color:var(--az);background:var(--az-100)}
.inst-sec h3{margin:.1rem 0 .4rem;font-size:1.02rem}.inst-sec ol{margin:0;padding-left:1.3rem}.inst-sec li{margin:.25rem 0}
.inst-tu{display:inline-block;background:var(--az);color:#fff;border-radius:999px;font-size:.72rem;padding:.1rem .5rem;margin-left:.4rem;vertical-align:middle}
/* Checklist de visita */
.chk-mom{display:flex;gap:.5rem;margin:.5rem 0 1rem}.chk-mom input{flex:1}.chk.mom{border:1px dashed var(--az)}
.chk-editor input[type=text],.chk-editor input:not([type]){width:100%}.chk-editor tr.inactiva td{opacity:.55}.nowrap{white-space:nowrap}
fieldset.chk-cliente{border:1px solid var(--sup2);border-radius:12px;padding:.8rem;margin:.5rem 0}
.cobro-resumen{background:var(--verde-s);border-radius:12px;padding:.75rem .9rem;margin:.4rem 0 .8rem}.cobro-resumen .cr-txt{margin:0 0 .4rem;font-size:1.05rem}.cobro-resumen .cr-aviso{margin:.3rem 0 .5rem;font-size:.92rem}

/* Inventario de químicos */
.inv tr.inv-grupo td{background:#eef6fa;font-weight:600;color:#0b2545;font-size:.85em;text-transform:uppercase;letter-spacing:.03em}
input.inv-pz{width:5.5em!important;display:inline-block}
.inv-edit{margin-top:4px}.inv-edit form{margin:6px 0}
.inv-total{font-weight:600;color:#0095BF;min-height:1em}
.pn-stock{border-left:4px solid #e0a100}.pn-stock h2{margin-top:0}.pn-stock ul{margin:.4em 0 .6em;padding-left:1.2em}
.sa-q form.inline{margin:4px 0;flex-wrap:wrap}

/* Químicos incluidos en el servicio */
fieldset.quim-form{border:1px solid #dbe4ea;border-radius:8px;padding:10px 12px;margin:10px 0}
fieldset.quim-form legend{font-weight:600;padding:0 4px}
.quim-lista{list-style:none;padding-left:0;columns:2;margin:.3em 0}.quim-lista li.no{color:#8a97a6}
.etq.quim-cob{background:#fff4d6;color:#8a5a00}
/* Logo propio de la empresa */
.marca .logo.logo-emp{max-width:150px;object-fit:contain}
.logo-pub{display:block;max-height:70px;max-width:220px;width:auto;margin:0 0 .5rem}
.logo-cli{height:34px;width:auto;max-width:120px;object-fit:contain;vertical-align:middle}
.login-marca img.logo-emp{max-width:240px;object-fit:contain}
.logo-prev{background:var(--sup2);border:1px solid var(--borde);border-radius:10px;padding:.8rem;text-align:center;margin:.5rem 0}.logo-prev img{max-height:90px;max-width:100%}
.logo-card form{margin-top:.5rem}.pie-tec{font-size:.72rem}
/* Cotización → cobro */
.etq.cot-pagada{background:#0095BF;color:#fff}
.cot-cobro h2{margin-top:0}.cot-cobro .pagada-form{border-top:1px solid var(--borde);margin-top:1rem;padding-top:.6rem}
.transf{background:var(--sup2);border:1px solid var(--borde);border-radius:10px;padding:.7rem .9rem;margin:.6rem 0}
/* v20: menú simple en 5 secciones con íconos */
.ico{flex:none;vertical-align:middle}
.nav-g{border-radius:var(--r-s)}
.nav-g summary{list-style:none;cursor:pointer;color:var(--marino);padding:.6rem .8rem;border-radius:var(--r-s);font-weight:600;font-size:.95rem;display:flex;align-items:center;gap:.6rem;user-select:none}
.nav-g summary::-webkit-details-marker{display:none}
.nav-g summary:after{content:"";margin-left:auto;width:.45rem;height:.45rem;border-right:2px solid var(--borde2);border-bottom:2px solid var(--borde2);transform:rotate(45deg);transition:transform .15s}
.nav-g[open] summary:after{transform:rotate(-135deg)}
.nav-g summary:hover{background:var(--sup2)}
.nav-g summary.act-g{color:var(--az-o)}
.nav-g a{padding-left:2.55rem!important;font-size:.92rem}
.top nav a.nav-solo{color:var(--marino);font-weight:600}
.barra-inf{display:none}
@media(max-width:860px){
 .top nav{gap:0}.nav-g summary{padding:.85rem .8rem}
 body.con-menu .barra-inf{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--sup);border-top:1px solid var(--borde);box-shadow:0 -2px 10px rgba(14,25,50,.06);padding:.25rem .2rem calc(.25rem + env(safe-area-inset-bottom))}
 .barra-inf a{flex:1;display:flex;flex-direction:column;align-items:center;gap:.1rem;text-decoration:none;color:var(--gris);font-size:.7rem;font-weight:500;padding:.35rem 0;border-radius:10px}
 .barra-inf a.act{color:var(--az-o);background:var(--az-100);font-weight:700}
 body.con-menu{padding-bottom:4.4rem}
}
/* v20: cobranza en una pantalla */
.chips-filtro{display:flex;gap:.45rem;flex-wrap:wrap;margin:.2rem 0 1rem}
.chip-f{padding:.45rem 1rem;border-radius:999px;border:1px solid var(--borde);background:var(--sup);text-decoration:none;color:var(--gris);font-weight:500;font-size:.92rem}
.chip-f.act{background:var(--az);border-color:var(--az);color:#fff;font-weight:700}
.chip-f.f-pagado.act{background:var(--verde);border-color:var(--verde)}
.chip-f.f-pendiente.act{background:#E0A800;border-color:#E0A800;color:#3d2c00}
.chip-f.f-vencidos.act{background:#C53030;border-color:#C53030}
.kpi.kpi-verde:before{background:var(--verde)}.kpi.kpi-amarillo:before{background:#E0A800}
.cobro-fila{border-left:5px solid var(--borde2)}
.cobro-fila.cobro-pagado{border-left-color:var(--verde)}
.cobro-fila.cobro-pendiente{border-left-color:#E0A800}
.cobro-fila.cobro-vencido{border-left-color:#C53030;background:#FFF8F8}
.etq.vencido{background:#FDE0E0;color:#9B1C1C}
/* v20: calculadora de dosis */
.calc-dosis{border-left:5px solid var(--az);background:var(--az-50);margin:.8rem 0}
.calc-dosis h3{margin-top:0}
.calc-lista{list-style:none;padding:0;margin:.4rem 0}
.calc-lista li{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.45rem 0;border-top:1px solid var(--borde);flex-wrap:wrap}
.calc-leyenda{font-size:.82rem;font-weight:600;color:#7a5a00;background:#FFF3C4;border-radius:8px;padding:.35rem .6rem;margin:.4rem 0 0}
/* v20: orden manual de la ruta */
.orden-flechas{display:flex;gap:.3rem;justify-content:flex-end;margin:.2rem 0}
.orden-flechas .btn{min-width:2.6rem}
.orden-flechas .btn[disabled]{opacity:.35;cursor:default}
.calc-vol[hidden]{display:none!important}
/* =====================================================================
   v21 · Sistema de diseño "Pro" (estilo SaaS). Capa de tokens y componentes
   que se sobrepone al tema v2 sin cambiar marcado ni funciones.
   ===================================================================== */
@font-face{font-family:"Inter";src:local("Inter"),url("fonts/inter-var.woff") format("woff");font-weight:100 900;font-style:normal;font-display:swap}
:root{
/* Neutros slate */
--n-0:#fff;--n-25:#fbfcfd;--n-50:#f8fafc;--n-100:#f1f5f9;--n-200:#e2e8f0;--n-300:#cbd5e1;--n-400:#94a3b8;--n-500:#64748b;--n-600:#475569;--n-700:#334155;--n-800:#1e293b;--n-900:#0f172a;
/* Primario azul agua */
--p-50:#ecfaff;--p-100:#d4f3fd;--p-200:#a8e6fa;--p-500:#0095bf;--p-600:#0080a6;--p-700:#006685;--p-800:#08516a;
/* Estados */
--ok:#15803d;--ok-bg:#ecfdf3;--ok-bd:#abefc6;
--warn:#b45309;--warn-bg:#fffaeb;--warn-bd:#fedf89;
--bad:#b42318;--bad-bg:#fef3f2;--bad-bd:#fecdca;
--info:#0369a1;--info-bg:#f0f9ff;--info-bd:#b9e6fe;
/* Escala 4/8 */
--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;
/* Tipografía */
--f:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--t-xs:.75rem;--t-sm:.8125rem;--t-base:.9375rem;--t-md:1rem;--t-lg:1.125rem;--t-xl:1.375rem;--t-2xl:1.75rem;
/* Superficie */
--rad:12px;--rad-s:8px;--rad-xs:6px;
--sh-xs:0 1px 2px rgba(15,23,42,.05);
--sh-sm:0 1px 3px rgba(15,23,42,.06),0 1px 2px rgba(15,23,42,.04);
--sh-md:0 4px 12px -2px rgba(15,23,42,.08),0 2px 4px -2px rgba(15,23,42,.05);
--sh-lg:0 16px 40px -12px rgba(15,23,42,.22);
--ring:0 0 0 3px rgba(0,149,191,.28);
/* Mapeo a variables del tema anterior */
--az:var(--p-500);--az-h:var(--p-600);--az-o:var(--p-700);--az-50:var(--p-50);--az-100:var(--p-100);--az-200:var(--p-200);
--marino:var(--n-900);--marino2:var(--n-700);--fondo:var(--n-50);--sup:#fff;--sup2:var(--n-100);--borde:var(--n-200);--borde2:var(--n-300);
--txt:var(--n-800);--gris:var(--n-500);--verde:var(--ok);--verde-s:var(--ok-bg);--rojo:#d92d20;
--sombra:var(--sh-md);--sombra-s:var(--sh-xs);--r:var(--rad);--r-s:var(--rad-s);--lat:256px}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--f);font-size:var(--t-base);line-height:1.55;color:var(--txt);background:var(--n-50);font-feature-settings:"cv11","ss01";text-rendering:optimizeLegibility}
h1,h2,h3{font-family:var(--f);color:var(--n-900)}
h1{font-size:var(--t-2xl);font-weight:700;letter-spacing:-.022em;line-height:1.2;margin:0 0 var(--s1)}
h2{font-size:var(--t-lg);font-weight:600;letter-spacing:-.012em;line-height:1.35}
h3{font-size:var(--t-md);font-weight:600;letter-spacing:-.006em}
h1 small,h2 small{font-size:var(--t-sm);font-weight:500;color:var(--n-500);letter-spacing:0}
small,.mini{color:var(--n-500)}
.mini{font-size:var(--t-sm)}
a{color:var(--p-600);font-weight:500;text-decoration-color:rgba(0,128,166,.35)}a:hover{color:var(--p-700)}
:focus-visible{outline:2px solid var(--p-500);outline-offset:2px;border-radius:var(--rad-xs)}
::selection{background:var(--p-100)}
/* Cifras tabulares */
.kpi b,.pn-num,td,th,.num,.inv-total,.cobro-resumen,.calc-lista,.lect-tabla,.cobro-fila,input[type=number],.etq{font-variant-numeric:tabular-nums}
@media(max-width:600px){h1{font-size:var(--t-xl)}}

/* ---------- Contenedor y encabezado de página ---------- */
.cont{max-width:1200px;padding:var(--s8) var(--s8) var(--s10)}
@media(max-width:860px){.cont{padding:var(--s5) var(--s4) var(--s8)}}
.fila-tit,.pn-cab{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s3) var(--s4);flex-wrap:wrap;margin:0 0 var(--s6);padding-bottom:var(--s5);border-bottom:1px solid var(--n-200)}
.fila-tit h1,.pn-tit{margin:0;display:flex;flex-direction:column;gap:2px}
.pn-tit small{font-size:var(--t-sm);font-weight:500;color:var(--n-500);text-transform:capitalize}
.fila-tit>div,.fila-tit>.acciones{display:flex;gap:var(--s2);flex-wrap:wrap;margin:0}
.fila-tit .btn{margin:0}
.cont>h1:first-child{margin-bottom:var(--s6)}
@media(max-width:600px){.fila-tit{align-items:stretch;margin-bottom:var(--s5);padding-bottom:var(--s4)}.fila-tit>div{width:100%}.fila-tit>div .btn{flex:1}}

/* ---------- Tarjetas ---------- */
.card{background:#fff;border:1px solid var(--n-200);border-radius:var(--rad);box-shadow:var(--sh-sm);padding:var(--s6);margin-bottom:var(--s4)}
.card>h2:first-child,.card>h3:first-child{margin:0 0 var(--s4);font-size:var(--t-md);font-weight:600}
.card h2{font-size:var(--t-md)}
.card.item{padding:var(--s4) var(--s5);transition:border-color .15s,box-shadow .15s}
.card.item:hover{border-color:var(--n-300);box-shadow:var(--sh-md)}
@media(max-width:600px){.card{padding:var(--s4);border-radius:var(--rad)}}
.pn-grid{gap:var(--s4)}
hr{border:0;border-top:1px solid var(--n-200);margin:var(--s5) 0}

/* ---------- KPIs ---------- */
.kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--s4);margin-bottom:var(--s6)}
.kpi{border:1px solid var(--n-200);border-radius:var(--rad);box-shadow:var(--sh-sm);padding:var(--s5);font-size:var(--t-sm);font-weight:500;color:var(--n-500);background:#fff}
.kpi:before{display:none}
.kpi b{font-size:1.875rem;font-weight:650;letter-spacing:-.03em;color:var(--n-900);line-height:1.15;margin-top:var(--s1)}
.kpi.kpi-verde b{color:var(--ok)}.kpi.kpi-amarillo b{color:var(--warn)}.kpi.kpi-rojo b{color:var(--bad)}
.kpi.kpi-verde{box-shadow:inset 0 3px 0 var(--ok),var(--sh-sm)}.kpi.kpi-amarillo{box-shadow:inset 0 3px 0 #f79009,var(--sh-sm)}.kpi.kpi-rojo{box-shadow:inset 0 3px 0 #f04438,var(--sh-sm)}
.pn-et{font-size:var(--t-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--n-500)}
.pn-num{font-weight:650;letter-spacing:-.03em;color:var(--n-900)}
@media(max-width:600px){.kpis{grid-template-columns:1fr 1fr;gap:var(--s3)}.kpi{padding:var(--s4)}.kpi b{font-size:1.5rem}}

/* ---------- Botones ---------- */
.btn{height:40px;padding:0 var(--s4);border-radius:var(--rad-s);font-size:var(--t-base);font-weight:600;letter-spacing:-.005em;background:var(--p-500);color:#fff;border:1px solid var(--p-600);box-shadow:var(--sh-xs),inset 0 1px 0 rgba(255,255,255,.14);transition:background .15s,border-color .15s,box-shadow .15s,color .15s;line-height:1;white-space:nowrap}
.btn:hover{background:var(--p-600);color:#fff}
.btn:focus-visible{outline:0;box-shadow:var(--ring)}
.btn:disabled,.btn[disabled]{opacity:.5;cursor:not-allowed}
/* secundario */
.btn.gris{background:#fff;color:var(--n-700);border:1px solid var(--n-300);box-shadow:var(--sh-xs)}
.btn.gris:hover{background:var(--n-50);color:var(--n-900);border-color:var(--n-400)}
/* fantasma */
.btn.fantasma,.btn.ghost{background:transparent;border-color:transparent;color:var(--n-600);box-shadow:none}.btn.fantasma:hover,.btn.ghost:hover{background:var(--n-100);color:var(--n-900)}
.btn.verde{background:var(--ok);border-color:#116932}.btn.verde:hover{background:#116932}
.btn.rojo{background:#d92d20;border-color:#b42318}.btn.rojo:hover{background:#b42318}
.btn.naranja{background:#f79009;border-color:#dc6803}
.btn.chico{height:32px;padding:0 var(--s3);font-size:var(--t-sm);border-radius:var(--rad-xs)}
.btn.grande{height:48px;font-size:var(--t-md);border-radius:var(--rad-s)}
@media(max-width:600px){.btn{height:44px}.btn.chico{height:36px}}

/* ---------- Formularios ---------- */
label{display:block;font-size:var(--t-sm);font-weight:600;color:var(--n-700);margin-bottom:var(--s4)}
label small{font-weight:500}
input,select,textarea{min-height:44px;padding:10px 12px;margin-top:6px;border:1px solid var(--n-300);border-radius:var(--rad-s);font-size:var(--t-md);font-weight:400;color:var(--n-900);background:#fff;box-shadow:var(--sh-xs)}
textarea{min-height:96px;line-height:1.5}
input::placeholder,textarea::placeholder{color:var(--n-400)}
input:hover,select:hover,textarea:hover{border-color:var(--n-400)}
input:focus,select:focus,textarea:focus{border-color:var(--p-500);box-shadow:var(--ring)}
input[type=checkbox],input[type=radio]{min-height:0;width:18px;height:18px;box-shadow:none;margin:0}
input[type=file]{padding:8px;font-size:var(--t-sm)}
select{appearance:none;-webkit-appearance:none;padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
select[multiple]{background-image:none;padding-right:12px}
input.fuera{border-color:#f04438;background:var(--bad-bg)}input.fuera:focus{box-shadow:0 0 0 3px rgba(240,68,56,.2)}
.chk{font-weight:500;color:var(--n-700);font-size:var(--t-base)}
.chk.grande{background:var(--n-50);border:1px solid var(--n-200);border-radius:var(--rad-s)}
.chip{background:#fff;border:1px solid var(--n-300);border-radius:999px;font-size:var(--t-sm);font-weight:500;color:var(--n-700);min-height:36px}
.chip:has(input:checked){background:var(--p-50);border-color:var(--p-500);color:var(--p-700)}
.filtros{gap:var(--s2);margin-bottom:var(--s5)}
.filtros input,.filtros select{min-height:40px}
.grid2{gap:0 var(--s4)}

/* ---------- Tablas ---------- */
.tabla-scroll.card{padding:0;overflow:auto}
table{font-size:var(--t-base);border-collapse:separate;border-spacing:0}
th{background:var(--n-50);color:var(--n-500);font-size:var(--t-xs);font-weight:600;letter-spacing:.05em;text-transform:uppercase;padding:10px 16px;border-bottom:1px solid var(--n-200);white-space:nowrap}
th:first-child,th:last-child{border-radius:0}
td{padding:12px 16px;border-bottom:1px solid var(--n-100);color:var(--n-700);vertical-align:middle}
tr:last-child td{border-bottom:0}
tbody tr:hover td,table tr:hover td{background:var(--n-50)}
tr:first-child:has(th):hover td{background:none}
.card:not(.tabla-scroll)>table th:first-child{border-top-left-radius:var(--rad-xs)}.card:not(.tabla-scroll)>table th:last-child{border-top-right-radius:var(--rad-xs)}
td input,td select{margin-top:0;min-height:38px}
/* Celular: cada fila se vuelve tarjeta (app.js agrega data-l a cada celda) */
@media(max-width:640px){
 table.rt,table.rt tbody,table.rt tr,table.rt td{display:block;width:100%}
 table.rt thead,table.rt tr.rt-cab{display:none}
 table.rt tr{background:#fff;border:1px solid var(--n-200);border-radius:var(--rad);box-shadow:var(--sh-xs);padding:var(--s2) var(--s4);margin:0 0 var(--s3)}
 table.rt td{border:0;padding:6px 0;display:flex;justify-content:space-between;align-items:center;gap:var(--s3);text-align:right}
 table.rt td:before{content:attr(data-l);font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--n-500);text-align:left;flex:none;max-width:45%}
 table.rt td[data-l=""]:before{display:none}
 table.rt td:first-child{font-weight:600;color:var(--n-900);border-bottom:1px solid var(--n-100);padding-bottom:var(--s2);margin-bottom:var(--s1)}
 table.rt td form,table.rt td .acciones{justify-content:flex-end}
 table.rt tr:hover td{background:none}
 .tabla-scroll.card:has(table.rt){background:none;border:0;box-shadow:none;overflow:visible}
}

/* ---------- Badges pill ---------- */
.etq{display:inline-flex;align-items:center;gap:5px;padding:2px 10px;border-radius:999px;font-size:var(--t-xs);font-weight:600;line-height:1.6;letter-spacing:.01em;background:var(--n-100);color:var(--n-700);border:1px solid var(--n-200);white-space:nowrap}
.etq:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}
.etq.pagado,.etq.activa,.etq.sev-baja,.etq.est-resuelta,.etq.cot-aceptada,.etq.con-firmado,.etq.pro-convertido{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-bd)}
.etq.pendiente,.etq.gracia,.etq.sev-media,.etq.cot-vencida,.etq.quim-cob{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-bd)}
.etq.vencido,.etq.solo_lectura,.etq.sev-alta,.etq.est-abierta,.etq.cot-rechazada,.etq.con-cancelado,.etq.pro-cerrado,.etq.rechazada{background:var(--bad-bg);color:var(--bad);border-color:var(--bad-bd)}
.etq.est-en_proceso,.etq.cot-enviada,.etq.con-enviado,.etq.pro-contactado{background:var(--info-bg);color:var(--info);border-color:var(--info-bd)}
.etq.cot-pagada{background:var(--p-500);color:#fff;border-color:var(--p-600)}

/* ---------- Alertas / toasts ---------- */
.aviso,.error,.alerta,.banner{border-radius:var(--rad-s);padding:12px 16px 12px 44px;font-size:var(--t-base);font-weight:500;position:relative;box-shadow:var(--sh-xs);line-height:1.5}
.aviso:before,.error:before,.alerta:before{content:"";position:absolute;left:16px;top:14px;width:18px;height:18px;border-radius:50%;background:currentColor;-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.aviso{background:var(--ok-bg);border:1px solid var(--ok-bd);color:#085d3a;--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 0a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm4.7 7.7-5.5 5.5a1 1 0 0 1-1.4 0L5.3 10.7a1 1 0 1 1 1.4-1.4l1.8 1.8 4.8-4.8a1 1 0 1 1 1.4 1.4z'/%3E%3C/svg%3E")}
.cont>.aviso:first-child{animation:toast-in .25s ease-out}
.error{background:var(--bad-bg);border:1px solid var(--bad-bd);color:#912018;--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 0a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15H9v-2h2v2zm0-4H9V5h2v6z'/%3E%3C/svg%3E")}
.alerta{background:var(--warn-bg);border:1px solid var(--warn-bd);color:#93370d;--m:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 0a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm1 15H9v-2h2v2zm0-4H9V5h2v6z'/%3E%3C/svg%3E")}
.banner{border-radius:0;box-shadow:none;padding:10px 16px;text-align:center;font-size:var(--t-sm)}
@keyframes toast-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- Estados vacíos ---------- */
.pn-vacio{display:flex;flex-direction:column;align-items:center;gap:var(--s2);padding:var(--s8) var(--s4);color:var(--n-500);font-size:var(--t-base)}
.pn-vacio:before{content:"";width:44px;height:44px;border-radius:12px;background:var(--n-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 24'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 15h8'/%3E%3C/svg%3E") center no-repeat;border:1px solid var(--n-200)}
.vacio{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s2);padding:var(--s10) var(--s4);color:var(--n-500)}

/* ---------- Navegación: sidebar oscuro (escritorio) ---------- */
.top{border-bottom:1px solid var(--n-200);box-shadow:var(--sh-xs)}
.avatar{background:linear-gradient(135deg,var(--p-500),#00bbf0);font-weight:600}
.menu-btn{background:var(--n-100);color:var(--n-700);border-radius:var(--rad-s);width:40px;height:40px}
.menu-btn:focus-visible{box-shadow:var(--ring);outline:0}
@media(min-width:861px){
 body.con-menu .top{background:var(--n-900);border-right:1px solid #1e293b;box-shadow:none;padding:var(--s5) var(--s3);color:#cbd5e1}
 body.con-menu .marca{background:#fff;border-radius:var(--rad);padding:var(--s3) var(--s4);margin:0 var(--s1) var(--s4);width:auto}
 body.con-menu .marca small{background:var(--n-100);color:var(--n-600)}
 body.con-menu .top nav a,body.con-menu .nav-g summary{color:#cbd5e1;font-size:var(--t-base);font-weight:500;border-radius:var(--rad-s);padding:9px 12px}
 body.con-menu .top nav a:hover,body.con-menu .nav-g summary:hover{background:rgba(148,163,184,.12);color:#fff}
 body.con-menu .top nav a.act{background:rgba(0,187,240,.14);color:#fff;font-weight:600;box-shadow:inset 3px 0 0 #22c3f0}
 body.con-menu .top nav a.nav-solo{color:#e2e8f0}
 body.con-menu .nav-g summary.act-g{color:#fff}
 body.con-menu .nav-g summary .ico,body.con-menu .top nav a .ico{color:#94a3b8}
 body.con-menu .nav-g summary.act-g .ico,body.con-menu .top nav a.act .ico{color:#22c3f0}
 body.con-menu .nav-g summary:after{border-color:#64748b}
 body.con-menu .nav-g a{color:#94a3b8;font-size:var(--t-sm)!important}
 body.con-menu .nav-tit{color:#64748b;font-size:11px;letter-spacing:.08em}
 body.con-menu .top nav a.usr{border-top:1px solid #1e293b;border-radius:0;padding-top:var(--s4);margin-top:var(--s2);color:#fff;font-weight:600}
 body.con-menu .top nav a.salir{color:#fda29b}
 body.con-menu .top nav a.salir:hover{background:rgba(240,68,56,.12);color:#fecdca}
 body.con-menu .nav-instalar{background:rgba(148,163,184,.12);color:#e2e8f0;border:1px solid #334155;border-radius:var(--rad-s)}
 body.con-menu .top nav :focus-visible{outline:2px solid #22c3f0;outline-offset:1px}
}
/* Barra inferior (celular) */
@media(max-width:860px){
 .top{background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(180%) blur(12px);backdrop-filter:saturate(180%) blur(12px)}
 .top nav.abierto{background:#fff;border-top:1px solid var(--n-200)}
 body.con-menu .barra-inf{background:rgba(255,255,255,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--n-200);box-shadow:0 -4px 16px -8px rgba(15,23,42,.12);padding:6px 6px calc(6px + env(safe-area-inset-bottom))}
 .barra-inf a{font-size:11px;font-weight:500;color:var(--n-500);gap:3px;padding:6px 0;border-radius:var(--rad-s);min-height:48px;justify-content:center}
 .barra-inf a.act{background:transparent;color:var(--p-600);font-weight:600}
 .barra-inf a.act .ico{background:var(--p-100);border-radius:999px;padding:2px 14px;width:52px;height:26px;box-sizing:border-box}
 .barra-inf a:focus-visible{outline:2px solid var(--p-500)}
}

/* ---------- Filtros tipo pill (cobranza, clientes) ---------- */
.chip-f{min-height:34px;display:inline-flex;align-items:center;padding:0 14px;border:1px solid var(--n-300);background:#fff;color:var(--n-600);font-size:var(--t-sm);font-weight:500;box-shadow:var(--sh-xs)}
.chip-f:hover{border-color:var(--n-400);color:var(--n-900)}
.chip-f.act{background:var(--n-900);border-color:var(--n-900);color:#fff}
.chip-f.f-pagado.act{background:var(--ok);border-color:var(--ok)}
.chip-f.f-pendiente.act{background:#f79009;border-color:#f79009;color:#fff}
.chip-f.f-vencidos.act{background:#d92d20;border-color:#d92d20}
.cobro-fila{border-left-width:4px}
.cobro-fila.cobro-pendiente{border-left-color:#f79009}
.cobro-fila.cobro-vencido{border-left-color:#f04438;background:#fff}
.calc-dosis{border:1px solid var(--p-200);border-left:4px solid var(--p-500);background:var(--p-50)}
.calc-leyenda{background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn-bd)}

/* ---------- Login ---------- */
body.sin-menu{background:radial-gradient(1200px 500px at 50% -10%,var(--p-100),transparent 70%),var(--n-50)}
.login{max-width:420px;margin:var(--s12) auto var(--s6);padding:var(--s8);border-radius:16px;box-shadow:var(--sh-lg);border:1px solid var(--n-200)}
.login h1{font-size:var(--t-xl);letter-spacing:-.02em;margin:var(--s4) 0 var(--s6)}
.login h1 small{font-size:var(--t-base);margin-top:6px}
.login .btn{width:100%;height:46px;font-size:var(--t-md)}
@media(max-width:600px){.login{margin:var(--s6) auto;padding:var(--s6)}}

/* ---------- Pie ---------- */
.pie{color:var(--n-400);font-size:var(--t-xs);padding:var(--s8) var(--s4)}
.pie a{color:var(--n-500)}
.pie-logo{opacity:.85}
/* ajustes finos v21 */
.pn-tit small{text-transform:none}
.alerta{padding-left:16px}.alerta:before{display:none}
@media(min-width:861px){body.con-menu{background:linear-gradient(90deg,var(--n-900) var(--lat),var(--n-50) var(--lat))}}
@media(max-width:640px){
 table.rt td:first-child{display:block;text-align:left}
 table.rt td:first-child:before{display:none}
 table.rt tr:not(:has(td)){display:block;background:none;border:0;box-shadow:none;padding:var(--s3) 0 var(--s1);margin:0}
 table.rt tr:not(:has(td)) th{display:block;background:none;border:0;padding:0;text-align:left}
}
/* KPIs del panel como tarjetas independientes */
.pn-ind{background:none;border:0;box-shadow:none;gap:var(--s4);margin-bottom:var(--s6)}
.pn-ind>div,.pn-ind>div:first-child{background:#fff;border:1px solid var(--n-200);border-radius:var(--rad);box-shadow:var(--sh-sm);padding:var(--s5);display:flex;flex-direction:column;gap:2px}
.pn-ind .pn-num{font-size:1.875rem;line-height:1.2;margin:var(--s1) 0}
.pn-ind .pn-num.rojo{color:var(--bad)}
.pn-barra{background:var(--n-100);border-radius:999px;height:6px;margin-top:var(--s2);overflow:hidden}.pn-barra span{background:var(--p-500);border-radius:999px}
@media(max-width:860px){.pn-ind{grid-template-columns:1fr 1fr;gap:var(--s3)}.pn-ind>div,.pn-ind>div:nth-child(n){border:1px solid var(--n-200);padding:var(--s4)}.pn-ind .pn-num{font-size:1.5rem}}
@media(max-width:520px){.pn-ind{grid-template-columns:1fr 1fr}.pn-ind>div:last-child:nth-child(odd){grid-column:1/-1}}
.pn-jornada{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap}
/* Mapa de destino (Leaflet + OpenStreetMap) */
.mapa-campo{border:1px solid var(--n-200);border-radius:var(--rad-s,12px);padding:var(--s3,12px) var(--s4,16px);margin:0 0 var(--s4,16px);min-width:0}
.mapa-campo legend{font-weight:600;padding:0 6px}
.mapa{height:260px;width:100%;border-radius:12px;border:1px solid var(--n-200);overflow:hidden;z-index:0;background:var(--n-100)}
.mapa-chico{height:200px;margin:.5rem 0 .25rem}
.mapa-botones{margin-top:.5rem}.mapa-botones .btn{flex:1 1 auto}
.mapa .leaflet-control-attribution{font-size:10px}
@media(min-width:861px){.mapa{height:320px}.mapa-chico{height:220px}}
.perfil-sec{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--n-200)}
.mapa-campo [hidden]{display:none!important}
/* búsqueda en mapa */
.mapa-buscar{display:flex;flex-direction:column;gap:8px;margin:0 0 8px}
.mapa-buscar input{width:100%;min-width:0;margin:0;font-size:16px}
.mapa-buscar .btn{width:100%}
.mapa-resultados{list-style:none;margin:0 0 8px;padding:0;border:1px solid var(--borde,#e2e8f0);border-radius:10px;overflow:hidden;background:#fff}
.mapa-resultados li+li{border-top:1px solid var(--borde,#e2e8f0)}
.mapa-resultados button{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 12px;font:inherit;font-size:14px;cursor:pointer}
.mapa-resultados button:hover{background:#f1f5f9}

.mapa-campo>label{margin-bottom:8px}
.leaflet-control-layers label{margin:0;font-weight:400}
.leaflet-control-layers-selector{width:auto;margin:0 4px 0 0}

/* Ojito mostrar/ocultar contraseña */
.pwd-wrap{position:relative;display:block;width:100%;margin-top:.3rem}
.pwd-wrap>input{margin-top:0!important;padding-right:48px!important;width:100%;box-sizing:border-box}
.pwd-ojo{position:absolute;top:0;right:0;bottom:0;width:44px;min-height:44px;margin:0;padding:0;border:0;background:transparent;color:var(--gris,#566070);display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:0 12px 12px 0;-webkit-tap-highlight-color:transparent;box-shadow:none}
.pwd-ojo:hover{color:var(--az,#0095BF);background:transparent}
.pwd-ojo:focus-visible{outline:2px solid var(--az,#0095BF);outline-offset:-4px}
.pwd-ojo svg{pointer-events:none}
form.inline .pwd-wrap{display:inline-block;width:auto;vertical-align:middle;margin-top:0}
form.inline .pwd-wrap>input{width:auto}
input[type=password]::-ms-reveal,input[type=password]::-ms-clear{display:none}