/* === CelloDie Block Calculator theme === */
:root, [data-bs-theme="dark"] {
  --ok:#19b54a;
  --bad:#e53935;
  --brand:#f68528;
  --brand2:#d96f15;
  --ink:#061019;
  --bg-rgb: 6,16,25;
  --panel:rgba(15,27,42,.92);
  --line:#1c3147;
  --muted:#9fb2c6;
  --text:#e7f0f8;
  --shadow:0 20px 60px rgba(0,0,0,.25);
  --radius:18px;
  --header-bg:#0d1a24;
  --bg-gradient: radial-gradient(1100px 550px at 20% -10%, rgba(246,133,40,.18), transparent 60%),
                 radial-gradient(900px 500px at 90% 0%, rgba(246,133,40,.10), transparent 55%),
                 var(--ink);
}

[data-bs-theme="light"] {
  --ok:#19b54a;
  --bad:#e53935;
  --brand:#f68528;
  --brand2:#d96f15;
  --ink:#f8f9fa;
  --bg-rgb: 248,249,250;
  --panel:rgba(255,255,255,.92);
  --line:#dee2e6;
  --muted:#6c757d;
  --text:#212529;
  --shadow:0 10px 30px rgba(0,0,0,.1);
  --radius:18px;
  --header-bg:#f8f9fa;
  --bg-gradient: radial-gradient(1100px 550px at 20% -10%, rgba(246,133,40,.08), transparent 60%),
                 radial-gradient(900px 500px at 90% 0%, rgba(246,133,40,.05), transparent 55%),
                 var(--ink);
}

* { box-sizing:border-box; }

body {
  background: var(--bg-gradient);
}

header {
  background: var(--header-bg);
  border-bottom:1px solid var(--line);
}

.header-inner {
  max-width:1200px;
  margin:0 auto;
  padding:14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
}

.logo {
  width:44px;
  height:44px;
  border-radius:12px;
  background:#0b1420;
  border:1px solid rgba(28,49,71,.9);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  color:rgba(255,255,255,.85);
  font-weight:900;
  font-size:12px;
  letter-spacing:.3px;
}

.title {
  margin:0;
  font-size:16px;
  font-weight:900;
  letter-spacing:.2px;
}

.sub {
  margin-top:2px;
  color:var(--muted);
  font-size:13px;
}

.tag {
  color:#fff;
  font-weight:800;
  font-size:13px;
  white-space:nowrap;
}

.top-accent-bar {
  height:4px;
  width:100%;
  background:#f68528;
}

.container-wide {
  max-width:none;
  margin:0;
  padding:16px;
}

.abs-card {
  background:var(--panel);
  border:1px solid rgba(28,49,71,.9);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}

/* === Theme Overrides for Bootstrap Alerts === */
[data-bs-theme="dark"] .alert-warning {
  background-color: rgba(255, 193, 7, 0.2);
  border-color: #ffc107;
  color: #ffecb3;
}
[data-bs-theme="dark"] .alert-danger {
  background-color: rgba(220, 53, 69, 0.2);
  border-color: #dc3545;
  color: #f8d7da;
}
[data-bs-theme="dark"] .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

.abs-card-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  background:rgba(6,16,25,.25);
  border-bottom:1px solid rgba(28,49,71,.65);
}

.abs-card-head h2 {
  margin:0;
  font-size:14px;
  color:#f2fbff;
  letter-spacing:.2px;
}

.abs-pill {
  font-size:12px;
  color:var(--text);
  background:rgba(var(--bg-rgb),.55);
  border:1px solid var(--line);
  padding:4px 8px;
  border-radius:999px;
}

.content {
  padding:14px;
}

.form {
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}

@media (max-width: 680px) {
  .form { grid-template-columns:1fr; }
}

label {
  display:block;
  font-size:12px;
  /*color:rgba(231,240,248,.86);*/
  margin:0 0 6px 2px;
}


select {
  width:100%;
  font:inherit;
  color:rgba(231,240,248,.98);
  background:rgba(6,16,25,.55);
  border:1px solid rgba(28,49,71,.85);
  border-radius:12px;
  padding:10px 10px;
  min-height:40px;
  outline:none;
}

