:root{
  --brand:#1a7a3c; --brand-dark:#145e2e; --brand-light:#e8f5ee;
  --surface:#fff; --surface2:#f4f7f5; --border:#e3e8e4; --border2:#cfd8d1;
  --text:#1f2a22; --text2:#6b7a70;
  --font:'DM Sans',system-ui,sans-serif; --display:'Syne',sans-serif;
  --radius:14px; --radius-sm:10px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0}
body{font-family:var(--font);color:var(--text);background:var(--surface2);min-height:100vh;}

/* Topbar */
.ch-top{position:sticky;top:0;z-index:30;background:var(--brand);color:#fff;display:flex;align-items:center;gap:10px;padding:11px 14px;box-shadow:0 2px 10px rgba(0,0,0,.08);}
.ch-burger{background:none;border:none;padding:4px;cursor:pointer;display:flex;}
.ch-burger svg{width:24px;height:24px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;}
.ch-top .tt{font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:.3px;}
.ch-cab{margin-left:auto;text-align:right;font-size:11.5px;line-height:1.3;opacity:.95;}
.ch-cab b{font-weight:700;}

/* Drawer menu */
.ch-scrim{position:fixed;inset:0;background:rgba(0,0,0,.4);opacity:0;visibility:hidden;transition:.2s;z-index:40;}
.ch-scrim.open{opacity:1;visibility:visible;}
.ch-drawer{position:fixed;top:0;left:0;bottom:0;width:260px;max-width:82%;background:var(--surface);z-index:50;transform:translateX(-100%);transition:transform .22s;display:flex;flex-direction:column;}
.ch-drawer.open{transform:translateX(0);}
.ch-drawer .dh{background:var(--brand);color:#fff;padding:18px 16px;}
.ch-drawer .dh .n{font-family:var(--display);font-weight:700;font-size:17px;}
.ch-drawer .dh .s{font-size:12px;opacity:.9;margin-top:3px;}
.ch-drawer a{display:flex;align-items:center;gap:12px;padding:14px 16px;text-decoration:none;color:var(--text);font-size:14px;font-weight:600;border-bottom:.5px solid var(--border);}
.ch-drawer a.act{background:var(--brand-light);color:var(--brand-dark);}
.ch-drawer a svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.ch-drawer a.salir{margin-top:auto;color:#b91c1c;border-top:.5px solid var(--border);border-bottom:none;}

.ch-main{padding:14px;max-width:720px;margin:0 auto;}

/* Encabezado de listado */
.ch-count{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 12px;}
.ch-count .t{font-family:var(--display);font-weight:700;font-size:16px;}
.ch-count .b{background:var(--brand);color:#fff;border-radius:20px;padding:3px 12px;font-size:13px;font-weight:700;}

/* Filtro fecha (histórico) */
.ch-filtro{display:flex;gap:8px;align-items:flex-end;margin-bottom:12px;flex-wrap:wrap;}
.ch-filtro label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;color:var(--text2);margin-bottom:4px;}
.ch-input{height:40px;border:.5px solid var(--border2);border-radius:var(--radius-sm);padding:0 12px;font-family:var(--font);font-size:15px;color:var(--text);background:var(--surface);outline:none;width:100%;}
.ch-input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(26,122,60,.12);}
.ch-btn{height:44px;padding:0 18px;background:var(--brand);color:#fff;border:none;border-radius:var(--radius-sm);font-family:var(--font);font-size:15px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.ch-btn:active{background:var(--brand-dark);}

/* Tarjeta de pedido */
.ped{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:12px;box-shadow:0 1px 4px rgba(0,0,0,.04);}
.ped .top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
.ped .cli{font-weight:700;font-size:15px;line-height:1.3;}
.ped .hora{flex-shrink:0;font-size:12px;color:var(--text2);text-align:right;white-space:nowrap;}
.ped .dir{margin-top:4px;font-size:13.5px;color:var(--text);line-height:1.4;}
.ped .dir a.map{color:var(--brand);text-decoration:none;font-weight:600;}
.ped .fono{margin-top:3px;font-size:13px;}
.ped .fono a{color:var(--brand);text-decoration:none;font-weight:700;}
.ped .cil{margin-top:8px;font-size:13.5px;background:var(--surface2);border-radius:var(--radius-sm);padding:8px 10px;}
.ped .cia{display:inline-block;background:var(--brand-light);color:var(--brand-dark);border-radius:6px;padding:1px 7px;font-size:11px;font-weight:700;margin-right:6px;}
.ped .pie{margin-top:9px;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;}
.ped .total{font-weight:800;font-size:17px;color:var(--brand-dark);}
.ped .pago{font-size:12px;color:var(--text2);font-weight:600;text-align:right;}
.ped .chips{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap;}
.ped .chip{border-radius:20px;padding:2px 9px;font-size:11px;font-weight:700;}
.chip-entrega{background:#fef3c7;color:#92400e;}
.chip-estado{background:#eef2ff;color:#3730a3;}
.chip-anula{background:#fee2e2;color:#b91c1c;}
.chip-canal{background:var(--surface2);color:var(--text2);}
.ped .motivo{margin-top:6px;color:#b91c1c;font-weight:700;font-size:12.5px;}
.ch-vacio{text-align:center;color:var(--text2);padding:40px 10px;font-size:14px;}

/* Login */
.lg-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;}
.lg-logo{width:92px;height:92px;border-radius:22px;background:linear-gradient(135deg,#1a7a3c,#2aaa5a);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(26,122,60,.3);margin-bottom:14px;}
.lg-logo svg{width:52px;height:52px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.lg-title{font-family:var(--display);font-weight:700;font-size:22px;letter-spacing:1px;color:var(--brand-dark);}
.lg-sub{color:var(--text2);font-size:13px;margin:2px 0 18px;}
.lg-card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius);padding:20px;width:100%;max-width:360px;box-shadow:0 10px 30px rgba(0,0,0,.06);}
.lg-card .field{margin-bottom:14px;}
.lg-card label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;color:var(--text2);margin-bottom:6px;}
.lg-err{background:#fef2f2;border:.5px solid #fecaca;color:#dc2626;border-radius:var(--radius-sm);padding:9px 12px;font-size:13px;margin-bottom:14px;text-align:center;}
.ch-foot{text-align:center;color:var(--text2);font-size:11.5px;padding:16px;}

/* Mensaje de resultado */
.ch-msg{margin:0 0 12px;padding:10px 14px;border-radius:var(--radius-sm);font-size:13.5px;font-weight:600;}
.ch-msg.ok{background:var(--brand-light);border:.5px solid rgba(26,122,60,.3);color:var(--brand-dark);}
.ch-msg.err{background:#fef2f2;border:.5px solid #fecaca;color:#b91c1c;}

/* Barra de acciones de la tarjeta */
.ped-acc{margin-top:10px;padding-top:10px;border-top:.5px solid var(--border);display:flex;gap:10px;justify-content:flex-end;align-items:center;}
.acc{width:46px;height:40px;border-radius:var(--radius-sm);border:.5px solid var(--border2);background:var(--surface);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0;}
.acc svg{width:21px;height:21px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.acc-map{border-color:#bfdbfe;background:#eff6ff;} .acc-map svg{stroke:#1d4ed8;}
.acc-ok{border-color:rgba(26,122,60,.3);background:var(--brand-light);} .acc-ok svg{stroke:var(--brand);stroke-width:2.6;}
.acc-no{border-color:#fecaca;background:#fef2f2;} .acc-no svg{stroke:#dc2626;}
.acc:active{transform:scale(.95);}

/* Modal (reusa .ch-scrim / .ch-scrim.open) */
.ch-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-48%) scale(.98);z-index:60;width:92%;max-width:380px;background:var(--surface);border-radius:var(--radius);overflow:hidden;opacity:0;visibility:hidden;transition:.18s;}
.ch-modal.open{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1);}
.ch-modal .mh{background:var(--brand);color:#fff;font-family:var(--display);font-weight:700;font-size:15px;padding:14px 16px;}
.ch-modal .mb{padding:16px;}
.ch-modal .mf{display:flex;gap:10px;justify-content:flex-end;margin-top:16px;}
.ch-btn.ghost{background:var(--surface2);color:var(--text2);border:.5px solid var(--border2);}
.ch-btn.danger{background:#dc2626;}
.ch-btn.danger:active{background:#b91c1c;}