/* ===== MotorKan — Slate Dark técnico ===== */
:root{
  --navy:#001391; --navy-d:#071a5e; --navy-rgb:0,19,145;
  --bg:#f6f8f9; --bg2:#ffffff; --surface:#ffffff; --surface2:#eef1f9; --border:rgba(var(--navy-rgb),.22);
  --text:#0b1a5c; --muted:#4b5a8f; --faint:#7480ad;
  --accent:#001391; --accent-ink:#ffffff; --ok:#15803d; --warn:#b45309; --bad:#c81e1e; --info:#0b63c8;
  --d-ecu:#ef4444; --d-ele:#eab308; --d-ac:#3b82f6; --d-mec:#22c55e; --d-rep:#a855f7;
  --radius:18px; --shadow:0 8px 24px rgba(var(--navy-rgb),.22);
  --card:#ffffff; --field:#ffffff; --panel:#eef1f9; --hover:#f1f4fb; --card-border:rgba(0,19,145,.28); --scrim:rgba(0,19,145,.4);
  --warn-bg:#fffbeb; --warn-ink:#78350f; --info-bg:#eff6ff; --info-ink:#0b3a7a; --stat-a:#e8f0ff; --stat-b:#e6f7ee; --stat-c:#fff1e0; --stat-d:#efe9ff;
  --card-shadow:0 0 0 1px rgba(var(--navy-rgb),.14),0 6px 18px rgba(var(--navy-rgb),.16);
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  --nav-h:76px; --side-w:248px;
  font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-size:15px;line-height:1.4;-webkit-tap-highlight-color:transparent}
body{overflow:hidden}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{margin:0}
[hidden]{display:none!important}
.muted{color:var(--muted)} .faint{color:var(--faint)} .small{font-size:12.5px} .tiny{font-size:11.5px}
.right{text-align:right} .center{text-align:center} .nowrap{white-space:nowrap}
.row{display:flex;gap:10px;align-items:center} .row.wrap{flex-wrap:wrap} .grow{flex:1;min-width:0}
.col{display:flex;flex-direction:column;gap:10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sp{height:8px} .sp2{height:16px}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#b7c0e0;border-radius:8px}::-webkit-scrollbar-track{background:transparent}

/* ---- controles ---- */
.btn{min-height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--border);background:var(--surface2);font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:filter .12s,transform .05s}
.btn:hover{filter:brightness(1.15)} .btn:active{transform:translateY(1px)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#052e12}
.btn.danger{background:transparent;border-color:var(--bad);color:var(--bad)}
.btn.ghost{background:transparent}
.btn.sm{min-height:34px;padding:0 10px;font-size:13px;border-radius:8px}
.btn.icon{width:44px;padding:0}
.btn.sm.icon{width:34px}
.btn[disabled]{opacity:.45;pointer-events:none}
label.f{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--muted);font-weight:600;letter-spacing:.2px}
.inp,select.inp,textarea.inp{width:100%;min-height:44px;padding:9px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg2);color:var(--text);outline:none}
textarea.inp{min-height:84px;resize:vertical}
.inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--navy-rgb),.18)}
.inp::placeholder{color:var(--faint)}
select.inp{appearance:auto}
.inp.num{text-align:right;font-variant-numeric:tabular-nums}
.seg{display:flex;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:3px;gap:3px}
.seg button{flex:1;min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-weight:700}
.seg button.on{background:var(--accent);color:var(--accent-ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--border);background:var(--bg2);color:var(--muted);font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px}
.chip.on{background:rgba(var(--navy-rgb),.1);border-color:var(--accent);color:var(--navy)}
.chip[data-dept].on{color:var(--navy)}
.tag{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--bg2);border:1px solid var(--border)}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:var(--c,#888)}
.badge{display:inline-block;min-width:20px;padding:1px 7px;border-radius:999px;background:var(--bg2);font-size:12px;font-weight:700;text-align:center}
.badge.bad{background:var(--bad);color:#fff}.badge.warn{background:var(--warn);color:#1a1204}.badge.ok{background:var(--ok);color:#052e12}
.card-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px}
.card-box h3{font-size:14px;margin-bottom:10px;color:var(--navy-d)}
.sectitle{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--faint);font-weight:800;margin:14px 0 8px}
.empty{padding:28px 12px;text-align:center;color:var(--faint)}
.hr{height:1px;background:var(--border);margin:12px 0}
.kv{display:flex;justify-content:space-between;gap:12px;padding:5px 0}
.kv.total{font-size:18px;font-weight:800;border-top:1px solid var(--border);margin-top:6px;padding-top:10px}
.m2{display:block;font-size:12px;color:var(--muted);font-weight:500;text-align:right}
.stat .m2{text-align:left;margin-top:2px}
.neg{color:var(--bad)}.pos{color:var(--ok)}

