/* Solidium3D Quote Viewer CSS — v4.7 layout (cen-grid + compact spacing v2) */

*{box-sizing:border-box;margin:0;padding:0}

/* Restore native scrolling on the quote page.
   The snippet's inline CSS has html,body{height:100%} which clamps to viewport.
   We need higher specificity than `html,body` (0,0,1 each) to override —
   :root has specificity (0,1,0) and body.page-id-11249 has (0,1,1).
   Using `body.page-id-11249.page-id-11249` doubles up to win even with !important. */
:root {
    height: auto !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
body.page-id-11249 {
    height: auto !important;
    min-height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* ── Typography: 1 font, 3 sizes ────────────────────────── */
.tool, .tool * { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important; }
/* Type scale (desktop). Stepped down to 12/11/9 on mobile <=767px. */
.tool { --fs-lg: 14px; --fs-md: 12px; --fs-sm: 9px; }
.tool { font-size: var(--fs-md); }

/* Headings: 13px bold */
.sec-lbl, .r-lbl, .pr-heading, .ph span, .mi-name { font-size: var(--fs-lg) !important; font-weight: 600 !important; }
/* Body: 12px */
.mat-name, .mat-pick, .pp-title, .fi-name, .sel-w select, .pri-sel,
.pr-row, .qty-val, .mi-size, .mi-vol, .notes, .already-badge,
.atc-btn, .nm-btn, .vc-btn, .co-btn, .cc-name,
.ci .cl, .tc-name, .draw-btn { font-size: var(--fs-md) !important; }
/* Small: 10px */
.mat-desc, .sel-sub, .pp-desc, .tc-sub, .dz-sub, .help-row,
.cc-row, .cc-key, .cc-val, .cc-files, .disc, .ft-sub,
.vdims, .badge { font-size: var(--fs-sm) !important; }

.page-wrap{width:100%;padding:8px 24px}
.logo-bar{display:flex;align-items:center;padding:4px 0;margin-bottom:6px;gap:12px}
.logo-bar .brand{font-size:22px;font-weight:800;color:#000;letter-spacing:-.5px}
.logo-bar .brand b{color:#e53e3e;font-weight:900}
.logo-bar .tagline{font-size:9px;color:#000;letter-spacing:.08em;margin-top:2px}
.logo-bar .nav{margin-left:auto;display:flex;align-items:center;gap:6px}
.logo-bar .nav-lnk{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#374151;padding:6px 12px;border-radius:6px;text-decoration:none;font-weight:500;transition:background .12s,color .12s}
.logo-bar .nav-lnk:hover{background:#e5e7eb;color:#374151}
.logo-bar .nav-lnk svg{flex-shrink:0}
.logo-bar .nav-lnk.acc{background:#1a56db;color:#fff;font-weight:600}
.logo-bar .nav-lnk.acc:hover{background:#1240a8;color:#fff}
/* My-account dropdown */
.nav-dd{position:relative;display:inline-flex}
.nav-dd .dd-caret{margin-left:2px;transition:transform .15s}
.nav-dd.open .dd-caret{transform:rotate(180deg)}
.nav-dd-menu{position:absolute;top:calc(100% + 6px);left:0;right:auto;width:100%;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:4px;z-index:1000;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s,transform .15s,visibility .15s}
.nav-dd:hover .nav-dd-menu,.nav-dd.open .nav-dd-menu{opacity:1;visibility:visible;transform:translateY(0)}
.nav-dd-menu a{display:block;padding:5px 10px;font-size:12px;line-height:1.3;color:#374151;text-decoration:none;border-radius:6px;font-weight:500;transition:background .12s,color .12s}
.nav-dd-menu a:hover{background:#eff4ff;color:#1a56db}
.nav-dd-menu .nav-dd-logout{color:#dc2626}
.nav-dd-menu .nav-dd-logout:hover{background:#fef2f2;color:#dc2626}
.nav-dd-sep{height:1px;background:#e5e7eb;margin:4px 4px}
.tool{display:grid;grid-template-columns:1fr 340px 300px;gap:12px;min-height:600px;border:none;border-radius:0;overflow:visible;background:transparent}
.col-stack{display:flex;flex-direction:column;gap:12px;min-width:0}
.col-stack > .pan-l{flex:0 0 auto}
.col-stack > .pan-c{flex:1 1 auto}
.pan{display:flex;flex-direction:column;overflow:hidden;background:#fff;border-radius:10px;border:1px solid #e5e7eb}
.pan-l{}
.cart-block{background:transparent !important;border:none !important;border-radius:0 !important;overflow:visible !important}
.cart-block > .ph, .cart-block > .cart-items{background:#fff}
.cart-block > .ph{border:1px solid #e5e7eb;border-radius:10px 10px 0 0}
.cart-block > .cart-items{border:1px solid #e5e7eb;border-top:none;border-radius:0 0 10px 10px}
.cart-block > .cart-ship, .cart-block > .cart-foot{margin-top:12px}
.cart-block > .cart-items{flex:1 1 auto;min-height:120px}
.pan-c{overflow:visible}
#mview{display:flex;flex-direction:column}
#mview > .ph{margin:0;width:100%;box-sizing:border-box}
.pan-r{}
.ph{display:flex;align-items:center;justify-content:space-between;padding:0 14px;min-height:44px;border-bottom:1px solid #e5e7eb;font-weight:600;font-size:14px;flex-shrink:0}
.badge{background:#1a56db;color:#fff;font-size:11px;font-weight:700;border-radius:20px;padding:1px 8px;min-width:18px;text-align:center;line-height:16px}

/* LEFT PANEL: file list + buttons scroll together */
.left-scroll{flex:1;overflow-y:auto;display:flex;flex-direction:column}
.file-list{flex-shrink:0;padding:6px 8px 0}
.browse-row{display:flex;flex-direction:column;gap:6px;padding:10px 12px;flex-shrink:0}
.browse-btns{display:flex;gap:6px}
.ob{flex:1;border:1px solid #1a56db;border-radius:6px;background:#fff;color:#1a56db;font-size:11px;font-weight:700;padding:6px 6px;cursor:pointer;text-align:center;letter-spacing:.03em;transition:background .12s;white-space:nowrap}
.ob:hover{background:#eff4ff}
.ob-sec{border-color:#d1d5db;color:#6b7280}.ob-sec:hover{background:#f9fafb}
.add-file-btn{width:100%;border:1px dashed #d1d5db;border-radius:6px;background:#f9fafb;color:#6b7280;font-size:11px;font-weight:500;padding:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;transition:all .12s}
.add-file-btn:hover{border-color:#1a56db;color:#1a56db;background:#eff4ff}

.fi{display:flex;align-items:center;gap:11px;padding:9px 12px;cursor:pointer;border:1px solid transparent;border-radius:8px;margin:2px 0;transition:background .12s,border-color .12s}
.fi:hover{background:#f5f7fa}
.fi.act{position:sticky;top:0;z-index:2;background:#eef4ff;border-color:#bcd4fb;box-shadow:0 1px 3px rgba(26,86,219,.12)}
.fi.act .fi-name{font-weight:600;color:#1a56db}
.fi.act .fi-thumb{border-color:#bcd4fb}
.fi-editing{display:none;align-items:center;gap:4px;font-size:9px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:#1a56db;margin-top:2px;width:max-content}
.fi-editing svg{flex:0 0 auto}
.fi.act .fi-editing{display:inline-flex}
.fi-mid{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:0}
.fi-thumb{width:44px;height:44px;border-radius:7px;background:#ebedf0;border:1px solid #e5e7eb;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:14px}
.fi-thumb canvas{width:100%;height:100%;display:block}
.fi-thumb img{width:100%;height:100%;display:block;object-fit:cover}
.fi-name{font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#1f2937}
.fi-del{opacity:0;background:none;border:none;cursor:pointer;color:#9ca3af;padding:4px 6px;border-radius:6px;font-size:14px;line-height:1;flex:0 0 auto;transition:opacity .12s,color .12s,background .12s}
.fi:hover .fi-del,.fi.act .fi-del{opacity:1}
.fi-del:hover{color:#ef4444;background:#fef2f2}

.drop-zone{margin:10px 12px;border:1.5px dashed #d1d5db;border-radius:8px;background:#fafbfc;padding:16px 10px;text-align:center;cursor:pointer;transition:all .15s}
.drop-zone:hover,.drop-zone.drag-over{border-color:#1a56db;background:#eff4ff}
.drop-zone.drag-over .dz-icon,.drop-zone.drag-over .dz-text{color:#1a56db}
.dz-icon{font-size:22px;color:#d1d5db;margin-bottom:4px;line-height:1}
.dz-text{font-size:12px;font-weight:700;color:#1a56db;letter-spacing:.04em}
.dz-sub{font-size:11px;color:#9ca3af;margin-top:2px}

.cart-ph{border-top:1px solid #e5e7eb}
.cart-empty{padding:16px 14px;text-align:center;color:#9ca3af;font-size:11px}
.cart-card{border-bottom:1px solid #e5e7eb;padding:10px 12px;font-size:11px}
.cc-head{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.cc-thumb{width:28px;height:28px;border-radius:4px;background:#ebedf0;overflow:hidden;flex-shrink:0}
.cc-thumb canvas{width:100%;height:100%}
.cc-thumb img{width:100%;height:100%;display:block;object-fit:cover}
.cc-name{flex:1;font-weight:600;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-actions{display:flex;gap:2px}
.cc-action{background:none;border:none;cursor:pointer;color:#9ca3af;font-size:14px;padding:1px 3px}
.cc-action:hover{color:#1a56db}
.cc-action.del:hover{color:#ef4444}
.fi-del,.cc-action{display:inline-flex;align-items:center;justify-content:center}
.cc-action.del{color:#ef4444}
.cc-meta{display:flex;flex-direction:column;gap:1px}
.cc-row{display:flex;font-size:11px;align-items:baseline;gap:8px}.cc-key{color:#6b7280;flex:0 0 110px;width:110px}.cc-val{color:#111827;font-weight:500;flex:1 1 auto;min-width:0}
.cc-row.cc-total{border-top:1px dashed #e5e7eb;margin-top:3px !important;padding-top:3px !important}
.cc-row.cc-total .cc-key,.cc-row.cc-total .cc-val{font-weight:700;color:#111827}
.cc-files{margin-top:4px;color:#9ca3af;font-size:9px}
/* Tighten cart-card rows: override theme line-height/margins */
.cc-row{line-height:1.45 !important;margin:0 !important;padding:0 !important}
.cc-key,.cc-val{line-height:1.45 !important;margin:0 !important;padding:0 !important}
.cart-items{overflow-y:auto}

/* Cart header right group: inline subtotal next to badge */
.ph-right{display:inline-flex;align-items:center;gap:8px}
.ph-right .cs-val{font-size:12px;font-weight:700;color:#111827;font-variant-numeric:tabular-nums}
.ph-right .cs-lbl{font-size:11px;font-weight:500;color:#6b7280}
.cart-foot{padding:12px 14px;border:1px solid #e5e7eb;border-radius:10px;flex-shrink:0;background:#fff}
.cart-foot .cf-breakdown{margin:0 0 10px}
.cart-foot .cf-line{display:flex;align-items:center;justify-content:space-between;font-size:12.5px;color:#374151;font-variant-numeric:tabular-nums;padding:3px 0}
.cart-foot .cf-line span:first-child{color:#6b7280}
.cart-foot .cf-line span:last-child{font-weight:600;color:#111827}
.cart-foot .cf-line.cf-gst{border-top:1px dashed #e5e7eb;margin-top:4px;padding-top:7px}
.cart-foot .cf-line.cf-waived span:last-child{color:#16a34a;font-weight:600;letter-spacing:.04em}
.cart-foot .cf-line.cf-waived span:first-child{text-decoration:line-through;color:#9ca3af}
.cart-foot .cf-hint{font-size:10.5px;color:#16a34a;font-weight:500;margin:-2px 0 4px;line-height:1.45}
.cart-foot .cf-hint strong{font-weight:700;white-space:nowrap}
.cart-foot .cf-total{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:#111827;font-variant-numeric:tabular-nums;margin:0 -14px 10px;padding:10px 14px 10px;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}
.cart-foot .cf-lbl{font-weight:600;color:#111827;white-space:nowrap}
.cart-foot .cf-sub{font-size:11px;font-weight:400;color:#9ca3af;white-space:nowrap}
.cart-foot .cf-val{margin-left:auto;font-variant-numeric:tabular-nums}
.cart-foot .cf-lead{display:flex;align-items:center;font-size:12px;color:#6b7280;font-variant-numeric:tabular-nums;margin:6px 0 0;padding:0 0 2px;line-height:1.5}
.cart-foot .cf-lead .cf-lbl{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:#6b7280;white-space:nowrap}
.cart-foot .cf-lead .cf-lbl svg{flex:none;opacity:.7}
.cart-foot .cf-lead .cf-val{margin-left:auto;font-weight:600;color:#111827;font-size:12px}
.order-notes-wrap{margin-top:10px}
.order-notes-lbl{display:block;font-size:11px;font-weight:600;color:#111827;margin-bottom:4px}
.order-notes{margin-top:0}

/* "Added to cart" confirmation badge above ATC button */
.added-badge{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#166534;margin-bottom:6px;background:#f0fdf4;border:1px solid #86efac;border-radius:6px;padding:6px 10px;justify-content:center}

/* Make cart action buttons feel clickable */
.cc-action{cursor:pointer;transition:color .12s,background .12s;border-radius:3px}
.cc-action:hover{background:#eff4ff}
.cc-action.del:hover{background:#fef2f2}
.cc-action:disabled{opacity:.4;cursor:wait}
.cc-action.busy{position:relative;opacity:1!important;pointer-events:none}
.cc-action.busy svg{visibility:hidden}
.cc-action.busy::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:s3dq-cc-spin .6s linear infinite}
@keyframes s3dq-cc-spin{to{transform:rotate(360deg)}}

/* CENTER */
.top-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-bottom:1px solid #e5e7eb;flex-shrink:0;border-radius:10px 10px 0 0;overflow:hidden}
.viewer-wrap{aspect-ratio:1/1;max-height:220px;background:#e0e4ea;position:relative;border-right:1px solid #e5e7eb}
.vl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#6b7280;font-size:12px;gap:6px;background:#e0e4ea}
.vbtns{position:absolute;bottom:8px;right:8px;display:none;gap:5px;z-index:4}
.vbtns.show{display:flex}
.vb{background:rgba(255,255,255,.9);border:1px solid #d1d5db;color:#6b7280;border-radius:5px;padding:3px 9px;font-size:11px;cursor:pointer}
.vb:hover,.vb.on{border-color:#1a56db;color:#1a56db}
.vdims{position:absolute;bottom:8px;left:8px;font-size:9px;font-family:monospace;color:rgba(0,0,0,.35);display:none;z-index:4;line-height:1.6}
.viewer-note{font-size:9px;color:#9ca3af;text-align:center;margin:5px 0 0;line-height:1.3;font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tech-panel{padding:8px 12px;overflow-y:auto}
.tg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:8px;width:100%;height:100%;box-sizing:border-box}
.tc{border:1px solid #e5e7eb;border-radius:6px;padding:10px 6px;text-align:center;cursor:pointer;transition:all .13s;background:#fff;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.tc:hover{border-color:#93aee8}
.tc.sel{border-color:#1a56db;background:#eff4ff}
.tc-check{position:absolute;top:3px;right:3px;width:14px;height:14px;border-radius:50%;background:#1a56db;color:#fff;font-size:9px;display:none;align-items:center;justify-content:center}
.tc.sel .tc-check{display:flex}
.tc-name{font-size:11px;font-weight:700;display:block}
.tc-sub{font-size:9px;color:#6b7280;margin-top:1px;line-height:1.2;display:block}
.mi{padding:14px 16px 4px}
.mi-name{font-weight:700;font-size:14px}
.mi-size{font-size:12px;color:#1a56db;margin-top:2px}
.mi-vol{font-size:12px;color:#6b7280}
.mi-resize{font-size:12px;color:#1a56db;cursor:pointer;margin-top:2px;display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.wall-pass{display:flex;align-items:center;gap:6px;background:#f0fff4;border:1px solid #86efac;border-radius:6px;padding:6px 12px;font-size:11px;font-weight:600;color:#166534;margin:6px 0 0;width:100%}
.sec{padding:14px 16px;border-top:1px solid #e5e7eb}
.sec-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.sec-lbl{font-size:12px;font-weight:700;margin-bottom:10px}
.mat-pick{display:flex;align-items:center;gap:8px;border:1px solid #d1d5db;border-radius:6px;padding:10px 12px;cursor:pointer;background:#fff}
.mat-pick:hover{border-color:#93aee8}
.mat-name{flex:1;font-size:12px}
.spec-lnk{font-size:11px;color:#1a56db;font-weight:700}
.mat-desc{font-size:11px;color:#6b7280;margin-top:6px}
.req-star{color:#ef4444;font-weight:700}
.sel-usecase{margin-top:2px}
/* Use-case block relocated to just above the ADD TO CART button (below Total) */
.pr-heading.use-relocated-title{margin-top:18px}
.use-relocated{margin-top:0}
.use-disclaimer{margin-top:8px;background:#fffbeb;border:1px solid #fde68a;border-left:3px solid #f59e0b;border-radius:7px;padding:9px 11px}
.use-disc-text{font-size:11px;line-height:1.5;color:#92400e;margin:0 0 8px}
.use-ack{display:flex;align-items:flex-start;gap:8px;font-size:11px;color:#3f2a06;cursor:pointer;font-weight:600}
.use-ack input{margin-top:1px;flex:0 0 auto;width:15px;height:15px;cursor:pointer;accent-color:#b45309}
.use-ack span{line-height:1.4}
.draw-btn{border:1px solid #1a56db;color:#1a56db;background:#fff;border-radius:6px;padding:5px 14px;font-size:11px;font-weight:700;letter-spacing:.03em;cursor:pointer}
.draw-btn:hover{background:#eff4ff}
.sel-grp{display:flex;flex-direction:column;gap:3px}
.sel-lbl{font-size:11px;font-weight:600}
.sel-w{position:relative}
.sel-w select{width:100%;appearance:none;-webkit-appearance:none;border:1px solid #d1d5db;border-radius:6px;padding:7px 26px 7px 9px;font-size:11px;background:#fff;cursor:pointer}
.sel-w select:focus{outline:none;border-color:#1a56db}
.sel-w::after{content:'▾';position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:11px;color:#9ca3af;pointer-events:none}
.sel-sub{font-size:9px;color:#ef4444;margin-top:2px}
.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;max-height:200px;overflow-y:auto}
.ci{display:flex;align-items:center;gap:5px;cursor:pointer;border:1px solid transparent;border-radius:6px;padding:5px 6px;transition:all .12s}
.ci:hover{background:#f9fafb;border-color:#e5e7eb}
.ci.sel{border-color:#1a56db;background:#eff4ff}
.cd{width:18px;height:18px;border-radius:50%;border:1px solid rgba(0,0,0,.1);flex-shrink:0}
.cl{font-size:9px;color:#6b7280;line-height:1.1;white-space:nowrap}
/* Custom colour dropdown with real swatches */
.csel-wrap{position:relative}
.csel-btn{width:100%;display:flex;align-items:center;gap:7px;border:1px solid #d1d5db;border-radius:6px;padding:7px 9px;font-size:11px;background:#fff;cursor:pointer;text-align:left}
.csel-btn:hover{border-color:#93aee8}
.csel-wrap.open .csel-btn{border-color:#1a56db}
.csel-dot{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.12);flex-shrink:0;display:inline-block}
.csel-txt{flex:1;color:#374151;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.csel-caret{color:#9ca3af;flex-shrink:0;transition:transform .15s}
.csel-wrap.open .csel-caret{transform:rotate(180deg)}
.csel-pop{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:4px;z-index:50;max-height:220px;overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .12s,transform .12s,visibility .12s}
.csel-wrap.open .csel-pop{opacity:1;visibility:visible;transform:translateY(0)}
.csel-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;cursor:pointer;font-size:11px;color:#374151}
.csel-item:hover{background:#f3f4f6}
.csel-item.sel{background:#eff4ff;color:#1a56db;font-weight:600}
.csel-iname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-item{display:grid;grid-template-columns:16px 1fr auto;gap:10px;align-items:start;padding:10px 0;cursor:pointer}
.pp-item:last-child{border-bottom:none}
.pp-item input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:#1a56db}
.pp-title{font-weight:600;font-size:12px;margin-bottom:2px}
.pp-desc{font-size:11px;color:#6b7280;line-height:1.3}
.pp-price{font-weight:600;font-size:12px;white-space:nowrap}
.disc{margin:4px 16px 8px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;padding:7px 10px;font-size:9px;color:#6b7280;line-height:1.5}
.notes{width:100%;border:1px solid #d1d5db;border-radius:6px;padding:7px 9px;font-size:12px;resize:none;font-family:inherit;background:#fff}
.notes:focus{outline:none;border-color:#1a56db}

/* RIGHT */
.right-body{flex:1;overflow-y:auto;padding:14px 16px}

/* Bulk prices toggle button + panel */
.bulk-toggle{font-size:11px;color:#1a56db;font-weight:700;background:none;border:none;cursor:pointer;padding:3px 6px;border-radius:3px;display:inline-flex;align-items:center;gap:3px;letter-spacing:.03em}
.bulk-toggle:hover{background:#eff4ff}
.pan-r .ph span, .pan-r .ph .bulk-toggle{white-space:nowrap}
.pan-r .ph{gap:8px}
.pan-r .ph > span:first-child{min-width:0;flex:1 1 auto}
.pan-r .ph > span:first-child > svg{flex:0 0 auto}
.pan-r .ph .bulk-toggle{flex:0 0 auto}
.bulk-panel{margin:6px 14px 8px;border:1px solid #e5e7eb;border-radius:6px;background:#f9fafb;overflow:hidden}
.bulk-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:5px 12px;font-size:11px;border-bottom:1px solid #eef2f7;align-items:center}
.bulk-row:last-child{border-bottom:none}
.bulk-row .bulk-qty{color:#6b7280}
.bulk-row .bulk-price{font-weight:700;color:#111827;font-variant-numeric:tabular-nums;min-width:54px;text-align:right}
.bulk-row .bulk-pct{color:#1a56db;font-weight:600;font-size:11px;min-width:60px;text-align:right}
.bulk-row.current{background:#eff4ff}
.bulk-row.current .bulk-qty{color:#1a56db;font-weight:700}
.bulk-row.current .bulk-qty::before{content:'\25B8\00A0';color:#1a56db}
.r-lbl{font-size:11px;font-weight:700;margin-bottom:5px}
.qty-row{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.qty-btn{width:26px;height:26px;border:1px solid #d1d5db;border-radius:4px;background:#fff;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer}
.qty-btn:hover{border-color:#1a56db}
.qty-val{font-size:14px;font-weight:600;width:52px;height:26px;text-align:center;border:1px solid #d1d5db;border-radius:4px;background:#fff;padding:0 4px;font-family:inherit}
.qty-val:focus{outline:none;border-color:#1a56db}
/* Equal height for the −, input and + (override theme input/button sizing) */
.qty-row .qty-btn{width:30px !important;height:30px !important;box-sizing:border-box}
.qty-row .qty-val{height:30px !important;padding:0 6px !important;line-height:normal !important;box-sizing:border-box}
.pri-sel{width:100%;border:1px solid #d1d5db;border-radius:6px;padding:7px 9px;font-size:11px;background:#fff;margin-bottom:12px}
.pr-heading{font-size:12px;font-weight:700;margin-bottom:6px;margin-top:14px}
.pr-row{display:flex;justify-content:space-between;padding:5px 0;font-size:11px;color:#6b7280;border-bottom:1px solid #fafafa}
.pr-row.total{border-top:2px solid #e5e7eb;margin-top:3px;padding-top:7px;font-size:14px;font-weight:600;color:#111827;border-bottom:none}
.atc-btn{width:100%;padding:10px 14px;background:#1a56db;color:#fff;border:none;border-radius:7px;font-size:12px;font-weight:700;letter-spacing:.02em;cursor:pointer;margin-top:6px;font-family:inherit;line-height:1.2}
.atc-btn.atc-review{background:#b45309}
.atc-btn.atc-review:hover{background:#92400e}
.atc-btn:hover{background:#1240a8}
.atc-btn:disabled{background:#d1d5db;color:#9ca3af;cursor:not-allowed}
/* Animated "Adding" running dots while the cart request is in flight */
.atc-dots{display:inline-block;vertical-align:middle}
.atc-dots i{display:inline-block;width:4px;height:4px;margin-left:3px;border-radius:50%;background:currentColor;opacity:.3;animation:s3dq-atc-dot 1s infinite ease-in-out}
.atc-dots i:nth-child(2){animation-delay:.16s}
.atc-dots i:nth-child(3){animation-delay:.32s}
@keyframes s3dq-atc-dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}
.success-area{display:none;margin-top:8px}
.already-badge{display:flex;align-items:center;gap:5px;font-size:12px;font-weight:600;color:#166534;margin-bottom:8px}
/* Unified style: NEXT MODEL / VIEW CART / CHECKOUT all match the primary CTA */
.nm-btn,.vc-btn,.co-btn{display:block;width:100%;padding:10px 14px;background:#1a56db;color:#fff;border:none;border-radius:7px;font-size:12px;font-weight:700;letter-spacing:.02em;text-align:center;text-decoration:none;cursor:pointer;margin-bottom:6px;box-sizing:border-box;font-family:inherit;line-height:1.2}
.nm-btn:hover,.vc-btn:hover,.co-btn:hover{background:#1240a8;color:#fff}
.help-row{text-align:center;font-size:11px;color:#9ca3af;margin-top:8px}
.help-lnk{color:#1a56db;font-weight:600;text-decoration:none}
.right-foot{padding:8px 12px;border-top:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;font-size:11px;flex-shrink:0}
.ft-lbl{font-weight:700}.ft-val{font-size:14px;font-weight:700}
.ft-sub{font-size:9px;color:#9ca3af}
.add-det{font-size:11px;color:#1a56db;font-weight:700;background:none;border:none;cursor:pointer}
.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem 2rem;gap:8px;color:#9ca3af;text-align:center;border:2px dashed #cbd5e1;border-radius:10px;margin:4px;transition:border-color .12s,background .12s}
.empty-state:hover,.empty-state.drag-over{border-color:#1a56db;background:#eff4ff}
.empty-icon{font-size:52px;line-height:1;color:#d1d5db}
.empty-title{font-size:14px;font-weight:700;color:#111827}
.empty-sub{font-size:12px;max-width:300px;line-height:1.5}
@keyframes spin{to{transform:rotate(360deg)}}
.spinner{display:inline-block;width:14px;height:14px;border:2px solid rgba(0,0,0,.08);border-top-color:#1a56db;border-radius:50%;animation:spin .7s linear infinite}

/* ── Compact spacing v3 — tighter vertical rhythm ───────
   PREFIXED with .page-wrap to raise specificity from (0,1,0) to (0,2,0)
   so these rules win over theme CSS (Porto, WC, WPBakery) that targets
   the same generic class names. */
.page-wrap .sec { padding: 6px 18px !important; }
.page-wrap .sec-lbl { margin-bottom: 4px !important; }
.page-wrap .mi { padding: 6px 18px 2px !important; }
.page-wrap .mi-name { margin-bottom: 1px !important; font-size: 14px !important; }
.page-wrap .mi-size { margin-bottom: 0 !important; }
.page-wrap .mat-pick { padding: 6px 12px !important; }
.page-wrap .mat-desc { margin-top: 2px !important; line-height: 1.25 !important; }
.page-wrap .sel-w select { padding: 8px 28px 8px 10px !important; }
.page-wrap .sel-sub { margin-top: 2px !important; }
.page-wrap .color-grid { gap: 4px !important; grid-template-columns: repeat(6,1fr) !important; }
.page-wrap .ci { padding: 3px 6px !important; }
.page-wrap .cd { width: 14px !important; height: 14px !important; }
.page-wrap .pp-item { padding: 5px 0 !important; gap: 10px !important; }
.page-wrap .pp-title { margin-bottom: 1px !important; }
.page-wrap .right-body { padding: 8px 14px !important; }
.page-wrap .r-lbl { margin-bottom: 3px !important; }
.page-wrap .qty-row { margin-bottom: 6px !important; }
.page-wrap .pri-sel { padding: 6px 10px !important; margin-bottom: 6px !important; }
.page-wrap .pr-heading { margin-bottom: 3px !important; margin-top: 14px !important; }
.page-wrap .pr-heading.use-relocated-title { margin-top: 18px !important; }
.page-wrap .pr-row { padding: 2px 0 !important; }
.page-wrap .pr-row.total { padding-top: 5px !important; margin-top: 3px !important; }
.page-wrap .atc-btn,
.page-wrap .vc-btn,
.page-wrap .co-btn,
.page-wrap .s3dq-qa { padding: 9px !important; margin-bottom: 6px !important; }
.page-wrap .atc-btn { margin-top: 6px !important; }
.page-wrap .s3dq-quote-actions { gap: 0 !important; }
.page-wrap .s3dq-quote-actions .s3dq-qa:last-child { margin-bottom: 0 !important; }
.page-wrap .co-btn { margin-bottom: 0 !important; }
.page-wrap .ph { padding: 0 14px !important; min-height: 40px !important; }
.page-wrap .fi { padding: 5px 12px !important; }
.page-wrap .drop-zone { margin: 6px 12px !important; padding: 5px 10px !important; }
.page-wrap .dz-icon { width: 18px !important; height: 18px !important; margin-bottom: 0 !important; }
.page-wrap .dz-sub { white-space: nowrap !important; font-size: 9px !important; }
.page-wrap .disc { margin: 8px 0 4px !important; padding: 6px 10px !important; }
.page-wrap .sec-row { gap: 10px !important; }
.page-wrap .draw-btn { padding: 5px 12px !important; }
.page-wrap .notes { padding: 6px 10px !important; }
.page-wrap .right-foot { padding: 6px 14px !important; }
.page-wrap .success-area { margin-top: 6px !important; }
.page-wrap .help-row { margin-top: 4px !important; }
.page-wrap .cart-empty { padding: 10px 14px !important; }
.page-wrap .tool { border-radius: 10px !important; }
.page-wrap .tc { padding: 6px 4px !important; }

/* ── v4 layout rearrangement ──────────────────── */
.cen-grid { display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; }
.cen-left { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cen-row { display: flex; flex-direction: row; align-items: stretch; gap: 10px; min-width: 0; }
.cen-row .viewer-wrap { flex: 1 1 auto; aspect-ratio: auto !important; height: 240px !important; max-height: 240px !important; }
.cen-row .file-info { flex: 0 0 200px; width: 200px; }
.cen-right { display: flex; flex-direction: column; min-width: 0; }

/* Viewer: square, all corners rounded, no right border */
.cen-left .viewer-wrap { max-height: 240px !important; border-right: none !important; border-radius: 8px !important; border: 1px solid #e5e7eb !important; width: 100%; }

/* File info card under viewer */
.file-info { background: #f3f4f6; padding: 7px 10px; border-radius: 8px; border: 1px solid #e5e7eb; }
.file-info .mi-name { font-size: 11px !important; font-weight: 700 !important; color: #111827 !important; margin: 0 0 6px 0 !important; line-height: 1.3 !important; }
.file-info .mi-size { font-size: 11px !important; color: #1a56db !important; margin: 0 0 6px 0 !important; line-height: 1.3 !important; }
.file-info .mi-vol { font-size: 11px !important; color: #6b7280 !important; margin: 0 !important; line-height: 1.3 !important; }
.file-info .mi-resize { font-size: 11px !important; color: #1a56db !important; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; text-decoration: none; font-weight: 500; }
.file-info .mi-resize:hover { color: #1240a8 !important; }

/* Wall pass: no margin so cen-left gap controls spacing */
.cen-left .wall-pass { margin: 0 !important; }

/* Tech grid: 4 cols, 5th item spans full row */
.cen-right .tg { grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 6px !important; height: auto !important; }
.cen-right .tc:nth-child(5) { grid-column: 1 / -1 !important; }
.cen-right .tc { padding: 7px 6px !important; min-height: 58px; }

/* Tech panel: bottom-border separator, no horizontal padding (parent provides it) */
.cen-right .tech-panel { padding: 0 0 14px 0 !important; overflow: visible; }

/* Sections inside cen-right: vertical padding only, no horizontal (parent provides) */
.cen-right .sec { padding-left: 0 !important; padding-right: 0 !important; padding-top: 4px !important; padding-bottom: 4px !important; border-top: none !important; }
.cen-right .disc { margin-left: 0 !important; margin-right: 0 !important; }

/* Color grid: 5 cols matching screenshot */
.cen-right .color-grid { grid-template-columns: repeat(5, 1fr) !important; gap: 6px !important; }
.cen-right .cd { width: 14px !important; height: 14px !important; }

/* Technical drawings button - sized like screenshot */
.cen-right .draw-btn { padding: 8px 18px !important; font-size: 11px !important; }

/* ── Fix: make cart cards actually visible ─────────────
   .left-scroll had flex:1 which consumed all panel height,
   leaving .cart-items with 0px and clipping its content.
   .cart-items needs a non-zero min-height so flexbox can't
   collapse it below content size. */
.pan-l .left-scroll { flex: 0 1 auto !important; }
.pan-l .cart-items { flex: 1 1 auto !important; overflow-y: auto !important; min-height: 180px !important; }
.pan-l .cart-card { display: block !important; }

/* ── WordPress/Porto/WPBakery wrapper neutralization ──────
   Force parent wrappers full-width so the tool isn't constrained
   by Visual Composer / Porto container max-widths. */
.page-id-11249 .vcv-content--blank,
.page-id-11249 article.post-11249,
.page-id-11249 article.post-11249 > .entry-content,
.page-id-11249 .wpb-content-wrapper,
.page-id-11249 .vc_row.top-row,
.page-id-11249 .vc_row.top-row > .vc_column_container,
.page-id-11249 .vc_row.top-row .vc_column-inner,
.page-id-11249 .vc_row.top-row .wpb_wrapper,
.page-id-11249 .wpb_raw_code,
.page-id-11249 .wpb_raw_code > .wpb_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
    float: none !important;
}

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE — tablet & mobile.
   Desktop (≥1024px) is untouched: the original 3-column layout
   (.tool = 250px 1fr 250px) only applies at ≥1024px now, because
   these media queries override it below that width.
   All overrides are prefixed with .page-wrap and use !important so
   they beat the plugin's enqueued CSS (which is .page-wrap-prefixed
   too) regardless of source order.
   ════════════════════════════════════════════════════════════════ */

/* ── TABLET: 768px–1023px ──────────────────────────────────────
   Collapse the 3 outer columns into a single stacked column.
   The centre keeps its viewer + options side-by-side (there's room).
   Order: Models → Configurator (viewer+options) → Cart/Actions. */
@media (max-width: 1023px) {
  .page-wrap { padding: 8px 16px !important; }
  .page-wrap .tool {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 14px !important;
    min-height: 0 !important;
  }
  .page-wrap .pan {
    width: 100% !important;
    max-width: 100% !important;
  }
  /* Panels become normal-flow blocks with a card look + visible borders.
     (pan-l is now a wrapper holding the Models + Cart cards, so it gets no
     border itself — its child .pan cards provide the card look.) */
  .page-wrap .pan-l,
  .page-wrap .pan-c,
  .page-wrap .pan-r {
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    background: #fff !important;
    overflow: hidden !important;
  }
  /* Let scroll regions grow with content instead of fighting for fixed height */
  .page-wrap .left-scroll,
  .page-wrap .right-body,
  .page-wrap .pan-c,
  .page-wrap .tech-panel,
  .page-wrap .cart-items {
    overflow-y: visible !important;
    max-height: none !important;
  }
  .page-wrap .pan-l .cart-items {
    min-height: 120px !important;
    max-height: 360px !important;
    overflow-y: auto !important;
  }
  /* Ensure the cart footer + shipping below the items are never clipped on
     mobile: let the left panel grow with its content. */
  .page-wrap .pan-l {
    overflow: visible !important;
    height: auto !important;
  }
  .page-wrap .pan-l .cart-ship,
  .page-wrap .pan-l .cart-foot {
    flex-shrink: 0 !important;
  }
  /* Cart block relocated to the very bottom on mobile — give it its own card. */
  #root > .cart-block {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow: visible !important;
  }
}

/* ── PHONE: ≤767px ─────────────────────────────────────────────
   Stack everything to one column. Viewer goes full-width on top of
   its options. Larger touch targets. Multi-col spec grids relax. */
@media (max-width: 767px) {
  /* Limited space: step the whole type scale down one level
     (heading 14→12, body 12→11, caption stays 9 as the floor). */
  .page-wrap .tool { --fs-lg: 12px; --fs-md: 11px; --fs-sm: 9px; }
  .page-wrap .ph, .page-wrap .ph span,
  .page-wrap .cart-foot .cf-total, .page-wrap .cart-ship .cs-head,
  .page-wrap .mi-name, .page-wrap .qty-val,
  .page-wrap .pr-row.total, .page-wrap .ft-val,
  .page-wrap .empty-title { font-size: 12px !important; }
  /* Keep "Cart Total" + value + GST on one line on mobile. */
  .page-wrap .cart-foot .cf-total { gap: 4px !important; }
  .page-wrap .cart-foot .cf-sub { font-size: 9px !important; }
  .page-wrap { padding: 6px 10px !important; }

  /* Header: stack vertically and centre the logo + nav */
  .page-wrap .logo-bar {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
  }
  /* Logo block: remove the desktop left offset, centre it */
  .page-wrap .logo-bar > div:first-child {
    margin-left: 0 !important;
    text-align: center !important;
  }
  /* Nav: drop the margin-left:auto push, centre the links, allow wrap */
  .page-wrap .logo-bar .nav {
    margin-left: 0 !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .page-wrap .logo-bar .nav-lnk {
    font-size: 14px !important;
    padding: 8px 12px !important;
  }

  /* Centre: viewer + options stack vertically */
  .page-wrap .cen-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: 12px !important;
    padding: 10px !important;
  }
  .page-wrap .cen-left,
  .page-wrap .cen-right { width: 100% !important; }
  /* Mobile: viewer + info stack vertically (no side-by-side). */
  .page-wrap .cen-row { flex-direction: column !important; }
  .page-wrap .cen-row .file-info { flex: 1 1 auto !important; width: 100% !important; }
  .page-wrap .cen-row .viewer-wrap { height: auto !important; }

  /* 3D viewer: full width, sensible height on a phone */
  .page-wrap .cen-left .viewer-wrap,
  .page-wrap .viewer-wrap {
    width: 100% !important;
    max-height: 300px !important;
    aspect-ratio: 4 / 3 !important;
    border-right: none !important;
  }

  /* Avoid a doubled-up uploader on phone: the Models card already has the
     "ADD FILES" dropzone, so hide the large empty-state prompt here. The
     middle panel is hidden entirely until a model is loaded (JS adds
     .has-model), so there's no empty white card. Desktop is unaffected. */
  .page-wrap .pan-c > #estate { display: none !important; }
  .page-wrap .pan-c:not(.has-model) { display: none !important; }

  /* Top-row (when present) stacks too */
  .page-wrap .top-row {
    grid-template-columns: 1fr !important;
  }

  /* Tech-type tiles: 2 across instead of 3–4 */
  .page-wrap .tg,
  .page-wrap .cen-right .tg {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 8px !important;
  }
  .page-wrap .cen-right .tc:nth-child(5) { grid-column: 1 / -1 !important; }

  /* Colour swatches: more per row is fine, they're small */
  .page-wrap .color-grid,
  .page-wrap .cen-right .color-grid {
    grid-template-columns: repeat(6, 1fr) !important;
    gap: 8px !important;
  }
  /* Bigger colour dots for finger taps */
  .page-wrap .cd,
  .page-wrap .cen-right .cd {
    width: 20px !important;
    height: 20px !important;
  }

  /* Two-up spec rows go single column */
  .page-wrap .sec-row { grid-template-columns: 1fr !important; gap: 10px !important; }

  /* Bigger touch targets on form controls — all matched to one height */
  .page-wrap select,
  .page-wrap .sel-w select,
  .page-wrap .csel-btn {
    min-height: 46px !important;
    height: 46px !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
  }
  .page-wrap .csel-btn { padding-top: 0 !important; padding-bottom: 0 !important; }
  .page-wrap .atc-btn,
  .page-wrap .vc-btn,
  .page-wrap .co-btn {
    min-height: 46px !important;
    font-size: 14px !important;
  }
  .page-wrap .draw-btn,
  .page-wrap .cen-right .draw-btn {
    min-height: 40px !important;
    padding: 10px 16px !important;
  }

  /* Cart action buttons (delete / duplicate) — easier to tap */
  .page-wrap .cc-action {
    min-width: 32px !important;
    min-height: 32px !important;
  }

  /* Post-processing rows: comfortable spacing */
  .page-wrap .pp-item { padding: 12px 0 !important; }

  /* Cart list can grow taller on phone before scrolling */
  .page-wrap .pan-l .cart-items {
    max-height: 50vh !important;
  }

  /* My-account dropdown: keep it anchored directly under the button on phone.
     (position:relative on the parent is required so the absolutely-positioned
     menu drops under the button instead of falling to the page top.) */
  .page-wrap .nav-dd { position: relative !important; }
  .page-wrap .nav-dd-menu {
    left: auto !important;
    right: 0 !important;
    transform: translateY(-4px) !important;
    min-width: 220px !important;
  }
  .page-wrap .nav-dd.open .nav-dd-menu,
  .page-wrap .nav-dd:hover .nav-dd-menu {
    transform: translateY(0) !important;
  }
  .page-wrap .nav-dd-menu a { padding: 8px 14px !important; font-size: 14px !important; line-height: 1.3 !important; }
}

/* ── SMALL PHONE: ≤400px ───────────────────────────────────────
   Tighten further for the narrowest devices. */
@media (max-width: 400px) {
  .page-wrap .tg,
  .page-wrap .cen-right .tg {
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
  }
  .page-wrap .color-grid,
  .page-wrap .cen-right .color-grid {
    grid-template-columns: repeat(5, 1fr) !important;
  }
  .page-wrap .logo-bar .nav-lnk {
    font-size: 12px !important;
    padding: 7px 10px !important;
  }
  .page-wrap .cen-left .viewer-wrap,
  .page-wrap .viewer-wrap { max-height: 240px !important; }
}

/* ── Page loading overlay ─────────────────────────────────── */
.s3dq-loader{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;background:#f3f4f6;opacity:1;transition:opacity .4s ease;animation:s3dq-loader-fail 1ms linear 6s forwards}
.s3dq-loader.s3dq-hide{opacity:0;pointer-events:none}
@keyframes s3dq-loader-fail{to{opacity:0;visibility:hidden;pointer-events:none}}
.s3dq-loader .s3dq-load-box{display:flex;flex-direction:column;align-items:center;gap:14px}
.s3dq-loader .s3dq-load-spin{width:42px;height:42px;border:4px solid #d1d5db;border-top-color:#1a56db;border-radius:50%;animation:s3dq-load-rot .7s linear infinite}
.s3dq-loader .s3dq-load-txt{font-size:14px;color:#6b7280;font-weight:500}
@keyframes s3dq-load-rot{to{transform:rotate(360deg)}}

/* ── Cart shipping section ────────────────────────────────── */
.cart-ship{padding:12px 14px;border:1px solid #e5e7eb;border-radius:10px;flex-shrink:0;background:#fff;position:relative}
.cart-ship .cs-head{font-size:14px;font-weight:600;color:#111827;margin:0 -14px 10px;padding:0 14px 10px;border-bottom:1px solid #e5e7eb}
.cart-ship .cs-free{margin-bottom:10px}
.cart-ship .cs-prog-lbl{font-size:11px;font-weight:600;color:#92400e;margin-bottom:6px}
.cart-ship .cs-prog-lbl.go{color:#047857}
.cart-ship .cs-prog-track{height:7px;border-radius:99px;background:#e5e7eb;overflow:hidden}
.cart-ship .cs-prog-fill{height:100%;background:#f59e0b;border-radius:99px;transition:width .4s ease}
.cart-ship .cs-prog-fill.full{background:#10b981}
.cart-ship .cs-method{display:flex;align-items:flex-start;gap:8px;font-size:12px;line-height:1.35;color:#374151;padding:5px 0;cursor:pointer}
.cart-ship .cs-method-lbl{line-height:1.35}
.cart-ship .cs-method input{margin:2px 0 0;flex:0 0 auto}
.cart-ship .cs-method .amount{font-weight:600;color:#111827}
.cart-ship .cs-none{font-size:11px;color:#9ca3af;padding:2px 0}
.cart-ship .cs-calc{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.cart-ship .cs-calc-lbl{margin-top:10px;font-size:11px;color:#6b7280}
.cart-ship .cs-calc select,.cart-ship .cs-calc input{width:100%;font-size:12px;padding:6px 8px;border:1px solid #d1d5db;border-radius:6px;background:#fff;box-sizing:border-box}
.cart-ship .cs-update{display:block;width:100%;padding:10px;background:#1a56db;color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:700;letter-spacing:.06em;text-align:center;text-transform:uppercase;cursor:pointer;box-sizing:border-box;font-family:inherit;margin-top:2px}
.cart-ship .cs-update:hover{background:#1240a8;color:#fff}
.cart-ship.cs-busy{pointer-events:none}
.cart-ship.cs-busy::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.6);z-index:1}
.cart-ship.cs-busy::before{content:"";position:absolute;top:50%;left:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border:3px solid #d1d5db;border-top-color:#1a56db;border-radius:50%;animation:s3dq-ship-spin .7s linear infinite;z-index:2}
@keyframes s3dq-ship-spin{to{transform:rotate(360deg)}}

/* ===== B2B layer (presentation only; no pricing/cart/upload logic) ===== */
.logo-bar .nav-lnk.nav-info{color:#374151;font-weight:500}
.logo-bar .nav-lnk.nav-info:hover{background:#eff4ff;color:#1a56db}
.s3dq-hero{margin:2px 0 14px;padding:0 2px;text-align:center}
.s3dq-hero-title{font-size:21px;font-weight:800;color:#0f172a;letter-spacing:-.4px;line-height:1.2;margin:0}
.s3dq-hero-sub{font-size:13px;color:#5b6472;margin:5px auto 0;max-width:760px;line-height:1.45}
.s3dq-badges{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:0;padding:0}
.s3dq-badges li{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;color:#334155;background:#fff;border:1px solid #e5e7eb;border-radius:20px;padding:5px 11px}
.s3dq-badges li svg{flex-shrink:0;color:#1a56db}
.s3dq-how{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px auto 0;padding:0;max-width:520px}
.s3dq-how li{display:inline-flex;align-items:center;gap:7px;font-size:11px;color:#475569;background:#f8fafc;border:1px solid #eef2f7;border-radius:8px;padding:7px 11px}
.s3dq-how-n{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#1a56db;color:#fff;font-size:10px;font-weight:700;flex-shrink:0}
.s3dq-how-t{font-weight:500;line-height:1.3;text-align:left}
.s3dq-intent{margin:10px 0 6px;padding:10px 0 2px;border-top:1px solid #eef2f7}
.s3dq-intent-lbl{font-size:11px;font-weight:700;color:#374151;margin-bottom:6px}
.s3dq-intent-btns{display:flex;gap:6px;flex-wrap:wrap}
.s3dq-intent-b{flex:1;min-width:90px;font-size:11px;font-weight:600;color:#475569;background:#fff;border:1px solid #d1d5db;border-radius:7px;padding:7px 8px;cursor:pointer;transition:all .12s}
.s3dq-intent-b:hover{border-color:#1a56db;color:#1a56db;background:#eff4ff}
.s3dq-intent-b.is-on{background:#1a56db;border-color:#1a56db;color:#fff}
.bulk-cap{font-size:11px;color:#6b7280;padding:6px 14px 0;line-height:1.4}
.bulk-workflow{font-size:11px;color:#475569;background:#eff4ff;border:1px solid #dbe7ff;border-radius:8px;margin:8px 14px 2px;padding:8px 11px;line-height:1.45}
.s3dq-quote-actions{display:flex;flex-direction:column;gap:6px;margin-top:6px}
.s3dq-qa{width:100%;font-size:12px;font-weight:700;letter-spacing:.02em;line-height:1.2;color:#1a56db;background:#fff;border:1px solid #1a56db;border-radius:7px;padding:10px 14px;cursor:pointer;text-align:center;font-family:inherit;transition:all .12s}
.s3dq-qa:hover{background:#eff4ff}
.s3dq-qa.primary{background:#1a56db;color:#fff}
.s3dq-qa.primary:hover{background:#1240a8}
@media (max-width:1023px){.s3dq-hero-title{font-size:19px}}
@media (max-width:767px){
  .s3dq-hero-title{font-size:17px}.s3dq-hero-sub{font-size:12px}
  .s3dq-badges li{font-size:10px;padding:4px 9px}
  .s3dq-how{gap:6px}.s3dq-how li{font-size:10px;padding:6px 9px}
  .logo-bar{flex-wrap:wrap;gap:8px;padding:6px 0}
  .logo-bar .logo-link{margin-left:0 !important;width:100%;text-align:left !important}
  .logo-bar .nav{margin-left:0;width:100%;justify-content:flex-start;gap:8px}
  .logo-bar .nav-lnk{font-size:12px;padding:7px 12px}
  .logo-bar .nav-lnk.new-q{flex:1;justify-content:center}
  .logo-bar .nav-dd{flex:0 0 auto}
  .nav-lnk-extra{display:none}
  .nav-dd-menu{right:0;left:auto}
}

/* ── 3D viewer controls (wireframe / views / reset / info / gizmo) ── */
.s3dq-vctrls{position:absolute;bottom:8px;right:8px;display:flex;flex-direction:column;gap:4px;z-index:5;align-items:flex-end}
.s3dq-vb{background:rgba(255,255,255,.92);border:1px solid #d1d5db;color:#6b7280;border-radius:6px;padding:4px 8px;font-size:10px;font-weight:600;line-height:1;cursor:pointer;display:inline-flex;align-items:center;gap:4px;min-width:40px;justify-content:center}
.s3dq-vb:hover,.s3dq-vb.on{border-color:#1a56db;color:#1a56db;background:#fff}
.s3dq-gizmo{position:absolute;top:8px;right:8px;width:56px;height:56px;z-index:5}
.s3dq-vinfo{position:absolute;bottom:8px;left:8px;z-index:6}
.s3dq-vinfo-btn{background:rgba(255,255,255,.92);border:1px solid #d1d5db;color:#6b7280;border-radius:50%;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.s3dq-vinfo-btn:hover{border-color:#1a56db;color:#1a56db}
.s3dq-vinfo-pop{display:none;position:absolute;bottom:28px;left:0;width:190px;background:#111827;color:#fff;font-size:10px;line-height:1.4;padding:7px 9px;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.s3dq-vinfo:hover .s3dq-vinfo-pop{display:block}