/* BD Größen-Matrix — Baustein 1. Schlank, erbt Flatsome-Schrift/Farbe wo möglich. */

.bd-size-matrix {
  margin: 1.2em 0;
}

.bd-size-matrix .bd-hint {
  margin: 0;
  padding: .9em 1em;
  background: #f6f6f6;
  border: 1px dashed #ccc;
  border-radius: 4px;
  font-size: .92em;
  color: #555;
}

.bd-size-matrix .bd-color {
  font-weight: 600;
  margin-bottom: .5em;
}

.bd-matrix-table {
  width: 100%;
  table-layout: fixed;        /* feste Spaltenbreiten -> Mengen-Spalte wandert nicht mehr */
  border-collapse: collapse;
  margin: 0 0 .8em;
  font-size: .95em;
}

.bd-matrix-table th,
.bd-matrix-table td {
  padding: .45em .6em;
  border-bottom: 1px solid #eee;
  text-align: left;
  vertical-align: middle;
}

.bd-matrix-table thead th {
  font-size: .78em;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #888;
  border-bottom: 2px solid #ddd;
}

/* v0.16.2 — ausgewogene Spalten: Werte sitzen sauber unter ihren Headern.
 * Grösse links · Stückpreis links · Menge ZENTRIERT (Feld + Header mittig) · Summe rechts. */
