/* webaruhaz – bolti stílusok. Csak .wa- előtagú osztályok (a site stílusát nem írja felül). Bootstrap 5.3-ra épül. */
.wa-bolt-fejlec .wa-kereso-urlap { min-width: 12rem; max-width: 32rem; }
.wa-mini-kosar { color: inherit; font-size: 1.15rem; }
.wa-mini-kosar .wa-mini-kosar-db { font-size: .65rem; }
.wa-mini-kosar .wa-mini-kosar-osszeg { font-size: .85rem; }

/* Kártya */
.wa-kartya { transition: box-shadow .15s ease-in-out; }
.wa-kartya:hover { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .08); }
.wa-kartya .wa-kartya-kep { aspect-ratio: 1 / 1; overflow: hidden; background: #f8f9fa; }
.wa-kartya .wa-kartya-kep img { width: 100%; height: 100%; object-fit: contain; }
.wa-kartya .card-title a:hover { text-decoration: underline !important; }
.wa-kartya-elfogyott .wa-kartya-kep img { opacity: .6; }
.wa-kartya-tul li { line-height: 1.3; }

/* Kategóriacsempe */
.wa-kategoria-csempe img { aspect-ratio: 3 / 2; object-fit: cover; }
.wa-kategoria-csempe:hover { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .08); }

/* Szűrők */
.wa-szurok .wa-szuro-blokk h3 { font-size: .95rem; }
.wa-szinmintak .btn-check + .wa-szinminta-gomb { display: inline-block; padding: 2px; border: 2px solid transparent; border-radius: 50%; cursor: pointer; }
.wa-szinmintak .btn-check:checked + .wa-szinminta-gomb { border-color: var(--bs-primary, #0d6efd); }
.wa-szinmintak .btn-check:focus-visible + .wa-szinminta-gomb { outline: 2px solid var(--bs-primary, #0d6efd); }
.wa-szinminta { display: inline-block; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 1px solid rgba(0, 0, 0, .2); vertical-align: middle; }
.wa-lista.wa-tolt { opacity: .5; pointer-events: none; transition: opacity .15s; }
.wa-szuro-cimke { font-weight: 500; }

/* Termékoldal */
.wa-termekoldal .wa-fo-kep { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; background: #f8f9fa; }
.wa-belyegkep img { width: 72px; height: 72px; object-fit: cover; }
.wa-belyegkep.active { border-color: var(--bs-primary, #0d6efd) !important; border-width: 2px !important; }
.wa-szin-gomb { background: none; border: 2px solid transparent; border-radius: 50%; padding: 2px; line-height: 0; }
.wa-szin-gomb.active { border-color: var(--bs-primary, #0d6efd); }
.wa-ertek-gomb.wa-nem-elerheto { opacity: .35; }
.wa-ertek-gomb.wa-elfogyott-ertek { text-decoration: line-through; }
.wa-szin-gomb.wa-elfogyott-ertek .wa-szinminta { background-image: linear-gradient(to top right, transparent 46%, #dc3545 47%, #dc3545 53%, transparent 54%); }
.wa-mennyiseg input::-webkit-outer-spin-button, .wa-mennyiseg input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.wa-mennyiseg input[type=number] { -moz-appearance: textfield; }
.wa-leiras img { max-width: 100%; height: auto; }
.wa-fo-kep-link { cursor: zoom-in; }
.wa-fo-kep-link:focus-visible, .wa-belyegkep:focus-visible { outline: 3px solid var(--bs-primary, #0d6efd); outline-offset: 2px; }

/* Lightbox (webaruhaz.js – saját <dialog>, világos háttér: a sötét palackfotó és a fehér hátterű kép is jól látszik) */
html.wa-lightbox-nyitva { overflow: hidden; }
dialog.wa-lightbox {
    position: fixed; inset: 0; z-index: 2000; box-sizing: border-box;
    width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; border-radius: 0;
    background: #fff; color: #212529; overflow: hidden; overscroll-behavior: contain;
}
dialog.wa-lightbox:not([open]) { display: none; }
dialog.wa-lightbox::backdrop { background: rgba(0, 0, 0, .35); }
.wa-lightbox .wa-lb-abra {
    position: absolute; inset: 3.75rem 4.5rem 1rem; margin: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem;
}
.wa-lightbox .wa-lb-kep {
    display: block; max-width: 100%; max-height: calc(100% - 2.25rem); width: auto; height: auto; object-fit: contain;
    user-select: none; -webkit-user-drag: none; touch-action: pan-y pinch-zoom; transition: opacity .15s ease-in-out;
}
.wa-lightbox .wa-lb-kep.wa-lb-tolt { opacity: .25; }
.wa-lightbox .wa-lb-felirat { min-height: 1.5rem; font-size: .95rem; text-align: center; color: #495057; }
.wa-lightbox .wa-lb-szamlalo { position: absolute; top: 1.1rem; left: 1.25rem; font-size: .95rem; font-variant-numeric: tabular-nums; color: #495057; }
.wa-lightbox .wa-lb-gomb {
    position: absolute; display: inline-flex; align-items: center; justify-content: center;
    width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: 50%;
    background: rgba(0, 0, 0, .06); color: #212529; cursor: pointer; line-height: 1;
}
.wa-lightbox .wa-lb-gomb:hover { background: rgba(0, 0, 0, .14); }
.wa-lightbox .wa-lb-gomb:focus-visible { outline: 3px solid var(--bs-primary, #0d6efd); outline-offset: 2px; }
.wa-lightbox .wa-lb-gomb[hidden] { display: none; }
.wa-lightbox .wa-lb-bezar { top: .5rem; right: .75rem; }
.wa-lightbox .wa-lb-elozo { left: .75rem; top: 50%; transform: translateY(-50%); }
.wa-lightbox .wa-lb-kovetkezo { right: .75rem; top: 50%; transform: translateY(-50%); }
@media (max-width: 575.98px) {
    .wa-lightbox .wa-lb-abra { inset: 3.5rem .5rem 4.5rem; }
    .wa-lightbox .wa-lb-elozo, .wa-lightbox .wa-lb-kovetkezo { top: auto; bottom: .75rem; transform: none; }
    .wa-lightbox .wa-lb-elozo { left: calc(50% - 3.25rem); }
    .wa-lightbox .wa-lb-kovetkezo { right: calc(50% - 3.25rem); }
}
@media (prefers-reduced-motion: reduce) {
    .wa-lightbox .wa-lb-kep { transition: none; }
}

/* Kategória-leírás „Tovább” */
.wa-kategoria-leiras.wa-osszecsukott { max-height: 7.5rem; overflow: hidden; position: relative; }
.wa-kategoria-leiras.wa-osszecsukott::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2.5rem; background: linear-gradient(rgba(255,255,255,0), var(--bs-body-bg, #fff)); }

/* Értesítés */
.wa-toast-tarolo { z-index: 1090; }

/* Élő keresési javaslatok (1.2.0) – a fejléc keresője alatt */
.wa-kereso-urlap .wa-javaslat { position: absolute; top: 100%; left: 0; right: 0; margin-top: .25rem; max-height: 70vh; overflow-y: auto; z-index: 1060; }
.wa-javaslat .wa-javaslat-termek img { width: 40px; height: 40px; object-fit: contain; flex: 0 0 40px; background: #fff; border-radius: .25rem; }
.wa-javaslat .dropdown-item { white-space: normal; }
.wa-javaslat .dropdown-item.active, .wa-javaslat .dropdown-item:active { color: var(--bs-dropdown-link-active-color, #fff); }
