/* ============================================================
   B2B 대량주문 (사업자 회원) 공통 스타일
   - 헤더 하단 메뉴(#b2b_nav) + 주문입력/발주예정/주문내역/매칭내역 페이지
   ============================================================ */

/* ── 헤더 하단 메뉴 ── */
#b2b_nav {background:#fff; border-bottom:1px solid var(--line, #e2e2e2);}
#b2b_nav .b2b_nav_inner {display:flex; align-items:stretch; justify-content:center; gap:0; max-width:1500px; margin:0 auto; padding:0 10px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none;}
#b2b_nav .b2b_nav_inner::-webkit-scrollbar {display:none;}
#b2b_nav li {flex:0 0 auto;}
#b2b_nav li a {position:relative; display:flex; align-items:center; gap:6px; height:52px; padding:0 22px; font-size:16px; font-weight:600; color:var(--text2, #454545); white-space:nowrap; transition:color .15s;}
#b2b_nav li a:hover {color:var(--main, #005504);}
#b2b_nav li.on a {color:var(--main, #005504);}
#b2b_nav li.on a::after {content:''; position:absolute; left:14px; right:14px; bottom:0; height:3px; border-radius:3px 3px 0 0; background:var(--main, #005504);}
#b2b_nav .b2b_nav_badge {display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 6px; border-radius:10px; background:var(--red, #FF0048); color:#fff; font-size:12px; font-weight:700; font-style:normal; line-height:1;}
@media (max-width: 768px) {
    #b2b_nav .b2b_nav_inner {justify-content:flex-start;}
    #b2b_nav li a {height:46px; padding:0 14px; font-size:14px;}
}

