/* BK Produkt Konfigurator – Shop-Styles. Ab 3.22.0 als Datei im <head> statt Inline-<style> im HTML.
   Abschalten (Theme übernimmt): add_filter( 'bk_konfigurator_css', '__return_false' ); */
/* Tooltip button */
.bk-tip{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;background:#9ca3af;color:#fff;font-size:11px;font-weight:700;cursor:pointer;position:relative;vertical-align:middle;margin-left:5px;border:none;padding:0;line-height:1;user-select:none}
.bk-tip[data-img]{background:#3b82f6}
.bk-tip[data-img]:hover{background:#2563eb}
.bk-tip[data-tip]::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#1a202c;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;font-weight:400;white-space:normal;width:230px;line-height:1.5;z-index:9999;pointer-events:none;opacity:0;transition:opacity .15s;text-align:left}
.bk-tip[data-tip]:hover::after,.bk-tip[data-tip].open::after{opacity:1}
/* Configurator layout */
.bk-shop-configurator{
  /* Farben/Größen zum Anpassen ans Theme – Beispiel im Child-Theme: .bk-shop-configurator{--bk-akzent:#3290c7} */
  --bk-feld-rand:#9CA3AF; --bk-akzent:#1E3A6E; --bk-akzent-ring:rgba(30,58,110,.12); --bk-auswahl-flaeche:#F3F6FB;
  --bk-text:#111827; --bk-text-leise:#6B7280; --bk-linie:#E5E7EB; --bk-flaeche:#f9fafb;
  --bk-preis:#1d4ed8; --bk-preis-flaeche:#eff6ff; --bk-preis-linie:#bfdbfe;
  --bk-info:#3290C7; --bk-info-flaeche:#EAF6FD; --bk-info-linie:#BEE3F8; --bk-info-text:#29586F;
  --bk-fertigmass-schrift:22px;
  margin-bottom:18px;position:relative}
/* min-width:0 auf den Spalten: sonst bestimmt der breiteste nicht umbrechbare Inhalt (z. B. ein
   Zahlarten-Chip) die Mindestbreite der linken Spalte und schiebt die rechte aus dem Rahmen. */
.bk-cfg-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.bk-cfg-grid>*,.bk-cfg-links>*{min-width:0}
.bk-cfg-fields p{margin-top:0}
.bk-cfg-fields input:not([type=checkbox]):not([type=radio]),.bk-cfg-fields select,.bk-cfg-fields textarea{
  width:100%;box-sizing:border-box;border:1px solid var(--bk-feld-rand)!important;border-radius:8px!important;
  padding:10px!important;font-size:15px;line-height:1.3;background:#fff!important;color:var(--bk-text);box-shadow:none}
.bk-cfg-fields input:not([type=checkbox]):not([type=radio]):focus,.bk-cfg-fields select:focus{
  border-color:var(--bk-akzent)!important;outline:none;box-shadow:0 0 0 3px var(--bk-akzent-ring)!important}
/* Karten-Auswahl (Darstellung „Karten“ bei Auswahlfeldern) */
.bk-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:2px}
.bk-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;cursor:pointer;
  background:#fff!important;color:var(--bk-text)!important;border:1px solid var(--bk-feld-rand)!important;border-radius:8px!important;
  padding:10px!important;margin:0!important;font:inherit;font-size:14px!important;line-height:1.3;
  box-shadow:none!important;text-transform:none!important;letter-spacing:0!important;min-height:0;height:auto;width:auto}
.bk-card:hover{border-color:var(--bk-akzent)!important}
.bk-card.bk-card-selected{border:2px solid var(--bk-akzent)!important;padding:9px!important;background:var(--bk-auswahl-flaeche)!important}
.bk-card-img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:6px;display:block;margin-bottom:2px}
.bk-card-head{display:flex;align-items:center;gap:6px;min-width:0}
.bk-card-dot{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.2);flex:none}
.bk-card-label{font-weight:600;overflow-wrap:break-word;hyphens:auto}
.bk-card-price{font-size:12px;color:var(--bk-text-leise)}
.bk-card-price.bk-card-price-plus{color:var(--bk-preis);font-weight:600}
.bk-card-price:empty::before{content:attr(data-empty)}
/* Vertrauensleiste unter dem Warenkorb-Button (ab 3.22.0 in der linken Spalte): Lieferzeit + Zahlarten */
.bk-trust{margin-top:18px;padding-top:14px;border-top:1px solid var(--bk-linie)}
.bk-lieferzeit{display:flex;align-items:center;justify-content:center;gap:8px;padding:9px 12px;border-radius:8px;
  background:var(--bk-info-flaeche);border:1px solid var(--bk-info-linie);color:var(--bk-info-text);font-size:13px;font-weight:600;margin-bottom:12px}
