/* ============ Entregas Fénix ============ */
:root{
  --bg:#f3f4f6; --card:#fff; --ink:#1b2333; --muted:#6b7385; --line:#e3e6ec; --line2:#eef0f4;
  --navy:#16233b; --navy2:#1f3150; --accent:#e8590c; --accent-2:#fff1e8;
  --ok:#1f8a4c; --ok-bg:#e7f6ec; --bad:#c92a2a; --bad-bg:#fdecec; --warn:#b76e00; --warn-bg:#fff5db;
  --cold:#1c6fb8; --cold-bg:#e6f1fb; --r:10px; --sh:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.05);
  font-size:15px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.4}
a{color:#1d4fa3;text-decoration:none} a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 .6rem;line-height:1.2} h2{font-size:1.02rem} h3{font-size:.98rem}
input,select,textarea,button{font:inherit;color:inherit}
input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea{
  width:100%;padding:.5rem .6rem;border:1px solid #cfd4dd;border-radius:8px;background:#fff;min-height:38px}
input:focus,select:focus,textarea:focus{outline:2px solid #ffb88a;border-color:var(--accent)}
input[type=checkbox]{width:17px;height:17px;accent-color:var(--accent);vertical-align:middle}
label{display:block;font-size:.83rem;color:#3b4456;font-weight:600}
label>input,label>select,label>textarea{margin-top:.25rem;font-weight:400}
label.chk{display:flex;gap:.45rem;align-items:center;font-weight:500}
.muted{color:var(--muted)} .small{font-size:.82rem} .center{text-align:center} .pad{padding:1.5rem!important}
.r{text-align:right} .nowrap{white-space:nowrap} .ok-text{color:var(--ok)}
.clip{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.5rem .9rem;border-radius:8px;border:1px solid #cfd4dd;
  background:#fff;cursor:pointer;font-weight:600;font-size:.88rem;color:var(--ink);text-decoration:none!important;white-space:nowrap;min-height:38px}
.btn:hover{background:#f6f7f9}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff} .btn.primary:hover{background:#d14e08}
.btn.ghost{background:transparent;border-color:transparent;color:#34405a} .btn.ghost:hover{background:#e9ecf1}
.btn.danger{color:var(--bad)} .btn.danger:not(.ghost){border-color:#f0b4b4}
.btn.sm{padding:.35rem .65rem;min-height:32px;font-size:.82rem} .btn.xs{padding:.2rem .5rem;min-height:26px;font-size:.78rem}
.btn.block{display:flex;width:100%} .btn.big{padding:.9rem;font-size:1.05rem}
.btn:disabled{opacity:.6;cursor:wait}
.link{background:none;border:0;padding:0;cursor:pointer;color:#1d4fa3} .link.danger{color:var(--bad)}
select.sm,input.sm{min-height:32px!important;padding:.25rem .45rem!important;width:auto!important;font-size:.84rem}
select.xs{width:auto!important;min-height:30px!important;padding:.15rem .3rem!important}
form.inline{display:inline}

/* Alertas / badges */
.alert{padding:.7rem .9rem;border-radius:8px;margin:0 0 .9rem;font-size:.9rem;border:1px solid}
.alert-ok{background:var(--ok-bg);border-color:#bfe5cc;color:#135c33}
.alert-err{background:var(--bad-bg);border-color:#f3c0c0;color:#8f1d1d}
.alert-warn{background:var(--warn-bg);border-color:#f2dc9b;color:#6e4300}
.badge{display:inline-block;padding:.12rem .45rem;border-radius:999px;font-size:.72rem;font-weight:700;background:#eceff4;color:#3b4456;white-space:nowrap;letter-spacing:.01em}
.badge.urge{background:var(--accent);color:#fff} .badge.frio{background:var(--cold-bg);color:var(--cold)}
.badge.late{background:var(--bad-bg);color:var(--bad)}
.st-pendiente{background:#eceff4;color:#495267} .st-asignado{background:#e8eefc;color:#2848a0}
.st-cargado{background:#efe7fb;color:#6231a8} .st-en-ruta{background:#fff1e0;color:#a4540b}
.st-entregado{background:var(--ok-bg);color:var(--ok)} .st-retenido{background:var(--warn-bg);color:var(--warn)}
.st-retira-cliente{background:#e3f4f4;color:#0f6d6d} .st-incidencia{background:var(--bad-bg);color:var(--bad)}
.st-anulado{background:#eee;color:#888;text-decoration:line-through}
.tipo{font-size:.72rem;font-weight:800;padding:.1rem .35rem;border-radius:5px;background:#eceff4}
.t-fl{background:#fde8dc;color:#b1470b} .t-c{background:#e3f4f4;color:#0f6d6d}
.tags{display:inline-flex;gap:.25rem;flex-wrap:wrap;align-items:center}
.pill{background:var(--accent);color:#fff;border-radius:999px;padding:0 .4rem;font-size:.72rem;margin-left:.3rem}

/* Panel: estructura */
body.panel{display:flex;min-height:100vh}
.side{width:236px;flex:0 0 236px;background:var(--navy);color:#cfd7e6;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto}
.brand{display:flex;gap:.6rem;align-items:center;padding:1.1rem 1rem .9rem}
.brand b{display:block;color:#fff;font-size:1.05rem;letter-spacing:.02em} .brand small{display:block;font-size:.72rem;color:#93a0b8}
.logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#ff8a3d,var(--accent) 60%,#b83c00);color:#fff;
  display:grid;place-items:center;font-weight:900;font-size:1.1rem;flex:0 0 auto}
.logo.sm{width:30px;height:30px;font-size:.95rem}
.side nav{padding:.3rem .5rem;flex:1}
.side nav a{display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem;border-radius:7px;color:#cfd7e6;font-size:.9rem;text-decoration:none}
.side nav a i{font-style:normal;width:18px;text-align:center;opacity:.75}
.side nav a:hover{background:var(--navy2);color:#fff}
.side nav a.on{background:#2a3f63;color:#fff;box-shadow:inset 3px 0 0 var(--accent)}
.nav-sep{font-size:.68rem;text-transform:uppercase;letter-spacing:.09em;color:#7d8aa3;padding:.9rem .6rem .3rem}
.side-foot{padding:.8rem 1rem;border-top:1px solid #243554;font-size:.8rem;color:#93a0b8}
.side-foot span{display:block;color:#e4e9f2;font-weight:600;margin-bottom:.15rem} .side-foot a{color:#ffb88a}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:1rem;padding:.8rem 1.4rem;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.top h1{font-size:1.15rem;margin:0;flex:1}
.top-search{width:min(380px,40vw)}
.burger{display:none;border:0;background:none;font-size:1.4rem;cursor:pointer;padding:.2rem .4rem}
.content{padding:1.2rem 1.4rem 3rem;max-width:1500px;width:100%}
.scrim{display:none}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem;margin-bottom:1rem;box-shadow:var(--sh)}
.card.highlight{border-color:#ffc9a6;background:#fffaf6}
.card.narrow{max-width:420px}
.card>h2 small{font-weight:400}
.toolbar{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.toolbar label{display:flex;align-items:center;gap:.35rem;font-weight:500}
.toolbar label input,.toolbar label select{margin:0;width:auto}
.toolbar.sticky{position:sticky;top:61px;z-index:10;background:var(--bg);padding:.5rem 0;margin-bottom:.4rem}
.toolbar form{display:flex;gap:.4rem;align-items:center}
.toolbar input[type=date]{width:auto}
.spacer{flex:1}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1rem} .grid-2>.card{margin:0} .span-2{grid-column:span 2}
.grid-main{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:1rem;align-items:start}
.stack>*{margin-bottom:1rem}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1rem}
.cards .card{margin:0}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.7rem;margin-bottom:1rem}
.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:.75rem .9rem;color:var(--ink);text-decoration:none!important;box-shadow:var(--sh);border-top:3px solid #c9cfda}
.kpi small{display:block;color:var(--muted);font-size:.76rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.kpi b{display:block;font-size:1.65rem;font-variant-numeric:tabular-nums;margin:.1rem 0}
.kpi em{font-style:normal;font-size:.78rem;color:var(--muted)}
.kpi.ok{border-top-color:var(--ok)} .kpi.bad{border-top-color:var(--bad)} .kpi.bad b{color:var(--bad)}
.kpi.warn{border-top-color:var(--accent)} .kpi.warn b{color:var(--accent)} .kpi.cold{border-top-color:var(--cold)}
a.kpi:hover{border-color:#b9c1cf}
.progress{height:8px;background:#e8ebf0;border-radius:99px;overflow:hidden}
.progress span{display:block;height:100%;background:linear-gradient(90deg,#2f9e5f,var(--ok));border-radius:99px}
.progress.big{height:10px;margin:-.3rem 0 1.1rem}
.bar{position:relative;height:20px;background:#f0f2f5;border-radius:4px}
.bar span{position:absolute;inset:0 auto 0 0;background:#ffcfae;border-radius:4px}
.bar em{position:relative;font-style:normal;font-size:.78rem;font-weight:700;padding-left:.4rem;line-height:20px}

/* Tablas */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.card.tbl-wrap{padding:0}
.tbl{width:100%;border-collapse:collapse;font-size:.86rem;background:#fff}
.tbl th{text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:#5b6477;background:#f7f8fa;padding:.55rem .6rem;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0}
.tbl td{padding:.5rem .6rem;border-bottom:1px solid var(--line2);vertical-align:top}
.tbl.compact td{padding:.4rem .55rem}
.tbl tbody tr:hover td{background:#fafbfd}
.tbl .day-row td{background:#eef1f6;font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:#46506a;padding:.35rem .6rem}
.row-urge td{background:#fff7f1} .row-urge td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
.row-warn td{background:#fffbea} .row-bad td{background:var(--bad-bg)}
tr.muted td{color:#9aa1b0}
.tbl input.num{width:100px;text-align:right;min-height:32px;padding:.25rem .4rem} .tbl input.num.xs{width:60px}
.entregas td:first-child,.entregas th:first-child{width:28px}
.pager{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:1rem}
.pager a{padding:.3rem .6rem;border:1px solid var(--line);border-radius:6px;background:#fff}
.pager a.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.seg{display:inline-flex;border:1px solid #cfd4dd;border-radius:8px;overflow:hidden;background:#fff}
.seg a{padding:.45rem .9rem;color:var(--ink);font-weight:600;font-size:.86rem;text-decoration:none}
.seg a.on{background:var(--navy);color:#fff}

/* Filtros y formularios */
.filters{display:flex;flex-wrap:wrap;gap:.7rem;align-items:flex-end}
.filters label{min-width:140px;flex:0 1 170px} .filters label.grow{flex:1 1 240px}
.filters .checks{display:flex;gap:.9rem;align-items:center;padding-bottom:.45rem}
.filters .actions{display:flex;gap:.4rem;margin-left:auto}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1rem}
.form-grid fieldset{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:.75rem 1rem;border:0;border-top:1px solid var(--line);padding:1rem 0 .2rem;margin:0}
.form-grid fieldset:first-of-type{border-top:0;padding-top:0}
.form-grid legend{font-weight:800;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);padding:0 .4rem 0 0}
.col-2{grid-column:span 2}
.hint{margin:-.3rem 0 0;font-size:.8rem;color:var(--muted)}
.form-actions{display:flex;gap:.5rem;flex-wrap:wrap;padding-top:.4rem}
.total-line{margin:0;font-size:.95rem} .total-line b{font-size:1.15rem}
.stack-form{display:grid;gap:.6rem}
.row-form{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.row-form input[type=file]{flex:1;min-width:180px;font-size:.84rem}
details summary{cursor:pointer;list-style:none} details summary::-webkit-details-marker{display:none}
details[open]>summary{margin-bottom:.6rem}

/* Listas, fotos, historial */
.list{list-style:none;margin:0;padding:0;max-height:460px;overflow:auto}
.list li{display:flex;justify-content:space-between;gap:.6rem;padding:.55rem 0;border-bottom:1px solid var(--line2)}
.list li a{color:var(--ink);text-decoration:none} .list li .tags{justify-content:flex-end;align-content:flex-start;max-width:45%}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.5rem;margin-bottom:.7rem}
.gallery figure{margin:0} .gallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.gallery figcaption{font-size:.7rem;color:var(--muted);display:flex;justify-content:space-between;margin-top:.2rem}
.gallery.sm{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}
.timeline{list-style:none;margin:0;padding:0 0 0 .9rem;border-left:2px solid var(--line);max-height:380px;overflow:auto}
.timeline li{position:relative;padding:.1rem 0 .7rem .3rem;font-size:.86rem}
.timeline li:before{content:"";position:absolute;left:-1.23rem;top:.35rem;width:9px;height:9px;border-radius:50%;background:#c3cad6;border:2px solid #fff}
.inc{padding:.5rem .6rem;border-radius:8px;background:#f7f8fa;margin-bottom:.5rem;font-size:.9rem}
.inc.open{background:var(--bad-bg)}
.inc-card.open{border-left:4px solid var(--bad)} .inc-card header{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:.4rem}

/* Hoja de ruta */
.route-sheet{padding:1.1rem}
.rs-head{display:flex;justify-content:space-between;gap:1rem;border-bottom:2px solid var(--navy);padding-bottom:.6rem;margin-bottom:.6rem}
.rs-head h2{font-size:1.25rem;margin:0} .rs-head h2 small{font-size:.8rem;font-weight:500;color:var(--muted)}
.rs-meta{text-align:right;display:flex;flex-direction:column}
.tbl.route td.sign{width:190px;border-left:1px dashed #cfd4dd} .tbl.route tr.done td{color:#7a8396;background:#f6fbf8}
.rs-foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:1rem;font-size:.85rem;color:#46506a}

/* Login */
body.login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(1200px 600px at 10% -10%,#2a3f63,var(--navy));padding:1rem}
.login-card{background:#fff;border-radius:14px;padding:1.6rem;width:min(380px,100%);display:grid;gap:.9rem;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.brand.big{padding:0 0 .4rem} .brand.big b{color:var(--ink);font-size:1.3rem} .brand.big small{color:var(--muted)}

/* ============ Portal chofer (móvil) ============ */
body.mobile{background:#eef0f4;padding-bottom:env(safe-area-inset-bottom)}
.m-top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:.7rem;padding:.7rem 1rem;padding-top:calc(.7rem + env(safe-area-inset-top));background:var(--navy);color:#fff}
.m-back{color:#fff;font-size:1.8rem;line-height:1;text-decoration:none!important;padding:0 .3rem 0 0}
.m-title{flex:1;min-width:0} .m-title b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .m-title small{color:#9fb0cc;font-size:.75rem}
.m-out{color:#ffb88a;font-size:.85rem}
.m-content{padding:.8rem;max-width:640px;margin:0 auto}
.m-hello{display:flex;flex-direction:column;padding:.2rem .2rem .7rem} .m-hello span{color:var(--muted);font-size:.84rem}
.m-tabs{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border-radius:10px;padding:4px;gap:4px;margin-bottom:.8rem;box-shadow:var(--sh)}
.m-tabs a{text-align:center;padding:.55rem .2rem;border-radius:7px;color:#46506a;font-size:.82rem;font-weight:600;text-decoration:none}
.m-tabs a b{display:block;font-size:1.15rem;color:var(--ink)}
.m-tabs a.on{background:var(--navy);color:#fff} .m-tabs a.on b{color:#fff}
.m-empty{text-align:center;padding:2.5rem 1rem;color:var(--muted);background:#fff;border-radius:12px}
.m-card{background:#fff;border-radius:12px;margin-bottom:.75rem;box-shadow:var(--sh);border-left:5px solid #c9cfda;overflow:hidden}
.m-card.urge{border-left-color:var(--accent)} .m-card.cold{border-left-color:var(--cold)} .m-card.urge.cold{border-left-color:var(--accent)}
.m-card-main{display:block;padding:.8rem .9rem .6rem;color:var(--ink);text-decoration:none!important}
.m-row{display:flex;justify-content:space-between;gap:.5rem;align-items:flex-start}
.m-client{font-weight:800;font-size:1.05rem}
.m-pick{margin:.3rem 0 .15rem;font-size:.92rem}
.m-meta{display:flex;gap:.8rem;flex-wrap:wrap;font-size:.85rem;color:#46506a;margin-bottom:.3rem}
.m-note{font-size:.84rem;background:#fff8e6;border-radius:6px;padding:.35rem .5rem;margin:.3rem 0}
.m-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:.4rem;padding:.2rem .9rem .8rem}
.m-actions .btn{min-height:44px}
.m-done{padding:.3rem .9rem .8rem;color:var(--ok);font-size:.86rem;font-weight:600}
.m-detail,.m-block{background:#fff;border-radius:12px;padding:.9rem;margin-bottom:.8rem;box-shadow:var(--sh)}
.m-detail dl{display:grid;grid-template-columns:96px 1fr;gap:.5rem .6rem;margin:.7rem 0 0}
.m-detail dt{color:var(--muted);font-size:.8rem;font-weight:600} .m-detail dd{margin:0}
.m-detail dd.hl{background:#fff8e6;padding:.3rem .45rem;border-radius:6px}
.m-form{display:grid;gap:.75rem}
.m-form input:not([type=checkbox]):not([type=file]),.m-form select,.m-form textarea{min-height:46px;font-size:16px}
.photo-pick{background:var(--accent-2);border:2px dashed #ffb88a;border-radius:10px;padding:.8rem;text-align:center;color:#a4460b}
.photo-pick input{margin-top:.5rem;width:100%;font-size:.9rem}
.preview{display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem} .preview img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px}
.gps-status{margin:0}

/* Responsive */
@media (max-width:1100px){.grid-main{grid-template-columns:1fr}}
@media (max-width:900px){
  .side{position:fixed;left:0;top:0;bottom:0;z-index:50;transform:translateX(-100%);transition:transform .2s}
  body.nav-open .side{transform:none} body.nav-open .scrim{display:block;position:fixed;inset:0;background:rgba(10,15,25,.4);z-index:40}
  .burger{display:block} .top{padding:.6rem .8rem;gap:.5rem} .top-search{display:none}
  .content{padding:.9rem .8rem 3rem}
  .grid-2{grid-template-columns:1fr} .span-2{grid-column:auto}
  .toolbar.sticky{top:53px}
  .form-grid,.form-grid fieldset{grid-template-columns:1fr} .col-2,.form-grid fieldset{grid-column:auto}
  .filters label{flex:1 1 45%} .filters .actions{margin-left:0}
}

/* Impresión */
@media print{
  @page{size:landscape;margin:10mm}
  body{background:#fff} .side,.top,.no-print,.toolbar,.filters,.scrim{display:none!important}
  .content{padding:0;max-width:none} .card{box-shadow:none;border:0;padding:0}
  .route-sheet{page-break-after:always} .route-sheet:last-of-type{page-break-after:auto}
  .tbl th{position:static} .tbl td,.tbl th{font-size:10.5pt}
  a{color:inherit} .badge{border:1px solid #999}
}