input:focus,
select:focus {
  border-color: rgba(246,133,40,.80);
  box-shadow: 0 0 0 4px rgba(246,133,40,.14);
}

.hint {
  margin-top:6px;
  color:rgba(159,178,198,.9);
  font-size:12px;
  line-height:1.35;
}

.abs-btnbar {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:6px;
}

.abs-btn {
  border:1px solid rgba(28,49,71,.9);
  background:rgba(6,16,25,.35);
  color:rgba(255,255,255,.92);
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
  user-select:none;
}

.abs-btn.abs-primary {
  border-color: rgba(246,133,40,.75);
  background: linear-gradient(135deg, rgba(246,133,40,.24), rgba(246,133,40,.14));
}

.abs-btn:disabled {
  opacity:.55;
  cursor:not-allowed;
}

.kpis {
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.kpi {
  border:1px solid rgba(28,49,71,.65);
  background: rgba(6,16,25,.25);
  border-radius:14px;
  padding:10px 12px;
}

.kpi .k {
  font-size:12px;
  color:rgba(159,178,198,.9);
  margin-bottom:4px;
}

.kpi .v {
  font-size:18px;
  font-weight:950;
  color:var(--text);
}

.kpi .s {
  margin-top:4px;
  font-size:12px;
  color:rgba(231,240,248,.78);
}

/* Preview panel */
.previewBox {
  border:1px solid rgba(28,49,71,.65);
  border-radius:14px;
  background:rgba(6,16,25,.18);
  overflow:hidden;
}

.previewHead {
  /* display:flex; removed to let Bootstrap classes handle it */
  /* align-items:center; */
  /* justify-content:space-between; */
  /* gap:10px; */
  padding: 10px 12px;
  border-bottom: 1px solid rgba(28,49,71,.55);
  background: rgba(6,16,25,.25);
  margin-bottom: 0 !important;
}

.previewTitle {
  font-weight:900;
  font-size:12px;
  letter-spacing:.2px;
  color:var(--text);
}

.mono {
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.abs-danger {
  border:1px solid rgba(255,180,70,.45);
  background:rgba(255,180,70,.10);
  color:rgba(255,236,200,.92);
  border-radius:12px;
  padding:10px 12px;
  margin-top:10px;
  font-size:12px;
  line-height:1.35;
}

/* Blocks list */
.blockRow {
  border:1px solid rgba(28,49,71,.65);
  background: rgba(6,16,25,.18);
  border-radius:14px;
  padding:10px 12px;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}

.blockRow:hover {
  transform: translateY(-1px);
}

.blockRow.selected {
  border-color: rgba(246,133,40,.85);
  box-shadow: 0 0 0 3px rgba(246,133,40,.18), 0 10px 30px rgba(0,0,0,.22);
  background: linear-gradient(135deg, rgba(246,133,40,.16), rgba(6,16,25,.14));
}

.blockTop {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.blockName {
  font-weight:950;
  color:#fff;
}

.blockMeta {
  margin-top:6px;
  font-size:12px;
  color:rgba(231,240,248,.78);
}

.blockActions {
  display:flex;
  gap:8px;
  margin-top:10px;
}

.miniBtn {
  border:1px solid rgba(28,49,71,.85);
  background:rgba(6,16,25,.35);
  color:rgba(255,255,255,.92);
  padding:8px 10px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
  font-size:12px;
}

.miniBtn.dangerBtn {
  border-color: rgba(255,120,120,.45);
}

.miniBtn:disabled {
  opacity:.55;
  cursor:not-allowed;
}

/* Canvas */
canvas {
  display:block;
  width:100%;
  height:auto;
}

.canvasWrap {
  padding:12px;
}

.canvasHint {
  font-size:12px;
  color:rgba(159,178,198,.9);
  padding:0 12px 12px;
}

/* Right column layout */
.rightStack {
  display:grid;
  gap:14px;
}

.sep {
  height:1px;
  background:rgba(28,49,71,.65);
  margin:12px 0;
}

/* Layout: keep preview to the right (desktop) */
.split {
  display:grid !important;
  grid-template-columns: 320px 1fr !important;
  gap:14px !important;
  align-items:start !important;
}

.split > section.abs-card,
.split > aside.rightStack {
  min-width:0;
}

@media (max-width: 900px) {
  .split {
    grid-template-columns: 1fr !important;
  }
}

/* Definitive 2-column layout */
.layout {
  display:grid !important;
  grid-template-columns:320px 1fr !important;
  gap:14px !important;
  align-items:start !important;
}

.layout > section.abs-card,
.layout > aside.rightStack {
  min-width:0;
}

@media (max-width: 900px) {
  .layout {
    grid-template-columns:1fr !important;
  }
}

.miniWarn {
  margin-top:8px;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.badgeBad {
  display:inline-flex;
  align-items:center;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(229,57,53,.14);
  border:1px solid rgba(229,57,53,.45);
  color:rgba(255,220,220,.96);
  font-size:12px;
  font-weight:700;
}

.noteBar {
  margin:10px 0 12px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,140,0,.10);
  border:1px solid rgba(255,140,0,.35);
  color:rgba(255,255,255,.92);
  font-size:13px;
}

.totalsRow {
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}

.priceBar {
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:12px 16px;
  background:rgba(12,12,14,.92);
  border-top:3px solid var(--brandOrange, #ff7a00);
  box-shadow: 0 -6px 18px rgba(0,0,0,.25);
  backdrop-filter: blur(10px);
  z-index: 50;
}

.priceBarLeft {
  display:flex;
  flex-direction:column;
  gap:2px;
}

.priceBarTitle {
  font-weight:800;
  letter-spacing:.2px;
}

.priceBarMeta {
  opacity:.8;
  font-size:13px;
}

.priceBarRight {
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
}

.priceBarPrice {
  font-size:18px;
  font-weight:900;
}

.priceBarNotes {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  opacity:.8;
}

.priceBarDot {
  opacity:.6;
}

.preflightBar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
}

.preflightTitle {
  font-weight:900;
}

.preflightMsg {
  font-size:13px;
  opacity:.85;
  margin-top:2px;
}

.preflightBadge {
  font-weight:900;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  opacity:.95;
}

.preflightPending {
  border-color: rgba(255,255,255,.14);
}

.preflightPass {
  border-color: rgba(46,204,113,.45);
  background: rgba(46,204,113,.06);
}

.preflightPass .preflightBadge {
  background: rgba(46,204,113,.18);
  border-color: rgba(46,204,113,.45);
}

.preflightFail {
  border-color: rgba(229,57,53,.55);
  background: rgba(229,57,53,.06);
}

.preflightFail .preflightBadge {
  background: rgba(229,57,53,.18);
  border-color: rgba(229,57,53,.55);
}

/* Strong error/warn bar */
#warnBar {
  border-radius:12px;
}

#warnBar a {
  color:inherit;
  text-decoration:underline;
}

#warnBar.errorStrong {
  border-color: rgba(229,57,53,.95);
  background: rgba(229,57,53,.22);
  color: rgba(255,245,245,.98);
}

