/* Bootstrap 5 compatibility: keeps the layout of the former Bootstrap 4 based theme. */

/* BS4 grid gutter was 30px (15px padding), BS5 default is 24px */
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm,
.row {
    --bs-gutter-x: 30px;
}

/* The theme used a 1200px container on desktop (BS5 would use 1140px / 1320px) */
@media (min-width: 1200px) {
    .container,
    .container-xxl { max-width: 1200px; }
}

/* BS4 links: no underline until hover */
a { text-decoration: none; }
a:hover { text-decoration: underline; }

/* BS4 grid columns were position: relative (absolutely positioned content inside columns relies on it) */
.col,
[class^="col-"],
[class*=" col-"] { position: relative; }

/* BS5 reboot gives lists a 2rem left padding; with BS4 the theme's global reset (padding: 0) applied */
ol, ul { padding-left: 0; }

/* BS5 forces width: 100% / padding / no-shrink on every direct child of .row.
   BS4 only did this for .col* elements, other children were plain flex items. */
.row > :not(.col):not([class^="col-"]):not([class*=" col-"]) {
    width: auto;
    max-width: none;
    flex-shrink: 1;
    padding-right: 0;
    padding-left: 0;
    margin-top: 0;
}

/* BS4: columns with an offset could shrink on phones; with BS5's flex-shrink: 0 they overflow */
@media (max-width: 575.98px) {
    [class*="offset-"] { flex-shrink: 1; }
}

/* BS5: .btn-link is underlined by default (BS4 only on hover) */
.btn-link { text-decoration: none; }

/* Product page accordion (Jellemzők / Szállítás & fizetés): no underline, square corners */
#accordion .btn-link,
#accordion .btn-link:hover,
#accordion .btn-link:focus { text-decoration: none; }
#accordion .card,
#accordion .card-header,
#accordion .card-body,
#accordion .btn { border-radius: 0; }