.bd-matrix-table .bd-c-size  { width: 12%; text-align: left;   white-space: nowrap; }
.bd-matrix-table .bd-c-price { width: 34%; text-align: left;   white-space: nowrap; }
.bd-matrix-table .bd-c-qty   { width: 24%; text-align: center; }
.bd-matrix-table .bd-c-line  { width: 30%; text-align: right;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-matrix-table thead th.bd-c-qty  { text-align: center; }
.bd-matrix-table thead th.bd-c-line { text-align: right; }

.bd-matrix-table input.bd-qty {
  width: 5em;
  padding: .35em .4em;
  text-align: center;
  margin: 0;
}

.bd-matrix-table .bd-row-oos { opacity: .5; }
.bd-matrix-table .bd-oos {
  font-size: .8em;
  color: #b00;
  white-space: nowrap;
}

.bd-size-matrix .bd-foot {
  border-top: 2px solid #ddd;
  padding-top: .8em;
}

.bd-size-matrix .bd-foot-sums {
  display: flex;
  flex-wrap: wrap;
  gap: 1.4em;
  font-size: .95em;
  margin-bottom: .4em;
}

.bd-size-matrix .bd-note {
  font-size: .82em;
  color: #888;
  margin: 0 0 .8em;
}

.bd-size-matrix .bd-add {
  margin: 0;
}

.bd-size-matrix .bd-add[disabled] {
  opacity: .45;
  cursor: not-allowed;
}

@media (max-width: 480px) {
  .bd-matrix-table .bd-c-price { min-width: 0; font-size: 12px; }
  .bd-c-price .bd-price-pair:first-child { display: none; }
  .bd-c-price .bd-price-tag { display: none; }
  .bd-matrix-table .bd-c-qty  { width: 5.5em; }
  .bd-matrix-table .bd-c-line { width: 7em; }
  .bd-matrix-table input.bd-qty { width: 4.2em; }
  .bd-size-matrix .bd-foot-sums { flex-direction: column; gap: .3em; }
}

/* v0.8 — Footer-Aufschlüsselung (Staffel / DTF / Gesamt-Vorschau) ------------ */
.bd-size-matrix .bd-foot-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1em;
  font-size: .95em;
  padding: .18em 0;
}
.bd-size-matrix .bd-foot-row strong { font-weight: 600; white-space: nowrap; }
.bd-size-matrix .bd-staffel { color: #1a7f37; }            /* Rabatt grün */
.bd-size-matrix .bd-dtf-line { color: #555; }
.bd-size-matrix .bd-foot-grand {
  border-top: 1px solid #ddd;
  margin-top: .35em;
  padding-top: .55em;
  font-size: 1.05em;
}
.bd-size-matrix .bd-foot-grand strong { font-size: 1.1em; }
.bd-size-matrix .bd-unit { white-space: nowrap; }

@media (max-width: 480px) {
  .bd-size-matrix .bd-foot-row { font-size: .9em; }
}

/* --- v0.9.2 Editor-Kontext (#lumise-cart-wrp) --- */
#bd-size-matrix-editor.bd-matrix-editor{margin-top:14px;padding-top:12px;border-top:1px solid #e5e5e5}
.bd-matrix-editor .bd-actions-editor{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.bd-matrix-editor .bd-tech-line{font-size:13px;color:#555}
.bd-matrix-editor .bd-tech-line .bd-tech-val{color:#111}
.bd-matrix-editor .bd-add-print{width:100%}

/* --- v0.9.8 #3 Doppelpreis je Größe (roh / inkl. Druck) — v0.16.2: linksbündig, 34% --- */
.bd-matrix-table .bd-c-price { width: 34%; }
.bd-c-price .bd-price-pair { display: block; line-height: 1.3; white-space: nowrap; }
.bd-c-price .bd-unit-raw { color: #888; }
.bd-c-price .bd-unit { font-weight: 600; }
.bd-c-price .bd-price-tag { font-style: normal; font-size: .8em; color: #9aa7b8; margin-left: .4em; }

/* Editor-Panel ist schmal: Preiszelle kompakter, aber sichtbar (siehe JS-Override der 480px-Regel) */
#bd-size-matrix-editor .bd-matrix-table .bd-c-price { width: auto; font-size: .82em; }
#bd-size-matrix-editor .bd-c-price .bd-price-tag { display: none; }
#bd-size-matrix-editor .bd-c-price .bd-price-pair { line-height: 1.15; }

/* ===========================================================================
 * Phase 3 — Warenkorb-Matrix
 * =========================================================================== */
.bd-cart-matrix{margin:10px 0 4px;padding:10px 12px;background:#fafbfc;border:1px solid #e3e8ef;border-radius:8px;}
.bd-cm-title{font-size:13px;font-weight:600;color:#33475b;margin-bottom:8px;}
.bd-cm-grid{display:flex;flex-wrap:wrap;gap:8px;}
.bd-cm-cell{display:flex;flex-direction:column;align-items:center;width:64px;}
.bd-cm-cell label{font-size:12px;color:#5a6b80;margin-bottom:3px;text-align:center;line-height:1.1;}
.bd-cm-cell.bd-cm-oos{opacity:.45;}
.bd-cm-stepper{display:flex;align-items:center;border:1px solid #cfd8e3;border-radius:6px;overflow:hidden;background:#fff;}
.bd-cm-stepper button{width:24px;height:30px;border:0;background:#eef2f7;color:#33475b;font-size:16px;line-height:1;cursor:pointer;padding:0;}
.bd-cm-stepper button:hover{background:#e1e8f0;}
.bd-cm-input{width:36px;height:30px;border:0;text-align:center;font-size:14px;-moz-appearance:textfield;padding:0;background:#fff;color:#1f2d3d;}
.bd-cm-input::-webkit-outer-spin-button,.bd-cm-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.bd-cm-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;flex-wrap:wrap;}
.bd-cm-total{font-size:13px;color:#33475b;}
.bd-cm-apply{background:#ec991c !important;color:#fff !important;border:0 !important;padding:7px 16px !important;border-radius:4px !important;font-size:13px !important;font-weight:600 !important;cursor:pointer;}
.bd-cm-apply:hover{background:#c67d14 !important;}
.bd-cm-qtycell{display:inline-block;font-weight:600;color:#1f2d3d;white-space:nowrap;}
@media (max-width:549px){
  .bd-cm-cell{width:calc(25% - 6px);}
}

/* --- v0.15.0: Staffel-Tabelle auf der Produktseite (read-only) --- */
.bd-staffel-table { margin-top: 18px; border: 1px solid #e6ebf1; border-radius: 10px; padding: 14px 16px; background: #fff; }
.bd-staffel-cap { font-size: 13px; font-weight: 600; color: #33475b; margin-bottom: 2px; }
.bd-staffel-note { font-size: 11.5px; color: #8a98ab; margin: 10px 0 0; }
.bd-staffel-tbl { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 10px; }
.bd-staffel-tbl thead th { font-size: 10.5px; text-transform: uppercase; letter-spacing: .03em; color: #9aa7b8; font-weight: 600; text-align: right; padding: 6px 8px; border-bottom: 1px solid #eef2f7; }
.bd-staffel-tbl thead th.l { text-align: left; }
.bd-staffel-tbl tbody td { padding: 6px 8px; text-align: right; border-bottom: 1px solid #f3f6f9; color: #1f2d3d; white-space: nowrap; }
.bd-staffel-tbl tbody td.l { text-align: left; font-weight: 600; color: #5a6b80; }
.bd-staffel-tbl tbody tr:nth-child(even) { background: #fafbfc; }
.bd-staffel-tbl tbody tr.bd-staffel-active { background: #e7f6f0 !important; }
.bd-staffel-tbl tbody tr.bd-staffel-active td { color: #0f6e56; font-weight: 600; }

/* v0.15.0: Staffel-Tabelle mobil */
@media (max-width: 480px) {
  .bd-staffel-table { padding: 12px 12px; }
  .bd-staffel-tbl { font-size: 12px; }
  .bd-staffel-tbl thead th, .bd-staffel-tbl tbody td { padding: 5px 5px; }
}

/* ===========================================================================
 * v0.16.0 — Bug B: einheitliche CI-Buttons (Produkt = Warenkorb = Editor)
 * Primär = orange #ec991c · Sekundär = outline. Editor-Add (#lumise-cart-action)
 * wird im JS-CI-CSS auf dieselben Werte gesetzt.
 * =========================================================================== */
.bd-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }

.bd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; min-height: 44px; padding: 10px 18px;
  font-family: Montserrat, sans-serif; font-weight: 600; font-size: 14px; line-height: 1;
  border-radius: 8px; border: 1.5px solid transparent; cursor: pointer;
  text-align: center; text-decoration: none; transition: background .15s, border-color .15s;
}
.bd-btn-primary { background: #ec991c !important; border-color: #ec991c !important; color: #fff !important; }
.bd-btn-primary:hover:not([disabled]) { background: #c67d14 !important; border-color: #c67d14 !important; }
.bd-btn-secondary { background: #fff !important; border-color: #ec991c !important; color: #334862 !important; }
.bd-btn-secondary:hover:not([disabled]) { background: #fff3e0 !important; }
.bd-btn[disabled] { opacity: .45; cursor: not-allowed; }

/* Warenkorb-Apply auf denselben Look ziehen (war radius 4px) */
.bd-cm-apply {
  border-radius: 8px !important; min-height: 40px; padding: 9px 18px !important;
  font-family: Montserrat, sans-serif; font-size: 14px !important;
}

/* ===========================================================================
 * v0.16.3 — Produktseite: Gestalten / Blanko in zwei getrennte Blöcke
 * =========================================================================== */
.bd-size-matrix .bd-block { border: 1px solid #e3e3df; border-radius: 10px; padding: 16px 18px; margin: 0 0 14px; }
.bd-size-matrix .bd-block-design { border-left: 4px solid #ec991c; }
.bd-size-matrix .bd-kicker { font-family: Montserrat, sans-serif; font-size: 11px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #8a94a0; margin-bottom: 4px; }
.bd-size-matrix .bd-block-title { font-family: Montserrat, sans-serif; font-weight: 700; font-size: 16px; color: #273647; margin-bottom: 4px; }
.bd-size-matrix .bd-block-sub { font-size: 12.5px; line-height: 1.45; color: #8a94a0; margin: 0 0 12px; }
.bd-size-matrix .bd-or { display: flex; align-items: center; gap: 12px; color: #aab2bb; font-size: 12px; letter-spacing: .05em; text-transform: uppercase; margin: 4px 0 14px; }
.bd-size-matrix .bd-or::before, .bd-size-matrix .bd-or::after { content: ""; flex: 1; height: 1px; background: #e3e3df; }
.bd-size-matrix .bd-block-blank .bd-color { margin-top: 2px; }
/* Im Block-Layout greift die alte Top-Margin der Matrix nicht mehr */
.bd-size-matrix .bd-block-blank .bd-matrix-table { margin-top: 8px; }

/* v0.16.3 — Grössen in CI-Petrol statt Flatsome-Blau */
.bd-matrix-table .bd-c-size { color: #334862; font-weight: 500; }