.bk-lieferzeit svg{flex:none;color:var(--bk-info)}
.bk-zahlarten-titel{display:block;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#9CA3AF;margin-bottom:8px;text-align:center}
.bk-zahlarten-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.bk-zahlart{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;min-width:0;
  padding:10px 6px 8px;border:1px solid var(--bk-linie);border-radius:8px;background:#fff;line-height:1.2;text-align:center}
.bk-zahlart-logo{display:flex;align-items:center;height:26px}
.bk-zahlart img{width:auto;display:block;max-width:90%;margin:0!important;box-shadow:none!important}
.bk-zahlart img.bk-logo-h22{height:22px}
.bk-zahlart img.bk-logo-h15{height:15px}
.bk-zahlart-text{font-size:11px;color:var(--bk-text-leise);overflow-wrap:break-word;hyphens:auto}
.bk-cfg-images{display:flex;flex-direction:column;gap:12px}
.bk-img-box{border:2px dashed #d0d5dd;border-radius:8px;overflow:hidden;min-height:100px;display:flex;align-items:center;justify-content:center}
.bk-img-box img{width:100%;height:auto;display:block}
.bk-img-placeholder{color:#bbb;font-size:13px;padding:16px;text-align:center}
/* Output cards */
/* Ergebnis-Karten: eine je Zeile (Nutzer-Vorgabe 18.09.2026 – zweispaltig war zu eng) */
.bk-out-grid{display:grid;grid-template-columns:1fr;gap:8px;margin-top:14px}
.bk-out-card{background:var(--bk-flaeche);border:1px solid var(--bk-linie);border-radius:8px;padding:10px 14px;min-width:0;box-sizing:border-box}
.bk-out-label{display:block;font-size:10px;color:var(--bk-text-leise);text-transform:uppercase;margin-bottom:3px;font-weight:500;overflow-wrap:break-word;hyphens:auto}
.bk-out-value{display:block;font-size:14px;font-weight:700;color:var(--bk-text);overflow-wrap:break-word;hyphens:auto}
.bk-out-price .bk-out-value,.bk-out-handling .bk-out-value{white-space:nowrap}
.bk-out-price{background:var(--bk-preis-flaeche);border-color:var(--bk-preis-linie)}
.bk-out-price .bk-out-value{color:var(--bk-preis);font-size:18px}
.bk-out-handling{background:#fff7ed;border-color:#fed7aa}
.bk-out-handling .bk-out-value{color:#c2410c}
.bk-out-note{display:block;font-size:11px;color:#9a3412;font-weight:400;margin-top:2px}
/* Validation */
.bk-cfg-field.bk-invalid{border-color:#ef4444!important;background:#fef2f2!important}
.bk-field-error{color:#dc2626;font-size:12px;margin-top:3px;display:block}
.bk-field-wrap{margin-bottom:12px}
.bk-btn-disabled{opacity:.5;cursor:not-allowed!important}
/* Image popup */
.bk-img-popup{position:absolute;z-index:999;background:#fff;border:1px solid #d0d5dd;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.15);padding:8px;max-width:260px;display:none}
.bk-img-popup.open{display:block}
.bk-img-popup img{width:100%;height:auto;border-radius:6px;display:block}

/* ---- 3.22.0 linke Spalte unter den Feldern: Fertigmaß → Hinweise → Preis → Menge/Warenkorb → Lieferzeit/Zahlarten ---- */
.bk-cfg-links{display:flex;flex-direction:column;gap:0}
.bk-fertigmass{margin-top:4px;padding:12px 14px;border:1px solid var(--bk-info-linie);border-radius:8px;background:#fff}
.bk-fertigmass-label{display:block;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--bk-text-leise)}
.bk-fertigmass-wert{display:block;margin-top:2px;font-size:var(--bk-fertigmass-schrift);font-weight:700;line-height:1.25;color:var(--bk-text);font-variant-numeric:tabular-nums}
.bk-fertigmass-sub{display:block;font-size:12px;color:var(--bk-text-leise)}
.bk-hinweise{list-style:none!important;margin:10px 0 0!important;padding:0!important;display:grid;gap:8px}
.bk-hinweis{display:flex;gap:10px;align-items:flex-start;margin:0!important;padding:10px 12px;border-radius:8px;
  background:var(--bk-info-flaeche);border:1px solid var(--bk-info-linie);color:var(--bk-info-text);font-size:13px;line-height:1.45}
.bk-hinweis::before{content:none!important;display:none!important}
.bk-hinweis-icon{flex:none;display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;margin-top:1px;
  border-radius:50%;background:var(--bk-info);color:#fff;font-size:11px;font-weight:700;line-height:1}
/* Menge + Button zieht render_cart_mover() hierher (WooCommerce-Markup); ohne JS bleiben sie unter dem Konfigurator */
.bk-cart-slot{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.bk-cart-slot:empty{display:none}
.bk-cart-slot .quantity{margin:0!important;float:none!important}
.bk-cart-slot .single_add_to_cart_button{float:none!important;margin:0!important;flex:1 1 180px}
/* Vorschau-Grafik (vorher Inline-Styles) */
.bk-preview-titel{margin:0 auto 8px!important;font-size:12px!important;font-weight:600!important;color:var(--bk-text-leise)!important;text-transform:uppercase;letter-spacing:.05em;text-align:center;max-width:280px}
.bk-preview-svg{display:block;max-width:280px;margin:0 auto}
.bk-preview-caption{font-size:12px!important;color:var(--bk-text-leise)!important;text-align:center;margin:8px 0 0!important;font-variant-numeric:tabular-nums}
.bk-preview-note{font-size:12px!important;color:var(--bk-text-leise)!important;text-align:center;margin:2px 0 0!important}

/* Handy – steht am Dateiende, damit die Grundregeln oben (z. B. .bk-cfg-links{display:flex}) es nicht überschreiben */
@media(max-width:600px){
  .bk-cfg-grid{grid-template-columns:1fr}
  /* Handy: Felder → Vorschau/Winkelhilfe → Kaufbereich. display:contents macht Felder und Kaufbereich zu
     eigenen Zellen; Messhilfe -1, Vorschau 1, Winkelhilfe 2 setzt hilfen.css. Kaufbereich nach oben: order 0. */
  .bk-cfg-links{display:contents}
  .bk-cfg-summary{order:3}
}
