*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#f5f6f8;color:#17191c}.muted{color:#6e747c}.topbar{height:78px;background:#fff;border-bottom:1px solid #e6e8eb;display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:5}.topbar h1{font-size:25px;margin:2px 0 0}.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.13em;font-weight:700;color:#7a8088}.topbar-actions{display:flex;align-items:center;gap:12px}.branch-pill{background:#f0f2f5;border:1px solid #e2e5e9;padding:8px 12px;border-radius:999px;font-size:13px}.user-name{font-size:14px;font-weight:600}.layout{display:grid;grid-template-columns:minmax(0,1fr) 430px;min-height:calc(100vh - 78px)}.content{padding:24px 28px}.detail-panel{background:#fff;border-left:1px solid #e3e6e9;padding:24px;min-height:calc(100vh - 78px)}.tabs{display:flex;gap:8px;margin-bottom:22px}.tab{border:0;background:transparent;padding:10px 14px;border-radius:10px;font-size:14px;font-weight:700;color:#666d75;cursor:pointer}.tab.active{background:#17191c;color:#fff}.count{display:inline-flex;min-width:22px;height:22px;border-radius:999px;align-items:center;justify-content:center;background:rgba(127,127,127,.16);font-size:12px;margin-left:5px}.orders-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.order-card{background:#fff;border:1px solid #e2e5e8;border-radius:16px;padding:17px;cursor:pointer;transition:.15s ease}.order-card:hover,.order-card.selected{border-color:#9da3aa;box-shadow:0 6px 18px rgba(20,25,30,.06)}.card-top{display:flex;justify-content:space-between;gap:10px}.order-number{font-weight:800;font-size:15px}.age{font-size:12px;color:#777d84}.customer{font-size:18px;font-weight:700;margin:13px 0 5px}.meta{font-size:13px;color:#687079}.card-total{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid #edf0f2;margin-top:14px;padding-top:13px}.money{font-size:21px;font-weight:800}.service{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.detail-empty{text-align:center;padding-top:22vh}.detail-icon{font-size:36px;color:#a6abb1}.detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.detail-header h2{margin:2px 0 4px;font-size:24px}.status-chip{padding:7px 10px;border-radius:999px;background:#f1f3f5;font-size:12px;font-weight:700}.section{padding:18px 0;border-bottom:1px solid #eceff1}.section h3{font-size:12px;text-transform:uppercase;letter-spacing:.09em;color:#747a81;margin:0 0 12px}.item-row,.total-row{display:flex;justify-content:space-between;gap:15px;margin:8px 0}.item-name{font-weight:650}.item-sub{font-size:12px;color:#7a8087}.total-row.grand{font-size:18px;font-weight:800;margin-top:13px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:20px}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;padding:10px 14px;text-decoration:none;border:1px solid #d9dde1;background:#fff;color:#222;font-weight:700;font-size:14px;cursor:pointer}.btn.primary{background:#17191c;color:white;border-color:#17191c}.btn.danger{background:#fff;color:#9c2828;border-color:#e5bcbc}.btn.ghost{padding:8px 11px}.btn.full{width:100%}.queue-message{margin:30px 0}.alert{padding:10px 12px;border-radius:10px;margin:12px 0;font-size:13px}.alert.error{background:#fff0f0;color:#8d2929;border:1px solid #f1cccc}.login-body{min-height:100vh;display:grid;place-items:center;background:#f3f5f7}.login-card{width:min(390px,calc(100vw - 32px));background:#fff;padding:34px;border:1px solid #e2e5e8;border-radius:20px;box-shadow:0 12px 35px rgba(10,15,20,.08)}.brand-mark{width:46px;height:46px;border-radius:14px;background:#17191c;color:#fff;display:grid;place-items:center;font-weight:900}.login-card h1{margin:18px 0 4px}.login-form{display:grid;gap:15px;margin-top:24px}.login-form label{font-size:13px;font-weight:700;display:grid;gap:7px}.login-form input{height:44px;border:1px solid #ccd1d6;border-radius:10px;padding:0 12px;font-size:15px}.notes-box{width:100%;min-height:70px;border:1px solid #d8dce0;border-radius:10px;padding:10px;resize:vertical}@media(max-width:900px){.layout{grid-template-columns:1fr}.detail-panel{border-left:0;border-top:1px solid #e3e6e9;min-height:auto}.topbar{padding:0 16px}.content{padding:18px 16px}.user-name,.branch-pill{display:none}}
.wait-time{margin-top:7px}.branch-status-button{cursor:pointer;font-family:inherit}.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#28a267;margin-right:6px}.status-dot[data-status="high_demand"]{background:#e4a11b}.status-dot[data-status="pickup_only"],.status-dot[data-status="delivery_only"]{background:#3a78c2}.status-dot[data-status="paused"],.status-dot[data-status="closed_today"]{background:#c44242}.time-editor{display:flex;gap:8px;align-items:center}.time-editor input{width:72px;height:38px;border:1px solid #d5d9dd;border-radius:9px;padding:0 8px}.modal-backdrop{position:fixed;inset:0;background:rgba(20,24,28,.4);display:grid;place-items:center;z-index:30;padding:20px}.modal-backdrop.hidden{display:none}.modal-card{width:min(520px,100%);background:#fff;border-radius:18px;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.18);display:grid;gap:16px}.modal-header{display:flex;align-items:flex-start;justify-content:space-between}.modal-header h2{margin:4px 0}.modal-card label{display:grid;gap:7px;font-size:13px;font-weight:700}.modal-card input,.modal-card select{height:42px;border:1px solid #d1d6db;border-radius:10px;padding:0 10px;background:#fff}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-actions{display:flex;justify-content:flex-end}.icon-btn{border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#737980}

