/* ===== UI v2: inicio, pedidos con anillo, sesiones, finanzas, avisos, modo noche, barra flotante ===== */
:root{--rad:16px}
/* --- cabecera con acciones --- */
.top{grid-template-columns:auto 1fr auto}
.hact{display:flex;align-items:center;gap:6px;grid-column:3;grid-row:1}
.hact button{position:relative;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--linea);background:var(--card);display:grid;place-items:center;color:var(--carbon);padding:0}
.hact svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hact em{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;border-radius:9px;background:var(--bad);color:#fff;font:600 10px var(--sans);font-style:normal;place-items:center;padding:0 4px}
.sdot{width:12px;height:12px;border-radius:50%;background:#aaa;display:inline-block;border:2px solid var(--card);box-shadow:0 0 0 1px var(--linea);margin:0 4px}
.sdot.ok{background:#2F9E5B}.sdot.wait{background:var(--lampara)}.sdot.off{background:var(--bad)}.sdot.loc{background:#9a9283}
.sdline{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted);margin-bottom:8px}.sdline .sdot{margin:0}

/* --- anillo de progreso --- */
.ring{width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;background:conic-gradient(var(--c,var(--tinta)) calc(var(--p)*1%),var(--papel2) 0)}
.ring i{width:35px;height:35px;border-radius:50%;background:var(--card);display:grid;place-items:center;font:600 11px var(--sans);font-style:normal;color:var(--carbon)}
.sm{font-size:12px;color:var(--muted)}
.pm{flex:1;min-width:0}

/* --- inicio --- */
.hn2{font-size:22px;font-weight:600;margin-top:2px}
.tiles3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.kt{background:var(--card);border:1.5px solid var(--linea);border-radius:14px;padding:9px 10px;box-shadow:var(--sombra)}
.kt.dk{background:var(--carbon);color:var(--papel);border-color:var(--carbon)}
.kt.dk .lab{color:#cdbf9f}
.kt .lab{font-size:9.5px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.kv{font-size:19px;font-weight:600;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos{color:var(--good)}.neg{color:var(--bad)}
.qa2{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.qa2 button{background:none;border:0;font:inherit;font-size:11.5px;color:var(--carbon);display:flex;flex-direction:column;align-items:center;gap:5px;padding:0}
.qa2 u{text-decoration:none;display:grid;place-items:center;width:52px;height:52px;border-radius:18px;background:var(--card);border:1.5px solid var(--linea);font-size:21px;font-weight:600;color:var(--barro);box-shadow:var(--sombra)}
.qa2 u.pri{background:var(--barro);border-color:var(--barro);color:#fff}
.qa2 button:active u{transform:scale(.94)}

/* --- tarjetas de pedido (compactas) --- */
.card.ped{display:block}
.card.ped.hp,.card.ped.bres,.card.ped.sline{display:flex;align-items:center;gap:10px}
.pcomp{display:flex;align-items:center;gap:10px}
.pcomp .p-top{display:flex;justify-content:space-between;align-items:center;gap:6px}
.p-line{font-size:12.5px;margin-top:2px}
.chev{color:var(--muted);font-size:14px;flex:none}
.pdet{margin-top:8px;padding-top:6px;border-top:1px dashed var(--linea)}
.card.ped.entregado{background:#E8F2EA}
.sline .sr{text-align:right;flex:none}.sline .sr b{font-size:16px}

/* --- subpestañas con iconos --- */
.subtabs{overflow-x:auto;scrollbar-width:none;gap:4px;-webkit-overflow-scrolling:touch}
.subtabs::-webkit-scrollbar{display:none}
.subtabs button{flex:0 0 auto;min-width:62px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 9px;min-height:46px;font-size:10.5px;font-weight:600;white-space:nowrap}
.subtabs button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.subtabs{position:sticky;mask-image:linear-gradient(90deg,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent)}

/* --- sesiones --- */
.wkhead{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.wkhead b{flex:1;font-family:var(--serif);letter-spacing:1.5px;text-transform:uppercase;font-size:13px}
.wkhead button{border:1.5px solid var(--linea);background:var(--card);border-radius:10px;font:inherit;font-size:16px;color:var(--carbon);padding:2px 10px;min-height:32px}
.wkhead .chip{font-size:12px;min-height:32px;padding:4px 10px}
.wk{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.wk button{border:1.5px solid var(--linea);background:var(--card);border-radius:12px;padding:5px 0 3px;font:inherit;color:var(--carbon);display:flex;flex-direction:column;align-items:center;line-height:1.1}
.wk small{font-size:10px;color:var(--muted)}.wk b{font-size:15px}
.wk i{width:6px;height:6px;border-radius:50%;margin-top:3px;background:transparent}
.wk .has i{background:var(--lampara)}
.wk .today{border-color:var(--lampara)}
.wk .on{background:var(--carbon);color:var(--papel);border-color:var(--carbon)}.wk .on small{color:#cdbf9f}
.wk button:disabled{opacity:.4}
.sstats{display:flex;justify-content:space-between;margin:4px 0 6px}.sstats .big{font-size:22px;font-weight:600}
.mbar{height:7px;border-radius:5px;background:#E6B8A8;overflow:hidden}.mbar i{display:block;height:100%;background:var(--good)}
.stickybtn{position:sticky;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:12;box-shadow:0 6px 16px rgba(42,42,42,.35)}

/* --- finanzas --- */
.fhero{background:var(--carbon);color:var(--papel);border-radius:18px;padding:14px 16px;margin-bottom:10px;box-shadow:var(--sombra)}
.fhero .lab{color:#cdbf9f;font-size:10.5px;letter-spacing:1.3px;text-transform:uppercase}
.fbig{font-size:32px;font-weight:600;margin:2px 0}
.fsub{font-size:13px}.fsub.up{color:#8fdca7}.fsub.dn{color:#ffb3a0}.fmore{font-size:12px;color:#cdbf9f;margin-top:3px}
.fchart{display:block;margin-top:4px}.fleg{font-size:11px;color:var(--muted)}
.tiles2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}
.kt.alerta{border-left:6px solid var(--c)}
.ctiles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ctiles .card{margin:0}.ct .val{font-size:16px;margin:2px 0}

/* --- overlays nuevos --- */
.card.av{border-left:6px solid var(--tinta)}.card.av.n3{border-left-color:var(--bad)}.card.av.n2{border-left-color:var(--lampara)}
.card.av::before{display:none}
.rec-cv{width:100%;height:auto;border-radius:12px;border:1.5px solid var(--linea);display:block}
.acts a.wa{background:var(--good);border-color:var(--good);color:#fff}
#rec-acts a{flex:1}
.top-ov{align-items:flex-start}.top-ov .sheet{border-radius:0 0 22px 22px;max-height:88vh}.top-ov .sheet::before{display:none}

/* --- barra inferior flotante --- */
.bar{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));border-radius:22px;border-top:0;padding:6px 6px;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.bar button{min-height:48px;border-radius:16px;justify-content:center}
.bar button.on{background:rgba(212,139,61,.22)}
body{padding-bottom:calc(92px + env(safe-area-inset-bottom,0px))}
.fab{bottom:calc(92px + env(safe-area-inset-bottom,0px))}
.btn,.acts a,.chip{min-height:44px}
.toast{bottom:calc(160px + env(safe-area-inset-bottom,0px))}

/* ===== MODO NOCHE ===== */
:root[data-tema=oscuro]{--papel:#17140f;--papel2:#2c261b;--card:#241f17;--linea:#3a3225;--carbon:#EFE6D3;--muted:#a89c82;--barro:#D49A5A;--tinta:#7FA6E0;--good:#5FB27E;--bad:#E58A6E;--sombra:0 1px 2px rgba(0,0,0,.5)}
:root[data-tema=oscuro] body{background:var(--papel);color:var(--carbon)}
:root[data-tema=oscuro] .top{background:#1d1912;border-color:var(--linea)}
:root[data-tema=oscuro] .iso,:root[data-tema=oscuro] .wm{filter:brightness(1.6) contrast(.9)}
:root[data-tema=oscuro] .bar{background:#2c261b}
:root[data-tema=oscuro] .bar button{color:#a89c82}
:root[data-tema=oscuro] .bar button.on{color:var(--lampara)}
:root[data-tema=oscuro] .kt.dk,:root[data-tema=oscuro] .fhero,:root[data-tema=oscuro] .stat.hl,:root[data-tema=oscuro] .hero{background:#33291b;border-color:#4a3d28;color:#F5F0E6}
:root[data-tema=oscuro] .kt.dk .lab,:root[data-tema=oscuro] .stat.hl .lab{color:#cdbf9f}
:root[data-tema=oscuro] .chip.on,:root[data-tema=oscuro] .subtabs button.on,:root[data-tema=oscuro] .wk .on,:root[data-tema=oscuro] .cal button.on{background:var(--lampara);border-color:var(--lampara);color:#1d1408}
:root[data-tema=oscuro] .wk .on small{color:#4a3513}
:root[data-tema=oscuro] input,:root[data-tema=oscuro] select,:root[data-tema=oscuro] textarea,:root[data-tema=oscuro] .search{background:#1d1912!important;color:var(--carbon);border-color:var(--linea)}
:root[data-tema=oscuro] .card.ped.entregado{background:#1c2a21}
:root[data-tema=oscuro] .ring i{background:var(--card)}
:root[data-tema=oscuro] .sheet{background:#1d1912;color:var(--carbon)}
:root[data-tema=oscuro] .btn{color:var(--carbon);border-color:var(--linea)}
:root[data-tema=oscuro] .btn.primary{background:var(--lampara);color:#1d1408;border-color:var(--lampara)}
:root[data-tema=oscuro] .fab{background:var(--lampara);color:#1d1408;border-color:#1d1912}
:root[data-tema=oscuro] .toast{background:#EFE6D3;color:#17140f}
:root[data-tema=oscuro] .mbar{background:#5a3a2c}
:root[data-tema=oscuro] .alert{background:#2c261b;color:var(--carbon)}
:root[data-tema=oscuro] .mov,:root[data-tema=oscuro] .stat,:root[data-tema=oscuro] .tile,:root[data-tema=oscuro] .mi,:root[data-tema=oscuro] .row{background:var(--card);color:var(--carbon)}
:root[data-tema=oscuro] .p-money,:root[data-tema=oscuro] .pg{background:none}
:root[data-tema=oscuro] .seg div{color:var(--carbon)}
:root[data-tema=oscuro] .seg div.on{background:var(--lampara);color:#1d1408}
:root[data-tema=oscuro] .badge{filter:brightness(.95)}
:root[data-tema=oscuro] .lock,:root[data-tema=oscuro] .login{background:#17140f}
