:root{--az:#0b3d91;--bg:#f4f6fa;--tx:#1b2430;--mu:#6b7686;--br:#d9dfe8;--ve:#1e8e3e;--ro:#c62828;--na:#e07b00}
*{box-sizing:border-box}
body{margin:0;font:16px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--tx)}
.barra{display:flex;gap:10px;align-items:center;padding:10px 14px;background:var(--az);color:#fff;position:sticky;top:0;z-index:5}
.barra span{flex:1;opacity:.85;text-align:right;font-size:14px}
.btn{display:inline-block;border:0;border-radius:10px;background:var(--az);color:#fff;padding:12px 16px;font-size:16px;font-weight:600;text-decoration:none;cursor:pointer;text-align:center}
.btn.chico{padding:8px 12px;font-size:14px}.btn.grande{width:100%;padding:14px}
.btn.gris{background:#e4e8ef;color:var(--tx)}.btn.rojo{background:var(--ro)}.btn.verde{background:var(--ve)}
.btn.borde{background:#fff;color:var(--tx);border:1px solid var(--br)}
.btn.rojo-b{background:#fff;color:var(--ro);border:2px solid var(--ro)}
.btn.sel{outline:3px solid #000;outline-offset:1px}.btn:disabled{opacity:.5}
.login{max-width:340px;margin:12vh auto;padding:0 20px;text-align:center}.login h1{color:var(--az);margin:0}
.sub{color:var(--mu);margin-top:0}.login form{display:grid;gap:14px;text-align:left}
label{display:grid;gap:4px;font-size:14px;color:var(--mu)}
input,select,textarea{font:inherit;padding:10px;border:1px solid var(--br);border-radius:8px;background:#fff;color:var(--tx);width:100%}
input[type=checkbox]{width:auto}
.error{color:var(--ro)}.ok{color:var(--ve)}.muted{color:var(--mu);font-size:14px}.vacio{text-align:center;color:var(--mu);padding:30px}
.controles{display:grid;gap:8px;padding:12px 14px}.atajos{display:flex;gap:8px;flex-wrap:wrap}
.chips{display:flex;gap:6px;overflow-x:auto;padding:0 14px 8px}
.chip{border:1px solid var(--br);background:#fff;border-radius:999px;padding:6px 12px;white-space:nowrap;font-size:14px;cursor:pointer}
.chip.on{background:var(--az);color:#fff;border-color:var(--az)}
.lista{display:grid;gap:10px;padding:0 14px 30px}
.card{background:#fff;border:1px solid var(--br);border-radius:12px;padding:12px;display:grid;gap:8px;margin:0 0 10px}
.lista .card{margin:0}
.fila{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.obs{background:#fff7e0;border-radius:8px;padding:6px 8px;font-size:14px}
.acciones{display:flex;gap:8px;flex-wrap:wrap}.acciones .btn{flex:0 0 auto}
.estatus-btns{display:flex;gap:6px;flex-wrap:wrap}.estatus-btns .btn{flex:1 1 auto}
.num{display:inline-block;background:var(--az);color:#fff;border-radius:999px;min-width:26px;text-align:center;padding:0 6px;margin-right:4px}
.badge{font-size:12px;padding:3px 8px;border-radius:999px;color:#fff;background:#8a94a3;white-space:nowrap}
.badge.verde,.badge.verde-fuerte{background:var(--ve)}.badge.rojo{background:var(--ro)}
.badge.naranja{background:var(--na)}.badge.azul{background:#1a73e8}
.tabs{display:flex;gap:6px}.tabs button{flex:1;border:1px solid var(--br);background:#fff;border-radius:8px;padding:8px;font-size:15px;cursor:pointer}
.tabs button.on{background:var(--az);color:#fff;border-color:var(--az)}.tabs.fijo{padding:8px 14px;overflow-x:auto}
.ancho{max-width:1100px;margin:0 auto;padding-bottom:30px}.ancho>.card{margin:0 14px 10px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;padding:0 14px 10px}
.kpis div{background:#fff;border:1px solid var(--br);border-radius:10px;padding:10px;display:grid}.kpis span{font-size:12px;color:var(--mu)}.kpis b{font-size:20px}
.tabla-wrap{overflow-x:auto;padding:0 14px}table{width:100%;border-collapse:collapse;background:#fff;font-size:14px}
th,td{border-bottom:1px solid var(--br);padding:8px;text-align:left;vertical-align:top}tbody tr[data-id]{cursor:pointer}tbody tr[data-id]:hover{background:#eef3fb}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.checks{display:flex;flex-wrap:wrap;gap:10px}.checks label,label.check{display:flex;align-items:center;gap:6px;color:var(--tx)}
.modal{position:fixed;inset:0;background:#0007;display:grid;place-items:center;z-index:20;padding:12px;overflow:auto}
.modal-card{background:#fff;border-radius:14px;padding:16px;width:100%;max-width:560px;display:grid;gap:10px;max-height:94vh;overflow:auto}
.prev,.evid img{max-width:100%;border-radius:8px}.evid{display:grid;gap:6px;padding:8px 0;border-top:1px solid var(--br)}.evid img{max-height:240px;object-fit:cover}
#toasts{position:fixed;bottom:16px;left:0;right:0;display:grid;gap:6px;justify-items:center;z-index:30;pointer-events:none}
.toast{background:#222;color:#fff;padding:10px 16px;border-radius:10px}.toast.error{background:var(--ro)}

.logo-login{width:240px;max-width:80%;margin:0 auto 4px;display:block}
.login h1{display:none}
.logo-barra{height:30px;background:#fff;border-radius:8px;padding:3px 8px;display:block}
.alerta{background:#fdecea;color:#b3261e;border:1px solid #f4b8b3;border-radius:8px;padding:8px 12px;margin:8px 14px;font-size:14px}
td.bajo{color:#b3261e}td.bajo b::before{content:"⚠ "}
.nowrap{white-space:nowrap}.sub-t{margin:16px 14px 6px}
.barra-asignar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#eef3fb;border:1px solid var(--br);border-radius:8px;padding:8px 12px;margin:8px 14px}
.barra-asignar select,.barra-asignar input{max-width:200px}
.resumen-mun{margin:4px 14px;font-size:13px}
td.chk,th.chk{width:28px;padding-right:0}
.btn.opt{width:100%;margin-top:6px}
.ef{margin:8px 14px}.ef .fila{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.ef-base select{width:auto;padding:6px}.ef-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:8px}
.ef-nav{display:flex;justify-content:space-between;align-items:center;text-align:center}
.ef-pct{font-size:44px;font-weight:700;line-height:1.1;margin:6px 0}.ef-ok{color:#1e8e3e}.ef-bajo{color:#b3261e}
.ef-barra{position:relative;height:12px;background:#e3e7ee;border-radius:6px;margin:4px 0 6px}
.ef-barra i{display:block;height:100%;border-radius:6px}.ef-ok-bg{background:#1e8e3e}.ef-bajo-bg{background:#d93025}
.ef-barra u{position:absolute;top:-3px;width:2px;height:18px;background:#222;text-decoration:none}
.cp{border:1px solid var(--br);background:#fff;border-radius:6px;padding:0 6px;font-size:14px;line-height:22px;cursor:pointer;color:#555;vertical-align:middle}
.cp:active{background:#dfe8f7}
td,.card,.lista,h3{-webkit-user-select:text;user-select:text}
.b-res{max-height:50vh;overflow:auto}.b-fila{border-bottom:1px solid var(--br);padding:8px 2px;cursor:pointer;font-size:14px}.b-fila:hover{background:#eef3fb}
.contacto{display:inline-flex;gap:4px;flex-wrap:wrap;margin-top:4px}.contacto .btn{padding:4px 8px;font-size:13px}
.rep-texto{white-space:pre-wrap;background:#f4f6fa;border-radius:8px;padding:8px;font:13px/1.4 system-ui;margin:6px 0;max-height:40vh;overflow:auto}
.checks.col{display:grid;gap:6px}
details summary{cursor:pointer;color:var(--az)}

/* ---------- Celular ---------- */
@media (max-width:720px){
  body{font-size:16px}
  .barra{flex-wrap:wrap;padding:8px 10px;gap:6px}.barra span{font-size:13px}
  .btn.chico{min-height:40px;padding:8px 12px}
  .tabs.fijo{gap:6px;scrollbar-width:none}.tabs.fijo button{flex:0 0 auto;padding:10px 14px}
  .controles{padding:10px}.chips{padding:0 10px 8px}
  .ancho>.card,.kpis,.ef,.alerta,.barra-asignar,.resumen-mun{margin-left:10px;margin-right:10px}
  .kpis{padding:0 10px 10px;grid-template-columns:1fr 1fr}.kpis b{font-size:18px}
  .barra-asignar{display:grid;grid-template-columns:1fr 1fr}.barra-asignar b,.barra-asignar select,.barra-asignar input{grid-column:1/-1;max-width:none}
  .lista{padding:0 10px 24px}
  .modal{padding:0;align-items:end}.modal-card{max-width:none;border-radius:16px 16px 0 0;max-height:92vh}
  .ef-pct{font-size:38px}
  .estatus-btns .btn,.acciones .btn{min-height:44px}
  .tabla-wrap{padding:0 10px}
  /* tablas con class resp: cada fila es una tarjeta */
  table.resp thead{display:none}
  table.resp,table.resp tbody,table.resp tr,table.resp td{display:block;width:100%}
  table.resp tr{background:#fff;border:1px solid var(--br);border-radius:12px;margin:0 0 10px;padding:6px 10px}
  table.resp td{border:0;padding:4px 0;display:flex;justify-content:space-between;gap:12px;text-align:right}
  table.resp td::before{content:attr(data-l);color:var(--mu);font-size:13px;text-align:left;flex:0 0 auto}
  table.resp td[data-l=""]{justify-content:flex-start}table.resp td[data-l=""]::before{content:"Seleccionar";margin-right:8px}
  table.resp td.vacio{display:block;text-align:center}table.resp td.vacio::before{content:none}
  table.resp td .contacto{justify-content:flex-end}
  table.resp td .v{flex:1 1 0;min-width:0;text-align:right;overflow-wrap:anywhere}
  table.resp td .v .contacto{display:flex;margin-top:6px}
  table.resp td{align-items:flex-start}
  .cp{padding:2px 8px;line-height:24px;height:30px;min-height:0;vertical-align:middle}
  table.resp tbody tr td:last-child .btn{margin-left:4px}
}
@media (max-width:720px){table.resp td.chk:empty{display:none}}
[hidden]{display:none!important}
.pad{padding:14px}
.cobrar-grande{font-size:28px;font-weight:700;margin:0;color:var(--ve)}
.aviso{background:#fff7e0;border:1px solid #f0d58a;border-radius:8px;padding:10px;margin:0}
.modal-card h3{margin:0}
.btn{min-height:44px}.btn.chico{min-height:40px}
.chip{min-height:38px}.tabs button{min-height:42px}
body{padding-bottom:env(safe-area-inset-bottom)}
.barra{padding-top:calc(10px + env(safe-area-inset-top))}
.tabs.fijo{-webkit-overflow-scrolling:touch}.tabs.fijo button{flex:0 0 auto;white-space:nowrap}
input[type=checkbox]{width:22px;height:22px}
.mens{font-size:14px}.mens.sin{color:var(--mu)}
.pasos{padding-left:20px;display:grid;gap:6px;font-size:14px}

#sin-red{position:sticky;top:0;z-index:99;background:#b45309;color:#fff;text-align:center;padding:6px 10px;font-size:14px}
.mun-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;width:100%}

.v{display:block}
.btn.peligro{background:#b42318;color:#fff}.btn.peligro:active{background:#8f1b12}
.hub-sel{padding:4px 6px;border-radius:6px;border:0;max-width:140px}

.contacto-info{font-size:14px;margin:6px 0;padding:6px 8px;border-radius:8px;background:#e8f5e9;color:#1b5e20}.contacto-info.sin{background:#fff3e0;color:#b45309}