/* ---- shell ---- */
#app{height:100%;display:flex}
.side{width:var(--side-w);background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;padding:14px 12px;gap:4px;flex:none}
.brand{display:flex;align-items:center;gap:10px;padding:4px 6px 14px}
.brand img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.brand b{font-size:17px;letter-spacing:.2px;line-height:1.1}
.brand small{display:block;color:var(--muted);font-weight:500;font-size:11.5px}
.nav-i{display:flex;align-items:center;gap:12px;min-height:46px;padding:0 12px;border-radius:10px;background:transparent;border:0;color:var(--muted);font-weight:700;text-align:left;width:100%}
.nav-i:hover{background:var(--surface)}
.nav-i.on{background:var(--surface);color:var(--navy);box-shadow:inset 3px 0 0 var(--accent)}
.nav-i .ic{width:24px;text-align:center;font-size:18px}
.side .spacer{flex:1}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border);background:var(--bg2);flex:none}
.search{position:relative;flex:1;max-width:460px}
.search .inp{padding-left:38px;min-height:42px}
.search .si{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--faint);pointer-events:none}
.search kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:11px;border:1px solid var(--border);border-radius:5px;padding:1px 6px;color:var(--faint)}
.results{position:absolute;top:48px;left:0;right:0;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);max-height:60vh;overflow:auto;z-index:50}
.results .grp{padding:8px 12px 4px;font-size:11px;font-weight:800;color:var(--faint);text-transform:uppercase;letter-spacing:1px}
.results .it{display:flex;gap:10px;align-items:center;padding:9px 12px;border:0;background:transparent;width:100%;text-align:left}
.results .it:hover,.results .it.hi{background:var(--surface2)}
.kpis{display:flex;gap:8px;margin-left:auto}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:5px 12px;min-width:98px}
.kpi b{display:block;font-size:17px;line-height:1.15;font-variant-numeric:tabular-nums}
.kpi span{font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.kpi.alert b{color:var(--bad)}
.ratechip{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 12px;border:1px solid var(--border);background:var(--surface);border-radius:10px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.ratechip.stale{border-color:var(--warn);color:var(--warn)}
.view{flex:1;min-height:0;overflow:auto;padding:16px}
.view.noscroll{overflow:hidden;display:flex;flex-direction:column;padding:12px 16px 12px}
.view-h{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.view-h h2{font-size:21px}
.bottomnav{display:none}
.mtop{display:none}

/* ---- kanban ---- */
.board-tools{display:flex;gap:10px;align-items:center;margin-bottom:10px;flex-wrap:wrap}
.board{flex:1;min-height:0;display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;padding-bottom:6px;scroll-snap-type:x proximity}
.kcol{flex:0 0 292px;display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--border);border-radius:14px;min-height:0;scroll-snap-align:start}
.kcol-h{display:flex;align-items:center;gap:8px;padding:11px 12px;border-bottom:3px solid var(--c);font-weight:800;font-size:13.5px}
.kcol-h .badge{margin-left:auto}
.kcol-b{flex:1;min-height:60px;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:10px}
.kcol-b.over{background:rgba(var(--navy-rgb),.08);outline:2px dashed var(--accent);outline-offset:-6px}
.kcard{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--c,#64748b);border-radius:12px;padding:11px 12px;cursor:pointer;display:flex;flex-direction:column;gap:6px;position:relative}
.kcard:hover{border-color:#475569;background:var(--hover)}
.kcard.dragging{opacity:.4}
.kcard.stale{box-shadow:0 0 0 1px var(--bad),0 0 14px rgba(239,68,68,.25)}
.kcard .t1{display:flex;align-items:center;gap:8px}
.kcard .t1 b{font-size:13px;color:var(--navy-d)}
.kcard .age{margin-left:auto;font-size:11.5px;font-weight:800;color:var(--muted)}
.kcard .age.stale{color:var(--bad)}
.kcard .title{font-weight:800;font-size:15px;line-height:1.25}
.kcard .sub{font-size:12.5px;color:var(--muted)}
.kcard .fault{font-size:12.5px;color:var(--navy-d);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.kcard .foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.kcard .foot .amt{margin-left:auto;font-weight:800;font-size:13px;font-variant-numeric:tabular-nums}
.kcard .mv{display:flex;gap:6px;margin-top:2px}
.kcard .mv .btn{flex:1}
.dtag{font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;color:#fff;background:var(--c)}
.pay-ok{color:var(--ok)}.pay-due{color:var(--bad)}

/* ---- drawer ---- */
.dr-back{position:fixed;inset:0;background:var(--scrim);z-index:900;opacity:0;transition:opacity .2s}
.dr-back.in{opacity:1}
.drawer{position:fixed;z-index:901;background:var(--bg);display:flex;flex-direction:column;box-shadow:var(--shadow);
  top:0;right:0;bottom:0;width:min(720px,100vw);transform:translateX(102%);transition:transform .25s ease;border-left:1px solid var(--border)}
.drawer.in{transform:none}
.dr-h{padding:12px 14px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:8px;background:var(--bg2)}
.dr-h .l1{display:flex;align-items:center;gap:10px}
.dr-h h3{font-size:17px}
.dr-grip{display:none;width:44px;height:5px;border-radius:99px;background:#b7c0e0;margin:0 auto 4px}
.dr-tabs{display:flex;border-bottom:1px solid var(--border);background:var(--bg2);overflow-x:auto;flex:none}
.dr-tabs button{flex:1;min-width:max-content;min-height:48px;padding:0 8px;border:0;background:transparent;color:var(--muted);font-weight:800;font-size:12.5px;border-bottom:3px solid transparent;white-space:nowrap}
.dr-tabs button.on{color:var(--navy);border-bottom-color:var(--accent)}
.dr-b{flex:1;min-height:0;overflow:auto;padding:14px 14px 28px}
.dr-f{display:flex;gap:8px;padding:10px 14px calc(10px + var(--safe-b));border-top:1px solid var(--border);background:var(--bg2);flex-wrap:wrap}
.dr-f .btn{flex:1;min-width:120px}

/* ---- tablas de líneas ---- */
.lines{display:flex;flex-direction:column;gap:8px}
.line{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px}
.line .r1{display:flex;gap:8px;align-items:center}
.line .r2{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px;align-items:end}
.line .x{margin-left:auto}
.hint{font-size:12px;color:var(--faint)}
.warnbox{background:rgba(var(--navy-rgb),.1);border:1px solid rgba(var(--navy-rgb),.5);color:var(--warn);border-radius:10px;padding:9px 12px;font-size:13px}
.infobox{background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.4);color:var(--info);border-radius:10px;padding:9px 12px;font-size:13px}

/* ---- fotos / firma / combustible ---- */
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.ph{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;border:1px solid var(--border);background:var(--bg2)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph button{position:absolute;top:4px;right:4px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(0,0,0,.65);color:#fff}
.ph.add{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:4px;color:var(--muted);font-weight:700;font-size:12px;border-style:dashed;cursor:pointer}
.sigbox{border:1px dashed var(--border);border-radius:12px;background:#f8fafc;position:relative;touch-action:none}
.sigbox canvas{width:100%;height:150px;display:block;border-radius:12px}
.sigbox .sg-hint{position:absolute;left:12px;top:8px;color:#94a3b8;font-size:12px;pointer-events:none}
.fuel{display:flex;gap:6px}
.fuel button{flex:1;min-height:40px;border:1px solid var(--border);background:var(--bg2);border-radius:8px;color:var(--muted);font-weight:800;font-size:12.5px}
.fuel button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.mic{min-height:30px;padding:0 10px;border-radius:999px;border:1px solid var(--border);background:var(--bg2);font-size:12.5px;font-weight:700}
.mic.live{background:var(--bad);border-color:var(--bad);color:#fff;animation:pulse 1.1s infinite}
@keyframes pulse{50%{opacity:.6}}
.lblrow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.brandbtn{justify-content:space-between;width:100%;text-align:left;font-weight:600;background:var(--bg2)}
.hist{background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.4);border-radius:10px;padding:8px 10px;font-size:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ---- ventanas flotantes ---- */
#scrim{position:fixed;inset:0;background:var(--scrim);z-index:999}
#windows{position:fixed;inset:0;z-index:1000;pointer-events:none}
.win{position:fixed;left:50%;top:6vh;transform:translateX(-50%);max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);pointer-events:auto}
.win-h{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border);background:var(--surface);border-radius:14px 14px 0 0;cursor:grab;user-select:none;touch-action:none}
.win-h:active{cursor:grabbing}
.win-t{font-weight:800;flex:1;font-size:15px}
.win-grip{color:var(--faint);letter-spacing:2px;font-size:12px}
.win-b{flex:1;min-height:0;overflow:auto;padding:14px}
.win-f{display:flex;gap:8px;justify-content:flex-end;padding:10px 12px;border-top:1px solid var(--border);background:var(--bg2);border-radius:0 0 14px 14px;flex-wrap:wrap}
.win.fixed .win-h{cursor:default}

/* selector de marca */
.picker-wrap{display:flex;gap:8px;align-items:stretch}
.picker-list{flex:1;height:min(46vh,340px);overflow-y:auto;border:1px solid var(--border);border-radius:10px;background:var(--bg2);scroll-behavior:auto;outline:none}
.picker-list .let{position:sticky;top:0;background:var(--surface);padding:3px 12px;font-size:11px;font-weight:800;color:var(--accent);letter-spacing:1px;z-index:1}
.pk-it{cursor:pointer;display:flex;align-items:center;gap:10px;width:100%;min-height:46px;padding:0 12px;border:0;background:transparent;text-align:left;font-weight:600;border-bottom:1px solid rgba(var(--navy-rgb),.1)}
.pk-it:hover,.pk-it.hi{background:var(--surface2)}
.pk-it.sel{background:rgba(var(--navy-rgb),.14);box-shadow:inset 3px 0 0 var(--accent)}
.pk-av{width:30px;height:30px;border-radius:8px;background:var(--surface2);display:flex;align-items:center;justify-content:center;font-weight:800;color:var(--navy-d);flex:none}
.pk-it .del{margin-left:auto;width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--faint)}
.pk-it .del:hover{color:var(--bad);border-color:var(--bad)}
.picker-scroll{display:flex;flex-direction:column;gap:8px;justify-content:center}
.scrollbtn{width:48px;height:56px;border-radius:12px;border:1px solid var(--border);background:var(--surface2);font-size:20px;font-weight:800;user-select:none;touch-action:none}
.scrollbtn:active,.scrollbtn.held{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.scrollbtn.sm{height:34px;font-size:15px}
.addbrand{margin-top:10px;border:1px dashed var(--border);border-radius:12px;padding:10px;background:var(--bg2)}

/* menú contextual / toasts */
#toasts{position:fixed;left:50%;top:calc(var(--safe-t) + 12px);transform:translateX(-50%);z-index:3000;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;width:min(92vw,460px)}
.toast{pointer-events:auto;background:var(--card);color:var(--text);border:1px solid var(--border);border-left:4px solid var(--info);padding:11px 14px;border-radius:10px;box-shadow:var(--shadow);font-weight:600;font-size:14px;width:100%;animation:tin .2s}
.toast.ok{border-left-color:var(--ok)}.toast.warn{border-left-color:var(--warn)}.toast.bad{border-left-color:var(--bad)}
@keyframes tin{from{opacity:0;transform:translateY(-8px)}}

/* inventario / tablas */
.tbl{width:100%;border-collapse:collapse}
.tbl th{font-size:11.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--faint);text-align:left;padding:8px 10px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg)}
.tbl td{padding:10px;border-bottom:1px solid rgba(var(--navy-rgb),.1);vertical-align:middle}
.tbl tr.clk{cursor:pointer}.tbl tr.clk:hover td{background:var(--surface)}
.tbl .r{text-align:right;font-variant-numeric:tabular-nums}
.tbl.inv{min-width:720px}
.tbl td:first-child{white-space:nowrap}
.tbl-wrap{border:1px solid var(--border);border-radius:12px;overflow:auto;background:var(--bg)}
.stat{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:14px}
.stat .card-box b{display:block;font-size:22px;font-variant-numeric:tabular-nums}
.stat .card-box span{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.ilist{display:flex;flex-direction:column;gap:8px}
.irow{display:flex;gap:10px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px 12px}
.irow.clk{cursor:pointer}.irow.clk:hover{background:var(--hover)}

.banner{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:rgba(var(--navy-rgb),.12);border:1px solid rgba(var(--navy-rgb),.5);color:var(--warn);border-radius:10px;padding:8px 12px;margin-bottom:12px;font-size:13.5px}

/* ===== Móvil / tablet ===== */
@media (max-width: 899px){
  body{font-size:15.5px}
  .side{display:none}
  .kpis{display:none}
  .topbar{padding:calc(8px + var(--safe-t)) 12px 8px}
  .search kbd{display:none}
  .desk-only{display:none!important}
  .mtop{display:none!important}
  .ratechip{min-height:40px;padding:0 9px;font-size:12.5px;flex:none}
  .board-tools{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;margin-right:0}
  .board-tools .chip{flex:none}
  .hm{display:none}
  .tbl.inv{min-width:0!important}
  .mtop{display:flex}
  .bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:800;background:var(--bg2);border-top:1px solid var(--border);padding-bottom:var(--safe-b);height:calc(var(--nav-h) + var(--safe-b))}
  .bottomnav button{flex:1;border:0;background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11.5px;font-weight:800}
  .bottomnav button .ic{font-size:22px;line-height:1}
  .bottomnav button.on{color:var(--accent)}
  .bottomnav button.plus .ic{background:var(--accent);color:var(--accent-ink);width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:900;margin-top:-18px;box-shadow:0 6px 16px var(--scrim)}
  .view{padding:12px 12px calc(var(--nav-h) + var(--safe-b) + 16px)}
  .view.noscroll{padding:8px 0 calc(var(--nav-h) + var(--safe-b)) 12px}
  .board-tools{padding-right:12px}
  .kcol{flex-basis:84vw}
  .board{scroll-snap-type:x mandatory;padding-right:12px}
  .grid2.keep{grid-template-columns:1fr 1fr}
  .grid2,.grid3{grid-template-columns:1fr}
  .grid3.keep{grid-template-columns:repeat(3,1fr)}
  /* drawer = bottom sheet */
  .drawer{top:auto;left:0;right:0;bottom:0;width:100%;height:92vh;height:92dvh;border-left:0;border-top:1px solid #475569;border-radius:18px 18px 0 0;transform:translateY(102%)}
  .drawer.in{transform:none}
  .dr-grip{display:block}
  .dr-tabs .lg{display:none}
  /* ventanas = hojas inferiores */
  .win{left:0!important;right:0;top:auto!important;bottom:0;width:100%!important;max-width:100vw;transform:none!important;max-height:92vh;max-height:92dvh;border-radius:18px 18px 0 0}
  .win-h{border-radius:18px 18px 0 0;cursor:default}
  .win-grip{display:none}
  .win-f{padding-bottom:calc(10px + var(--safe-b))}
  .picker-list{height:38vh}
}
@media (min-width: 900px){ .mobile-only{display:none!important} }


/* ===== Estilo bancario: tarjetas blancas, borde y sombra en azul marino ===== */
h1,h2,.view-h h2,.brand b,.win-t,.dr-h h3{font-family:Georgia,"Times New Roman",serif;font-weight:800;color:var(--navy-d);letter-spacing:0}
.view-h h2{font-size:30px}
.btn{border-radius:999px;background:var(--card);border:1.5px solid var(--navy);color:var(--navy);box-shadow:0 2px 8px rgba(var(--navy-rgb),.12)}
.btn:hover{filter:none;background:var(--surface2)}
.btn.primary{background:var(--navy);color:#fff;box-shadow:0 4px 12px rgba(var(--navy-rgb),.35)}
.btn.primary:hover{background:var(--navy-d)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.danger{background:var(--card);border-color:var(--bad);color:var(--bad);box-shadow:none}
.btn.ghost{background:transparent;box-shadow:none;border-color:transparent}
.btn.icon{border-radius:50%}
.inp,select.inp,textarea.inp{background:var(--field);border:1.5px solid var(--border);border-radius:14px;color:var(--text)}
.inp:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(var(--navy-rgb),.15)}
.seg{background:var(--field);border:1.5px solid var(--border);border-radius:999px}
.seg button{border-radius:999px;color:var(--navy)}
.seg button.on{background:var(--navy);color:#fff}
.chip{background:var(--card);border:1.5px solid var(--border);color:var(--navy)}
.chip[data-dept].on{color:#fff}
.tag,.badge{background:var(--surface2);color:var(--navy);border:1px solid var(--border)}
.badge.bad{background:var(--bad);color:#fff;border-color:var(--bad)}.badge.warn{background:#fde68a;color:#78350f;border-color:#fcd34d}.badge.ok{background:#bbf7d0;color:#14532d;border-color:#86efac}
.card-box,.kpi,.ratechip,.line,.irow,.kcard,.results,.tbl-wrap,.kcol,.addbrand,.picker-list,.toast{border:1px solid var(--card-border);box-shadow:var(--card-shadow)}
.card-box,.kpi,.line,.irow,.kcard{background:var(--card);border-radius:var(--radius)}
.kcard{border-left:5px solid var(--c,var(--navy));box-shadow:var(--card-shadow)}
.kcard:hover{box-shadow:0 0 0 1.5px var(--navy),0 8px 22px rgba(var(--navy-rgb),.25)}
.kcard.stale{box-shadow:0 0 0 1.5px var(--bad),0 6px 18px rgba(200,30,30,.25)}
.kcol{background:var(--panel);border-radius:22px;box-shadow:none;border:1px solid var(--border)}
.kcol-b.over{background:rgba(var(--navy-rgb),.06);outline:2px dashed var(--navy)}
.kpi b{color:var(--navy-d)}
.ratechip{background:var(--card);border-radius:999px}
.topbar{background:var(--bg);border-bottom:0}
.side{background:var(--card);border-right:1px solid var(--border);box-shadow:4px 0 18px rgba(var(--navy-rgb),.1)}
.nav-i{color:var(--navy);border-radius:999px}
.nav-i:hover{background:var(--surface2)}
.nav-i.on{background:var(--navy);color:#fff;box-shadow:0 4px 12px rgba(var(--navy-rgb),.35)}
.drawer{background:var(--bg);border-left:1px solid var(--border);box-shadow:-10px 0 30px rgba(var(--navy-rgb),.25)}
.dr-h,.dr-tabs,.dr-f{background:var(--card)}
.dr-tabs button{color:var(--muted)}
.win{background:var(--bg);border:1.5px solid var(--navy);border-radius:20px;box-shadow:0 12px 36px rgba(var(--navy-rgb),.35)}
.win-h{background:var(--card);border-radius:18px 18px 0 0}
.win-f{background:var(--card);border-radius:0 0 18px 18px}
.pk-av{background:var(--surface2);color:var(--navy)}
.picker-list{background:var(--card);border-radius:14px}
.picker-list .let{background:var(--surface2);color:var(--navy)}
.pk-it.sel{background:rgba(var(--navy-rgb),.08);box-shadow:inset 3px 0 0 var(--navy)}
.scrollbtn{background:var(--card);border:1.5px solid var(--navy);color:var(--navy);box-shadow:0 2px 8px rgba(var(--navy-rgb),.15)}
.scrollbtn:active,.scrollbtn.held{background:var(--navy);color:#fff}
.tbl th{background:var(--card);color:var(--muted)}
.tbl-wrap{background:var(--card);border-radius:var(--radius)}
.fuel button{background:var(--card);color:var(--navy);border:1.5px solid var(--border)}
.fuel button.on{background:var(--navy);color:#fff}
.mic,.brandbtn{background:var(--card)}
.warnbox,.banner{background:var(--card)beb;border:1px solid #f59e0b;color:#78350f}
.infobox,.hist{background:var(--info-bg);border:1px solid rgba(11,99,200,.45);color:var(--info-ink)}
.sigbox{border-color:var(--navy);background:#fff}
.dtag{color:#fff}
.m2{color:var(--muted)}
.ph{background:var(--card)}
.pay-ok{color:var(--ok)}.pay-due{color:var(--bad)}
.kv.total{border-top:1px solid var(--border)}

@media (max-width: 899px){
  .view-h h2{font-size:28px}
  /* barra inferior flotante con círculo azul en la opción activa */
  .bottomnav{left:12px;right:12px;bottom:calc(10px + var(--safe-b));height:68px;padding:0 6px;background:var(--card);border:1px solid var(--card-border);border-radius:26px;box-shadow:var(--card-shadow)}
  .bottomnav button{color:var(--navy);font-size:11.5px;border-radius:20px}
  .bottomnav button .ic{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px}
  .bottomnav button.on{color:var(--navy)}
  .bottomnav button.on .ic{background:var(--navy);color:#fff;box-shadow:0 4px 12px rgba(var(--navy-rgb),.4)}
  .bottomnav button.plus .ic{background:var(--card);color:var(--navy);border:1.5px solid var(--navy);margin-top:0;width:44px;height:44px;font-size:26px;box-shadow:none}
  .view{padding-bottom:calc(var(--nav-h) + var(--safe-b) + 24px)}
  .view.noscroll{padding-bottom:calc(var(--nav-h) + var(--safe-b) + 16px)}
  .drawer{border-top:1.5px solid var(--navy);border-radius:24px 24px 0 0;box-shadow:0 -10px 30px rgba(var(--navy-rgb),.3)}
  .win{border-radius:24px 24px 0 0}
  .win-h{border-radius:22px 22px 0 0}
}

/* ===== Modo oscuro (diseño AutoTaller) ===== */
:root[data-theme="dark"]{
  --navy:#2f7df6; --navy-d:#e8eefb; --navy-rgb:47,125,246;
  --bg:#070d1a; --bg2:#0b1426; --surface:#101b32; --surface2:#17253f; --border:rgba(148,163,184,.22);
  --text:#e8eefb; --muted:#93a4c6; --faint:#6f80a6;
  --accent:#2f7df6; --accent-ink:#ffffff; --ok:#22c55e; --warn:#f59e0b; --bad:#f87171; --info:#38bdf8;
  --radius:14px; --shadow:0 12px 34px rgba(0,0,0,.55);
  --card:#101b32; --field:#0b1426; --panel:#0b1426; --hover:#17253f; --card-border:rgba(148,163,184,.16); --scrim:rgba(0,0,0,.62);
  --card-shadow:0 0 0 1px rgba(148,163,184,.08),0 8px 22px rgba(0,0,0,.35);
  --warn-bg:rgba(245,158,11,.12); --warn-ink:#fcd34d; --info-bg:rgba(56,189,248,.1); --info-ink:#7dd3fc;
  --stat-a:linear-gradient(135deg,#12306b,#0f2552); --stat-b:linear-gradient(135deg,#0f4630,#0d3324); --stat-c:linear-gradient(135deg,#5a3410,#41260d); --stat-d:linear-gradient(135deg,#2e2a73,#221f56);
  color-scheme:dark;
}
:root[data-theme="dark"] h1,:root[data-theme="dark"] h2,:root[data-theme="dark"] .view-h h2,:root[data-theme="dark"] .brand b,:root[data-theme="dark"] .win-t,:root[data-theme="dark"] .dr-h h3{font-family:inherit;font-weight:800;color:var(--text)}
:root[data-theme="dark"] .view-h h2{font-size:26px}
:root[data-theme="dark"] ::-webkit-scrollbar-thumb{background:#2a3a5c}
:root[data-theme="dark"] .btn{border-radius:12px;border:1px solid var(--border);background:var(--surface2);color:var(--text);box-shadow:none}
:root[data-theme="dark"] .btn:hover{background:#1f3057}
:root[data-theme="dark"] .btn.primary{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 4px 16px rgba(47,125,246,.35)}
:root[data-theme="dark"] .btn.primary:hover{background:#4a8ff8}
:root[data-theme="dark"] .btn.danger{background:transparent;border-color:var(--bad);color:var(--bad)}
:root[data-theme="dark"] .btn.ghost{background:transparent;border-color:transparent}
:root[data-theme="dark"] .btn.icon{border-radius:12px}
:root[data-theme="dark"] .inp,:root[data-theme="dark"] select.inp,:root[data-theme="dark"] textarea.inp{border-radius:12px;border:1px solid var(--border)}
:root[data-theme="dark"] .inp:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(47,125,246,.25)}
:root[data-theme="dark"] .seg{border-radius:14px;border:1px solid var(--border)}
:root[data-theme="dark"] .seg button{border-radius:11px;color:var(--muted)}
:root[data-theme="dark"] .seg button.on,:root[data-theme="dark"] .fuel button.on{background:var(--navy);color:#fff}
:root[data-theme="dark"] .chip{border:1px solid var(--border);color:var(--muted);background:var(--surface)}
:root[data-theme="dark"] .chip.on{background:rgba(47,125,246,.18);border-color:var(--navy);color:#cfe0ff}
:root[data-theme="dark"] .chip[data-dept].on{color:#fff}
:root[data-theme="dark"] .tag,:root[data-theme="dark"] .badge{background:var(--surface2);color:var(--text);border-color:var(--border)}
:root[data-theme="dark"] .badge.warn{background:rgba(245,158,11,.25);color:#fcd34d;border-color:rgba(245,158,11,.5)}
:root[data-theme="dark"] .badge.ok{background:rgba(34,197,94,.22);color:#86efac;border-color:rgba(34,197,94,.5)}
:root[data-theme="dark"] .card-box,:root[data-theme="dark"] .kpi,:root[data-theme="dark"] .line,:root[data-theme="dark"] .irow,:root[data-theme="dark"] .kcard{background:var(--card)}
:root[data-theme="dark"] .kcard:hover{box-shadow:0 0 0 1px var(--navy),0 8px 22px rgba(47,125,246,.25)}
:root[data-theme="dark"] .kcard.stale{box-shadow:0 0 0 1px var(--bad),0 0 16px rgba(248,113,113,.25)}
:root[data-theme="dark"] .kcol{background:var(--bg2);border-radius:16px}
:root[data-theme="dark"] .kcol-b.over{background:rgba(47,125,246,.08);outline:2px dashed var(--navy)}
:root[data-theme="dark"] .side{background:var(--bg2);box-shadow:none;border-right:1px solid var(--border)}
:root[data-theme="dark"] .topbar{background:var(--bg2);border-bottom:1px solid var(--border)}
:root[data-theme="dark"] .nav-i{color:var(--muted);border-radius:12px}
:root[data-theme="dark"] .nav-i:hover{background:var(--surface);color:var(--text)}
:root[data-theme="dark"] .nav-i.on{background:var(--navy);color:#fff;box-shadow:0 4px 16px rgba(47,125,246,.4)}
:root[data-theme="dark"] .win{border:1px solid var(--border)}
:root[data-theme="dark"] .drawer{border-left:1px solid var(--border)}
:root[data-theme="dark"] .scrollbtn{color:var(--text);border:1px solid var(--border);background:var(--surface2)}
:root[data-theme="dark"] .pk-av{color:var(--text)}
:root[data-theme="dark"] .picker-list .let{color:var(--navy)}
:root[data-theme="dark"] .kcard .title,:root[data-theme="dark"] .kpi b{color:var(--text)}
:root[data-theme="dark"] .ph.add{color:var(--muted)}
:root[data-theme="dark"] .toast{border-left-color:var(--info)}
@media (max-width: 899px){
  :root[data-theme="dark"] .bottomnav{background:var(--bg2);border:1px solid var(--border);border-radius:22px}
  :root[data-theme="dark"] .bottomnav button{color:var(--muted)}
  :root[data-theme="dark"] .bottomnav button.on{color:var(--text)}
  :root[data-theme="dark"] .bottomnav button.plus .ic{background:var(--surface2);color:var(--text);border:1px solid var(--border)}
  :root[data-theme="dark"] .drawer{border-top:1px solid var(--border)}
}

/* ===== Reubicación según modelo ===== */
.clock{display:flex;align-items:center;gap:10px;font-weight:700;white-space:nowrap;color:var(--text)}
.clock i{width:1px;height:18px;background:var(--border);display:block}
.tb-right{display:flex;gap:10px;align-items:center;margin-left:auto}
.topbar .search{max-width:420px}
.bell{position:relative}
.bell .bdg{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--bad);color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.usr{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 6px 0 4px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--text);font-weight:700;max-width:230px}
.usr .av{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;flex:none}
.usr .un{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.umenu{position:fixed;z-index:2500;min-width:210px;background:var(--card);border:1px solid var(--card-border);box-shadow:var(--shadow);border-radius:14px;padding:6px;display:flex;flex-direction:column}
.umenu .uhead{padding:8px 12px 10px;border-bottom:1px solid var(--border);margin-bottom:4px;display:flex;flex-direction:column}
.umenu .uhead small{color:var(--muted)}
.umenu button{min-height:42px;border:0;background:transparent;color:var(--text);text-align:left;padding:0 12px;border-radius:10px;font-weight:600}
.umenu button:hover{background:var(--hover)}
.sidestat{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--card)}
.sidestat b{display:block;font-size:13.5px}.sidestat small{color:var(--muted);font-size:11.5px}
.alrt{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:transparent;padding:9px 6px;border-bottom:1px solid var(--border);color:var(--text)}
.alrt:hover{background:var(--hover)}
.alrt .mic2{width:34px;height:34px;border-radius:50%;background:var(--surface2);display:flex;align-items:center;justify-content:center;flex:none}
.home-alerts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}
.hmini{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:11px 14px;border-radius:var(--radius);background:var(--card);border:1px solid var(--card-border);box-shadow:var(--card-shadow);color:var(--text);text-align:left}
.hmini b{font-size:20px;font-variant-numeric:tabular-nums}.hmini span{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.hmini.warn b{color:var(--bad)}
@media (max-width: 899px){ .home-alerts{gap:8px} .hmini{flex-direction:column;align-items:flex-start;padding:10px} .hmini b{font-size:17px} .hmini span{font-size:10.5px} .tb-right{gap:8px} .usr{padding:0;border:0;background:transparent;min-height:44px} .usr .av{width:40px;height:40px} }

/* ===== Icono SVG (menús) ===== */
.ic svg{width:1.25em;height:1.25em;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* ===== Inicio (dashboard) ===== */
.home-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.home-stats.h5{grid-template-columns:repeat(5,1fr)}
.hstat{border-radius:var(--radius);padding:14px;display:flex;gap:12px;align-items:center;border:1px solid var(--card-border);box-shadow:var(--card-shadow);min-width:0}
.hstat.a{background:var(--stat-a)}.hstat.b{background:var(--stat-b)}.hstat.c{background:var(--stat-c)}.hstat.d{background:var(--stat-d)}
.hstat .hic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none;color:#fff;font-size:22px}
.hstat.a .hic{background:#2f7df6}.hstat.b .hic{background:#16a34a}.hstat.c .hic{background:#ea8a0c}.hstat.d .hic{background:#6d4cf0}
.hstat .hl{font-size:12.5px;font-weight:700;color:var(--muted)}
.hstat .hv{font-size:26px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--text);word-break:break-word}
.hstat .hs{font-size:11.5px;color:var(--muted);margin-top:2px}
.home-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px}
.home-grid .full{grid-column:1/-1}
.home-card{background:var(--card);border:1px solid var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--radius);padding:14px;min-width:0}
.home-card .hh{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:8px}
.home-card .hh h3{font-size:15px}
.linkbtn{background:none;border:0;color:var(--navy);font-weight:700;font-size:13px;padding:4px}
.otpill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;color:#fff;background:var(--c,#64748b);white-space:nowrap}
.qgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.qbtn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px;border-radius:14px;background:var(--surface2);border:1px solid var(--border);color:var(--text);font-weight:700;font-size:13px}
.qbtn:hover{border-color:var(--navy)}
.qbtn .ic{color:var(--navy);font-size:22px}
.mv-i{display:flex;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--border)}
.mv-i:last-child{border-bottom:0}
.mv-i .mic2{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none;background:var(--surface2);font-size:16px}
.mv-i .when{margin-left:auto;font-size:12.5px;color:var(--muted);white-space:nowrap}
@media (max-width: 1199px){ .home-stats,.home-stats.h5{grid-template-columns:1fr 1fr} .home-stats.h5>:last-child{grid-column:1/-1} .home-grid{grid-template-columns:1fr} }
@media (max-width: 899px){ .home-card .tbl td,.home-card .tbl th{padding:8px 4px;font-size:13px} .otpill{white-space:normal;font-size:11px;padding:2px 8px;text-align:center} .home-card{padding:12px} .home-stats{gap:10px} .hstat{padding:12px} .hstat .hv{font-size:21px} .hstat .hic{width:40px;height:40px} .qgrid{grid-template-columns:1fr 1fr 1fr} .hm2{display:none} }
@media print{ body{background:var(--card);color:#000;overflow:visible} }

/* ===== Rediseño v1.6: pestañas, mosaicos, tarjetas de sección, calendario, reportes ===== */
.side{overflow-y:auto}
.tabs{display:inline-flex;background:var(--field);border:1px solid var(--border);border-radius:12px;padding:3px;gap:2px}
.tabs b{padding:8px 14px;border-radius:9px;font-size:13.5px;font-weight:700;color:var(--muted);cursor:pointer;white-space:nowrap}
.tabs b.on{background:var(--navy);color:#fff}
.state-tiles{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-bottom:14px}
.tile{display:flex;flex-direction:column;gap:2px;align-items:flex-start;text-align:left;padding:10px 12px;border-radius:var(--radius);background:var(--card);border:1px solid var(--card-border);box-shadow:var(--card-shadow);color:var(--text);min-width:0}
.tile b{font-size:24px;font-variant-numeric:tabular-nums;line-height:1.1}
.tile span{line-height:1.2}
.tile.on{outline:2px solid var(--navy)}
.sec-card{background:var(--card);border:1px solid var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--radius);padding:12px 14px;margin-bottom:12px}
.sec-h{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.sec-h .n{width:30px;height:30px;border-radius:9px;background:rgba(var(--navy-rgb),.12);display:flex;align-items:center;justify-content:center;flex:none;font-size:15px}
.sec-card .lblrow{margin:0!important}
.sec-h .sectitle{margin:0!important;text-transform:none;letter-spacing:0;font-size:15px;color:var(--text)}
.sec-card .card-box{background:transparent;border:0;box-shadow:none;padding:0}
.av-s{display:inline-flex;width:28px;height:28px;border-radius:50%;background:rgba(var(--navy-rgb),.15);color:var(--navy);font-weight:800;align-items:center;justify-content:center;font-size:13px;margin-right:6px;vertical-align:middle}
.av-s.big{width:46px;height:46px;font-size:19px;margin:0}
.plate{display:inline-block;padding:6px 12px;border-radius:8px;border:2px solid var(--text);font-weight:800;letter-spacing:1.5px;font-size:16px;background:var(--field)}
.search.inline{flex:1;min-width:200px;max-width:380px}
/* calendario */
.cal-wrap{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);gap:12px;align-items:start}
.calgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.calgrid .ch{font-size:11.5px;font-weight:800;text-transform:uppercase;color:var(--faint);text-align:center;padding:4px 0}
.cd{min-height:96px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:6px;border-radius:10px;border:1px solid var(--border);background:var(--field);color:var(--text);text-align:left;overflow:hidden}
.cd:hover{border-color:var(--navy)}
.cd.out{opacity:.45}
.cd.today b{background:var(--navy);color:#fff;border-radius:999px;padding:0 7px}
.cd.sel{outline:2px solid var(--navy)}
.cd b{font-size:13px}
.cd .ev{display:flex;flex-direction:column;gap:2px;width:100%;min-width:0}
.cd .ev em{font-style:normal;font-size:11px;font-weight:700;padding:1px 5px;border-left:3px solid var(--c);background:rgba(var(--navy-rgb),.07);border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd .ev em.off{text-decoration:line-through;opacity:.55}
.cd .ev small{font-size:10.5px;color:var(--muted)}
.cd .dots{display:none;gap:3px}
.cd .dots i,.legend i{width:8px;height:8px;border-radius:50%;display:inline-block}
.legend{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px;font-size:12.5px;color:var(--muted)}
.legend span{display:inline-flex;align-items:center;gap:6px}
.apt{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:10px;margin-bottom:8px;border-radius:12px;border:1px solid var(--border);border-left:4px solid var(--c);background:var(--field);color:var(--text)}
.apt:hover{background:var(--hover)}
.apt .tm{font-weight:800;font-variant-numeric:tabular-nums;min-width:48px}
.mcal{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.mcal .dw{font-size:11px;font-weight:800;color:var(--faint);padding:4px 0}
.mcal .md{position:relative;min-height:38px;border:0;background:transparent;color:var(--text);border-radius:8px;font-weight:600;font-size:13px;padding:4px 0 8px}
.mcal .md:hover{background:var(--hover)}
.mcal .md.out{opacity:.35}
.mcal .md.today{background:var(--navy);color:#fff}
.mcal .md .ul{position:absolute;left:50%;bottom:3px;transform:translateX(-50%);display:flex;gap:2px}
.mcal .md .ul i{width:10px;height:3px;border-radius:2px;display:block}
/* reportes */
.bars{display:flex;flex-direction:column;gap:9px}
.bar-r{display:grid;grid-template-columns:minmax(70px,120px) 1fr auto;gap:10px;align-items:center;font-size:13px}
.bar-r .bl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-weight:600}
.bar-r .bt{height:12px;border-radius:999px;background:rgba(var(--navy-rgb),.1);overflow:hidden}
.bar-r .bt i{display:block;height:100%;border-radius:999px}
.bar-r .bv{font-variant-numeric:tabular-nums;min-width:56px;text-align:right}
@media (max-width:1199px){ .state-tiles{grid-template-columns:repeat(3,1fr)} .cal-wrap{grid-template-columns:1fr} }
@media (max-width:899px){
  .state-tiles{grid-template-columns:repeat(2,1fr);gap:8px}
  .tile b{font-size:20px}
  .cd{min-height:52px;align-items:center;padding:4px 2px}
  .cd .ev{display:none}.cd .dots{display:flex}
  .calgrid{gap:2px}
  .bar-r{grid-template-columns:80px 1fr auto}
  .search.inline{max-width:none}
}

/* ===== Tablero v1.7: tarjetas compactas y limpias ===== */
:root:root .board{gap:14px}
:root:root .board .kcol{flex:0 0 272px;background:transparent;border:0;box-shadow:none;border-radius:0}
:root:root .board .kcol-h{border-bottom:0;padding:2px 4px 10px;font-size:13px;font-weight:800;color:var(--text);gap:8px;position:relative}
:root:root .board .kcol-h::after{content:"";position:absolute;left:4px;right:4px;bottom:3px;height:2px;border-radius:2px;background:var(--c);opacity:.75}
:root:root .board .kcol-h span:nth-child(2){white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root:root .board .kcol-h .badge{min-width:22px;padding:0 7px;font-size:11.5px}
:root:root .board .kcol-b{padding:8px 2px 4px;gap:8px}
:root:root .board .kcard{border-left:1px solid var(--card-border);border-radius:12px;padding:10px 12px;gap:3px;box-shadow:0 1px 2px rgba(0,0,0,.12);background:var(--card)}
:root:root .board .kcard::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:var(--c)}
:root:root .board .kcard:hover{box-shadow:0 0 0 1px var(--navy),0 6px 16px rgba(0,0,0,.18)}
:root:root .board .kcard.stale{box-shadow:0 1px 2px rgba(0,0,0,.12);border-color:rgba(239,68,68,.55)}
:root:root .board .kcard .t1{gap:8px}
:root:root .board .kcard .t1 b{font-size:12px;color:var(--muted);font-weight:700}
:root:root .board .kcard .pl{font-size:11px;font-weight:800;letter-spacing:.8px;padding:1px 7px;border-radius:6px;border:1px solid var(--border);background:var(--field);color:var(--text)}
:root:root .board .kcard .age{font-size:11.5px;font-weight:700}
:root:root .board .kcard .title{font-size:14px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
:root:root .board .kcard .sub{font-size:12.5px}
:root:root .board .kcard .fault{font-size:12px;color:var(--muted);-webkit-line-clamp:1;margin-top:1px}
:root:root .board .kcard .foot{margin-top:6px;gap:8px;flex-wrap:nowrap}
:root:root .board .kcard .dds{display:inline-flex;gap:4px}
:root:root .board .kcard .dd{width:10px;height:10px;border-radius:50%;background:var(--c)}
:root:root .board .kcard .tag.s{font-size:10.5px;padding:0 7px;min-height:0;white-space:nowrap}
:root:root .board .kcard .foot .amt{font-size:13px}
:root:root .board .kcard .small{font-size:11.5px}
:root:root .board .kcard .mv{margin-top:6px;gap:6px;display:flex}
:root:root .board .kcard .mvb{min-height:30px;border-radius:8px;border:1px solid var(--border);background:var(--field);color:var(--muted);font-size:12px;font-weight:700;padding:0 10px}
:root:root .board .kcard .mvb.nx{flex:1;background:rgba(var(--navy-rgb),.12);border-color:transparent;color:var(--navy)}
:root:root .board .kcard .mvb:hover{border-color:var(--navy);color:var(--text)}
:root:root .board .kcard .mvb[disabled]{opacity:.35}
@media (hover:hover) and (min-width:900px){
  :root:root .board .kcard .mv{display:none}
  :root:root .board .kcard:hover .mv,:root:root .board .kcard:focus-within .mv{display:flex}
}
@media (max-width:899px){ :root:root .board .kcol{flex-basis:84vw} }

/* ===== Checklist de ingreso (lista con ayuda "?") ===== */
.ck-tools{display:flex;align-items:center;gap:8px;flex:none}
.ck-count{font-size:12px;font-weight:800;color:var(--muted);font-variant-numeric:tabular-nums}
.ck-list{display:flex;flex-direction:column}
.ck-row{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--border);min-width:0}
.ck-row:last-of-type{border-bottom:0}
.ck-n{flex:1;min-width:0;font-size:14px;font-weight:600;line-height:1.25}
.ck-row.is-ok .ck-n{color:var(--text)}
.ck-row.is-bad .ck-n{color:var(--bad)}
.ck-q{flex:none;width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border);background:transparent;color:var(--muted);font-weight:800;font-size:12.5px;display:inline-flex;align-items:center;justify-content:center;padding:0}
.ck-q:hover,.ck-q.on{border-color:var(--navy);color:var(--navy);background:rgba(var(--navy-rgb),.12)}
.ck-st{display:flex;gap:6px;flex:none}
.ck-b{min-height:34px;min-width:64px;padding:0 10px;border-radius:9px;border:1.5px solid var(--border);background:var(--field);color:var(--muted);font-weight:700;font-size:12.5px}
.ck-b.ok.on{background:var(--ok);border-color:var(--ok);color:#052e12}
.ck-b.mal.on{background:var(--bad);border-color:var(--bad);color:#fff}
.ck-box{flex:1;min-width:0;display:flex;align-items:center;gap:10px;border:0;background:transparent;text-align:left;color:var(--text);padding:2px 0;min-height:34px}
.ck-box i{flex:none;width:22px;height:22px;border-radius:6px;border:1.5px solid var(--border);background:var(--field);display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-weight:800;font-size:13px;color:#fff}
.ck-box.on i{background:var(--navy);border-color:var(--navy)}
.ck-help{margin:2px 0 8px;padding:9px 12px;border-radius:10px;background:rgba(var(--navy-rgb),.08);border-left:3px solid var(--navy);font-size:12.5px;line-height:1.4;color:var(--text)}
@media (max-width:520px){
  .ck-row:not(.obs){flex-wrap:wrap}
  .ck-row:not(.obs) .ck-n{flex-basis:calc(100% - 40px)}
  .ck-st{flex:1;margin-left:0}
  .ck-b{flex:1}
}

/* ===== Ayudas "?" automáticas ===== */
.lbt{display:inline-flex;align-items:center;gap:6px}
.hq{width:20px;height:20px;font-size:11.5px;margin-left:6px;vertical-align:middle;cursor:help}
.lbt .hq,.sectitle .hq{margin-left:0}
.hq.after{margin-left:6px;flex:none}
.sectitle .hq,.hh h3 .hq,.card-box h3 .hq{margin-left:8px}
.hq-pop{position:fixed;z-index:6000;max-width:300px;padding:10px 12px;border-radius:12px;background:var(--card);color:var(--text);border:1px solid var(--navy);box-shadow:0 10px 30px rgba(0,0,0,.35);font-size:13px;line-height:1.4;display:flex;flex-direction:column;gap:3px}
.hq-pop b{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--navy)}

/* ===== Venta de mostrador (POS) ===== */
.posbox{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:14px;min-height:420px}
.pos-l{display:flex;flex-direction:column;gap:8px;min-width:0}
.pos-list{display:flex;flex-direction:column;gap:6px;overflow-y:auto;max-height:52vh;padding-right:2px}
.pos-it{display:flex;align-items:center;gap:10px;text-align:left;padding:9px 11px;border-radius:10px;border:1px solid var(--border);background:var(--field);color:var(--text);min-height:48px}
.pos-it:hover{border-color:var(--navy)}
.pos-it .grow{display:flex;flex-direction:column}
.pos-it[disabled]{opacity:.45}
.pos-r{min-width:0}
.pos-cart{display:flex;flex-direction:column;gap:6px}
.pos-ln{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--border)}
.pos-ln .grow{display:flex;flex-direction:column;min-width:0}
.pos-ln .grow b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos-ln .qty{display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:9px;overflow:hidden;flex:none}
.pos-ln .qty button{width:32px;height:32px;border:0;background:var(--field);color:var(--text);font-weight:800;font-size:16px}
.pos-ln .qty span{min-width:30px;text-align:center;font-weight:800;font-variant-numeric:tabular-nums}
.pos-lt{min-width:70px;text-align:right}
.pos-tot{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(var(--navy-rgb),.1);font-weight:800}
.pos-tot b{font-size:20px;text-align:right}
@media (max-width:899px){ .posbox{grid-template-columns:1fr;min-height:0} .pos-list{max-height:34vh} }

/* ===== Avisos (toasts) sin tapar el encabezado ===== */
@media (min-width:900px){
  #toasts{top:auto;bottom:22px;left:calc(var(--side-w) + 24px);transform:none;align-items:flex-start;width:min(420px,40vw)}
}
@media (max-width:899px){
  #toasts{top:auto;bottom:calc(var(--safe-b, 0px) + 96px)}
}
.win-f .hq.after,.dr-f .hq.after,.row .hq.after{align-self:center}
.topbar .search .inp{padding-right:36px;text-overflow:ellipsis}

/* ===== Pantalla de usuario / PIN ===== */
.lockscr{position:fixed;inset:0;z-index:5000;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto}
.lk-box{width:min(460px,100%);text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
.lk-logo{width:72px;height:72px;border-radius:18px;object-fit:contain}
.lk-box h2{margin:4px 0 0}
.lk-users{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;width:100%;margin-top:14px}
.lk-u{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 8px;border-radius:16px;border:1px solid var(--card-border);background:var(--card);color:var(--text);box-shadow:var(--card-shadow)}
.lk-u:hover{border-color:var(--navy)}
.lk-u .av{width:52px;height:52px;border-radius:50%;color:#fff;font-weight:800;font-size:22px;display:flex;align-items:center;justify-content:center}
.lk-u small{color:var(--muted);font-size:12px}
.lk-pin{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:10px}
.lk-who{font-weight:800;font-size:18px}
.lk-dots{display:flex;gap:12px;min-height:18px}
.lk-dots i{width:16px;height:16px;border-radius:50%;border:2px solid var(--muted)}
.lk-dots i.on{background:var(--navy);border-color:var(--navy)}
.lk-dots.err i{border-color:var(--bad)}
.lk-pad{display:grid;grid-template-columns:repeat(3,76px);gap:12px}
.lk-pad button{height:64px;border-radius:18px;border:1px solid var(--card-border);background:var(--card);color:var(--text);font-size:24px;font-weight:700;box-shadow:var(--card-shadow)}
.lk-pad button:active{background:var(--navy);color:#fff}

/* ===== Nube ===== */
.cloudpill{min-height:36px;padding:0 10px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:var(--text);font-weight:700;font-size:13px;white-space:nowrap}
.cloudpill.ok{border-color:rgba(34,197,94,.5)}
.cloudpill.sync{border-color:rgba(245,158,11,.6)}
.cloudpill.offline,.cloudpill.error{border-color:var(--bad);color:var(--bad)}
.invcode{font-size:30px;font-weight:800;letter-spacing:6px;text-align:center;padding:14px;border-radius:14px;border:2px dashed var(--navy);background:rgba(var(--navy-rgb),.08);font-variant-numeric:tabular-nums;margin-top:6px}

/* ===== v2.5: cronómetro, garantía/retorno ===== */
.timer{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px;padding:8px 10px;border-radius:10px;background:var(--surface2);border:1px solid var(--border)}
.timer .tm-v{font-variant-numeric:tabular-nums;font-size:16px;min-width:74px}
.timer.run{border-color:rgba(34,197,94,.55);background:rgba(34,197,94,.10)}
.timer.run .tm-v{color:var(--ok,#22c55e)}
.timer.run .tm-ic{animation:tmpulse 1.2s ease-in-out infinite}
@keyframes tmpulse{50%{opacity:.35}}
.retbox{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:10px 0;padding:10px 12px;border-radius:10px;border:1px solid rgba(245,158,11,.55);background:rgba(245,158,11,.10);font-size:13px}
.retbox.on{border-color:rgba(168,85,247,.6);background:rgba(168,85,247,.12)}
.btn.warn{background:#f59e0b;border-color:#f59e0b;color:#111}
.retpill{display:inline-block;margin-top:4px;padding:3px 9px;border-radius:999px;background:rgba(168,85,247,.16);color:#c4b5fd;font-weight:600}
.retpill.warn{background:rgba(245,158,11,.16);color:#fbbf24}
.retpill a{color:inherit;text-decoration:underline}
.kcard .tag.ret{color:#c4b5fd}
.kcard .tag.run{color:var(--ok,#22c55e)}
[data-theme="light"] .retpill{color:#6d28d9}
[data-theme="light"] .retpill.warn{color:#b45309}

/* ---- barra de licencia (versión Local) ---- */
.licbar{display:flex;align-items:center;gap:10px;flex:none;padding:7px 16px;font-size:13.5px;font-weight:600;border-bottom:1px solid var(--border);background:rgba(var(--navy-rgb),.12);color:var(--text)}
.licbar .grow{flex:1;min-width:0}
.licbar.warn{background:rgba(245,158,11,.16);color:#fcd34d;border-bottom-color:rgba(245,158,11,.5)}
.licbar.bad{background:rgba(239,68,68,.16);color:#fecaca;border-bottom-color:rgba(239,68,68,.55)}
:root[data-theme="light"] .licbar.warn{background:#fef3c7;color:#78350f}
:root[data-theme="light"] .licbar.bad{background:#fee2e2;color:#7f1d1d}
@media (max-width:760px){.licbar{padding:6px 12px;font-size:12.5px}}