/* CBX Picking Lite - UI (admin + shortcode) */
.cbxpl-wrap{
  max-width: 1480px;
  margin: 20px auto;
  padding: 0 12px;
  box-sizing: border-box;
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,"Helvetica Neue",Arial,sans-serif;
  color:#111;
}

.cbxpl-topbar{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:14px;
  padding:14px;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
  margin-bottom: 14px;
}

.cbxpl-topbar__row{
  display:flex;
  gap:12px;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
}

.cbxpl-order-input{
  display:flex;
  gap:10px;
  align-items:flex-end;
  flex-wrap:wrap;
}
.cbxpl-order-input label{
  font-size:12px;
  color:#555;
  display:block;
}
#cbxpl-order-id{
  height:38px;
  border-radius:10px;
  border:1px solid #d0d0d0;
  padding:0 10px;
  width:160px;
  font-size:14px;
  background:#fff;
}
.cbxpl-save-indicator{
  font-size:12px;
  color:#666;
  min-height: 18px;
  text-align:right;
}

.cbxpl-topbar__ext{
  margin-top: 10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.cbxpl-empty{
  background:#fff;
  border:1px dashed #d6d6d6;
  border-radius:14px;
  padding:22px;
}

.cbxpl-orderbar{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:14px;
  padding:14px;
  margin-bottom: 14px;
}

.cbxpl-chips{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom: 12px;
}
.cbxpl-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border:1px solid #efefef;
  border-radius:999px;
  background:#fafafa;
  font-size:13px;
  color:#222;
  white-space:nowrap;
}
.cbxpl-chip b{font-weight:700}
.cbxpl-chip--link{
  text-decoration:none;
  border-color:#dbeafe;
  background:#eff6ff;
}
.cbxpl-chip--link:hover{background:#dbeafe}

.cbxpl-progress__bar{
  height:10px;
  background:#f3f4f6;
  border-radius:999px;
  overflow:hidden;
}
.cbxpl-progress__fill{
  height:100%;
  background:#2563eb;
  border-radius:999px;
  width:0%;
}

.cbxpl-scanrow{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:14px;
  padding:14px;
  margin-bottom: 14px;
  display:flex;
  gap:14px;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
}

.cbxpl-scanrow__input{
  flex: 1 1 520px;
  min-width: 280px;
}
.cbxpl-scanrow__input label{
  display:block;
  font-size:12px;
  color:#555;
  margin-bottom:6px;
}
#cbxpl-scan-input{
  width:100%;
  height:46px;
  border-radius:12px;
  border:1px solid #d0d0d0;
  padding:0 12px;
  font-size:16px;
  outline:none;
}
#cbxpl-scan-input:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.15);
}
#cbxpl-btn-pick{
  margin-top: 0;
  height:46px;
  border-radius:12px;
  width: 92px;
  flex: 0 0 auto;
}

.cbxpl-scanrow__opts{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.cbxpl-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:#333;
  user-select:none;
}
#cbxpl-opt-fixqty-val{
  width:90px;
  height:46px;
  border-radius:10px;
  border:1px solid #d0d0d0;
  padding:0 10px;
}
#cbxpl-opt-fixqty-val:disabled{opacity:.6}

.cbxpl-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}

@media (max-width: 960px){
  .cbxpl-grid{grid-template-columns: 1fr;}
  #cbxpl-btn-pick{width:100%}
}

.cbxpl-col{
  background:#fff;
  border:1px solid #e6e6e6;
  border-radius:14px;
  overflow:hidden;
}
.cbxpl-col__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-bottom:1px solid #f0f0f0;
}
.cbxpl-col__head h3{
  margin:0;
  font-size:14px;
  letter-spacing:.4px;
}
.cbxpl-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 28px;
  height: 22px;
  padding:0 8px;
  border-radius:999px;
  background:#111827;
  color:#fff;
  font-weight:700;
  font-size:12px;
}

.cbxpl-list{
  padding:8px;
  display:flex;
  flex-direction:column;
  gap:8px;
  max-height: 68vh;
  overflow:auto;
}

