/* ===========================================================================
   ColdBox™ Designer — 2D floor-plan cold-room builder (Phase 1)
   Namespaced with .cbx to avoid clashing with the page / thermal calculator.
   Relies on the brand CSS variables defined in refrigeracion.html :root.
   =========================================================================== */

/* Full-bleed: the designer breaks out of the 900px page column and uses the
   whole viewport width (the rest of the page text stays centred at 900px). */
#cbx-designer {
  display: block;
  width: 100vw;
  margin-top: var(--header-height);
  margin-left: calc(50% - 50vw);
  padding: 0 24px;
  box-sizing: border-box;
}
@media (max-width: 600px) { #cbx-designer { padding: 0 10px; } }

.cbx {
  border: 1px solid #d8d8d8;
  border-radius: 6px;
  background: var(--color-white);
  margin: 0 0 35px;
  overflow: hidden;
}

.cbx-head {
  background: var(--color-primary);
  color: #fff;
  padding: 16px 20px;
}
/* Specificity bumped (.cbx .cbx-head) so the page's inline `.page-content h2/p`
   rules — which load after this file — don't override the header colors. */
.cbx .cbx-head h2 {
  font-family: var(--font-heading);
  font-size: 1.4rem;
  margin: 0 0 4px;
  color: #fff;
}
.cbx .cbx-head p {
  font-size: .85rem;
  margin: 0;
  color: #dce3ef;
  line-height: 1.5;
}
.cbx-head .cbx-beta {
  display: inline-block;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .08em;
  background: var(--color-accent);
  color: var(--color-primary);
  padding: 2px 7px;
  border-radius: 3px;
  vertical-align: middle;
  margin-left: 8px;
}

/* ---- Layout: stage (canvas) + side panel ------------------------------- */
.cbx-body {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 0;
}
@media (max-width: 860px) {
  .cbx-body { grid-template-columns: 1fr; }
}

.cbx-stage {
  position: relative;
  background: #f4f6f9;
  /* fallback height; resize() in JS overrides this to fit the exact viewport so
     the bottom hint + zoom controls are always visible without scrolling */
  height: 68vh;
  min-height: 380px;
  border-right: 1px solid #e2e2e2;
}
@media (max-width: 860px) {
  .cbx-stage { height: 62vh; border-right: none; border-bottom: 1px solid #e2e2e2; }
}
.cbx-canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
  cursor: crosshair;
}
.cbx-canvas.cbx-pan { cursor: grab; }
.cbx-canvas.cbx-panning { cursor: grabbing; }

/* ---- Floating toolbar -------------------------------------------------- */
.cbx-toolbar {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  background: rgba(255,255,255,.95);
  border: 1px solid #d4d9e2;
  border-radius: 6px;
  padding: 5px;
  box-shadow: var(--shadow-sm);
  max-width: calc(100% - 20px);
}
.cbx-tool {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--color-gray-600);
  font-family: var(--font-body);
  font-size: .6rem;
  font-weight: 700;
  padding: 5px 7px;
  border-radius: 4px;
  cursor: pointer;
  min-width: 48px;
  transition: background .15s, color .15s, border-color .15s;
}
.cbx-tool svg { width: 20px; height: 20px; }
.cbx-tool svg:not([fill="none"]) { fill: currentColor; }
.cbx-tool:hover { background: #eef1f6; color: var(--color-primary); }
.cbx-tool.active {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.cbx-tool[data-tool="erase"] { color: var(--color-red); }
.cbx-tool[data-tool="erase"].active { color: #fff; }
.cbx-tool-sep { width: 1px; background: #dfe3ea; margin: 2px 3px; }

/* Carga tool hover-dropdown with label-visibility checkbox */
.cbx-carga-wrap, .cbx-estruct-wrap { position: relative; display: inline-flex; align-items: center; }
.cbx-carga-drop, .cbx-estruct-drop {
  display: none;
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  background: #fff; border: 1px solid #d4d9e2; border-radius: 4px;
  padding: 7px 10px; white-space: nowrap; z-index: 20;
  box-shadow: 0 4px 14px rgba(0,16,48,.18);
  font-size: .76rem; font-family: var(--font-body);
}
.cbx-carga-wrap:hover .cbx-carga-drop, .cbx-estruct-wrap:hover .cbx-estruct-drop { display: block; }
.cbx-carga-drop label, .cbx-estruct-drop label { display: flex; align-items: center; gap: 6px; cursor: pointer; color: var(--color-dark); font-weight: 600; }
.cbx-carga-drop input[type="checkbox"], .cbx-estruct-drop input[type="checkbox"] { width: 15px; height: 15px; cursor: pointer; accent-color: var(--color-accent); }

/* Ambient temperature widget (next to Borrar) */
.cbx-temp-widget {
  display: inline-flex; align-items: center; gap: 3px;
  font-family: var(--font-body); font-size: .78rem; font-weight: 700;
  padding: 0 4px; user-select: none;
}
.cbx-temp-val {
  min-width: 3.2em; text-align: right;
  transition: color 0.3s;
}
.cbx-temp-arrows {
  display: flex; flex-direction: column; line-height: 0;
}
.cbx-temp-arrows button {
  display: block; width: 16px; height: 12px; padding: 0;
  border: none; background: transparent; color: var(--color-gray-600);
  font-size: 8px; line-height: 1; cursor: pointer;
  transition: color 0.15s;
}
.cbx-temp-arrows button:hover { color: var(--color-primary); }

/* Cielo / Piso tools carry their layer colour so they read at a glance */
.cbx-tool[data-tool="ceil"] { color: #9664d2; }
.cbx-tool[data-tool="ceil"]:hover { background: #f0eafb; color: #7e4dc4; }
.cbx-tool[data-tool="ceil"].active { background: #9664d2; border-color: #9664d2; color: #fff; }
.cbx-tool[data-tool="floor"] { color: #b9881a; }
.cbx-tool[data-tool="floor"]:hover { background: #fbf4e3; color: #9c7212; }
.cbx-tool[data-tool="floor"].active { background: #c4961e; border-color: #c4961e; color: #fff; }
.cbx-tool[data-tool="cota"] { color: #0f7d8a; }
.cbx-tool[data-tool="cota"]:hover { background: #e6f3f4; color: #0c656f; }
.cbx-tool[data-tool="cota"].active { background: #0f7d8a; border-color: #0f7d8a; color: #fff; }
.cbx-tool[data-tool="carga"] { color: #4a6b2f; }
.cbx-tool[data-tool="carga"]:hover { background: #eef3e6; color: #3c571f; }
.cbx-tool[data-tool="carga"].active { background: #5a7d38; border-color: #5a7d38; color: #fff; }

/* Hint / status line at bottom of stage */
.cbx-hint {
  position: absolute;
  left: 10px;
  bottom: 10px;
  background: rgba(0,32,96,.88);
  color: #fff;
  font-size: .72rem;
  padding: 5px 10px;
  border-radius: 4px;
  pointer-events: none;
  max-width: calc(100% - 20px);
}
.cbx-zoombar {
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: flex;
  gap: 4px;
}
.cbx-zoombar button {
  width: 30px; height: 30px;
  border: 1px solid #d4d9e2;
  background: rgba(255,255,255,.95);
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1;
}
.cbx-zoombar button:hover { background: #eef1f6; }

/* ---- 3D preview button (top-right of the stage) ------------------------ */
.cbx-3d-btn {
  position: absolute; top: 10px; right: 10px; z-index: 4;
  display: flex; align-items: center; gap: 6px;
  background: var(--color-primary); color: #fff; border: none; border-radius: 6px;
  padding: 7px 11px; font-family: var(--font-body); font-weight: 800; font-size: .78rem;
  cursor: pointer; box-shadow: var(--shadow-sm);
}
.cbx-3d-btn:hover { background: var(--color-accent); color: var(--color-primary); }
.cbx-3d-btn svg { width: 18px; height: 18px; }

/* ---- 3D preview floating window ---------------------------------------- */
.cbx-3d-ov {
  position: fixed; inset: 0; z-index: 10000; background: rgba(0,16,48,.5);
  display: flex; align-items: center; justify-content: center; padding: 24px;
}
.cbx-3d-win {
  position: relative;
  width: min(1040px, 94vw); height: min(740px, 90vh);
  background: #fff; border-radius: 10px; box-shadow: 0 22px 64px rgba(0,0,0,.4);
  display: flex; flex-direction: column; overflow: hidden;
}
.cbx-3d-head { display: flex; align-items: center; gap: 12px; padding: 9px 14px; background: var(--color-primary); color: #fff; }
.cbx-3d-title { font-family: var(--font-heading); font-weight: 700; font-size: .95rem; flex: 1; }
.cbx-3d-title small { font-weight: 400; opacity: .82; font-size: .76rem; }
.cbx-3d-tools { display: flex; align-items: center; gap: 10px; font-size: .8rem; }
.cbx-3d-tools label { display: flex; align-items: center; gap: 5px; cursor: pointer; }
.cbx-3d-tools button { background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.4); color: #fff; border-radius: 4px; padding: 4px 9px; font-size: .76rem; font-weight: 700; cursor: pointer; }
.cbx-3d-tools button:hover { background: rgba(255,255,255,.15); }
.cbx-3d-close { padding: 3px 9px !important; font-size: .9rem; }
.cbx-3d-canvas { flex: 1; width: 100%; display: block; background: #eef2f6; cursor: grab; touch-action: none; }
.cbx-3d-canvas:active { cursor: grabbing; }
.cbx-3d-hint { padding: 6px 14px; font-size: .72rem; color: var(--color-gray-600); background: #f4f6f9; border-top: 1px solid #e2e6ec; }

/* ---- 3D navigation cube (CAD-style) ---------------------------------- */
.cbx-3d-nav {
  position: absolute; bottom: 42px; right: 14px; z-index: 10;
  width: 254px; height: 254px;
  border-radius: var(--radius);
  overflow: visible;
}
.cbx-3d-nav-canvas {
  width: 254px; height: 254px; display: block;
  border-radius: inherit;
  cursor: pointer; touch-action: none;
}
/* Fullscreen toggle (bottom-right corner of the 3D view) */
.cbx-3d-fs {
  position: absolute; bottom: 6px; right: 12px; z-index: 11;
  width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid #d4d9e2; border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,16,48,.22); color: var(--color-primary); cursor: pointer;
}
.cbx-3d-fs:hover { background: #eef2f9; }
.cbx-3d-fs svg { width: 18px; height: 18px; }
.cbx-3d-win:fullscreen, .cbx-3d-win:-webkit-full-screen { width: 100vw; height: 100vh; max-width: none; max-height: none; border-radius: 0; }

/* Borrar tool hover-dropdown with "Borrar Todo" slide switch */
.cbx-erase-wrap { position: relative; display: inline-flex; align-items: center; }
.cbx-erase-drop { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: #fff; border: 1px solid #d4d9e2; border-radius: 6px; padding: 9px 12px; white-space: nowrap; z-index: 30; box-shadow: 0 6px 18px rgba(0,16,48,.20); font-size: .76rem; font-family: inherit; text-align: center; }
.cbx-erase-wrap:hover .cbx-erase-drop, .cbx-erase-drop:hover { display: block; }
/* Remate (finishing profiles) dropdown — two columns (Muros | Cubierta) + actions */
.cbx-remate-wrap { position: relative; display: inline-flex; align-items: center; }
.cbx-remate-drop { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: #fff; border: 1px solid #d4d9e2; border-radius: 6px; padding: 8px; z-index: 30; box-shadow: 0 6px 18px rgba(0,16,48,.20); font-family: inherit; }
.cbx-remate-wrap:hover .cbx-remate-drop, .cbx-remate-drop:hover { display: block; }
.cbx-remate-cols { display: flex; gap: 10px; }
.cbx-remate-col { min-width: 188px; }
.cbx-remate-h { font-size: .64rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: var(--color-primary,#002060); padding: 2px 8px 5px; border-bottom: 1px solid #e6e9f0; margin-bottom: 3px; }
.cbx-remate-opt { display: flex; align-items: center; gap: 7px; width: 100%; padding: 6px 8px; border: none; background: none; cursor: pointer; text-align: left; color: var(--color-gray-600,#606060); font-family: inherit; font-size: .74rem; font-weight: 600; border-radius: 4px; transition: background .12s, color .12s; white-space: nowrap; }
.cbx-remate-opt:hover { background: #eef1f6; color: var(--color-primary,#002060); }
.cbx-remate-opt.active { color: var(--color-primary,#002060); background: #e8ecf5; }
.cbx-remate-sw { width: 12px; height: 12px; border-radius: 3px; flex: 0 0 auto; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15); }
.cbx-remate-actions { display: flex; flex-direction: column; gap: 3px; margin-top: 7px; padding-top: 7px; border-top: 1px solid #e6e9f0; }
.cbx-remate-act { width: 100%; padding: 7px 8px; border: none; border-radius: 4px; background: #eef4ff; color: var(--color-primary,#002060); font-family: inherit; font-size: .74rem; font-weight: 700; cursor: pointer; transition: background .12s; }
.cbx-remate-act:hover { background: #dbe7ff; }
.cbx-remate-clear { background: #f6eef0; color: #a23b3b; }
.cbx-remate-clear:hover { background: #f2dfe2; }
.cbx-switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; color: #c0392b; font-weight: 700; user-select: none; }
.cbx-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.cbx-switch-track { position: relative; width: 36px; height: 19px; border-radius: 19px; background: #cdd3dc; transition: background .18s ease; flex: none; cursor: ew-resize; touch-action: none; }
.cbx-switch-track::after { content: ''; position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.35); transform: translateX(var(--knob, 0px)); transition: transform .18s ease; }
.cbx-switch-track.cbx-dragging::after { transition: none; }
.cbx-switch-track.cbx-armed { background: #c0392b; }
.cbx-switch-hint { display: block; margin-top: 5px; font-size: .64rem; color: #6b7785; font-weight: 400; }

/* ---- Side panel -------------------------------------------------------- */
.cbx-panel {
  position: relative;
  padding: 14px 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-height: 68vh;
  overflow-y: auto;
}
/* two half-width fields sharing one row (height + ambient, rotation + temp) */
.cbx-row2 { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 8px; align-items: end; }
.cbx-row2 .cbx-field { margin-bottom: 8px; }
.cbx-row2 .cbx-field label { min-height: 2.1em; }   /* keep both inputs aligned when a label wraps */

/* (?) help button in dark header */
.cbx-head { position: relative; }
.cbx-help-btn {
  position: absolute; top: 14px; right: 14px; z-index: 5;
  width: 24px; height: 24px; border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.55); background: transparent; color: #fff;
  font-weight: 700; font-size: .85rem; line-height: 1; cursor: pointer;
}
.cbx-help-btn:hover { background: rgba(255,255,255,.15); }
.cbx-help-pop {
  position: absolute; top: 46px; right: 14px; z-index: 6; width: 290px;
  background: #fff; border: 1px solid #d4d9e2; border-radius: 6px;
  box-shadow: 0 8px 26px rgba(0,16,48,.22); padding: 12px 14px; display: none;
  font-size: .73rem; color: #3a3f47 !important; line-height: 1.5;
}
.cbx-help-pop.show { display: block; }
.cbx-help-pop p { margin: 0 0 8px; color: #3a3f47 !important; }
.cbx-help-pop p:last-child { margin: 0; }
.cbx-help-pop b { color: var(--color-primary); }
@media (max-width: 860px) { .cbx-panel { max-height: none; } }
.cbx-group h3 {
  font-family: var(--font-heading);
  font-size: .9rem;
  color: var(--color-primary);
  margin: 0 0 8px;
}
.cbx-field { display: flex; flex-direction: column; gap: 3px; margin-bottom: 8px; }
.cbx-field label { font-size: .72rem; font-weight: 700; color: var(--color-gray-600); }
.cbx-field input, .cbx-field select {
  font-family: var(--font-body);
  font-size: .85rem;
  padding: 6px 8px;
  border: 1px solid #c4c4c4;
  border-radius: 4px;
  background: #fff;
  color: var(--color-dark);
}
.cbx-field input:focus, .cbx-field select:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: -1px;
}
.cbx-dims { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.cbx-check { display: flex; align-items: center; gap: 7px; font-size: .78rem; color: var(--color-gray-600); font-weight: 600; margin-bottom: 6px; }
.cbx-check input { width: 16px; height: 16px; }
.cbx-help { font-size: .72rem; color: var(--color-gray-300); line-height: 1.45; margin: 2px 0 9px; }
.cbx-help b { color: var(--color-gray-600); }

/* Selected-zone card */
.cbx-selzone { background: #f4f6f9; border: 1px solid #e2e6ec; border-radius: 5px; padding: 11px 12px; }
.cbx-area-big { font-family: var(--font-heading); font-size: 1.25rem; font-weight: 800; color: var(--color-primary); }
.cbx-area-sub { font-size: .7rem; color: var(--color-gray-300); margin-bottom: 8px; }
.cbx-btn-del { background: none; border: 1px solid var(--color-red); color: var(--color-red); border-radius: 4px; font-weight: 700; font-size: .76rem; padding: 6px 10px; cursor: pointer; }
.cbx-btn-del:hover { background: var(--color-red); color: #fff; }

/* Zone load (T.R.) estimate inside the Carga card */
.cbx-zload {
  margin-top: 8px; padding: 8px 10px; border-radius: 5px;
  background: #e6f3f4; border: 1px solid #bfe0e3;
  font-size: .82rem; color: #0c656f; line-height: 1.4;
}
.cbx-zload b { color: #0f7d8a; font-size: .95rem; }

/* Thermal-load Pro upsell (Free tier sees this instead of the T.R. inputs/output) */
.cbx-zload-locked {
  margin-top: 8px; padding: 12px 14px; border-radius: 5px;
  background: #fdf6e8; border: 1px solid #f0ddaa; text-align: center;
}
.cbx-zload-locked p { font-size: .82rem; color: #7a5c17; line-height: 1.4; margin-bottom: 8px; }
.cbx-zload-locked .cbx-btn { width: 100%; }

/* Unit airflow rotation buttons */
.cbx-rotrow { display: flex; gap: 6px; margin: 8px 0; }
.cbx-btn-rot {
  flex: 1; background: #eef1f6; border: 1px solid #d4d9e2; color: var(--color-primary);
  border-radius: 4px; font-weight: 700; font-size: .82rem; padding: 7px 6px; cursor: pointer;
  transition: background .15s, color .15s;
}
.cbx-btn-rot:hover { background: var(--color-primary); color: #fff; }

/* ---- BOM table --------------------------------------------------------- */
.cbx-bom { width: 100%; border-collapse: collapse; font-size: .76rem; }
.cbx-bom th {
  text-align: left;
  color: var(--color-gray-600);
  font-weight: 700;
  border-bottom: 2px solid #e6e6e6;
  padding: 5px 4px;
}
.cbx-bom td { padding: 6px 4px; border-bottom: 1px solid #f0f0f0; vertical-align: top; }
.cbx-bom td.num, .cbx-bom th.num { text-align: right; white-space: nowrap; }
.cbx-bom .cbx-item-name { font-weight: 600; color: var(--color-dark); }
.cbx-bom .cbx-item-sub { font-size: .68rem; color: var(--color-gray-300); }
.cbx-bom .cbx-quote { color: var(--color-accent-hover); font-weight: 700; }
.cbx-bom tr.cbx-empty td { color: var(--color-gray-300); text-align: center; padding: 18px 4px; }

.cbx-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  border-top: 2px solid var(--color-primary);
  padding-top: 8px;
  margin-top: 2px;
}
.cbx-total span:first-child { font-size: .8rem; font-weight: 700; color: var(--color-gray-600); }
.cbx-total span:last-child { font-size: 1.15rem; font-weight: 800; color: var(--color-primary); font-family: var(--font-heading); }
.cbx-total-note { font-size: .66rem; color: var(--color-gray-300); margin-top: 2px; }

.cbx-actions { display: flex; flex-direction: column; gap: 8px; }
.cbx-btn {
  border: none;
  border-radius: 4px;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: .9rem;
  padding: 11px 16px;
  cursor: pointer;
  transition: background .2s;
}
.cbx-btn-primary { background: var(--color-accent); color: var(--color-primary); }
.cbx-btn-primary:hover { background: var(--color-accent-hover); color: #fff; }
.cbx-btn-ghost { background: #eef1f6; color: var(--color-primary); }
.cbx-btn-ghost:hover { background: #e0e5ee; }
.cbx-added {
  font-size: .76rem;
  color: var(--color-green);
  font-weight: 700;
  text-align: center;
  min-height: 16px;
}
.cbx-added a { color: var(--color-primary); }

/* ---- Confirm modal (missing Cielo/Piso warning) ------------------------ */
.cbx-modal-ov {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,16,48,.55);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.cbx-modal {
  background: #fff; border-radius: 8px; max-width: 420px; width: 100%;
  padding: 22px 22px 18px; box-shadow: 0 18px 48px rgba(0,0,0,.3);
  font-family: var(--font-body);
}
.cbx-modal h4 { font-family: var(--font-heading); font-size: 1.1rem; color: var(--color-primary); margin: 0 0 8px; }
.cbx-modal p { font-size: .88rem; color: var(--color-gray-600); line-height: 1.55; margin: 0 0 18px; }
.cbx-modal-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.cbx-modal-actions .cbx-btn { flex: 0 0 auto; min-width: 112px; }
.cbx-modal-actions .cbx-btn:disabled { opacity: .6; cursor: default; }

/* ---- Context menu (right-click) --------------------------------------- */
.cbx-3d-ctx, .cbx-ctx-menu {
  position: fixed; z-index: 10000;
  background: #fff; border-radius: 4px;
  box-shadow: 0 4px 18px rgba(0,0,0,.22);
  min-width: 180px; padding: 6px 0;
  font-family: var(--font-body); font-size: 0.82rem;
}
.cbx-ctx-item {
  padding: 8px 16px; cursor: pointer; color: var(--color-dark);
  transition: background 0.12s; white-space: nowrap;
}
.cbx-ctx-item:hover { background: var(--color-primary); color: #fff; }
.cbx-ctx-sep {
  height: 1px; background: rgba(0,0,0,.08); margin: 4px 0;
}

/* Estruct icon = the Two_Winged_Classic_Structure PNG applied as a MASK filled with
   currentColor, so it recolors exactly like the stroke icons (gray / hover / active). */
.cbx-ico-estruct {
  width: 20px; height: 20px; flex: none; background: currentColor;
  --estruct-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHQAAABdCAYAAAB0OULZAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAABVLSURBVHhe7Z3Zb1RXnsdLUYRarShqtVrRSKPWqB/6D5jHeRrN87yO8tBh38Fg9t0QzBrSMTsYs5gdwmLMHgKOWRKl6QzTQqNupLQmo1E6aUKMwXutds3vc1w/51e3TtnlchkbuA9f3fK555x77vme33pOlSPpdLpo9HjgqxfixcFbWChCQkcfvIWFIiR09MFbWChCQkcfvIWFIiR09MFbWCheCUJ7etGT6s4qTyaTke7ubne9ePFi1bZt2x4uWLAgPXHixPSkSZPS169fr+zo6Hijp6fH1dfrSMNbWCh4iSB89UY1MoTGo7EsUuvq6nYtWbLEkQeJPuzevfvL9vb2N+PxeHafIwhvYaHoYWUH4Ks3GtHTLYuP8coiTAiZFy/Ub6ves/fe7NmzveTlQ2VlZbNK82hY0N7CQvEyqdzghKcSyUjtodqr5eXlXqIGAxYB6retrW2MfeZIwFtYKF4mQlGNJ0+ePP77Dz/864wZM7zEDAXTp09PP3369JcsHN/zXxS8hYViNBBqJzCRSESsPXv06NG/7tq16/6sWbO8JAwWSOLOnTu/Wr9+/RPfffDs2bO39fmpVKpvLC8K3sJCMdKEWjL53NnZ6ZwZ7NrUqVO9E14Mjh8/flqfg71k4Rw+fLjeVxfgLMVi4mRlHMUXaVu9hYVipAlloh4+fPjvu0Rqpk2b5p3coWDRokXp1tbWn0Egz2PRQBR/U/78+fO3fO3A6tWrO6n3wgn1keLgBuIpHwC+h/QL52nmgXiiOC/us9SNdUUjlyQmPHjgwI2KVavik/sJKQaDSZ4yFkl3MuVCGRfOZMYAIPbjjz8+NGXKlJx2FqhoXQxK7HCT6yXFYZQQSp27t2/PWbduXdOUyZO9EzdYEFtWVFREjx45UjenbE7WPUh48vfHv05BBM+HzEx8ik2ETOJT2wbk0xCTZcw4ZLR7NQmVfrtZ9X1xYAbck7JukcjGhoaFB/bvv7lBnI9SSSETy6L47FbDYsbw4+Mf/jFoZ9dXVjY5EgWpeEayZKyMKRaNRmpray/5Eg04ShB2+fLlLcF7ipMnTpxMIfHMK+Q6lJ5gLykOpSbUkgdxBOOo04wENNy8tXTF8hXpUhGoQOKePvnxHR1HQmzgtq1b/9vWgez6urodOeOVK4RGO7siPk8ZtY/UIoFcmTNsa76wiOfSr3t3VedunktHqpcUh2EjtMdN6qX6i1V7xBssnzv0wD4f5pWXpxOxeKT1ecvPWTztrW1jlizOVpdLRX2S9sNWu0nOTC7vkhIpOiGxq60PkOyGhobFXV1dTg3jKJFYoB1eMJIcbKNYXbE6ynOGjVBf4VDA4HAEeLG4TCZlKfmMVF6QkGLB/AVeJ6RYzCkrS1d99NGjLR988L+2nGQ6k4b0s4Ag06rLSRMnpc+fO1/tVCr1MuPvkNCnvbPjjfauzsjMmTP76rs20p5+3btJvIuapQ1/Q+yXX345sZCkBQuio639zXSmvVPzmecPFd7CUgBSr1y+suWDzZv/D7Xne7FiMXfu3PTxY8fOxMXrZVI+CJB57uzZmqTaQCGreu/ee/Z+2eyyNAS7+0iJQFVsXMa9bcf2P9n6YFXFqij3Uz3dkWQq6UiEUIhFOjdu3PhdsA1gofnsLmXPnzb/oquj043R+RTS/1DhLRwqWK3DkV4DH27Z8j9MAM9Bjb6/Zk273mOSWp49fyspmgEvlaT7woULc9qjhmNiF91EZgjFCWpvaxsTDEVYjJeuXNnC85JCZko0EO8HoSzaLdKfra8gQ9XR3vEm2iEqpAWlXXH61Kmj9D1qCcWu5HvJwYAwYPOmzd/a1Y20O0mSl4eAte+/36r3XMyX2QJDOpubnv5ymvFiUXNIg7bvRa/KQ1qDKhvsqd57L5ZMROKCVPqnCY/FY5H94oX74tD3ZUyQ7dQwUpwBqh8nKlgf8GzUPp60PqNYeAuLBS9x+/btct+gCwFeLqq0q73jDRwVvE+9hwPFMzrlHtc5c36KH1euWNnd3to6hnYQtn9fTYPeAxs3bHyMlCCRSMxPhPZErl29ujGoEsnVtood7YhFHZmAZ+IoNcr7+WLOtWvXPm9ubv4F9VDFQUK7ZZElu2KRcjEXwbYAM8LYNRFRLLyFxQJvz5IwGKxcsaIbiYmKU/K8+dnbdtKUEDzRVlGpvLze27ljxwP3bLGnkLNk8eK+e+D2Z43zs8Ypk4YUszDWVVY227pI8dVr19Z3izQikV2JWCQu9hJCWyQcWbpsWVbfgO037Gg0I13q+RJrK6Etz569RUwdbBsE7+ykVL3eIrxfb2GxWGPs2UBYunRp3+e5Im3YNNePTHiZcaLY7kK9OpUkpOmCwVM+dvToub179nzhs0+oNxaBk0TUrPTday9TkVMnckMRkgNKSlIWViwhzk5UyBFifbsr5HmvCfkadiCVjkjUeOaZ2Orly5ZntVOwEObPm++9hzPpxp6Z18HAW1gMeDk7qGAWJh/YR6Q9pAH7kpDF5KAqm3548g9W+gfKoxLftre0/kxVKwuCBIOeC1KQxoMIpMxuvSGZh8gMTc5Wx7xXfX39Nq1nCVU1i6ZA49h2ChbC7YbPFmLvaW/9AAsyZfqMwcBbWCg05kTV2sEQrC8MTFw+/PD93//J9SfSs8JMwo7t2/8EEX/8w/2x69eta7JtBoMWUd/0H7Srs0Sqz507V8341WsF1MVOBhckWoBtMbbonBRKPdoyB278gvv374+1tt0CTUOCQ+u6DJlcWaz7qvfd8bXBg9fwC/Vrn5UP3sJCoS+2ynhvhCsQsWC+X51YEIe5vqQ+HqyWQyyqaiAp9MFnw63NBbslpLDvAFC3jx8//nUwzAFHjhyp07qQyNVKJTncZR77illwCzPzLKf6QUZrUIZaJs87b968nPaAckIwwhp9bn/EegsLBQ84JXGUHUBU7By2brGoFlseBPaPOBK7hmPjq1MIIBAPmFwsHiwTtGnjJm+Qz4onRHFZGhl/MkMOEkq4Yevi+WJXNaWnUIlmUu/evSvRUm7ShLwvJLW1tPSpfBc7K6H0Iyp3+7ZtDwvJXbskxLNnbw8rodibpqamX9kHY0cZMCQFpSIISPBJw2BAmONsr0wyYQ7jYjE9/u773/jqY7+6Ojrc+Jhkku4nZOKD9T4U9cj7IX3BCYRMbKhPtVJG2KYk4pW7Z9E2Q+TdO3fn5ItHAYsun0fMHix9WFsfhLewEPCS841axb7oCjp08OB1O5ChAseJrS9b9vGp04exK5DpNsEZl0zi6oqKqK0XjDGnS2iA/eLYpi0HpBBbWlp+zjtw1fcEvBsL1heDYiI+//zz6dhX6iqhTgMhmdIPGmTGdH/2jNiUOWOBUZeQyueJA7QGi0rH5t7bIKegELBy7cpGz1PGS7fKRNgBFAtUKar4wVf/+a5ud40dOzZNSBMnOSArnitpPhyHC+frdtn2EOmkQiY2n31S4Pkydj0HhFpV6WTykAxfaMTZJeoyJ1mn6JFKATEzGwc+tcr4WHxf3f/j72gTlfhV5xezgcbpEPPAYg62Xb58eRqbr8+2yCkoBKxe7Rx7oR1jT4MSUSisM7Nxw4bHLuSQPm1/2DkCdyaeiYZQpDN4kuHggYM3VAUDPgcT+ABPluwO4weQSr8qAb5jJoyzpqamAQKpB/G05art7ojatdrLgsWF/9Apdpyx00YXDn3QXs0C908cP3Ha1w9j1+dZ5BQUAusIsMtQbCKeyWF/kEB65/YdDyaMn+C2wpC4oNrmuyQ68YyBl2dibR1CEyaBFY6EoLpQY1urqv5s61lskMVDf0wOhIJDhw5dDdZD1XLSTycd9crC0jGxyc0+aFlZWVY7wKIkv4197zMPGSiZKt1dMt76Cxd2FBL27d27957tC2T90R/0hfs7kzoYHKmVyYnGZfJjkYqVq+JzZpelv/v2b79lZVo7BelMIiqGXGpCPsfEKbB9IUWQh81CBXNF3XJmyNYDNftqGoN2EBIgpbq6OiceJKPDAW3NIgEmH1AGqZzwC7YDxOOnpK3b5pP3UnuqfXRnJIz3a2xsnN+fk4hEBh2xg7LotT9F1h/9Ac+Kk+G2w6GgS1ROh6jVJYsWp6dNnpKGCNx8q2Kx07xsW0f7mxDZ2tY6Zk9gb9N5fmInNfMCTp44meO5Qi6Sm8x4iAPZVQ6RqV1kMQPmAOKRTs7qBrNOgMWF48IzdBuvL0EPoThMco/+bt26tRRnz5obC8rXrF7T+V8PHvwHuWEItPeHRCgo5R5n8w8/vjNlwsR03dlz1eRXiQ2VTK7YRyYQKeiKRSNnzpw5YNv/vuqjR+RbnXOAipWJunLp8pYgUe4cj0yGm0iBepJI8OJAIh/g6PAdFSSP50Me9SGAa1DNK1gAV65c2YwW0/nSkMoS+ugvf/k3tJxduBZoj4/E7JCs0H4YP9J84MCBG7YupqGvTgZZfwShq5NrvlWkwAuslQf43Pp8QCWR9lq2tDfLMm7suPTWqq1/xonBljChXUJY8NmMLdEt45IrdfAG7UY3YDsr610gRCabhQNptm4QhGBWKr/44oupwbAJII1qx5wKzdhg90whwS00+UzKj3O++QSCOasSO99svkbRBzx1AScG2YO17TifHKyf9YcPSACpL+3E574DViLJdP0bVWrvFwKIwxZiV3kBTtBZMo+LCmb3AzK5Jj2rduXKlUlOASARLAwmlZAgKXbVd0wESeAEfPC9CA1IIPjed9OmTd9qvArpSqQllAV07szZmnzzReIFgnD2VPotggfumA8S9raPgglloLrisGHaASs33wDZXF4jzg0EJDoHTv3lA6qIw2RIGHHnu+++m94qarO7RyaLCeQYiIzrYMATpd3NmzeXQ6AeL+Fd8Jh9JyhOi+1VByuR2cD2HaBWIF3nz5/fQ9iE1OpcMT9KKjaXhD8ZLF8fODbVe6vvcSaXA3S0BdqXBYRaUp2E1uzPUvcFEapEMkg+q65HveAQ+NxyMHPGzPSE341NJzq6Ipfr66uC8Vs+MFHsRFQKgcF7BNVKjjs5KOND/dk6ugBwQLiPhGMrGxs+WxhMmK9dV9n82Z3b5XqsBEmPS79sld25c2eOz8kBfCUfW4q2gkygkghYSPk8VDYp6mQhPP2x6VeELbyLW2zYdJlf7QOoIAXJROVif70Siko2dbP+AFYy7flSynihfNtDYOYgnKbdO3f27njQL6SJzTly+EjWN7o2i2rrbG9/A+eiSyY0SBBeIl4rKpr2hCt3Gm+XB23uZlJ67W1jkvK8rm4JgVIJh854NFJ7JPdbZD5bpzsuirNnz9bkO+mHFjuTybv2QcbnEgkCzEEvoea+IEioJbZoQgHSiZdHIyZHj1Vwz7e7UAxSEoOmWa3yos4LZWDykmxCW0KYHJIM48eNS0+YMMFNNgE+qpWXdKtd2gYXA7AqCansjMciyczRkg2bcskgm8QOChKI/SaZb+/jyWI/bZmC0xp4nXw/tDc86Y07dXxZE69/+8rlCondGZSEUCRRG+F0QCjOQ74VWQw4MJXuluexUoGQCrkgLs8Pqnbyod9/+7ff8gIE6hCKdOIA2XrgzOle6WAysaFRIZK/D4uUlQfCGhZo/cX6Kn13Fi7ayYVDYmJ8+5wKtBXpTtqxCNSWugVq3stdLXn62Vcmn0tOqHWP89nMINjMXSR2pPbAwescsVi0oP+tsSChSiZw6TEpCx6tPFx7+JLaneA+LECSaduXYsvU3SXOnK2H3d0n8eSTpqZ3EmI/OWuL04WdhBgIPXbs2BlfYhwgyRqrKolqV935Wh/sxBvyfIBEC8ryOkWFEKqO0GAQbRNnBPWSFFsWS0QGykUy6bxon90wYGIUeJa2Hd6v/Rvg+mvbBMG8TDKZHHukBfBedRfqdiTFGeI98Zh5Bp8hB5XpS6rjLNlyVL62U9jxA1tu6xULEgsQaMfFAg4+L6uRwjYqFLH2TlEv0rGgVIRCDCsfyQme8cHOnj59+rB6n6hH2gY3rKlHiuzuvbszOZ7Jib5o4qew4+rVqxuD2SWIZ+GQncLc0D9xqd73ETrcYC5KRihbZByAhoDZeX6AIqZHJgWpEhHKZx0ThFknBecItQehOCJsPltnClIIN/rsmvRBHNvR1em2xSpWr+4MaiKkEIJ5lqufGcdoITSYRGGh6pxpvaxGCtsI8NU5gmHs0uxZfi83JitZbQOOSL6YTtEfoRY6JiYQ20ae0/bDYhs/fnz6vffec98nwb6R4VHPHFVKe07kBXOofIYodlPQBP0936rv14JQu6E8HIQClRZ+6cT2RWiDpEKeTjQTcPTo0XOozqBzQ0bIJr9ZKKC/55NS1PYhoR4UI6FcKUMlctLAeuCajEcyv/7663+x6heQkEcSlTj602dQZv+20OeHhA6DhFqoOrW2TTFu3DininF2IJH6wb7sM/KRCbR+SOgwEwp4SSRyj9nlwbH55ptv/hkpVvvJ5yABvmf5oPVDQl8AoRYa1nCmFhXKBBQ66YU857Uj1BE0jF7uQFBC2SpTMgfTfiC8tIRy0zYChRE6vGHLQNCTEoQtSuZg2g+El4ZQLbCwjQDbVMNCqDzLDnoosITad/HVLQavHaF9X64VjAShGmtu5ncYPPeHipDQF0yo2lAk1Hd/qBhpQn3J+deCUJwi3/2hYjQS6k3OWyIVthEICQ0JDQktFTKOJsdCfYQy33Cm9XPIBLYRCAkNCQ0JLRVCQkNCc2AbgZDQkNCQ0BIjH6HKmdbLIRPYRiAkdOQJDcOWEiMkNCS0pIDQ1zKX+6oS+tom50NCMwUWthEICQ0JDQktMUJCS4yQ0JDQkiIktMR4aQjVDyGh/WPUE5rJ+fY1CAntHyNN6ICJhUETKuUQav8Fh4X7H16Zr9Tz2wcDfT+UBUBdO+ih4EUSys+39k2ip+5wAIGCQB0D4DcXlLMcQi1sIwChlPNzLPw3wOB94H4NM5lyP+7Az8zwewu+egr9vdjgs4vFtKm953L5KoTvfl64yRgY9t928ONRri0aKdgfyExuSSH98tN7OgZQU72vUbWi1ssdjMA2CjF6gYRmkZ5DaKbQ1zjE6EP/hJpCX+MQow8hoa8YQkJfMbDhbXkDIaEvMfon1JAa/P2eEKMT7tSfIRNkEyogSOUfmDZI7Hnz009XfvrJjYobn3yy5vq16+uvX722/vq1a+v5kacQIwN+Bo8vYANftiqngEouQSBBP1f386AuA9T7mTLyiiFGBpbEgggF7hclyZB47oUYeWi6r3BCQzJHNZRQH085BSAkdHQjP6HpyP8DJzoyrAg8/k0AAAAASUVORK5CYII=");
  -webkit-mask: var(--estruct-icon) center / contain no-repeat;
  mask: var(--estruct-icon) center / contain no-repeat;
}

/* ---- Panel take-off (despiece) detail + Optimizar --------------------- */
.cbx-panels { margin-top: 14px; }
.cbx-panels-h { font-size: .95rem; margin: 0 0 8px; color: var(--color-primary, #002d5b); }
.cbx-panels-h small { font-weight: 400; color: var(--color-gray-600, #666); }
.cbx-panels-sum { font-size: .8rem; line-height: 1.5; color: #444; margin-bottom: 8px; }
.cbx-cut { width: 100%; border-collapse: collapse; font-size: .78rem; margin-bottom: 8px; }
.cbx-cut th, .cbx-cut td { padding: 3px 6px; border-bottom: 1px solid #eef0f2; text-align: left; }
.cbx-cut th.num, .cbx-cut td.num { text-align: right; }
.cbx-cut thead th { color: #666; font-weight: 700; }
.cbx-optbtn { width: 100%; margin-top: 2px; }
.cbx-opt-on { font-size: .8rem; color: #1a6b40; font-weight: 700; margin-top: 4px; }
.cbx-optlink { background: none; border: none; color: var(--color-primary, #002d5b); text-decoration: underline; cursor: pointer; font-size: .74rem; padding: 0; margin-left: 4px; }
.cbx-opt-locked { font-size: .78rem; color: #b07d1a; line-height: 1.5; background: #fdf6e7; border: 1px solid #f0e2bf; border-radius: 6px; padding: 8px 10px; margin-top: 4px; }