/* Ertragswerke Storefront Utilities – vorkompilierte Styles (build-frei).
   Wird per <link> geladen; kein Theme-Build nötig. */

/* ---------- Mengen-Stepper ---------- */
.qb-qty { display:inline-flex; align-items:stretch; border:1px solid #cfd7dc; border-radius:.35rem; overflow:hidden; background:#fff; height:2.6rem; vertical-align:middle; }
.qb-qty__btn { border:0; background:#f3f6f7; color:#2b3136; width:2.4rem; min-width:2.4rem; font-size:1.15rem; line-height:1; font-weight:700; cursor:pointer; transition:background-color .15s ease,color .15s ease; -webkit-user-select:none; user-select:none; }
.qb-qty__btn:hover { background:#2c7d90; color:#fff; }
.qb-qty__btn:active { filter:brightness(.92); background:#2c7d90; color:#fff; }
.qb-qty__btn:disabled,.qb-qty__btn.is-disabled { opacity:.4; cursor:default; background:#f3f6f7; color:#2b3136; }
.qb-qty__input { width:3rem; min-width:0; height:100%; padding:.25rem; border:0; border-left:1px solid #cfd7dc; border-right:1px solid #cfd7dc; border-radius:0; text-align:center; font-weight:600; color:#2b3136; background:#fff; box-shadow:none; -moz-appearance:textfield; appearance:textfield; }
.qb-qty__input:focus { outline:none; box-shadow:inset 0 0 0 2px rgba(44,125,144,.45); }
.qb-qty__input::-webkit-outer-spin-button,.qb-qty__input::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }

/* ---------- Kauf-Zeile: Stepper NEBEN dem Button (eine Zeile) ---------- */
.qb-buy-row { display:flex; gap:.4rem; align-items:stretch; }
.qb-buy-row .qb-qty { flex:0 0 auto; }
.qb-buy-row .d-grid { flex:1 1 auto; display:block; min-width:0; }
.qb-buy-row .btn-buy { width:100%; height:100%; }

/* ---------- Erfolgs-Feedback am Kauf-Button ---------- */
.btn-buy.qb-add--success { background-color:#3cc261; border-color:#3cc261; color:#fff; pointer-events:none; }

/* ---------- Bild-Overlay: Hover-Bild + Badges + Quick-View ---------- */
.qb-media { position:relative; overflow:hidden; }
.qb-media .qb-hover-image { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:0; transition:opacity .25s ease; pointer-events:none; }
@media (hover:hover){ .qb-media:hover .qb-hover-image { opacity:1; } }

.qb-badge { position:absolute; z-index:3; font-weight:700; line-height:1.3; white-space:nowrap; pointer-events:none; }
.qb-badge--pill { padding:.15rem .5rem; border-radius:.25rem; font-size:.75rem; }
.qb-badge--seal { width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; text-align:center; font-size:.62rem; padding:.2rem; }
.qb-badge--bar-top,.qb-badge--bar-bottom { left:0; right:0; width:100%; text-align:center; padding:.3rem .25rem; font-size:.8rem; }
.qb-badge--bar-top { top:0; }
.qb-badge--bar-bottom { bottom:0; }
.qb-badge--ribbon { width:150px; text-align:center; padding:.22rem 0; font-size:.72rem; }
.qb-badge--pill.qb-pos--top-left,.qb-badge--seal.qb-pos--top-left { top:.5rem; left:.5rem; }
.qb-badge--pill.qb-pos--top-right,.qb-badge--seal.qb-pos--top-right { top:.5rem; right:.5rem; }
.qb-badge--pill.qb-pos--bottom-left,.qb-badge--seal.qb-pos--bottom-left { bottom:.5rem; left:.5rem; }
.qb-badge--pill.qb-pos--bottom-right,.qb-badge--seal.qb-pos--bottom-right { bottom:.5rem; right:.5rem; }
.qb-badge--ribbon.qb-pos--top-left { top:20px; left:-42px; transform:rotate(-45deg); }
.qb-badge--ribbon.qb-pos--top-right { top:20px; right:-42px; transform:rotate(45deg); }
.qb-badge--ribbon.qb-pos--bottom-left { bottom:20px; left:-42px; transform:rotate(45deg); }
.qb-badge--ribbon.qb-pos--bottom-right { bottom:20px; right:-42px; transform:rotate(-45deg); }

.qb-quickview-btn { position:absolute; left:50%; bottom:.5rem; transform:translateX(-50%); z-index:3; border:0; border-radius:.25rem; padding:.35rem .75rem; font-size:.8rem; background:rgba(23,46,59,.85); color:#fff; cursor:pointer; opacity:0; transition:opacity .2s ease; white-space:nowrap; }
@media (hover:hover){ .qb-media:hover .qb-quickview-btn { opacity:1; } }
.qb-quickview-btn:focus { opacity:1; }
.qb-quickview-btn:hover { background:#172e3b; }

/* ---------- Verfügbarkeit / Lagerbestand ---------- */
.qb-availability { margin-bottom:.4rem; font-size:.85rem; }
.qb-lowstock { margin-bottom:.4rem; font-size:.85rem; font-weight:600; color:#d9822b; }

/* ---------- Hinweis-Banner ---------- */
.ews-usp { width:100%; font-size:.9rem; }
.ews-usp__inner { max-width:1300px; margin:0 auto; padding:.5rem 1rem; display:flex; align-items:center; justify-content:center; gap:1rem; text-align:center; }
.ews-usp__text a { color:inherit; text-decoration:underline; }
.ews-usp__close { margin-left:auto; background:none; border:0; font-size:1.3rem; line-height:1; cursor:pointer; opacity:.8; }
.ews-usp__close:hover { opacity:1; }

/* ---------- Quick-View-Modal (build-frei, eigenes Overlay) ---------- */
.qb-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; z-index:2000; padding:1rem; }
.qb-modal { background:#fff; border-radius:.5rem; max-width:820px; width:100%; max-height:90vh; overflow:auto; padding:1.5rem; position:relative; }
.qb-modal__close { position:absolute; top:.5rem; right:.75rem; background:none; border:0; font-size:1.6rem; line-height:1; cursor:pointer; color:#172e3b; }
.qb-quickview { display:flex; flex-wrap:wrap; gap:1.5rem; align-items:flex-start; }
.qb-quickview__media { flex:1 1 240px; max-width:360px; }
.qb-quickview__img { width:100%; height:auto; object-fit:contain; }
.qb-quickview__info { flex:1 1 260px; display:flex; flex-direction:column; gap:.75rem; }
.qb-quickview__title { margin:0; font-size:1.4rem; }
.qb-quickview__desc { font-size:.95rem; opacity:.85; }
.qb-quickview__details { margin-top:.25rem; font-size:.9rem; }
@media (max-width:575px){ .qb-quickview { flex-direction:column; } .qb-quickview__media { max-width:100%; } }

/* ---------- Alternativprodukte (Produktseite) ---------- */
.qb-alternatives { margin-top:1rem; padding:1rem; border:1px solid #cfd7dc; border-radius:.5rem; background:#f8fafb; }
.qb-alternatives__headline { font-weight:700; margin-bottom:.75rem; }
.qb-alternatives__list { display:flex; flex-direction:column; gap:.5rem; }
.qb-alt { display:flex; align-items:center; gap:.75rem; padding:.5rem; border-radius:.35rem; text-decoration:none; color:inherit; transition:background-color .15s ease; }
.qb-alt:hover { background:#eef3f5; }
.qb-alt__img { width:56px; height:56px; object-fit:contain; flex:0 0 auto; }
.qb-alt__info { display:flex; flex-direction:column; }
.qb-alt__brand { font-size:.75rem; text-transform:uppercase; letter-spacing:.03em; opacity:.7; }
.qb-alt__name { font-weight:600; }
.qb-alt__price { font-size:.9rem; }

/* ---------- „Wieder verfügbar" ---------- */
.qb-stocknotify { margin-top:1rem; }
.qb-stocknotify__btn { width:100%; }
.qb-stocknotify__active { font-weight:600; color:#3b6d11; margin-bottom:.35rem; }
.qb-stocknotify__cancel { background:none; border:0; padding:0; color:#5f5e5a; text-decoration:underline; cursor:pointer; font-size:.85rem; }
.qb-stocknotify__hint { font-size:.9rem; opacity:.9; }