/* Modal close button positioning */
#submitModal .modalCard {
  position:relative;
}

#btnCloseModal {
  position:absolute;
  top:12px;
  right:12px;
  z-index:5;
  pointer-events:auto;
}

/* Zoom lens */
.lensbar {
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  margin:10px 0 8px;
}

.lensbar .zbtn {
  border:1px solid rgba(0,0,0,.18);
  background:#fff;
  border-radius:10px;
  padding:8px 12px;
  cursor:pointer;
  font-weight:800;
}

.lensbar .hint {
  font-weight:700;
  color:rgba(0,0,0,.65);
  margin-right:auto;
}

#zoomLensWrap {
  position:absolute;
  right:16px;
  bottom:16px;
  width:360px;
  height:240px;
  border:3px solid #ff7a00;
  border-radius:12px;
  background:#fff;
  display:none;
  box-shadow:0 10px 22px rgba(0,0,0,.22);
  z-index:30;
}

#zoomLens {
  width:100%;
  height:100%;
}


/* Hide Smart selection UI (customer-facing) */
#tol,
#maxpix,
label[for="tol"],
label[for="maxpix"] {
  display:none !important;
}


.chev {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  border:1px solid rgba(28,49,71,.65);
  background: rgba(6,16,25,.18);
  transition: transform .15s ease;
  flex: 0 0 auto;
}


