/* Wholesale directory: public data, honest empty state and supplier checklist. */
body.wholesale-view, body.wholesale-view .app-main { background:#0d0f10; }
body.wholesale-view .topbar {
  --ld-panel:#121517; --ld-text:#f8f8f8; --ld-muted:#b5b9ba;
  --ld-muted-bg:#292c2f; --ld-border-strong:#35393c;
  background:#121517; border-bottom-color:#35393c;
}
body.wholesale-view .topbar .btn.topbar-login { background:#24282a; color:#f6f6f6; border-color:#45494b; }
body.wholesale-view .sidebar { background:#111416; border-right:1px solid #303538; }
body.wholesale-view .side-nav a.nav-current { background:#33251e; color:#ffa66f; border-left-color:#ff8a4b; border-radius:9px; }
body.wholesale-view .side-nav a.nav-current svg { color:#ff9e62; }
body.wholesale-view footer { background:#0d0f10; border-top-color:#303538; }
body.wholesale-view footer, body.wholesale-view footer a, body.wholesale-view footer button { color:#c5c8c9; }
body.wholesale-view footer .footer-meta { color:#a9adae; }

#view-wholesale {
  --ink:#f8f8f8; --ink-body:#cbd0d0; --ink-soft:#bdc5c6; --ink-faint:#9aa4a5;
  --surface:#171b1d; --surface-hover:#252b2e;
  --border:#353c3f; --border-strong:#394043;
  --accent:#ff8a4b; --accent-ink:#ffb386; --accent-soft:#35271e;
  --brand:#ff8a4b; --brand-ink:#ffb386; --brand-soft:#39281f;
  color:#f8f8f8;
}
#view-wholesale .content { max-width:1430px; padding-top:34px; }
#view-wholesale .eyebrow { background:none; border:0; padding:0; margin:0 0 8px; color:#ffa66d; font-size:11px; font-weight:800; letter-spacing:.12em; }
#view-wholesale .eyebrow::before { display:none; }
#view-wholesale .wholesale-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:14px 22px; flex-wrap:wrap; }
#view-wholesale .page-head { padding:0; }
#view-wholesale .page-head h1 { color:#fff; font-size:clamp(34px,4vw,51px); line-height:1.2; letter-spacing:-.05em; }
#view-wholesale .page-lead { margin:8px 0 0; color:#bac1c2; font-size:16px; }
#view-wholesale #wholesaleInquiryBtn { flex:0 0 auto; min-height:42px; padding:10px 18px; border-radius:8px; background:#ff8a4b; color:#25160f; font-size:12px; font-weight:800; }
#view-wholesale #wholesaleInquiryBtn:hover { background:#ffab77; }

#view-wholesale .wholesale-search-wrap { display:flex; align-items:center; gap:12px; width:100%; min-height:59px; padding:0 18px; margin:26px 0 16px; border:1px solid #485155; border-radius:11px; background:#1b2022; color:#a9b3b5; }
#view-wholesale .wholesale-search-wrap:focus-within { border-color:#ff9d61; box-shadow:0 0 0 3px rgba(255,138,75,.12); }
#view-wholesale .wholesale-search-wrap svg { flex:none; }
#view-wholesale #wholesaleSearch { flex:1; min-width:0; width:100%; height:55px; border:0; outline:0; box-shadow:none; background:transparent; color:#f7f7f7; font-family:var(--f-body); font-size:14px; }
#view-wholesale #wholesaleSearch::placeholder { color:#a4aeb0; opacity:1; }
#view-wholesale #wholesaleSearch::-webkit-search-cancel-button { cursor:pointer; }
#view-wholesale .wholesale-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px; }
#view-wholesale .wholesale-tabs .filter-tab { min-height:36px; padding:6px 15px; border:1px solid #444c4f; border-radius:19px; background:#171b1d; color:#c2c9ca; font-size:12px; }
#view-wholesale .wholesale-tabs .filter-tab:hover { border-color:#ff9f68; color:#fff; }
#view-wholesale .wholesale-tabs .filter-tab.active { border-color:#ff8a4b; background:#36271e; color:#ffb386; }
#view-wholesale .wholesale-result-status { margin:13px 0 6px; max-width:none; color:#b8c0c1; font-size:12px; }
#view-wholesale .wholesale-result-status:empty { display:none; }

#view-wholesale #wholesaleEmptyState { width:100%; min-height:380px; padding:20px 20px 27px !important; border:1px solid #393f42; border-radius:14px; background:radial-gradient(circle at 50% 45%,#2d211c 0,#171b1d 55%); }
#view-wholesale .wholesale-empty-art { display:block; width:min(380px,85%); max-height:252px; object-fit:contain; margin:0 auto -4px; }
#view-wholesale #wholesaleEmptyState p { max-width:none; margin:0 auto 15px; color:#bec6c6; font-size:13px; }
#view-wholesale #wholesaleEmptyState strong { display:block; margin-bottom:9px; color:#fff; font-size:clamp(21px,2.5vw,30px); letter-spacing:-.04em; }
#view-wholesale #wholesaleEmptyState .btn { min-height:43px; border-color:#ff8a4b; border-radius:8px; background:transparent; color:#ffb386; font-size:12px; font-weight:800; }
#view-wholesale #wholesaleEmptyState .btn:hover { background:#35271e; }
#view-wholesale #wholesaleLoadingState, #view-wholesale #wholesaleErrorState,
#view-wholesale #wholesaleFilterEmptyState { margin:12px 0 0; border:1px solid #393f42; border-radius:12px; background:#171b1d; }
#view-wholesale #wholesaleErrorState p, #view-wholesale #wholesaleFilterEmptyState p,
#view-wholesale #wholesaleLoadingState p { max-width:none; margin:0 auto 14px; color:#cbd1d1; }
#view-wholesale #wholesaleFilterEmptyState .btn, #view-wholesale #wholesaleErrorState .btn { border-radius:7px; color:#ffb386; }

#view-wholesale #wholesaleGrid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-top:18px; }
#view-wholesale #wholesaleGrid .info-card { min-width:0; padding:21px; border-color:#394043; border-radius:11px; background:#171b1d; }
#view-wholesale #wholesaleGrid .info-card:hover { border-color:#ff9e65; }
#view-wholesale #wholesaleGrid h4 { color:#fff; font-size:16px; line-height:1.5; }
#view-wholesale #wholesaleGrid .tag { border-radius:15px; background:#39291f; color:#ffb386; padding:3px 9px; font-size:11px; }
#view-wholesale #wholesaleGrid p { color:#bac3c4; line-height:1.6; overflow-wrap:anywhere; }
#view-wholesale #wholesaleGrid li.good { color:#d9dddd; }
#view-wholesale #wholesaleGrid .rc-action { display:inline-flex; align-items:center; min-height:40px; color:#ffb386; }

#view-wholesale .wholesale-learning { margin:32px 0 0; }
#view-wholesale .wholesale-learning > span { color:#ff9f67; font-size:11px; font-weight:800; letter-spacing:.1em; }
#view-wholesale .wholesale-learning h2 { margin:5px 0 15px; color:#fff; font-size:21px; letter-spacing:-.04em; }
#view-wholesale .wholesale-learning-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
#view-wholesale .wholesale-learning-grid article { min-width:0; min-height:132px; padding:19px; border:1px solid #394043; border-radius:11px; background:#171b1d; }
#view-wholesale .wholesale-learning-icon { display:inline-grid; place-items:center; width:32px; height:32px; margin-bottom:10px; border-radius:8px; background:#38291f; color:#ffa66d; font-size:11px; font-weight:800; }
#view-wholesale .wholesale-learning-grid h3 { color:#fff; font-size:15px; margin-bottom:5px; }
#view-wholesale .wholesale-learning-grid p { color:#adb7b9; font-size:12px; line-height:1.6; margin:0; }

/* The inquiry dialog lives outside the route section, so theme it by body route. */
body.wholesale-view #wholesaleInquiryModal {
  --bg:#111618; --ink:#f8f8f8; --ink-body:#ced4d4; --ink-soft:#c2c9ca;
  --surface:#1b2022; --surface-hover:#292e30; --border-strong:#485155;
  --accent:#ff8a4b; --accent-ink:#ffb386; --brand:#ff8a4b; --brand-soft:#38281e;
}
body.wholesale-view #wholesaleInquiryModal .modal-panel { max-width:480px; border-radius:12px; }
body.wholesale-view #wholesaleInquiryModal .modal-head h2 { color:#fff; }
body.wholesale-view #wholesaleInquiryModal .modal-close { color:#fff; }
body.wholesale-view #wholesaleInquiryModal .ws-field input,
body.wholesale-view #wholesaleInquiryModal .ws-field textarea,
body.wholesale-view #wholesaleInquiryModal #whInqCategory { border-radius:7px; background:#111618; color:#fff; }
body.wholesale-view #wholesaleInquiryModal #wholesaleInquirySubmit { background:#ff8a4b; color:#25160f; border-radius:8px; }

@media (max-width:1050px) {
  #view-wholesale #wholesaleGrid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:680px) {
  #view-wholesale .content { padding:24px 16px 42px; }
  #view-wholesale .page-lead { font-size:13px; }
  #view-wholesale .wholesale-search-wrap { min-height:50px; margin-top:20px; }
  #view-wholesale #wholesaleSearch { height:48px; font-size:13px; }
  #view-wholesale .wholesale-learning-grid { grid-template-columns:minmax(0,1fr); }
  #view-wholesale #wholesaleGrid { grid-template-columns:minmax(0,1fr); }
  #view-wholesale #wholesaleEmptyState { min-height:0; }
  #view-wholesale .wholesale-empty-art { width:min(270px,80%); max-height:190px; }
}