:root{--azul:#0f2a44;--azul2:#18406a;--rojo:#d62828;--gris:#f2f4f7;--borde:#d9dee5;--texto:#1d2530;--suave:#5b6675;--ok:#1b8a4b}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--gris);color:var(--texto);font-size:15px}
a{color:var(--azul2)}
header.top{background:var(--azul);color:#fff;display:flex;align-items:center;gap:12px;padding:10px 16px;position:sticky;top:0;z-index:5}
header.top .marca{font-weight:800;letter-spacing:.5px}
header.top .marca span{color:var(--rojo)}
header.top .esp{flex:1}
header.top a,header.top button{color:#fff;background:none;border:1px solid #ffffff55;border-radius:6px;padding:6px 10px;cursor:pointer;text-decoration:none;font-size:14px}
main{max-width:1150px;margin:0 auto;padding:16px}
h1{font-size:22px;margin:4px 0 14px}
.tarjetas{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.tarjeta{background:#fff;border:1px solid var(--borde);border-left:5px solid var(--rojo);border-radius:8px;padding:14px;text-decoration:none;color:var(--texto);display:block}
.tarjeta b{display:block;font-size:16px;margin-bottom:4px}
.tarjeta small{color:var(--suave)}
.tarjeta.prox{opacity:.55;border-left-color:#999;pointer-events:none}
.caja{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:14px;margin-bottom:14px}
table{width:100%;border-collapse:collapse;background:#fff}
th,td{padding:8px;border-bottom:1px solid var(--borde);text-align:left;font-size:14px}
th{background:#e9edf2}
input,select,textarea{width:100%;padding:8px;border:1px solid var(--borde);border-radius:6px;font-size:15px;font-family:inherit}
label{display:block;font-size:13px;color:var(--suave);margin:8px 0 3px}
.fila{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.btn{background:var(--azul2);color:#fff;border:0;border-radius:6px;padding:9px 14px;cursor:pointer;font-size:15px}
.btn.rojo{background:var(--rojo)}
.btn.gris{background:#8a94a3}
.chip{display:inline-block;padding:2px 8px;border-radius:10px;font-size:12px;background:#e3e8ef}
.chip.ok{background:#d8f2e3;color:var(--ok)}
.chip.no{background:#fbe0e0;color:var(--rojo)}
.msg{padding:8px;border-radius:6px;margin:8px 0;display:none}
.msg.err{display:block;background:#fbe0e0;color:#8a1515}
.msg.ok{display:block;background:#d8f2e3;color:#14593a}
.login{max-width:360px;margin:9vh auto;background:#fff;border-radius:10px;padding:26px;border-top:6px solid var(--rojo);box-shadow:0 6px 24px #0f2a4422}
.login h1{text-align:center;margin-bottom:2px}
.login p{text-align:center;color:var(--suave);margin-top:0}
.login .btn{width:100%;margin-top:14px}
.modal{position:fixed;inset:0;background:#0007;display:none;align-items:center;justify-content:center;padding:12px;z-index:10}
.modal.ver{display:flex}
.modal .caja{width:100%;max-width:520px;max-height:90vh;overflow:auto}
.manual h2{border-bottom:2px solid var(--rojo);padding-bottom:4px;margin-top:26px}
@media(max-width:600px){main{padding:10px}th,td{padding:6px;font-size:13px}}
@media print{header.top,.noprint{display:none}body{background:#fff}}

/* ---- Entrega 2 ---- */
.barra{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-bottom:12px}
.barra>*{flex:0 1 auto}
.barra input,.barra select{width:auto;min-width:140px}
.barra .crece{flex:1 1 200px}
.btn.chico{padding:5px 9px;font-size:13px}
.btn.verde{background:var(--ok)}
.btn.blanco{background:#fff;color:var(--azul2);border:1px solid var(--borde)}
.btn:disabled{opacity:.5;cursor:default}
.der{text-align:right}
.cen{text-align:center}
.nowrap{white-space:nowrap}
.suave{color:var(--suave);font-size:13px}
tr.clic{cursor:pointer}
tr.clic:hover td{background:#f5f8fc}
.tabla-scroll{overflow-x:auto;background:#fff;border:1px solid var(--borde);border-radius:8px}
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--borde);margin-bottom:12px;flex-wrap:wrap}
.tabs button{background:none;border:0;padding:9px 14px;cursor:pointer;font-size:15px;color:var(--suave);border-bottom:3px solid transparent;margin-bottom:-2px}
.tabs button.act{color:var(--azul);border-bottom-color:var(--rojo);font-weight:600}
.oculto{display:none!important}
.sug-caja{position:relative}
.sug{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid var(--borde);border-radius:6px;box-shadow:0 6px 18px #0002;z-index:30;max-height:280px;overflow:auto}
.sug div{padding:8px 10px;cursor:pointer;border-bottom:1px solid #eef1f5;font-size:14px}
.sug div:hover{background:#eef4fb}
.chip.e-PROFORMA{background:#eceff3}.chip.e-APROBADA{background:#dbeafe;color:#1e4fa0}
.chip.e-EN_PROCESO{background:#fff2cc;color:#8a5a00}.chip.e-ESPERA_REPUESTO{background:#ffe1c7;color:#9a4300}
.chip.e-TERMINADA{background:#d8f2e3;color:#14593a}.chip.e-ENTREGADA,.chip.e-FACTURADA{background:#d1d5db;color:#333}
.chip.e-ANULADA,.chip.e-DEVUELTA,.chip.e-NO_AUTORIZADA,.chip.e-CANCELADA,.chip.e-NO_ASISTIO{background:#fbe0e0;color:#8a1515}
.chip.e-AUTORIZADA,.chip.e-ATENDIDA,.chip.e-HECHO{background:#d8f2e3;color:#14593a}
.chip.e-PENDIENTE,.chip.e-FIRMADA,.chip.e-RECIBIDA{background:#fff2cc;color:#8a5a00}.chip.e-CONFIRMADA{background:#dbeafe;color:#1e4fa0}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:14px}
.kpi{background:#fff;border:1px solid var(--borde);border-radius:8px;padding:10px 12px;text-decoration:none;color:var(--texto)}
.kpi b{display:block;font-size:22px;color:var(--azul)}
.kpi small{color:var(--suave)}
.kpi.alerta b{color:var(--rojo)}
.alerta-caja{background:#fff4e5;border:1px solid #f3c27a;color:#7a4b00;padding:10px;border-radius:8px;margin-bottom:12px}
.fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.fotos figure{margin:0;position:relative;background:#eee;border-radius:6px;overflow:hidden}
.fotos img{width:100%;height:110px;object-fit:cover;display:block;cursor:zoom-in}
.fotos figcaption{font-size:11px;padding:3px 5px;background:#fff}
.totales{margin-left:auto;max-width:340px}
.totales td{padding:4px 8px}
.totales tr:last-child td{font-weight:700;font-size:16px;border-top:2px solid var(--azul)}
.dos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modal .caja.ancho{max-width:900px}
.check-lista{display:flex;flex-wrap:wrap;gap:6px 14px}
.check-lista label{display:flex;align-items:center;gap:5px;margin:0;color:var(--texto);font-size:14px}
.check-lista input{width:auto}
input.mini{width:80px}
td input,td select{padding:5px;font-size:14px}
.barras{display:flex;align-items:center;gap:6px}
.barras span{display:inline-block;height:12px;background:var(--azul2);border-radius:3px}
@media(max-width:700px){.dos{grid-template-columns:1fr}.barra input,.barra select{width:100%}}
.modal .caja .caja{max-width:none;width:auto}