.btn:disabled{opacity:.55;cursor:not-allowed}.branch-status-button:disabled{opacity:.65;cursor:wait}

.availability-modal-card{width:min(760px,100%);max-height:90vh;overflow:auto}.availability-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.availability-form>label{display:grid;gap:7px;font-size:13px;font-weight:700}.availability-form>button{align-self:end}.availability-blocks{display:grid;gap:9px}.availability-block{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border:1px solid #e1e5e8;border-radius:12px}.courier-assign{display:flex;gap:8px;margin-top:12px}.courier-assign select{flex:1;height:40px;border:1px solid #d3d8dc;border-radius:9px;padding:0 8px}.hidden{display:none!important}@media(max-width:700px){.availability-form{grid-template-columns:1fr}}

.courier-assign .btn:disabled{opacity:.45;cursor:not-allowed}

:root{--blue:#2563eb;--blue-bg:#eff6ff;--orange:#d97706;--orange-bg:#fff7ed;--green:#15803d;--green-bg:#f0fdf4;--red:#b91c1c;--red-bg:#fef2f2}
.btn.info{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.primary{background:var(--green);border-color:var(--green)}
.btn.danger{background:var(--red-bg);border-color:#fecaca;color:var(--red)}
.status-chip{border:1px solid transparent}
.status-new{background:var(--blue-bg);color:var(--blue);border-color:#bfdbfe}
.status-accepted{background:#eef2ff;color:#4f46e5;border-color:#c7d2fe}
.status-preparing{background:var(--orange-bg);color:var(--orange);border-color:#fed7aa}
.status-ready{background:var(--green-bg);color:var(--green);border-color:#bbf7d0}
.status-out_for_delivery{background:var(--blue-bg);color:var(--blue);border-color:#bfdbfe}
.status-completed{background:var(--green-bg);color:var(--green);border-color:#bbf7d0}
.status-rejected,.status-cancelled{background:var(--red-bg);color:var(--red);border-color:#fecaca}
.order-card.status-new{border-left:4px solid var(--blue)}
.order-card.status-preparing{border-left:4px solid var(--orange)}
.order-card.status-ready,.order-card.status-completed{border-left:4px solid var(--green)}
.order-card.status-out_for_delivery{border-left:4px solid var(--blue)}
.delivery-chip{display:inline-flex;padding:3px 8px;border-radius:999px;font-size:12px;font-weight:800}
.delivery-assigned{background:var(--blue-bg);color:var(--blue)}
.delivery-picked_up{background:var(--orange-bg);color:var(--orange)}
.delivery-delivered{background:var(--green-bg);color:var(--green)}
.delivery-cancelled{background:var(--red-bg);color:var(--red)}
.metrics-modal-card{width:min(850px,100%);max-height:90vh;overflow:auto}
.metrics-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.metric-card{padding:16px;border-radius:14px;border:1px solid #e5e7eb}
.metric-card span{display:block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.metric-card strong{display:block;font-size:28px;margin-top:5px}
.metric-blue{background:var(--blue-bg);color:var(--blue)}
.metric-orange{background:var(--orange-bg);color:var(--orange)}
.metric-green{background:var(--green-bg);color:var(--green)}
.metrics-couriers{display:grid;gap:12px}
.courier-metric-row{border:1px solid #e5e7eb;border-radius:14px;padding:16px}
.courier-metric-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.courier-times{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.courier-times>div{background:#f8fafc;border-radius:10px;padding:10px}
.courier-times span{display:block;font-size:11px;color:#64748b}
.courier-times strong{display:block;margin-top:4px}
@media(max-width:700px){.metrics-summary,.courier-times{grid-template-columns:1fr}}


/* v1.3.1 — detalle responsivo */
.layout{
  grid-template-columns:minmax(0,1fr);
  position:relative;
}
.detail-panel{
  display:none;
  position:relative;
}
body.detail-open .layout{
  grid-template-columns:minmax(0,1fr) 430px;
}
body.detail-open .detail-panel{
  display:block;
}
.detail-close{
  position:absolute;
  top:10px;
  right:10px;
  z-index:2;
}
body.detail-open .detail-header{
  padding-right:28px;
}
.tabs{
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  padding-bottom:4px;
}
.tab{
  flex:0 0 auto;
  white-space:nowrap;
}

/* En ventana reducida el detalle se convierte en panel lateral flotante,
   para que las pestañas y tarjetas conserven todo el ancho disponible. */
@media (max-width:1280px){
  body.detail-open .layout{
    grid-template-columns:minmax(0,1fr);
  }
  body.detail-open .detail-panel{
    display:block;
    position:fixed;
    top:78px;
    right:0;
    bottom:0;
    width:min(430px,92vw);
    min-height:0;
    overflow-y:auto;
    z-index:20;
    border-left:1px solid #e3e6e9;
    border-top:0;
    box-shadow:-12px 0 32px rgba(20,25,30,.12);
  }
}

/* Tablet / móvil: panel de detalle de ancho completo y barra superior adaptable. */
@media (max-width:900px){
  .topbar{
    height:auto;
    min-height:70px;
    padding:12px 16px;
    gap:12px;
    align-items:flex-start;
  }
  .topbar h1{font-size:21px}
  .topbar-actions{
    margin-left:auto;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:7px;
  }
  .user-name{display:none}
  .branch-pill{
    display:inline-flex;
    font-size:12px;
    padding:7px 9px;
  }
  .btn.ghost{
    padding:7px 9px;
    font-size:12px;
  }
  .layout{
    min-height:calc(100vh - 70px);
  }
  .content{
    padding:16px 12px;
  }
  .tabs{
    gap:5px;
    margin-bottom:14px;
  }
  .tab{
    padding:9px 11px;
    font-size:13px;
  }
  body.detail-open .detail-panel{
    top:0;
    left:0;
    width:100vw;
    max-width:none;
    z-index:50;
    padding:20px 18px 28px;
    border:0;
    box-shadow:none;
  }
  .orders-grid{
    grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  }
}

@media (max-width:560px){
  .topbar{
    display:block;
  }
  .topbar-actions{
    margin-top:10px;
    justify-content:flex-start;
  }
  .orders-grid{
    grid-template-columns:1fr;
  }
  .detail-header{
    gap:10px;
  }
  .detail-header h2{
    font-size:21px;
  }
  .time-editor{
    flex-wrap:wrap;
  }
  .actions{
    grid-template-columns:1fr;
  }
  .courier-assign{
    flex-direction:column;
  }
  .courier-assign .btn{
    width:100%;
  }
}