@charset "utf-8";

/* cargo / cubic 공통 목록 — modern catalog */
.cb-list.bo_ulist{
  margin:0 0 18px;border:1px solid var(--line,#e5e7eb);border-radius:16px;overflow:hidden;
  background:var(--white,#fff);box-shadow:0 10px 30px -24px rgba(15,23,42,.35)
}
html[data-theme="dark"] .cb-list.bo_ulist{background:#111827;border-color:#374151;box-shadow:none}

.cb-list .cb-head,
.cb-list .bo_li_head.cb-head{
  display:flex;align-items:center;gap:14px;padding:12px 18px;
  background:linear-gradient(180deg,#f8fafc 0%,#f1f5f9 100%);
  border-bottom:1px solid var(--line,#e5e7eb);border-top:0;
  font-size:12px;font-weight:700;letter-spacing:.04em;color:#64748b
}
html[data-theme="dark"] .cb-list .cb-head,
html[data-theme="dark"] .cb-list .bo_li_head.cb-head{background:#1f2937;border-bottom-color:#374151;color:#94a3b8}

.cb-list .cb-li,
.cb-list .bo_li.cb-li{
  display:flex;align-items:center;gap:14px;padding:16px 18px;
  border-bottom:1px solid rgba(148,163,184,.18);border-left:0;
  background:var(--white,#fff);color:#334155;
  transition:background .18s ease,transform .18s ease
}
.cb-list .cb-li:last-child,
.cb-list .bo_li.cb-li:last-child{border-bottom:0}
.cb-list .cb-li:hover,
.cb-list .bo_li.cb-li:hover{background:#f8fafc}
.cb-list .cb-li.even,
.cb-list .bo_li.cb-li.even{background:var(--white,#fff)}
.cb-list .cb-li.is-current{background:var(--brand-light,#eff6ff)}
.cb-list .cb-li.is-cargo,
.cb-list .bo_li.cb-li.is-cargo{
  background:linear-gradient(90deg,rgba(16,185,129,.08),transparent 42%)
}
html[data-theme="dark"] .cb-list .cb-li,
html[data-theme="dark"] .cb-list .bo_li.cb-li,
html[data-theme="dark"] .cb-list .cb-li.even,
html[data-theme="dark"] .cb-list .bo_li.cb-li.even{background:#111827}
html[data-theme="dark"] .cb-list .cb-li:hover,
html[data-theme="dark"] .cb-list .bo_li.cb-li:hover{background:#1f2937}
html[data-theme="dark"] .cb-list .cb-li.is-cargo,
html[data-theme="dark"] .cb-list .bo_li.cb-li.is-cargo{
  background:linear-gradient(90deg,rgba(16,185,129,.16),transparent 48%)
}

.cb-list .cb-col-item{flex:1 1 auto;min-width:0}
.cb-list .cb-col-thumb{
  flex:0 0 72px;width:72px;height:72px;display:block;overflow:hidden;
  border-radius:12px;background:#f1f5f9;border:1px solid #e2e8f0;
  text-decoration:none;flex-shrink:0
}
.cb-list .cb-col-thumb img{
  display:block;width:100%;height:100%;object-fit:cover
}
.cb-list .cb-col-thumb.is-empty,
.cb-list .cb-thumb-placeholder{
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;color:#94a3b8;font-size:22px;background:#f8fafc
}
.cb-list .cb-head .cb-col-thumb{height:auto;border:0;background:transparent}
.cb-list .cb-col-group{flex:0 0 132px;font-size:13px;font-weight:600;color:#475569}
.cb-list .cb-col-size{flex:0 0 100px;text-align:center;font-size:13px;font-weight:700;color:#0f172a}
.cb-list .cb-col-add{flex:0 0 108px;text-align:right}
.cb-list .cb-col-vol{flex:0 0 128px;text-align:right;font-size:14px;font-weight:800;color:#0f172a;letter-spacing:-.02em}
.cb-list .cb-head .cb-col-item,
.cb-list .cb-head .cb-col-thumb,
.cb-list .cb-head .cb-col-group,
.cb-list .cb-head .cb-col-size,
.cb-list .cb-head .cb-col-add,
.cb-list .cb-head .cb-col-vol{padding-top:0}
html[data-theme="dark"] .cb-list .cb-col-thumb{background:#1f2937;border-color:#374151}
html[data-theme="dark"] .cb-list .cb-col-thumb.is-empty,
html[data-theme="dark"] .cb-list .cb-thumb-placeholder{background:#111827;color:#64748b}

.cb-list .cb-tags{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.cb-list .bo_cate_link,
.cb-list .cb-size,
.cb-list .cb-sot{
  display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:999px;
  font-size:11px;font-weight:700;line-height:1;text-decoration:none;letter-spacing:-.01em
}
.cb-list .bo_cate_link{background:rgba(37,99,235,.1);color:var(--brand,#2563eb)!important}
.cb-list .cb-size{background:#eef2ff;color:#4338ca}
.cb-list .cb-sot{background:#ecfdf5;color:#047857}
.cb-list .cb-name{
  display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px;
  font-size:16px;font-weight:800;line-height:1.35;letter-spacing:-.03em;
  color:#0f172a;text-decoration:none;word-break:break-word
}
.cb-list .cb-name:hover{color:var(--brand,#2563eb)}
.cb-list .cb-sub{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin-top:8px}
.cb-list .cb-code{
  display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;
  background:#f1f5f9;font-size:11px;font-weight:700;letter-spacing:.04em;color:#64748b;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace
}
.cb-list .cb-spec{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.cb-list .cb-spec li{
  display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:8px;
  background:#f8fafc;border:1px solid #e2e8f0;font-size:12px;color:#475569
}
.cb-list .cb-empty{color:#94a3b8;font-weight:500}
.cb-list .bo_li_empty{
  padding:56px 20px;text-align:center;color:#64748b;
  background:linear-gradient(180deg,#fff,#f8fafc);border:0
}
.cb-list .bo_li_empty a{color:var(--brand,#2563eb);font-weight:700;text-decoration:none}

.cb-add-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  min-width:88px;height:36px;padding:0 12px;border:1px solid #cbd5e1;border-radius:999px;
  background:#fff;color:#0f172a;font-size:13px;font-weight:700;cursor:pointer;
  box-shadow:0 1px 2px rgba(15,23,42,.04);transition:all .16s ease
}
.cb-add-btn:hover{border-color:var(--brand,#2563eb);color:var(--brand,#2563eb);background:#eff6ff;transform:translateY(-1px)}
.cb-add-on{display:none}
.cb-li.is-cargo .cb-add-btn{border-color:#86efac;background:#ecfdf5;color:#047857;box-shadow:none}
.cb-li.is-cargo .cb-add-off{display:none}
.cb-li.is-cargo .cb-add-on{display:inline-flex;align-items:center;gap:4px}
.cb-add-qty{font-style:normal}

.cb-qty{
  display:inline-flex;align-items:center;gap:0;padding:3px;border:1px solid #e2e8f0;border-radius:999px;background:#fff
}
.cb-qty-btn{
  width:30px;height:30px;border:0;border-radius:999px;background:#f1f5f9;color:#0f172a;
  font-size:16px;line-height:1;cursor:pointer;transition:background .15s
}
.cb-qty-btn:hover{background:#e2e8f0}
.cb-qty-num{min-width:28px;text-align:center;font-size:14px;font-weight:800;color:#0f172a}
.cb-del-btn{
  display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;margin-left:8px;
  border:0;border-radius:999px;background:#f1f5f9;color:#64748b;cursor:pointer;transition:all .15s
}
.cb-del-btn:hover{background:#fee2e2;color:#dc2626}
.cb-line-vol{font-variant-numeric:tabular-nums}

.cb-cargo-bar{
  display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px;padding:16px 18px;
  border:1px solid #a7f3d0;border-radius:16px;
  background:
    radial-gradient(120% 140% at 0% 0%,rgba(16,185,129,.18),transparent 55%),
    linear-gradient(135deg,#ecfdf5 0%,#f0fdf4 48%,#eff6ff 100%);
  color:#065f46;box-shadow:0 12px 28px -22px rgba(5,150,105,.55)
}
.cb-cargo-bar-txt{font-size:14px;line-height:1.45;letter-spacing:-.01em}
.cb-cargo-bar-txt strong{font-size:20px;font-weight:800;letter-spacing:-.03em;color:#047857}
.cb-cargo-bar-link{
  flex:0 0 auto;display:inline-flex;align-items:center;height:38px;padding:0 16px;border-radius:999px;
  background:#059669;color:#fff!important;font-weight:700;text-decoration:none;
  box-shadow:0 8px 18px -10px rgba(5,150,105,.9);transition:transform .15s,background .15s
}
.cb-cargo-bar-link:hover{background:#047857;transform:translateY(-1px);color:#fff!important}
html[data-theme="dark"] .cb-cargo-bar{
  background:linear-gradient(135deg,rgba(16,185,129,.18),rgba(37,99,235,.12));
  border-color:#065f46;color:#a7f3d0;box-shadow:none
}
html[data-theme="dark"] .cb-cargo-bar-txt strong{color:#6ee7b7}
html[data-theme="dark"] .cb-cargo-bar-link{background:#059669}

html[data-theme="dark"] .cb-list .cb-name{color:#f8fafc}
html[data-theme="dark"] .cb-list .cb-col-group,
html[data-theme="dark"] .cb-list .cb-col-size,
html[data-theme="dark"] .cb-list .cb-col-vol{color:#e2e8f0}
html[data-theme="dark"] .cb-list .bo_cate_link{background:rgba(96,165,250,.16);color:#93c5fd!important}
html[data-theme="dark"] .cb-list .cb-size{background:rgba(129,140,248,.18);color:#c7d2fe}
html[data-theme="dark"] .cb-list .cb-sot{background:rgba(16,185,129,.18);color:#6ee7b7}
html[data-theme="dark"] .cb-list .cb-code{background:#1f2937;color:#94a3b8}
html[data-theme="dark"] .cb-list .cb-spec li{background:#1f2937;border-color:#374151;color:#cbd5e1}
html[data-theme="dark"] .cb-add-btn{background:#1f2937;border-color:#475569;color:#e2e8f0}
html[data-theme="dark"] .cb-qty,
html[data-theme="dark"] .cb-qty-btn,
html[data-theme="dark"] .cb-del-btn{background:#1f2937;border-color:#374151;color:#e2e8f0}
html[data-theme="dark"] .cb-qty{border-color:#374151}
html[data-theme="dark"] .cb-qty-num{color:#f8fafc}
html[data-theme="dark"] .cb-list .bo_li_empty{background:#111827;color:#94a3b8}

@media (max-width:768px){
  .cb-list.bo_ulist{border-radius:14px}
  .cb-list .cb-head,
  .cb-list .bo_li_head.cb-head{display:none}
  .cb-list .cb-li,
  .cb-list .bo_li.cb-li{flex-wrap:wrap;row-gap:10px;padding:14px}
  .cb-list .cb-col-thumb{flex:0 0 64px;width:64px;height:64px;order:-1}
  .cb-list .cb-col-item{flex:1 1 calc(100% - 80px)}
  .cb-list .cb-col-group,
  .cb-list .cb-col-size,
  .cb-list .cb-col-add,
  .cb-list .cb-col-vol{flex:0 0 auto;padding-top:0;text-align:left;font-size:13px}
  .cb-list .cb-col-add{margin-left:auto}
  .cb-list .cb-col-vol{margin-left:auto;display:flex;align-items:center;gap:4px}
  .cb-list .cb-col-group::before,
  .cb-list .cb-col-size::before,
  .cb-list .cb-col-vol::before{content:attr(data-th) " · ";margin-right:2px;color:#94a3b8;font-weight:600}
  .cb-list .cb-name{font-size:15px}
  .cb-cargo-bar{flex-direction:column;align-items:flex-start}
  .cb-cargo-bar-link{width:100%;justify-content:center}
}

/* ---------- 상세: 품목 메타 / 부피 근거 ---------- */
.cv-meta{margin:8px 0 28px}
.cv-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.cv-chip{
  display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;
  border-radius:12px;border:1px solid #e2e8f0;background:#f8fafc;
  font-size:13px;line-height:1.2;color:#0f172a
}
.cv-chip em{
  font-style:normal;font-size:11px;font-weight:700;letter-spacing:.02em;
  color:#64748b
}
.cv-chip strong{font-weight:800;letter-spacing:-.02em}
.cv-chip-cate{background:rgba(37,99,235,.08);border-color:rgba(37,99,235,.22);color:#1d4ed8}
.cv-chip-cate em{color:#3b82f6}
.cv-chip-sot{background:#ecfdf5;border-color:#a7f3d0;color:#047857}
.cv-chip-sot em{color:#059669}
.cv-chip-group{background:#eef2ff;border-color:#c7d2fe;color:#3730a3}
.cv-chip-group em{color:#4f46e5}
.cv-chip-size{background:#fff7ed;border-color:#fed7aa;color:#c2410c}
.cv-chip-size em{color:#ea580c}
.cv-chip-code{background:#f1f5f9;border-color:#cbd5e1;color:#334155}
.cv-chip-code strong{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.04em}
.cv-chip-kg{background:#fef2f2;border-color:#fecaca;color:#b91c1c}
.cv-chip-kg em{color:#ef4444}

.cv-vol{
  padding:18px 18px 16px;border:1px solid #e2e8f0;border-radius:16px;
  background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
  box-shadow:0 10px 28px -24px rgba(15,23,42,.45)
}
.cv-vol-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:0 0 14px;flex-wrap:wrap
}
.cv-vol-title{
  display:inline-flex;align-items:center;gap:6px;
  font-size:14px;font-weight:800;color:#0f172a;letter-spacing:-.02em
}
.cv-vol-title i{color:var(--brand,#2563eb);font-size:18px}
.cv-vol-result{
  display:inline-flex;align-items:baseline;gap:4px;padding:8px 12px;border-radius:999px;
  background:var(--brand,#2563eb);color:#fff;font-size:18px;font-weight:800;letter-spacing:-.03em
}
.cv-vol-result small{font-size:12px;font-weight:700;opacity:.9}

.cv-dim{display:flex;align-items:stretch;flex-wrap:wrap;gap:8px}
.cv-dim-btn{
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  min-width:92px;padding:12px 14px;border-radius:12px;
  background:#fff;border:1px solid #e2e8f0;box-shadow:0 1px 0 rgba(15,23,42,.03)
}
.cv-dim-btn em{font-style:normal;font-size:11px;font-weight:700;color:#64748b;margin-bottom:4px}
.cv-dim-btn strong{font-size:20px;font-weight:800;color:#0f172a;letter-spacing:-.03em;line-height:1.1}
.cv-dim-btn small{margin-top:4px;font-size:11px;font-weight:700;color:#94a3b8}
.cv-dim-btn.is-empty{background:#f8fafc;border-style:dashed}
.cv-dim-btn.is-empty strong{color:#94a3b8}
.cv-dim-vol{
  background:rgba(37,99,235,.08);border-color:rgba(37,99,235,.28)
}
.cv-dim-vol strong{color:var(--brand,#2563eb)}
.cv-dim-vol small{color:#3b82f6}
.cv-dim-x,.cv-dim-eq{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;font-size:16px;font-weight:800;color:#94a3b8;padding-top:18px
}
.cv-vol-note{
  margin:14px 0 0;padding-top:12px;border-top:1px dashed #e2e8f0;
  font-size:13px;line-height:1.55;color:#64748b
}
.cv-vol-note strong{color:#0f172a}
.cv-vol-sep{margin:0 6px;color:#cbd5e1}

html[data-theme="dark"] .cv-chip{background:#1f2937;border-color:#374151;color:#e2e8f0}
html[data-theme="dark"] .cv-chip em{color:#94a3b8}
html[data-theme="dark"] .cv-chip-cate{background:rgba(96,165,250,.12);border-color:rgba(96,165,250,.28);color:#93c5fd}
html[data-theme="dark"] .cv-chip-sot{background:rgba(16,185,129,.14);border-color:rgba(52,211,153,.28);color:#6ee7b7}
html[data-theme="dark"] .cv-chip-group{background:rgba(129,140,248,.14);border-color:rgba(165,180,252,.28);color:#c7d2fe}
html[data-theme="dark"] .cv-chip-size{background:rgba(251,146,60,.12);border-color:rgba(253,186,116,.28);color:#fdba74}
html[data-theme="dark"] .cv-vol{background:#111827;border-color:#374151;box-shadow:none}
html[data-theme="dark"] .cv-vol-title{color:#f8fafc}
html[data-theme="dark"] .cv-dim-btn{background:#0f172a;border-color:#374151}
html[data-theme="dark"] .cv-dim-btn strong{color:#f8fafc}
html[data-theme="dark"] .cv-dim-btn.is-empty{background:#111827}
html[data-theme="dark"] .cv-vol-note{border-top-color:#374151;color:#94a3b8}
html[data-theme="dark"] .cv-vol-note strong{color:#e2e8f0}

@media (max-width:768px){
  .cv-dim-btn{min-width:calc(33.333% - 16px);flex:1 1 calc(33.333% - 16px)}
  .cv-dim-vol{flex:1 1 100%}
  .cv-dim-x,.cv-dim-eq{padding-top:0;min-height:auto}
  .cv-vol-result{font-size:16px}
}

#bo_v_con.cv-extra-con{min-height:0;margin:4px 0 24px}
#bo_v_con.sound_only{min-height:0 !important;margin:0 !important;height:0 !important;width:0 !important;padding:0 !important;overflow:hidden !important}
