/* webaruhaz – kosár, pénztár, köszönőoldal. A változók és a közös elemek (gomb, mező, kártya, címke) a webaruhaz.css-ben vannak;
 * minden szabály a .wa-bolt hatókörben (a site többi része változatlan). */

/* ================================================================== Kosár */
.wa-kosar-kep { object-fit: cover; background: var(--wa-felulet-halvany, #f6f7f9); border: 1px solid var(--wa-keret, #e2e5e9); border-radius: var(--wa-radius-kicsi, 8px) !important; }
.wa-kosar-tabla .wa-db { -moz-appearance: textfield; }
.wa-kosar-tabla .wa-db::-webkit-outer-spin-button,
.wa-kosar-tabla .wa-db::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.wa-kosar-tabla .wa-k-kep { width: 96px; }
.wa-kosar-tabla .wa-k-menny { min-width: 140px; }
.wa-kosar-tabla .wa-torol-urlap { margin: 0; }
.wa-bolt .wa-kosar-tabla .wa-k-nev > a { color: var(--wa-szoveg); line-height: 1.35; display: inline-block; margin-bottom: .2rem; }
.wa-bolt .wa-kosar-tabla .wa-k-nev > a:hover { color: var(--wa-elsodleges); text-decoration: underline !important; }
.wa-bolt .wa-kosar-tabla .wa-k-nev .small { font-size: .8125rem; }
.wa-bolt .wa-kosar-tabla .wa-sor-osszeg { font-variant-numeric: tabular-nums; }
.wa-bolt .wa-kosar-tabla .wa-mennyiseg { max-width: 120px !important; }
.wa-bolt .wa-kosar-tabla .wa-mennyiseg > * { min-height: 2.25rem; }
.wa-bolt .wa-kosar-tabla .wa-torol { min-height: 2.25rem; }
.wa-bolt .wa-kosar-ures { padding: 3rem 1.5rem; }

/* Mobilon (< 768 px) a táblázat kártyasorokká alakul: a mennyiség, a sorösszeg és a Törlés gomb vízszintes görgetés nélkül látszik */
@media (max-width: 767.98px) {
    .wa-kosar-oldal .table-responsive { overflow-x: visible; }
    .wa-kosar-tabla thead { display: none; }
    .wa-kosar-tabla, .wa-kosar-tabla tbody { display: block; width: 100%; }
    .wa-kosar-tabla tr {
        display: grid; grid-template-columns: 72px auto minmax(0, 1fr) auto; align-items: center; gap: .4rem .75rem;
        grid-template-areas: "kep nev nev nev" "kep ar ar ar" "menny menny torol osszeg";
        padding: 1rem; border-bottom: 1px solid var(--wa-keret, #e2e5e9);
    }
    .wa-kosar-tabla tr:last-child { border-bottom: 0; }
    .wa-bolt .wa-kosar-tabla td { display: block; padding: 0; border: 0; min-width: 0; width: auto; }
    .wa-kosar-tabla .wa-k-kep { grid-area: kep; align-self: start; }
    .wa-kosar-tabla .wa-k-nev { grid-area: nev; }
    .wa-kosar-tabla .wa-k-ar { grid-area: ar; text-align: start !important; }
    .wa-kosar-tabla .wa-k-ar del { display: inline !important; margin-right: .4rem; }
    .wa-kosar-tabla .wa-k-menny { grid-area: menny; min-width: 0; text-align: start !important; }
    .wa-kosar-tabla .wa-k-menny .wa-mennyiseg { margin-left: 0 !important; }
    .wa-kosar-tabla .wa-sor-osszeg { grid-area: osszeg; font-size: 1.0625rem; }
    .wa-kosar-tabla .wa-k-torol { grid-area: torol; text-align: start !important; }
    .wa-bolt .wa-kosar-tabla .wa-mennyiseg { max-width: 132px !important; }
    .wa-bolt .wa-kosar-tabla .wa-mennyiseg > *, .wa-bolt .wa-kosar-tabla .wa-torol { min-height: 44px; }
    .wa-bolt .wa-kosar-tabla .wa-mennyiseg .btn { min-width: 40px; }
    .wa-bolt .wa-kosar-tabla .wa-mennyiseg .form-control { font-size: 16px; }
    /* a Törlés gomb mobilon csak ikon (a felirat a képernyőolvasónak megmarad az aria-labelben) */
    .wa-bolt .wa-kosar-tabla .wa-torol { width: 44px; padding: 0; }
    .wa-bolt .wa-kosar-tabla .wa-torol > span { display: none; }
}

/* Összesítő (kosár + pénztár) */
@media (min-width: 992px) {
    .wa-ragados-osszesito { position: sticky; top: 1rem; }
}
.wa-bolt .wa-ragados-osszesito h2 { font-size: 1.125rem; margin-bottom: 1rem; }
.wa-bolt .wa-ragados-osszesito .alert { padding: .6rem .8rem !important; }
.wa-bolt .wa-ragados-osszesito dl { row-gap: .3rem; }
.wa-bolt .wa-ragados-osszesito dd { margin-bottom: 0; font-variant-numeric: tabular-nums; }
.wa-bolt .wa-ragados-osszesito .border-top, .wa-bolt .wa-ragados-osszesito .border-bottom { border-color: var(--wa-keret) !important; }
.wa-bolt .wa-ragados-osszesito #wa-o-vegosszeg, .wa-bolt #wa-kosar-osszeg { font-variant-numeric: tabular-nums; }

/* ================================================================== Pénztár */
.wa-penztar-oldal .wa-mod-sor { cursor: pointer; }
.wa-bolt.wa-penztar-oldal .list-group { display: flex; flex-direction: column; gap: .5rem; border-radius: 0; }
.wa-bolt.wa-penztar-oldal .list-group > .wa-mod-sor + .wa-mod-sor { border-top-width: 1px; }
.wa-bolt.wa-penztar-oldal .wa-cspont-lista { gap: 0; border: 1px solid var(--wa-keret); }
.wa-bolt.wa-penztar-oldal .wa-cspont-lista:empty { border: 0; }
.wa-bolt.wa-penztar-oldal .wa-cspont-lista .list-group-item { border-width: 0 0 1px; border-radius: 0; }
.wa-bolt.wa-penztar-oldal .wa-cspont-lista .list-group-item:last-child { border-bottom: 0; }
.wa-bolt.wa-penztar-oldal .wa-cspont-valaszto { padding: 1rem; border: 1px solid var(--wa-keret); border-radius: var(--wa-radius-kicsi); background: var(--wa-felulet-halvany); }
.wa-fizetes-logo { max-height: 40px; max-width: 100%; width: auto; display: block; }
.wa-bolt.wa-penztar-oldal .wa-ragados-osszesito .form-check { margin-bottom: .35rem; }
.wa-bolt.wa-penztar-oldal .wa-ragados-osszesito ul li { border-color: var(--wa-keret) !important; padding: .45rem 0 !important; }
.wa-bolt.wa-penztar-oldal #wa-megrendeles-gomb { min-height: 3.25rem; }

/* ================================================================== Köszönjük */
.wa-koszonjuk .fa-circle-check { line-height: 1; }
.wa-bolt.wa-koszonjuk .wa-visszajelzo .lead strong { font-variant-numeric: tabular-nums; }

@media (max-width: 991.98px) {
    /* mobilon / tableten az összesítő a szakaszok alatt, kártyaként – a Megrendelés gomb a végén */
    .wa-bolt.wa-penztar-oldal .wa-ragados-osszesito { border-color: var(--wa-elsodleges-keret); }
}

/* ================================================================== Pénztár telefonon (1.17.1) – csak keskeny kijelzőn, az asztali nézet változatlan */
@media (max-width: 640px) {
    /* az oldalak custom.css-e (≤ 576 px) a .col-12-ről leveszi a gutter-t – a .row.g-2-ben így a teljes szélességű mező 8 px-szel kilógott a többi alól */
    .wa-bolt.wa-penztar-oldal .row.g-2 > .col-12 { padding-left: calc(var(--bs-gutter-x) * .5) !important; padding-right: calc(var(--bs-gutter-x) * .5) !important; }
    /* rádiók és jelölőnégyzetek (magán/cég, eltérő szállítási cím, ÁSZF, adatkezelés, címmentés): a címkével együtt legalább 44 px magas cél */
    .wa-bolt.wa-penztar-oldal .form-check { display: flex; flex-wrap: wrap; align-items: center; column-gap: .6rem; min-height: 44px; padding-left: 0; margin-bottom: 0; }
    .wa-bolt.wa-penztar-oldal .form-check-inline { display: inline-flex; margin-right: 1.25rem; }
    .wa-bolt.wa-penztar-oldal .form-check > .form-check-input { float: none; flex-shrink: 0; margin: 0; }
    .wa-bolt.wa-penztar-oldal .form-check > .form-check-label { flex: 1 1 0; min-width: 0; padding: .7rem 0; }
    .wa-bolt.wa-penztar-oldal .form-check-inline > .form-check-label { flex: 0 1 auto; }
    .wa-bolt.wa-penztar-oldal .form-check > .invalid-feedback { flex: 0 0 100%; margin-top: -.5rem; }
}
@media (max-width: 575.98px) {
    /* csomagpont-kereső: a mező és „A közelemben” gomb egymás alatt, teljes szélességben (egy sorban a mező 40–90 px-re szűkült) */
    .wa-bolt.wa-penztar-oldal .wa-cspont-valaszto .input-group { flex-wrap: wrap; gap: .5rem; }
    .wa-bolt.wa-penztar-oldal .wa-cspont-valaszto .input-group > #wa-cspont-q,
    .wa-bolt.wa-penztar-oldal .wa-cspont-valaszto .input-group > #wa-cspont-hely { flex: 1 1 100%; width: 100%; min-height: 44px; margin-left: 0; border-radius: var(--wa-radius-kicsi); }
    /* szállítási / fizetési mód: a név és a díj nem ér össze; ha nem fér ki egy sorba, a díj a név alá, jobbra kerül (az ikon nem marad egyedül) */
    .wa-bolt.wa-penztar-oldal .wa-mod-sor > .flex-grow-1 > .d-flex { flex-wrap: wrap; column-gap: .75rem; }
    .wa-bolt.wa-penztar-oldal .wa-mod-sor .wa-mod-dij { margin-left: auto; }
}
