:root{--azul:#0f3d6e;--azul2:#1663b0;--rojo:#d93636;--rojo-bg:#fdeaea;--verde:#1f9d55;--verde-bg:#e8f6ee;--ambar:#c47f00;--ambar-bg:#fff4dc;--gris:#6b7280;--borde:#e3e7ee;--fondo:#f3f6fa}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--fondo);color:#1d2433;font-size:14px}
.hidden{display:none!important}
button,input,select,textarea{font:inherit}
button{cursor:pointer;border:1px solid var(--borde);background:#fff;border-radius:8px;padding:7px 12px}
button:hover{filter:brightness(.96)}
button.primary{background:var(--azul2);color:#fff;border-color:var(--azul2);font-weight:600}
button.danger{background:var(--rojo);color:#fff;border-color:var(--rojo)}
button.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
button.sm{padding:3px 8px;font-size:12px}
input,select,textarea{border:1px solid var(--borde);border-radius:8px;padding:7px 10px;background:#fff;width:100%}

#login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,var(--azul),var(--azul2))}
.login-box{background:#fff;padding:32px;border-radius:16px;width:320px;display:grid;gap:12px;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.login-box h1{margin:0}.login-box p{margin:0 0 8px;color:var(--gris)}.logo{font-size:48px}

header{background:var(--azul);color:#fff;display:flex;align-items:center;gap:16px;padding:8px 16px;position:sticky;top:0;z-index:20;flex-wrap:wrap}
.brand{font-size:18px}
nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
nav button{background:transparent;color:#cfe0f5;border:none}
nav button.on{background:rgba(255,255,255,.15);color:#fff;font-weight:600}
.demo{background:var(--ambar-bg);color:#7a5200;padding:6px 16px;font-size:13px}
.mesbar{display:flex;align-items:center;gap:8px;padding:12px 16px 0}
.mesbar input{width:auto}.mesbar h2{margin:0 0 0 8px;font-size:20px;text-transform:capitalize}
main{padding:12px 16px 40px}

.card{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:16px;margin-bottom:12px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:12px}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:12px;padding:12px;color:var(--gris)}
.kpi b{display:block;font-size:26px;color:#1d2433}
.kpi.ok b{color:var(--verde)}.kpi.bad b{color:var(--rojo)}.kpi.warn b{color:var(--ambar)}
.bar{height:8px;background:var(--rojo-bg);border-radius:4px;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:var(--verde)}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.toolbar label{display:flex;gap:6px;align-items:center}.toolbar input[type=checkbox]{width:auto}
.sp{flex:1}

.tablewrap{overflow:auto;max-height:calc(100vh - 260px);border:1px solid var(--borde);border-radius:12px;background:#fff}
table{border-collapse:collapse;width:100%}
th,td{border-bottom:1px solid var(--borde);padding:6px 8px;text-align:left;vertical-align:middle}
.list th{background:#f8fafc;font-size:12px;color:var(--gris);text-transform:uppercase}
.cal thead th{position:sticky;top:0;background:#f8fafc;z-index:2;min-width:150px;font-size:13px}
.cal thead th small{display:block;color:var(--gris);font-weight:400}
.cal tbody th{position:sticky;left:0;background:#fff;z-index:1;white-space:nowrap;width:70px}
.cal thead th:first-child{left:0;z-index:3;min-width:70px}
.cal td{padding:4px;border-left:1px solid var(--borde)}
tr.dom th,tr.dom td{background:#eef4ff}tr.sab th,tr.sab td{background:#f7f9fd}
tr.hoy th{color:var(--azul2);font-weight:800}
.slot{display:flex;align-items:center;gap:4px;width:100%;text-align:left;padding:4px 6px;margin:2px 0;border-radius:6px;font-size:12.5px;border:1px solid transparent;background:var(--verde-bg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slot.gap{background:var(--rojo-bg);color:var(--rojo);font-weight:700;border:1px dashed var(--rojo)}
.slot.warn{background:var(--ambar-bg);border-color:var(--ambar)}
.tag{font-style:normal;font-size:10px;padding:1px 5px;border-radius:8px;margin-left:auto;background:#dde7f5;color:var(--azul)}
.t-extra,.t-reemplazo{background:#ffe1c2;color:#8a4b00}.t-devolucion{background:#e5dcff;color:#4b2fa0}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;color:var(--gris);font-size:12px}
.legend span{display:flex;align-items:center;gap:4px}.legend i{width:14px;height:14px;border-radius:4px;display:inline-block}

.ov{position:fixed;inset:0;background:rgba(10,20,40,.45);display:grid;place-items:center;z-index:50;padding:16px}
.box{background:#fff;border-radius:14px;padding:20px;width:min(520px,100%);max-height:92vh;overflow:auto;display:grid;gap:10px}
.box h3{margin:0 0 4px}
.box label{display:grid;gap:4px;font-size:12px;color:var(--gris);font-weight:600}
.box label.chk{display:flex;align-items:center;gap:8px}.box label.chk input{width:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.btns{display:flex;gap:8px;align-items:center;margin-top:6px}
.hint{font-size:12.5px;color:#4b5563;background:#f3f6fa;border-radius:8px;padding:8px 10px}
.hint:empty{display:none}.hint.warn{background:var(--ambar-bg);color:#7a5200}
.call{display:inline-block;background:var(--verde);color:#fff;padding:6px 12px;border-radius:8px;text-decoration:none;font-weight:600}
.pill{font-size:11px;padding:2px 8px;border-radius:10px;background:#eef2f7}
.pill.bad{background:var(--rojo-bg);color:var(--rojo)}.pill.ok{background:var(--verde-bg);color:var(--verde)}
.muted{color:var(--gris)}.right{text-align:right}
#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:60}
#toast div{background:#1d2433;color:#fff;padding:10px 16px;border-radius:10px;margin-top:6px;box-shadow:0 6px 20px rgba(0,0,0,.2)}
#toast div.err{background:var(--rojo)}

@media (max-width:700px){.grid2{grid-template-columns:1fr}nav button{padding:6px 8px;font-size:13px}}
@media print{header,.mesbar button,.mesbar input,.toolbar,.demo,.kpis,.legend{display:none!important}.tablewrap{max-height:none;overflow:visible;border:none}body{background:#fff}.slot{border:none!important;background:none!important;padding:0}.cal thead th,.cal tbody th{position:static}}