/* ── 페이지 공통 ── */
.b2b-page {background:#f6f6f6; min-height:60vh;}
.b2b-wrap {max-width:1200px; margin:0 auto; padding:34px 20px 80px;}
.b2b-wrap.wide {max-width:1400px;}
.b2b-head {display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:22px;}
.b2b-head h2 {font-size:26px; font-weight:700; color:var(--text1, #222); margin:0;}
.b2b-head .desc {font-size:14px; color:var(--text3, #787878); margin-top:6px; width:100%;}
.b2b-head .actions {display:flex; gap:8px;}
.b2b-card {background:#fff; border:1px solid #e5e8eb; border-radius:12px; padding:24px; margin-bottom:20px;}
.b2b-card.tight {padding:0; overflow:hidden;}
.b2b-card h3 {font-size:17px; font-weight:700; margin:0 0 14px;}
.b2b-row {display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
.b2b-row .lbl {font-size:15px; font-weight:600; color:var(--text2, #454545);}
.b2b-radio {display:inline-flex; align-items:center; gap:6px; font-size:15px; cursor:pointer;}
.b2b-radio input {width:18px; height:18px; accent-color:var(--main, #005504); margin:0;}
.b2b-divider {height:1px; background:#eef0f2; margin:18px 0;}

/* 안내 박스 */
.b2b-note {border-radius:10px; padding:14px 18px; font-size:14px; line-height:1.7;}
.b2b-note.info {background:#f3f8ff; border:1px solid #cfe1fb; color:#1f4e8c;}
.b2b-note.warn {background:#fff6f6; border:1px solid #f5c6c6; color:#b3261e;}
.b2b-note.tip  {background:#f7f7f7; border:1px solid #e5e8eb; color:#333;}
.b2b-note .tit {display:block; font-weight:700; margin-bottom:6px;}
.b2b-note ul {margin:0; padding-left:18px;}
.b2b-note li {list-style:disc;}
.b2b-chips {display:flex; flex-wrap:wrap; gap:6px; margin:8px 0;}
.b2b-chip {display:inline-block; padding:3px 9px; border:1px solid #f0a8a8; border-radius:6px; background:#fff; color:#c62828; font-size:13px; font-weight:600;}

/* 버튼 */
.b2b-btn {display:inline-flex; align-items:center; justify-content:center; gap:6px; height:42px; padding:0 18px; border-radius:8px; border:1px solid var(--main, #005504); background:var(--main, #005504); color:#fff; font-size:15px; font-weight:600; cursor:pointer; white-space:nowrap; transition:filter .15s, background .15s; text-decoration:none;}
.b2b-btn:hover {filter:brightness(1.08);}
.b2b-btn:disabled, .b2b-btn.disabled {opacity:.45; cursor:not-allowed; filter:none;}
.b2b-btn.outline {background:#fff; color:var(--main, #005504);}
.b2b-btn.gray {background:#fff; color:#333; border-color:#d5d9de;}
.b2b-btn.gray:hover {background:#f5f5f5; filter:none;}
.b2b-btn.danger {background:#fff; color:#d33; border-color:#e9b3b3;}
.b2b-btn.sm {height:32px; padding:0 12px; font-size:13px; border-radius:6px;}
.b2b-btn.xs {height:26px; padding:0 8px; font-size:12px; border-radius:5px;}
.b2b-btn.lg {height:50px; padding:0 26px; font-size:16px;}
.b2b-link {color:var(--main, #005504); text-decoration:underline; cursor:pointer; background:none; border:0; padding:0; font-size:inherit;}
.b2b-link.red {color:#d33;}

/* 드롭존 */
.b2b-drop {display:flex; align-items:center; justify-content:center; min-height:110px; border:2px dashed #cfd4da; border-radius:12px; background:#fafbfc; color:#8a929b; font-size:15px; cursor:pointer; transition:all .15s; text-align:center; padding:20px;}
.b2b-drop:hover, .b2b-drop.over {border-color:var(--main, #005504); background:#f2f8f2; color:var(--main, #005504);}
.b2b-drop input[type=file] {display:none;}

/* 파일 정보 */
.b2b-file {display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px;}
.b2b-file .name {font-size:16px; font-weight:700;}
.b2b-file .name::before {content:'📄'; margin-right:6px;}
.b2b-file .sum {font-size:13px; color:#666; margin-top:4px;}
.b2b-file .sum .ok {color:#0a7a2f; font-weight:700;}
.b2b-file .sum .need {color:#e07b00; font-weight:700;}
.b2b-file .sum .err {color:#d33; font-weight:700;}

/* 테이블 */
.b2b-table-wrap {overflow-x:auto; -webkit-overflow-scrolling:touch;}
.b2b-table {width:100%; border-collapse:collapse; font-size:14px; min-width:820px;}
.b2b-table th {background:#f5f6f7; color:#555; font-weight:600; padding:12px 10px; border-bottom:1px solid #e5e8eb; text-align:left; white-space:nowrap;}
.b2b-table td {padding:12px 10px; border-bottom:1px solid #eef0f2; vertical-align:middle; word-break:break-all;}
.b2b-table tr:last-child td {border-bottom:0;}
.b2b-table tr:hover td {background:#fafcfa;}
.b2b-table .num, .b2b-table th.num {text-align:right; white-space:nowrap;}
.b2b-table .c, .b2b-table th.c {text-align:center;}
.b2b-table .mono {font-family:Menlo, Consolas, monospace; letter-spacing:.2px;}
.b2b-table .sub {display:block; font-size:12px; color:#888; margin-top:2px; font-weight:400;}
.b2b-table .ok {color:#0a7a2f; font-weight:700;}
.b2b-table .err {color:#d33; font-weight:700;}
.b2b-table .need {color:#e07b00; font-weight:700;}
.b2b-table input.cell {width:100%; min-width:80px; height:32px; padding:0 8px; border:1px solid #d5d9de; border-radius:6px; font-size:13px; background:#fff;}
.b2b-table input.cell[readonly] {border-color:transparent; background:transparent; padding-left:0;}
.b2b-table input.cell.qty {width:64px; min-width:64px; text-align:right;}
.b2b-table input.cell.bad {border-color:#e57373; background:#fff5f5;}
.b2b-table tr.row-err td {background:#fff8f8;}
.b2b-table tr.group-head td {background:#f0f6f0; font-weight:600; color:#2c5c2f;}
.b2b-table a.od {color:var(--main, #005504); font-weight:700; text-decoration:none;}
.b2b-table a.od:hover {text-decoration:underline;}
.b2b-empty {padding:60px 20px; text-align:center; color:#888;}
.b2b-empty strong {display:block; font-size:20px; color:#222; margin-bottom:10px;}
.b2b-empty p {margin:0 0 20px; font-size:14px;}

/* 뱃지 */
.b2b-badge {display:inline-block; padding:3px 9px; border-radius:6px; font-size:12px; font-weight:700; white-space:nowrap; background:#eee; color:#555;}
.b2b-badge.st-order {background:#fff4e0; color:#b26a00;}
.b2b-badge.st-paid {background:#e3f4ff; color:#0b63b3;}
.b2b-badge.st-ready {background:#efe9ff; color:#5a3ec8;}
.b2b-badge.st-shipping {background:#e8f7ec; color:#1b7a3b;}
.b2b-badge.st-done {background:#e6f6ea; color:#0a7a2f;}
.b2b-badge.st-cancel, .b2b-badge.st-return, .b2b-badge.st-soldout {background:#fdeaea; color:#c62828;}

/* 하단 액션 바 */
.b2b-actions {display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-top:18px;}
.b2b-actions .left {margin-right:auto; color:#666; font-size:14px;}

/* 검색/필터 폼 */
.b2b-filter {display:grid; grid-template-columns:repeat(4, 1fr); gap:12px 16px;}
.b2b-filter label {display:block; font-size:13px; color:#666; margin-bottom:6px;}
.b2b-filter input, .b2b-filter select {width:100%; height:42px; padding:0 12px; border:1px solid #d5d9de; border-radius:8px; font-size:14px; background:#fff;}
.b2b-filter .btns {grid-column:1 / -1; display:flex; justify-content:flex-end; gap:8px;}
@media (max-width: 900px) { .b2b-filter {grid-template-columns:repeat(2, 1fr);} }
@media (max-width: 560px) { .b2b-filter {grid-template-columns:1fr;} }

/* 페이징 */
.b2b-paging {display:flex; justify-content:center; gap:4px; margin-top:20px;}
.b2b-paging a, .b2b-paging strong {display:inline-flex; align-items:center; justify-content:center; min-width:34px; height:34px; padding:0 8px; border:1px solid #e0e3e6; border-radius:6px; font-size:13px; color:#444; text-decoration:none; background:#fff;}
.b2b-paging strong {background:var(--main, #005504); border-color:var(--main, #005504); color:#fff;}

/* 모달 */
.b2b-modal {display:none; position:fixed; inset:0; z-index:10050; background:rgba(0,0,0,.45); align-items:center; justify-content:center; padding:16px;}
.b2b-modal.open {display:flex;}
.b2b-modal .box {background:#fff; border-radius:14px; width:100%; max-width:640px; max-height:92vh; display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,.25); overflow:hidden;}
.b2b-modal .box.wide {max-width:820px;}
.b2b-modal .box.narrow {max-width:520px;}
.b2b-modal .hd {display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:22px 24px 10px;}
.b2b-modal .hd h4 {font-size:19px; font-weight:700; margin:0;}
.b2b-modal .hd p {margin:6px 0 0; font-size:13px; color:#666; line-height:1.6;}
.b2b-modal .hd .x {border:0; background:none; font-size:24px; line-height:1; cursor:pointer; color:#888; padding:0 2px;}
.b2b-modal .bd {padding:8px 24px 18px; overflow-y:auto;}
.b2b-modal .ft {display:flex; justify-content:flex-end; gap:8px; padding:14px 24px 22px; border-top:1px solid #eef0f2;}
.b2b-modal .searchrow {display:flex; gap:8px; margin:8px 0 12px;}
.b2b-modal .searchrow input {flex:1; height:44px; padding:0 14px; border:2px solid var(--main, #005504); border-radius:8px; font-size:15px;}
.b2b-modal .results {border:1px solid #e5e8eb; border-radius:10px; min-height:220px; max-height:46vh; overflow-y:auto;}
.b2b-modal .results .hint {padding:40px 16px; text-align:center; color:#888; font-size:14px; line-height:1.8;}
.b2b-modal .results .it {display:flex; align-items:center; gap:12px; padding:10px 12px; border-bottom:1px solid #f0f2f4;}
.b2b-modal .results .it img {width:44px; height:44px; border-radius:6px; object-fit:cover; background:#f2f2f2; flex-shrink:0;}
.b2b-modal .results .it .nm {flex:1; font-size:14px; font-weight:600;}
.b2b-modal .results .it .nm small {display:block; color:#888; font-weight:400; margin-top:2px;}
.b2b-modal .results .opt {display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 12px 8px 68px; border-bottom:1px solid #f4f6f8; cursor:pointer; font-size:14px;}
.b2b-modal .results .opt:hover, .b2b-modal .results .opt.sel {background:#f0f7f0;}
.b2b-modal .results .opt .price {font-weight:700; white-space:nowrap;}
.b2b-modal .results .opt .stock {font-size:12px; color:#888; margin-left:6px;}
.b2b-modal .results .opt.soldout {color:#bbb; cursor:not-allowed;}
.b2b-modal .keys {font-size:12px; color:#888; margin-top:10px;}

/* 요약/결제 */
.b2b-sum {border:1px solid #e5e8eb; border-radius:10px; padding:14px 16px; font-size:14px; background:#fafbfc;}
.b2b-sum .line {display:flex; justify-content:space-between; padding:5px 0;}
.b2b-sum .line.sub {color:#777; font-size:13px; padding-left:12px;}
.b2b-sum .line.total {border-top:1px solid #e5e8eb; margin-top:6px; padding-top:10px; font-weight:700; font-size:16px;}
.b2b-amount {font-size:34px; font-weight:800; color:#111; margin:4px 0 14px;}
.b2b-amount small {font-size:16px; font-weight:600; margin-left:4px;}

/* 커스텀 매핑 */
.b2b-mapgrid {display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 16px;}
.b2b-mapgrid label {display:block; font-size:13px; font-weight:600; color:#444; margin-bottom:5px;}
.b2b-mapgrid label.req::after {content:' *'; color:#d33;}
.b2b-mapgrid select {width:100%; height:40px; padding:0 10px; border:1px solid #d5d9de; border-radius:8px; font-size:14px; background:#fff;}
@media (max-width: 640px) { .b2b-mapgrid {grid-template-columns:1fr;} }
.b2b-saved {display:flex; flex-direction:column; gap:8px; margin:12px 0;}
.b2b-saved .item {display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; border:1px solid #e5e8eb; border-radius:10px; background:#fff; font-size:14px;}
.b2b-saved .item .nm {font-weight:600;}
.b2b-saved .item .nm small {display:block; color:#888; font-weight:400; font-size:12px; margin-top:2px;}

/* 주문 상세 */
.b2b-detail-grid {display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media (max-width: 760px) { .b2b-detail-grid {grid-template-columns:1fr;} }
.b2b-kv {display:grid; grid-template-columns:90px 1fr; gap:8px 12px; font-size:14px;}
.b2b-kv dt {color:#888;}
.b2b-kv dd {margin:0; font-weight:600; word-break:break-all;}
.b2b-order-title {display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;}
.b2b-order-title h2 {font-family:Menlo, Consolas, monospace; font-size:24px; margin:0;}
.b2b-order-title .meta {font-size:13px; color:#888; margin-top:4px;}
.b2b-history {font-size:13px; color:#666; line-height:1.9;}

/* 상단 헤더 백버튼 영역과의 간격 */
body.b2b-body #wrapper_title {display:none;}