.unitTag {
  font-size:12px;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid rgba(28,49,71,.65);
  background: rgba(6,16,25,.18);
  color: rgba(159,178,198,.95);
  font-weight: 800;
}


.switch {
  position:relative;
  width:46px;
  height:26px;
  border-radius:999px;
  border:1px solid rgba(28,49,71,.65);
  background: rgba(10,22,35,.55);
  flex:0 0 auto;
}

.switch input {
  opacity:0;
  width:0;
  height:0;
  position:absolute;
}

.switch .knob {
  position:absolute;
  top:3px;
  left:3px;
  width:20px;
  height:20px;
  border-radius:999px;
  background: rgba(255,255,255,.92);
  transition: transform .15s ease;
  box-shadow: 0 4px 10px rgba(0,0,0,.35);
}

.switch input:checked + .knob {
  transform: translateX(20px);
}

.switch input:disabled + .knob {
  opacity:.55;
}

.switch:has(input:checked) {
  background: rgba(44,160,110,.55);
}

.padSelected {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 10px;
  border-radius:14px;
  border:1px solid rgba(28,49,71,.65);
  background: rgba(6,16,25,.12);
  margin-top:10px;
}

.padSelected .name {
  font-weight:950;
  color:#fff;
}

.padSelected .meta {
  color: rgba(159,178,198,.9);
  font-size:12px;
  margin-top:4px;
}

.padHint {
  margin-top:6px;
  color: rgba(159,178,198,.9);
  font-size:12px;
}

/* Smart selection tidy */
#smartSel .s,
#smartSel .hint {
  display:none !important;
}

#smartSel .form {
  margin-top:8px !important;
}

#smartSel label {
  font-weight:850;
}

/* Thin detail warning banner (non-blocking) */
.thinWarnBanner {
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  border:2px solid rgba(255,200,80,.55);
  background: rgba(255, 120, 0, .28);
  color: rgba(255,255,255,.95);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
  max-width: 720px;
}

.thinWarnTitle {
  font-weight: 950;
  letter-spacing: .2px;
  font-size: 15px;
}

.thinWarnMsg {
  margin-top:6px;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 800;
}

/* ------------------------------------------------------------------------- */
/* Extracted styles from former inline <style> tags                           */
/* ------------------------------------------------------------------------- */

/* make the actual thin-detail hint obvious (non-blocking) */
.thin-detail-warn-box{
  display:block !important;
  margin:10px 0 12px 0 !important;
  padding:14px 16px !important;
  background:#b00020 !important;
  border:2px solid #ff5252 !important;
  border-radius:12px !important;
  box-shadow:0 10px 24px rgba(0,0,0,.18) !important;
  color:#fff !important;
  font-weight:800 !important;
  line-height:1.25 !important;
}
.thin-detail-warn-box:before{
  content:"⚠ Artwork warning: fine detail below 0.1pt";
  display:block;
  font-weight:950;
  font-size:15px;
  margin-bottom:6px;
}
.thin-detail-warn-sub{
  display:block;
  margin-top:6px;
  font-size:12px;
  font-weight:600;
  color:rgba(255,255,255,.85);
}

.warnLine{
  margin-top:6px;
  padding:6px 8px;
  border-radius:10px;
  background:rgba(176,0,32,.12);
  border:1px solid rgba(176,0,32,.35);
  color:#b00020;
  font-weight:800;
  font-size:12px;
}

/* rotation controls in preview header */
.rotControls{ padding: 2px 0; }
.btn-abs-tool{
  border:1px solid rgba(28,49,71,.85);
  background:rgba(6,16,25,.35);
  color:rgba(255,255,255,.92);
  cursor:pointer;
  font-weight:700;
  line-height:1;
  transition: all 0.15s ease;
}