/* Item card */
.cbxpl-item{
  border:1px solid #ededed;
  border-radius:12px;
  padding:10px;
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.cbxpl-item--complete{border-color: rgba(16,185,129,.55); background: rgba(16,185,129,.06);}
.cbxpl-item--partial{border-color: rgba(59,130,246,.55); background: rgba(59,130,246,.06);}
.cbxpl-item--serial{border-color: rgba(245,158,11,.65); background: rgba(245,158,11,.07);}
.cbxpl-item--errorflash{animation: cbxplShake .25s linear;}
@keyframes cbxplShake{0%{transform:translateX(0)}25%{transform:translateX(-2px)}50%{transform:translateX(2px)}75%{transform:translateX(-2px)}100%{transform:translateX(0)}}

.cbxpl-item__img{
  width:40px;
  height:40px;
  border-radius:10px;
  background:#f3f4f6;
  overflow:hidden;
  flex: 0 0 40px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.cbxpl-item__img img{width:100%;height:100%;object-fit:cover}

.cbxpl-item__body{flex:1;min-width:0}
.cbxpl-item__title{
  font-size:14px;
  font-weight:700;
  margin:0 0 4px 0;
  color:#111;
  line-height:1.25;
}
.cbxpl-item__meta{
  font-size:12px;
  color:#444;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.cbxpl-item__meta code{
  font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size:12px;
  background:#f3f4f6;
  padding:2px 6px;
  border-radius:8px;
}
.cbxpl-item__meta .cbxpl-loc{
  color:#111827;
  background:#f9fafb;
  border:1px solid #f0f0f0;
  padding:2px 6px;
  border-radius:8px;
}

.cbxpl-item__right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
  flex:0 0 auto;
}
.cbxpl-item__qty{
  font-weight:800;
  font-size:14px;
  color:#111;
}
.cbxpl-minirow{
  display:flex;
  gap:8px;
  align-items:center;
}

.cbxpl-minibtn{
  border:none;
  background:transparent;
  cursor:pointer;
  padding:2px 4px;
  border-radius:8px;
  color:#111;
  opacity:.65;
  font-size:16px;
}
.cbxpl-minibtn:hover{opacity:1;background:#f3f4f6}

.cbxpl-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
  border:1px solid #e5e7eb;
  background:#fff;
  color:#111;
  cursor:pointer;
  user-select:none;
}
.cbxpl-pill--serial{border-color: rgba(245,158,11,.7); background: rgba(245,158,11,.1);}
.cbxpl-pill--skip{border-color: rgba(107,114,128,.55); background: rgba(107,114,128,.08); cursor:default;}

.cbxpl-footer-ext{margin-top: 12px}

/* Modal */
.cbxpl-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;padding:16px}
.cbxpl-modal.is-hidden{display:none}
.cbxpl-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.cbxpl-modal__panel{
  position:relative;
  background:#fff;
  width:min(900px, 96vw);
  border-radius:16px;
  border:1px solid #e6e6e6;
  box-shadow:0 12px 40px rgba(0,0,0,.2);
  overflow:hidden;
}
@media (max-width: 720px){
  .cbxpl-modal{padding:0}
  .cbxpl-modal__panel{width:100vw;height:100vh;border-radius:0}
}

.cbxpl-modal__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid #f0f0f0;
}
.cbxpl-modal__title{font-weight:800;font-size:16px;margin:0}
.cbxpl-modal__subtitle{font-size:12px;color:#666;margin-top:2px}
.cbxpl-iconbtn{
  border:none;background:transparent;font-size:22px;cursor:pointer;opacity:.65;
  width:40px;height:40px;border-radius:12px;
}
.cbxpl-iconbtn:hover{opacity:1;background:#f3f4f6}

.cbxpl-modal__body{padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.cbxpl-serial-input{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#cbxpl-serial-input{
  flex:1;
  height:46px;
  border-radius:12px;
  border:1px solid #d0d0d0;
  padding:0 12px;
  font-size:16px;
}
#cbxpl-serial-input:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.15);outline:none}

.cbxpl-serial-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cbxpl-serial-list{display:flex;flex-direction:column;gap:8px;max-height: 45vh;overflow:auto;border-top:1px dashed #eee;padding-top:10px}
.cbxpl-serial-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  border:1px solid #f0f0f0;border-radius:12px;padding:10px;
}
.cbxpl-serial-row code{font-size:13px;background:#f3f4f6;padding:4px 8px;border-radius:10px}
.cbxpl-serial-actions{display:flex;gap:8px}
.cbxpl-serial-actions button{height:32px;border-radius:10px}

.cbxpl-modal__foot{padding:14px 16px;border-top:1px solid #f0f0f0;display:flex;justify-content:flex-end;gap:10px}
.cbxpl-modal__foot--inline{justify-content:flex-start}

/* Bulk modal */
.cbxpl-bulk-grid{display:grid;grid-template-columns:1fr 160px;gap:12px}
@media(max-width:720px){.cbxpl-bulk-grid{grid-template-columns:1fr}}
.cbxpl-bulk-grid label{display:block;font-size:12px;color:#555;margin-bottom:6px}
#cbxpl-bulk-sku, #cbxpl-bulk-qty{
  width:100%;height:46px;border-radius:12px;border:1px solid #d0d0d0;padding:0 12px;font-size:16px;
}

/* Small toast */
.cbxpl-toast{
  position:fixed;
  right:14px;
  bottom:14px;
  z-index: 10000;
  background:#111827;
  color:#fff;
  padding:10px 12px;
  border-radius:12px;
  font-size:13px;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
  max-width: 92vw;
}


/* Input error feedback */
#cbxpl-scan-input.cbxpl-item--errorflash{
  border-color:#ef4444 !important;
  box-shadow:0 0 0 3px rgba(239,68,68,.15) !important;
}


/* Minimal buttons */
.cbxpl-wrap .button,
.cbxpl-wrap button.button{
  border-radius:12px !important;
  box-shadow:none !important;
  text-shadow:none !important;
  font-weight:700 !important;
}
.cbxpl-wrap .button.button-primary{
  background:#2563eb !important;
  border-color:#2563eb !important;
}
.cbxpl-wrap .button.button-primary:hover{ background:#1d4ed8 !important; border-color:#1d4ed8 !important; }
.cbxpl-wrap .button:hover{ filter:none; }

/* Scan row layout: one line */
.cbxpl-scanrow{
  align-items:center;
}
.cbxpl-scanrow__input label{ display:none; }

.cbxpl-scanrow--oneline{ flex-wrap: wrap; }
.cbxpl-scanrow--oneline .cbxpl-scanrow__input{ flex: 1 1 520px; min-width: 240px; }
.cbxpl-scanrow--oneline .cbxpl-toggle{ white-space:nowrap; }