.btn-abs-tool:hover {
  z-index: 2;
  border-color: rgba(246,133,40,.6);
  color: #fff;
}

.btn-abs-tool.active,
.btn-abs-tool.abs-primary {
  z-index: 2;
  border-color: rgba(246,133,40,.85);
  background: linear-gradient(135deg, rgba(246,133,40,.35), rgba(246,133,40,.20));
  color: #fff;
  box-shadow: 0 0 0 2px rgba(246,133,40,.15);
}

.btn-abs-tool:disabled{opacity:.40; cursor:not-allowed; border-color: #404f61}
.rotLabel{ font-size:12px; color:rgba(231,240,248,.85); font-weight:850; margin-right:2px; }
.toolbar-group { display: flex; flex-direction: column; gap: 4px; }
.toolbar-label { font-size: 10px; font-weight: 850; text-transform: uppercase; color: rgba(231,240,248,.6); letter-spacing: 0.5px; line-height: 1; margin-left: 2px; }
.btn-abs-tool i {
  font-size: 11px;
  vertical-align: 1px;
}

/* rotate stage */
#rotStage{
  position: relative;
  display: inline-block;
  transform-origin: center center;
  will-change: transform;
}

/* make rotated canvas fill preview window and stay centered */
.canvasWrap{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  width:100%;
  height:100%;
  overflow:hidden;
}

#rotStage{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  width:100%;
  height:100%;
  transform-origin:center center;
  margin:0 auto;
}

#rotStage canvas{
  max-width:100%;
  max-height:100%;
  height:auto;
  width:auto;
  display:block;
}

/* make preflight text warnings use the same obvious red treatment */
#warnBar.text-warn-box{
  display:block !important;
  margin:10px 0 12px 0 !important;
  padding:14px 16px !important;
  background:#b00020 !important;
  border:2px solid #ff5252 !important;
  border-radius:12px !important;
  box-shadow:0 10px 24px rgba(0,0,0,.18) !important;
  color:#fff !important;
}
#warnBar.text-warn-box::before{
  content:"⚠ Artwork warning: text at 6pt or below";
  display:block;
  font-weight:950;
  font-size:15px;
  margin-bottom:6px;
}
#warnBar.text-warn-box .xbq-warn-sub{
  display:block;
  margin-top:6px;
  font-size:12px;
  color:rgba(255,255,255,.85);
}

/* UI tidy */
#backendUrl, label[for="backendUrl"], #backendUrlBox, .backendUrlRow, .backend-url-row{
  display:none !important;
}


/* Hide CNC/milling areas before JS runs so there is no flicker */
#millingPanel,
#cncPanel,
#cncSummary,
#bottomCncInfo,
[data-cnc-info],
[data-milling-info],
.priceBar .cncInfo,
.priceBar .millingInfo{
  display:none !important;
  visibility:hidden !important;
}

/* Hide headerTag text if present */
.headerTag,
.tagAlt,
.badgeAlt,
#headerTag{
  display:none !important;
}

/* Hide any header text node wrappers commonly used for header labels */
header .tag,
.header-inner .tag{
  display:none !important;
}

/* preview cleanup: remove nested window effect */
.previewBox{
  background: rgba(6,16,25,.22) !important;
}
.previewBox .previewBox{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.previewBox .abs-card{
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.previewBox .content,
.previewBox .abs-card-body{
  padding: 8px !important;
}

.previewBox .canvasWrap{
  padding: 0 !important;
}
.previewBox .previewHead{
  border-bottom: 1px solid rgba(28,49,71,.45) !important;
}
.previewBox canvas{
  margin: 0 auto !important;
}
.preview-flattened{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* tidy blocks list under preview */
#blocksList,
#rectList,
#diesList{
  display:grid;
  gap:10px;
}

.blockRow{
  border:1px solid rgba(28,49,71,.75) !important;
  background:linear-gradient(180deg, rgba(8,18,28,.55), rgba(6,16,25,.28)) !important;
  border-radius:14px !important;
  padding:12px 12px !important;
  box-shadow:none !important;
}

.blockRow:hover{
  transform:none !important;
  border-color:rgba(246,133,40,.38) !important;
}

.blockRow.selected{
  border-color:rgba(246,133,40,.9) !important;
  background:linear-gradient(180deg, rgba(246,133,40,.16), rgba(6,16,25,.22)) !important;
  box-shadow:0 0 0 2px rgba(246,133,40,.12) !important;
}

.blockTop{
  align-items:center !important;
  gap:12px !important;
}

.blockName{
  font-size:14px !important;
  line-height:1.2 !important;
  letter-spacing:.1px;
}

.blockMeta{
  margin-top:4px !important;
  font-size:12px !important;
  color:rgba(231,240,248,.72) !important;
  line-height:1.35 !important;
}

.blockActions{
  display:flex !important;
  gap:8px !important;
  flex-wrap:wrap !important;
  margin-top:10px !important;
}

.miniBtn{
  border-radius:10px !important;
  padding:7px 10px !important;
  font-size:12px !important;
  line-height:1.1 !important;
}

.miniWarn{
  margin-top:8px !important;
}

.badgeBad{
  font-size:11px !important;
}

#blocksList .mono,
#rectList .mono,
#diesList .mono{
  font-size:12px;
}

.blockMeta br + span,
.blockMeta span{
  display:inline;
}

#blocksListWrap,
#rectListWrap,
#diesListWrap{
  padding-top:2px;
}

.previewBox + .abs-card .content,
.previewBox + .abs-card .abs-card-body{
  padding-top:10px !important;
}

/* End extracted styles */

/* ------------------------------------------------------------------------- */
/* Overlay/cart/shoulder tweaks (extracted late inline <style> tags)          */
/* ------------------------------------------------------------------------- */

/* hide hints + show/apply minimum charges in cart */
#xccRateNote, #xcdThicknessNote, #xcgRateNote, #xchRateNote { display:none !important; }

/* clean replacement: zoom overlay + review cart overlay */
#zoomLensWrap, #cartView { display:none !important; }

#xclZoomBtn{
  border:1px solid rgba(246,133,40,.72);
  background:linear-gradient(135deg, rgba(246,133,40,.24), rgba(246,133,40,.14));
  color:#fff;
  border-radius:12px;
  padding:8px 12px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
}
#xclOverlay, #xclZoomOverlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:100000;
  background:rgba(5,10,18,.72);
  padding:22px 14px;
  overflow:auto;
}
#xclOverlay.open{ display:block; }
#xclCard{
  max-width:1200px;
  margin:0 auto;
  background:rgba(15,27,42,.97);
  border:1px solid rgba(28,49,71,.9);
  border-radius:18px;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  overflow:hidden;
}
#xclZoomCard{ height:calc(100vh - 44px); display:flex; flex-direction:column; }
.xclHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid rgba(28,49,71,.72);
  background:rgba(6,16,25,.22);
}
.xclHeadTitle{ font-size:22px; font-weight:950; }
.xclBody{ padding:16px; }
.xclBtns{ display:flex; gap:10px; flex-wrap:wrap; }
.xclBtns .abs-btn{
  border:1px solid rgba(28,49,71,.9);
  background:rgba(6,16,25,.35);
  color:#fff;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
}
#xclTableWrap{ overflow:auto; }
#xclTable{ width:100%; border-collapse:collapse; }
#xclTable th, #xclTable td{ padding:10px; border-bottom:1px solid rgba(255,255,255,.08); }
#xclTable th{ text-align:left; }
#xclTable td.num, #xclTable th.num{ text-align:right; }
.xclItemSummary{
  background:rgba(255,255,255,.05);
  font-size:13px;
}
.xclTotals{
  margin-top:16px;
  margin-left:auto;
  max-width:430px;
  background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.12);
  border-top:3px solid #f68528;
  border-radius:16px;
  padding:14px;
}
.xclTotalsRow{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin:6px 0;
}
#xclZoomBody{
  flex:1;
  overflow:auto;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:16px;
}
#xclZoomCanvas{
  background:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,.32);
}

/* ensure Review Cart button is visible */
#xcmReviewCartDock{
  position:fixed;
  right:16px;
  bottom:92px;
  z-index:100002;
  display:flex;
  gap:10px;
  align-items:center;
}
#xcmReviewCartBtn{
  border:1px solid rgba(246,133,40,.72);
  background:linear-gradient(135deg, rgba(246,133,40,.24), rgba(246,133,40,.14));
  color:#fff;
  border-radius:12px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.22);
}
#xcmReviewCartBadge{
  min-width:24px;
  height:24px;
  padding:0 8px;
  border-radius:999px;
  background:#f68528;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
}

/* fix duplicate Review Cart and force overlay open */
#btnReviewCart{ display:none !important; }

/* move Review Cart button into bottom banner */
#xcmReviewCartDock{ display:none !important; }
#xcoBottomActions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
#xcoReviewCartBtn{
  border:1px solid rgba(28,49,71,.9);
  background:rgba(6,16,25,.35);
  color:#fff;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:900;
}
#xcoReviewCartBtn .badge{
  margin-left:8px;
  min-width:22px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  background:#f68528;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:900;
}


/* hide CNC milling info from bottom bar, keep payload export */
#millingPanel,
#cncPanel,
#cncSummary,
#bottomCncInfo,
[data-cnc-info],
[data-milling-info],
.priceBar .cncInfo,
.priceBar .millingInfo{
  display:none !important;
}


/* Zoom toolbar */
.zoomControls { /* display:flex; removed to let Bootstrap classes handle it */ padding: 2px 0; }
.abs-zoom-toolbar {
  background: rgba(6, 16, 25, 0.2);
  padding: 2px 4px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.abs-zoom-pill {
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #fff;
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 8px;
  margin-left: 4px;
}
.block-item {
    position: relative;
    border: 1px solid var(--line) !important;
}

.block-item:hover {
    border-color: var(--brand) !important;
    background-color: rgba(241, 90, 36, 0.1) !important;
}

.abs-selected-block {
    background-color: rgba(241, 90, 36, 0.15) !important;
}

.block-item .edit-label-btn {
    opacity: 0;
    transition: opacity 0.2s;
}

.block-item:hover .edit-label-btn {
    opacity: 1;
}

.block-item.abs-border-primary {
    border-color: var(--brand) !important;
}

.block-item .abs-text-primary {
    color: var(--brand) !important;
}

.block-item .abs-bg-primary {
    background-color: var(--brand) !important;
}

/* Custom orange checkbox */
.block-item .form-check-input {
    cursor: pointer;
    border-color: var(--line);
    background-color: rgba(var(--bg-rgb), 0.3);
    width: 14px;
    height: 14px;
}
.block-item .form-check-input:hover {
    border-color: var(--brand);
}

.block-item .form-check-input:checked {
    background-color: var(--brand);
    border-color: var(--brand);
}

.block-item .form-check-input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 0.25rem rgba(241, 90, 36, 0.25);
}

#blockSection {
    max-height: 800px;
    overflow-y: auto;
    padding-right: 5px;
    flex: 1 1 auto;
}

@media (min-width: 768px) {
    #blockSection {
        flex: 0 0 230px;
        max-width: 230px;
    }
}

#abs-kpi-container {
    min-width: 0; /* Fix flexbox child overflow */
}

#abs-kpi-container .abs-card {
    transition: all 0.3s ease;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

#abs-kpi-container .abs-text-primary {
    color: var(--brand) !important;
}

#abs-kpi-container .bg-light {
    background-color: rgba(var(--bg-rgb), 0.2) !important;
    border: 1px dashed var(--line) !important;
}

/* Custom scrollbar for blockSection */
#blockSection::-webkit-scrollbar {
    width: 6px;
}
#blockSection::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.1);
}
#blockSection::-webkit-scrollbar-thumb {
    background: var(--line);
    border-radius: 3px;
}
#blockSection::-webkit-scrollbar-thumb:hover {
    background: var(--brand);
}