/* SpielZent Storefront v4
   Main dark/red storefront theme. Component sections are grouped below for maintainability. */

:root {
    --sz-red:#e50914;
    --sz-red2:#8b0008;
    --sz-bg:#070707;
    --sz-panel:#111;
    --sz-line:#282828;
    --sz-muted:#999
}

* {
    box-sizing:border-box
}

body {
    background:var(--sz-bg);
    color:#fff;
    font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif
}

a {
    color:#fff
}

.sz-nav {
    background:rgba(5,5,5,.94);
    border-bottom:1px solid #1d1d1d;
    backdrop-filter:blur(14px)
}

.navbar-brand span,.text-danger {
    color:#ff2430!important
}

.fw-black {
    font-weight:900
}

.sz-icon-btn {
    color:#fff;
    border:1px solid #333
}

.sz-hero {
    background:radial-gradient(circle at 70% 30%,rgba(229,9,20,.22),transparent 32%),linear-gradient(135deg,#050505,#100002);
    min-height:680px
}

.min-vh-75 {
    min-height:75vh
}

.sz-eyebrow,.sz-section-label,.sz-final-label {
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.16em;
    color:#ff3c45
}

.sz-hero-title {
    font-size:clamp(3rem,7vw,6.8rem);
    line-height:.92;
    font-weight:900;
    letter-spacing:-.06em
}

.sz-hero-title span {
    background:linear-gradient(90deg,#ff1624,#ff6870);
    -webkit-background-clip:text;
    color:transparent
}

.sz-hero-description {
    font-size:1.2rem;
    color:#aaa;
    max-width:700px
}

.sz-btn-red {
    background:linear-gradient(135deg,#f31320,#a90009);
    border:0;
    color:white
}

.sz-btn-red:hover {
    color:#fff;
    filter:brightness(1.12)
}

.sz-btn-outline {
    border:1px solid #444;
    color:#fff
}

.sz-btn-outline:hover {
    background:#fff;
    color:#000
}

.sz-stat-box,.sz-benefit-card,.sz-mini-card,.sz-platform-card,.sz-product-card {
    background:linear-gradient(145deg,#151515,#0c0c0c);
    border:1px solid #262626;
    border-radius:18px;
    padding:18px;
    color:#fff
}

.sz-stat-box {
    display:flex;
    gap:12px;
    align-items:center
}

.sz-stat-box i {
    color:#ff2430;
    font-size:1.5rem
}

.sz-stat-box span,.sz-mini-card span {
    display:block;
    color:#888;
    font-size:.85rem
}

.sz-hero-panel,.sz-search-panel {
    background:linear-gradient(145deg,rgba(35,8,10,.9),rgba(13,13,13,.96));
    border:1px solid rgba(255,40,50,.25);
    border-radius:28px;
    padding:28px;
    box-shadow:0 25px 80px rgba(0,0,0,.5)
}

.sz-hero-panel-top {
    display:flex;
    justify-content:space-between;
    align-items:center
}

.sz-controller-circle {
    width:64px;
    height:64px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:#e50914;
    font-size:1.8rem
}

.sz-mini-card {
    display:block;
    height:100%;
    transition:.2s
}

.sz-mini-card:hover,.sz-product-card:hover {
    transform:translateY(-4px);
    border-color:#a71920
}

.sz-mini-card i {
    display:block;
    color:#ff303b;
    font-size:1.7rem;
    margin-bottom:12px
}

.sz-delivery-box {
    display:flex;
    gap:15px;
    padding:16px;
    border-radius:16px;
    background:#090909
}

.sz-search-section {
    padding:34px 0;
    background:#090909
}
/* ============================================================
   SPIELZENT SEARCH SECTION
   Fully responsive - prevents horizontal overflow
   ============================================================ */

.sz-search-section {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

    .sz-search-section .container-fluid {
        width: 100%;
        max-width: 100%;
    }


/* Main panel */

.sz-search-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 28px;
    border-radius: 24px;
    background: radial-gradient( circle at 85% 20%, rgba(229, 9, 20, 0.12), transparent 35% ), linear-gradient( 135deg, #161616, #0b0b0b );
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-sizing: border-box;
}


    /* IMPORTANT:
   Allow Bootstrap columns to actually shrink */

    .sz-search-panel .row,
    .sz-search-panel [class*="col-"] {
        min-width: 0;
    }


/* ============================================================
   SEARCH BOX
   ============================================================ */

.sz-search-box {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    background: #080808;
    border: 1px solid #333;
    border-radius: 999px;
    padding: 6px 6px 6px 18px;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}


    .sz-search-box:focus-within {
        border-color: #e50914;
        box-shadow: 0 0 0 3px rgba(229, 9, 20, 0.12), 0 10px 30px rgba(0, 0, 0, 0.25);
    }


    /* Search icon */

    .sz-search-box > i {
        flex: 0 0 auto;
        color: #777;
        font-size: 1rem;
    }


    /* Search input */

    .sz-search-box input {
        /*
       THIS IS IMPORTANT.

       min-width: 0 allows the input to shrink
       inside the flex container instead of
       making the page wider.
    */
        flex: 1 1 0;
        width: 100%;
        min-width: 0;
        background: transparent;
        border: 0;
        outline: 0;
        color: #fff;
        padding: 12px;
        font-size: 0.95rem;
        box-sizing: border-box;
    }


        .sz-search-box input::placeholder {
            color: #777;
            opacity: 1;
        }


    /* Search button */

    .sz-search-box button {
        flex: 0 0 auto;
        border: 0;
        border-radius: 999px;
        background: linear-gradient( 135deg, #ff2638, #e50914, #b9000a );
        color: #fff;
        padding: 12px 24px;
        font-weight: 800;
        white-space: nowrap;
        cursor: pointer;
        box-shadow: 0 7px 20px rgba(229, 9, 20, 0.22);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }


        .sz-search-box button:hover {
            transform: translateY(-1px);
            box-shadow: 0 9px 24px rgba(229, 9, 20, 0.35);
        }


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 991.98px) {

    .sz-search-panel {
        padding: 24px;
    }
}


/* ============================================================
   PHONE
   ============================================================ */

@media (max-width: 575.98px) {

    .sz-search-section .container-fluid {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }


    .sz-search-panel {
        width: 100%;
        max-width: 100%;
        padding: 20px 16px;
        border-radius: 20px;
    }


        .sz-search-panel h2 {
            font-size: 1.5rem;
        }


        .sz-search-panel p {
            font-size: 0.88rem;
            line-height: 1.6;
        }


    /*
       On phones use a normal rounded rectangle
       instead of forcing everything into a pill.
    */
    .sz-search-box {
        width: 100%;
        padding: 6px;
        border-radius: 16px;
    }


        .sz-search-box > i {
            margin-left: 10px;
        }


        .sz-search-box input {
            width: 0;
            min-width: 0;
            padding: 12px 9px;
            font-size: 0.88rem;
        }


        .sz-search-box button {
            padding: 11px 15px;
            font-size: 0.82rem;
        }
}


/* ============================================================
   VERY SMALL PHONES
   Search button goes underneath the input.
   This makes it impossible for the search bar to overflow.
   ============================================================ */

@media (max-width: 390px) {

    .sz-search-panel {
        padding: 18px 13px;
    }


    .sz-search-box {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        width: 100%;
        padding: 7px;
        border-radius: 16px;
    }


        .sz-search-box > i {
            margin-left: 7px;
        }


        .sz-search-box input {
            width: 100%;
            min-width: 0;
            padding: 11px 9px;
        }


        .sz-search-box button {
            grid-column: 1 / -1;
            width: 100%;
            margin-top: 4px;
            padding: 12px;
            border-radius: 11px;
        }
}
.sz-dark-section {
    background:#0b0b0b
}

.sz-section-title {
    font-size:clamp(2rem,4vw,3.3rem);
    font-weight:850
}

.sz-category-card {
    position:relative;
    overflow:hidden;
    min-height:390px;
    padding:36px;
    border:1px solid #282828;
    border-radius:28px;
    color:white
}

.sz-category-games {
    background:linear-gradient(135deg,#1b0507,#0d0d0d)
}

.sz-category-gear {
    background:linear-gradient(135deg,#111,#210508)
}

.sz-category-bg-icon {
    position:absolute;
    right:-25px;
    bottom:-55px;
    font-size:15rem;
    color:rgba(255,255,255,.035)
}

.sz-category-badge {
    font-size:.75rem;
    font-weight:800;
    color:#ff4c55
}

.sz-category-card h2 {
    font-size:2.6rem;
    font-weight:850;
    margin-top:15px
}

.sz-category-card p {
    color:#aaa;
    max-width:600px
}

.sz-category-chip {
    background:#080808;
    border:1px solid #333;
    border-radius:12px;
    padding:12px
}

.sz-category-button {
    font-weight:800;
    color:#ff3b45
}

.sz-games-section,.sz-platform-section {
    background:#070707
}

.sz-view-all {
    color:#ff3b45
}

.sz-benefit-card {
    height:100%;
    padding:25px
}

.sz-benefit-icon {
    font-size:1.8rem;
    color:#ff303b
}

.sz-platform-card {
    display:flex;
    gap:10px;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    font-size:1.15rem
}

.sz-platform-card i {
    font-size:2rem;
    color:#ff303b
}

.sz-final-wrapper {
    padding:50px 0
}

.sz-final-cta {
    position:relative;
    overflow:hidden;
    padding:45px;
    border-radius:30px;
    background:linear-gradient(125deg,#b8000a,#520006);
    box-shadow:0 20px 70px rgba(180,0,10,.2)
}

.sz-btn-light {
    background:#fff;
    color:#111
}

.sz-btn-black {
    background:#090909;
    color:#fff
}

.sz-footer {
    border-top:1px solid #222;
    background:#050505
}

.sz-footer a {
    display:block;
    color:#aaa;
    text-decoration:none;
    margin-bottom:8px
}

.sz-product-card {
    height:100%;
    transition:.2s
}

.sz-product-img {
    aspect-ratio:16/10;
    object-fit:cover;
    width:100%;
    border-radius:12px;
    background:#191919
}

.sz-price {
    font-size:1.3rem;
    font-weight:800
}

.sz-sale {
    text-decoration:line-through;
    color:#777;
    font-size:.9rem
}

.form-control,.form-select {
    background:#101010!important;
    border-color:#333!important;
    color:#fff!important
}

.form-control:focus,.form-select:focus {
    border-color:#d51b25!important;
    box-shadow:0 0 0 .2rem rgba(229,9,20,.15)!important
}

.table {
    --bs-table-bg:transparent;
    --bs-table-color:#ddd;
    --bs-table-border-color:#292929
}

.sz-admin-side {
    width:245px;
    background:#090909;
    border-right:1px solid #222
}

.sz-admin-side .nav-link {
    color:#aaa;
    border-radius:10px
}

.sz-admin-side .nav-link:hover {
    background:#1a0809;
    color:#fff
}

@media(max-width:991px) {
    .sz-admin-side {
        width:78px
    }
    .sz-admin-side small,.sz-admin-side .nav-link {
        font-size:0
    }
    .sz-admin-side .nav-link i {
        font-size:1.25rem
    }
    .sz-hero {
        min-height:auto
    }
}


/* SpielZent v3 mega-navigation ------------------------------------------------ */
.sz-nav {
    background: rgba(5, 5, 5, 0.98);
    border-bottom: 1px solid rgba(220, 53, 69, 0.32);
    backdrop-filter: blur(14px);
}

.sz-mega-menu {
    --bs-dropdown-bg: #0d0d0f;
    --bs-dropdown-color: #ffffff;
    left: 2rem !important;
    right: 2rem !important;
    width: auto;
    max-height: min(72vh, 720px);
    overflow-y: auto;
    background: linear-gradient(145deg, #101012 0%, #090909 60%, #18090c 100%);
    border: 1px solid rgba(220, 53, 69, 0.35) !important;
    border-radius: 1rem;
}

.sz-dropdown {
    --bs-dropdown-bg: #0d0d0f;
    --bs-dropdown-color: #ffffff;
    border: 1px solid rgba(220, 53, 69, 0.35);
}

.sz-mega-title {
    color: #ffffff;
    border-bottom: 1px solid rgba(220, 53, 69, 0.25);
    padding-bottom: 0.75rem;
    margin-bottom: 0.75rem;
}

.sz-mega-menu .dropdown-item,
.sz-dropdown .dropdown-item {
    color: #bfc0c4;
    border-radius: 0.55rem;
    padding: 0.45rem 0.65rem;
    white-space: normal;
}

.sz-mega-menu .dropdown-item:hover,
.sz-mega-menu .dropdown-item:focus,
.sz-dropdown .dropdown-item:hover,
.sz-dropdown .dropdown-item:focus {
    color: #ffffff;
    background: linear-gradient(90deg, rgba(220, 53, 69, 0.24), rgba(220, 53, 69, 0.05));
}

.sz-page-hero {
    background:
        radial-gradient(circle at 15% 20%, rgba(220, 53, 69, 0.20), transparent 30rem),
        linear-gradient(180deg, #0d0d0f 0%, #080808 100%);
    border-bottom: 1px solid rgba(220, 53, 69, 0.18);
}

.sz-empty-state {
    background: linear-gradient(145deg, #121214, #0b0b0c);
    border: 1px solid rgba(220, 53, 69, 0.30);
    border-radius: 1rem;
}

@media (max-width: 1199.98px) {
    .sz-mega-menu {
        position: static !important;
        max-height: 65vh;
        margin-top: 0.5rem;
    }
}

/* ========================================================================== */
/* SpielZent v8 - Red gradient page, scrollbar, cart, address and checkout UI */
/* ========================================================================== */

html {
    min-height: 100%;
    background: #050505;
    scrollbar-color: #dc3545 #090909;
    scrollbar-width: thin;
}

body {
    min-height: 100vh;
    color: #ffffff;
    background:
        radial-gradient(circle at 12% 10%, rgba(220, 53, 69, 0.22), transparent 28rem),
        radial-gradient(circle at 88% 35%, rgba(122, 0, 20, 0.20), transparent 34rem),
        linear-gradient(180deg, #050505 0%, #100507 42%, #050505 100%);
    background-attachment: fixed;
}

/* Chromium/WebKit scrollbar styling. */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: #090909;
}

::-webkit-scrollbar-thumb {
    border: 3px solid #090909;
    border-radius: 999px;
    background: linear-gradient(180deg, #ff334d, #8d0018);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #ff5267, #b00020);
}

.sz-commerce-page {
    min-height: 70vh;
    background:
        linear-gradient(135deg, rgba(220, 53, 69, 0.06), transparent 45%),
        transparent;
}

.sz-checkout-card,
.sz-cart-line {
    padding: 1.35rem;
    border: 1px solid rgba(255, 55, 82, 0.28);
    border-radius: 1rem;
    background: linear-gradient(145deg, rgba(25, 10, 13, 0.96), rgba(8, 8, 9, 0.97));
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.28);
}

.sz-cart-line:hover {
    border-color: rgba(255, 55, 82, 0.55);
    transform: translateY(-1px);
    transition: 160ms ease;
}

.sz-cart-image {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    background: #111;
}

.sz-dark-input,
.sz-dark-input:focus,
.form-control,
.form-select {
    color: #fff;
    background-color: #0b0b0d;
    border-color: rgba(255, 255, 255, 0.14);
}

.sz-dark-input:focus,
.form-control:focus,
.form-select:focus {
    color: #fff;
    background-color: #0d0d0f;
    border-color: #dc3545;
    box-shadow: 0 0 0 .25rem rgba(220, 53, 69, .15);
}

.sz-btn-red {
    color: #fff;
    border: 0;
    background: linear-gradient(135deg, #ff314d 0%, #c20a27 55%, #7c0015 100%);
    box-shadow: 0 10px 30px rgba(220, 53, 69, .22);
}

.sz-btn-red:hover,
.sz-btn-red:focus {
    color: #fff;
    background: linear-gradient(135deg, #ff5268 0%, #dd1232 55%, #98001b 100%);
}

/* ========================================================================== */
/* SpielZent v9 - Advanced game catalog/filter and product-detail layout      */
/* Layout-only additions intentionally reuse the storefront's existing colors. */
/* ========================================================================== */

.sz-game-nav {
    display: flex;
    gap: .65rem;
    overflow-x: auto;
    padding-bottom: .4rem;
}

.sz-game-nav-item {
    min-width: 108px;
    padding: .8rem .9rem;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: .75rem;
    text-decoration: none;
    color: inherit;
    text-align: center;
    background: rgba(15,15,16,.8);
}

.sz-game-nav-item i { display: block; font-size: 1.35rem; margin-bottom: .25rem; }
.sz-game-nav-item span { display: block; font-size: .8rem; font-weight: 700; white-space: nowrap; }
.sz-game-nav-item small { display: block; margin-top: .15rem; opacity: .55; font-size: .68rem; }
.sz-game-nav-item:hover, .sz-game-nav-item.active { border-color: rgba(220,53,69,.75); color: inherit; }

.sz-filter-panel {
    position: sticky;
    top: 1rem;
    max-height: calc(100vh - 2rem);
    overflow-y: auto;
    padding: 1rem;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: .9rem;
    background: rgba(10,10,11,.88);
}

.sz-filter-group { padding: 0 0 1rem; margin: 0 0 1rem; border-bottom: 1px solid rgba(255,255,255,.08); }
.sz-filter-title { margin-bottom: .55rem; font-size: .82rem; font-weight: 800; }
.sz-filter-option { display: grid; grid-template-columns: 18px minmax(0,1fr) auto; align-items: center; gap: .45rem; padding: .28rem 0; cursor: pointer; font-size: .78rem; }
.sz-filter-option input { margin: 0; accent-color: #dc3545; }
.sz-filter-option small { opacity: .55; font-size: .68rem; }
.sz-filter-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .35rem .6rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(255,255,255,.04); font-size: .72rem; }

/* Compact cards keep more games visible and make scanning a large catalog easier. */
.sz-compact-grid .sz-product-card { height: 100%; padding: .55rem; }
.sz-compact-grid .sz-product-img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: .55rem; }
.sz-compact-grid .sz-product-card h5 { min-height: 2.25rem; margin-bottom: .35rem; font-size: .82rem; line-height: 1.15; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sz-compact-grid .sz-product-card small { font-size: .67rem; }
.sz-compact-grid .sz-price { font-size: .88rem; }
.sz-compact-grid .sz-sale { font-size: .68rem; }

.sz-product-media, .sz-buy-panel, .sz-product-info-panel { border: 1px solid rgba(255,255,255,.10); border-radius: .9rem; background: rgba(10,10,11,.82); }
.sz-product-media { overflow: hidden; }
.sz-product-hero-image { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.sz-product-thumbs { display: grid; grid-template-columns: repeat(6, minmax(70px, 1fr)); gap: .55rem; overflow-x: auto; }
.sz-product-thumb { padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: .55rem; background: transparent; }
.sz-product-thumb.active { border-color: #dc3545; }
.sz-product-thumb img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.sz-buy-panel, .sz-product-info-panel { padding: 1.25rem; }
.sz-product-badge { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .55rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; font-size: .7rem; }
.sz-purchase-benefits { display: grid; gap: .9rem; }
.sz-purchase-benefits > div { display: grid; grid-template-columns: 30px 1fr; gap: .65rem; align-items: start; }
.sz-purchase-benefits i { font-size: 1.2rem; }
.sz-purchase-benefits strong, .sz-purchase-benefits small { display: block; }
.sz-purchase-benefits small { margin-top: .15rem; opacity: .6; }
.sz-product-facts > div { display: grid; grid-template-columns: minmax(110px, .35fr) 1fr; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.sz-product-facts span { color: rgba(255,255,255,.55); }
.sz-buy-checklist { display: grid; gap: .85rem; }
.sz-buy-checklist li { display: grid; grid-template-columns: 22px 1fr; gap: .5rem; }

@media (max-width: 991.98px) {
    .sz-filter-panel { position: static; max-height: none; }
    .sz-product-thumbs { grid-template-columns: repeat(4, minmax(80px, 1fr)); }
}

/* ========================================================================== */
/* SpielZent v10 - image clarity, readable text and longer discovery homepage */
/* ========================================================================== */

/* Supplier cover images can be relatively small. Limiting their rendered size
   prevents the browser from stretching them into soft, blurry artwork. */
.sz-compact-grid .sz-product-img,
.sz-home-compact-grid .sz-product-img {
    width: 100%;
    height: 168px;
    aspect-ratio: auto;
    object-fit: contain;
    object-position: center;
    padding: .3rem;
    background: #0b0b0c;
}

.sz-home-compact-grid .sz-product-card {
    height: 100%;
    padding: .5rem;
}

.sz-home-compact-grid .sz-product-card h5 {
    min-height: 2.2rem;
    font-size: .8rem;
    line-height: 1.15;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.sz-home-compact-grid .sz-product-card small { font-size: .68rem; }
.sz-home-compact-grid .sz-price { font-size: .86rem; }

/* Use a brighter secondary text value than Bootstrap's default muted gray on
   the dark storefront. This improves readability without changing the theme. */
.sz-readable-muted,
.sz-catalog-page .text-secondary,
.sz-games-section .text-secondary,
.sz-dark-section .text-secondary {
    color: rgba(255, 255, 255, .76) !important;
}

.sz-home-browse-card {
    display: flex;
    flex-direction: column;
    min-height: 155px;
    height: 100%;
    padding: 1.1rem;
    color: #fff;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: .9rem;
    background: rgba(12,12,13,.78);
    transition: transform .16s ease, border-color .16s ease;
}
.sz-home-browse-card:hover { color:#fff; transform:translateY(-2px); border-color:rgba(220,53,69,.7); }
.sz-home-browse-card i { font-size:1.45rem; margin-bottom:.8rem; }
.sz-home-browse-card strong { font-size:.95rem; }
.sz-home-browse-card span { margin-top:.35rem; color:rgba(255,255,255,.72); font-size:.75rem; line-height:1.35; }

.sz-gear-info-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.sz-gear-info-grid > div { min-height:150px; padding:1.15rem; border:1px solid rgba(255,255,255,.11); border-radius:.9rem; background:rgba(12,12,13,.78); }
.sz-gear-info-grid i { display:block; font-size:1.6rem; margin-bottom:.75rem; }
.sz-gear-info-grid strong { display:block; color:#fff; }
.sz-gear-info-grid span { display:block; margin-top:.35rem; color:rgba(255,255,255,.72); font-size:.8rem; }

@media (max-width: 1399.98px) {
    .sz-compact-grid .sz-product-img, .sz-home-compact-grid .sz-product-img { height: 155px; }
}
@media (max-width: 767.98px) {
    .sz-compact-grid .sz-product-img, .sz-home-compact-grid .sz-product-img { height: 145px; }
    .sz-gear-info-grid { grid-template-columns:repeat(2,1fr); }
}

/* ========================================================================== */
/* SpielZent v11 - modern glass game cards + compact rounded product artwork   */
/* ========================================================================== */

/* Rounded artwork and a subtle glass layer make the catalog feel modern while
   keeping the existing SpielZent colors unchanged. */
.sz-product-card {
    position: relative;
    overflow: hidden;
    border-radius: 1rem;
    border: 1px solid rgba(255,255,255,.09);
}

.sz-product-card > a {
    display: block;
    position: relative;
}

.sz-product-img {
    border-radius: .9rem !important;
    transition: transform .28s ease, filter .28s ease;
}

/* v12: very light moving glass highlight.
   Instead of blurring/dimming the whole cover, a narrow translucent reflection
   travels diagonally from top-left to bottom-right for about one second. */
.sz-product-card > a {
    overflow: hidden;
    border-radius: .9rem;
}

.sz-product-card > a::after {
    content: "";
    position: absolute;
    top: -55%;
    left: -85%;
    width: 48%;
    height: 220%;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(
        115deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,.025) 35%,
        rgba(255,255,255,.10) 50%,
        rgba(255,255,255,.025) 65%,
        rgba(255,255,255,0) 100%
    );
    transform: translate3d(0, 0, 0) rotate(12deg);
}

.sz-product-card:hover > a::after {
    animation: sz-soft-glass-sweep 1.05s ease-out 1;
}

@keyframes sz-soft-glass-sweep {
    0%   { opacity: 0; transform: translate3d(0, 0, 0) rotate(12deg); }
    12%  { opacity: .7; }
    75%  { opacity: .45; }
    100% { opacity: 0; transform: translate3d(430%, 80%, 0) rotate(12deg); }
}

/* Keep the actual cover clear. Only a tiny scale gives the card some motion. */
.sz-product-card:hover .sz-product-img {
    transform: scale(1.012);
    filter: none;
}

/* Respect visitors who request reduced motion. */
@media (prefers-reduced-motion: reduce) {
    .sz-product-card:hover > a::after { animation: none; }
    .sz-product-card:hover .sz-product-img { transform: none; }
}

/* Product pages intentionally keep supplier artwork compact. Small source
   images stay sharper because they are no longer stretched across the page. */
.sz-product-media {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 340px;
    padding: 1rem;
    overflow: hidden;
    border-radius: 1.15rem;
}

.sz-product-hero-image {
    width: auto;
    max-width: min(100%, 420px);
    height: auto;
    max-height: 315px;
    aspect-ratio: auto;
    object-fit: contain;
    border-radius: 1rem;
    box-shadow: 0 16px 38px rgba(0,0,0,.38);
}

.sz-product-thumb { border-radius: .75rem; }
.sz-product-thumb img { border-radius: .68rem; }

@media (max-width: 767.98px) {
    .sz-product-media { min-height: 270px; }
    .sz-product-hero-image { max-width: 320px; max-height: 245px; }
}


/* ========================================================================== */
/* SpielZent v12 - navigation overflow cleanup                                */
/* ========================================================================== */
/* Mega menus should not become left/right scroll containers. Content wraps
   within the menu; only vertical scrolling is retained when the menu is tall. */
.sz-mega-menu {
    overflow-x: hidden !important;
    overflow-y: auto;
}

.sz-mega-menu > .row {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.sz-mega-menu .dropdown-item,
.sz-dropdown .dropdown-item {
    max-width: 100%;
    overflow-wrap: anywhere;
}

/* Hide horizontal scrollbar chrome in the collapsed navigation as well. */
#spielZentNavbar {
    overflow-x: clip;
}

/* ========================================================================== */
/* SpielZent v13 - modern digital-game merchandising + restrained glass motion */
/* ========================================================================== */

/* The moving reflection belongs to the artwork only. This prevents the old
   effect from washing over titles, prices and buying information. */
.sz-product-card > a::after { display: none !important; }

.sz-product-card-link {
    display: flex !important;
    flex-direction: column;
    height: 100%;
    overflow: visible !important;
    border-radius: inherit;
}

.sz-product-artwork {
    position: relative;
    overflow: hidden;
    border-radius: .9rem;
    background: rgba(255,255,255,.025);
    isolation: isolate;
}

.sz-product-artwork .sz-product-img {
    display: block;
    width: 100%;
    transition: transform .38s cubic-bezier(.2,.7,.2,1);
}

/* Very light one-second diagonal glass sweep: top-left -> bottom-right. */
.sz-glass-sweep {
    position: absolute;
    z-index: 2;
    top: -55%;
    left: -70%;
    width: 34%;
    height: 210%;
    pointer-events: none;
    opacity: 0;
    transform: rotate(16deg) translate3d(0,0,0);
    background: linear-gradient(110deg,
        transparent 0%,
        rgba(255,255,255,.015) 30%,
        rgba(255,255,255,.075) 48%,
        rgba(255,255,255,.025) 62%,
        transparent 100%);
}

.sz-product-card:hover .sz-glass-sweep {
    animation: sz-v13-glass-pass 1.05s ease-out 1;
}

@keyframes sz-v13-glass-pass {
    0%   { left:-70%; top:-55%; opacity:0; }
    14%  { opacity:.72; }
    70%  { opacity:.42; }
    100% { left:132%; top:8%; opacity:0; }
}

.sz-product-card:hover .sz-product-img { transform: scale(1.018); filter:none; }

.sz-card-badges {
    position:absolute;
    z-index:3;
    top:.5rem;
    left:.5rem;
    display:flex;
    flex-wrap:wrap;
    gap:.35rem;
}
.sz-discount-badge,.sz-card-badge {
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:.2rem .48rem;
    border-radius:.45rem;
    color:#fff;
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.02em;
    background:rgba(190,0,0,.92);
    box-shadow:0 4px 14px rgba(0,0,0,.28);
    backdrop-filter:blur(6px);
}
.sz-card-badge { background:rgba(12,12,14,.82); border:1px solid rgba(255,255,255,.16); }

.sz-card-body { display:flex; flex:1; flex-direction:column; padding:.72rem .2rem .12rem; }
.sz-card-meta { display:flex; flex-wrap:wrap; gap:.35rem .65rem; color:rgba(255,255,255,.67); font-size:.66rem; }
.sz-card-meta span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sz-card-title { min-height:2.35rem; margin:.38rem 0 .3rem; color:#fff; font-size:.82rem; line-height:1.18; font-weight:700; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sz-card-delivery { margin-top:auto; font-size:.67rem; font-weight:600; color:rgba(255,255,255,.66); }
.sz-card-delivery.is-available { color:rgba(255,255,255,.82); }
.sz-card-delivery i { margin-right:.2rem; }
.sz-card-buy-row { display:flex; align-items:flex-end; justify-content:space-between; gap:.55rem; margin-top:.55rem; padding-top:.55rem; border-top:1px solid rgba(255,255,255,.075); }
.sz-card-price-wrap { display:flex; min-width:0; flex-direction:column; }
.sz-card-old-price { color:rgba(255,255,255,.48); font-size:.64rem; line-height:1; text-decoration:line-through; }
.sz-card-price { margin-top:.14rem; color:#fff; font-size:.98rem; line-height:1; }
.sz-card-deal-button { flex:0 0 auto; padding:.34rem .48rem; border:1px solid rgba(255,255,255,.12); border-radius:.48rem; color:#fff; font-size:.64rem; font-weight:700; background:rgba(255,255,255,.045); transition:background .2s ease,border-color .2s ease,transform .2s ease; }
.sz-product-card:hover .sz-card-deal-button { background:rgba(180,0,0,.24); border-color:rgba(255,65,65,.34); transform:translateX(1px); }

/* Compact confidence strip: original SpielZent copy, using familiar digital-key
   shopping cues without copying another store's wording or visual identity. */
.sz-shop-confidence {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:.75rem;
    margin-bottom:1rem;
}
.sz-shop-confidence > div {
    display:flex;
    align-items:center;
    gap:.65rem;
    padding:.7rem .8rem;
    border:1px solid rgba(255,255,255,.08);
    border-radius:.75rem;
    background:rgba(255,255,255,.025);
}
.sz-shop-confidence i { font-size:1.15rem; }
.sz-shop-confidence strong { display:block; color:#fff; font-size:.74rem; }
.sz-shop-confidence span { display:block; margin-top:.1rem; color:rgba(255,255,255,.62); font-size:.64rem; }

@media (max-width: 767.98px) {
    .sz-shop-confidence { grid-template-columns:1fr; }
    .sz-card-deal-button { display:none; }
}
@media (prefers-reduced-motion: reduce) {
    .sz-product-card:hover .sz-glass-sweep { animation:none; }
    .sz-product-card:hover .sz-product-img { transform:none; }
}


/* SpielZent v14: compact purchase actions on game cards. */
.sz-product-card { cursor: pointer; }
.sz-card-actions { display:flex; align-items:center; justify-content:flex-end; gap:.35rem; flex-wrap:wrap; }
.sz-card-cart-button,
.sz-card-buy-button {
    border-radius:.48rem;
    padding:.38rem .52rem;
    font-size:.64rem;
    font-weight:800;
    line-height:1.1;
    white-space:nowrap;
    transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.sz-card-cart-button { color:#fff; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.055); }
.sz-card-buy-button { color:#fff; border:1px solid rgba(255,65,65,.38); background:linear-gradient(135deg,rgba(220,0,0,.82),rgba(130,0,0,.9)); }
.sz-card-cart-button:hover, .sz-card-buy-button:hover { transform:translateY(-1px); }
.sz-card-cart-button:hover { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.28); }
.sz-card-buy-button:hover { box-shadow:0 5px 16px rgba(190,0,0,.22); }
.sz-card-cart-button:disabled, .sz-card-buy-button:disabled { opacity:.42; cursor:not-allowed; transform:none; box-shadow:none; }
@media (max-width:575.98px) {
    .sz-card-actions { width:100%; justify-content:stretch; }
    .sz-card-actions form { flex:1 1 0; }
    .sz-card-cart-button, .sz-card-buy-button { width:100%; }
}

/* ========================================================================== */
/* SpielZent v15 - rounded game artwork + subtle moving glass reflection       */
/* ========================================================================== */
/* Keep supplier artwork crisp: rounding happens on the artwork container and
   image, while the glass highlight is a separate, low-opacity moving layer. */
.sz-product-artwork,
.sz-product-artwork .sz-product-img {
    border-radius: 1rem !important;
}

.sz-product-artwork {
    overflow: hidden !important;
    transform: translateZ(0);
}

.sz-product-artwork .sz-product-img {
    clip-path: inset(0 round 1rem);
}

/* The reflection is intentionally narrow and faint so game covers stay clear. */
.sz-glass-sweep {
    background: linear-gradient(112deg,
        transparent 0%,
        rgba(255,255,255,.008) 32%,
        rgba(255,255,255,.055) 49%,
        rgba(255,255,255,.016) 64%,
        transparent 100%) !important;
}

.sz-product-card:hover .sz-glass-sweep {
    animation: sz-v15-glass-pass 1.05s ease-out 1 !important;
}

@keyframes sz-v15-glass-pass {
    0%   { left:-72%; top:-58%; opacity:0; }
    18%  { opacity:.62; }
    72%  { opacity:.32; }
    100% { left:134%; top:10%; opacity:0; }
}

/* Match the dark checkout controls while keeping native select behavior. */
select.sz-dark-input {
    color: #fff;
    background-color: #111;
}
select.sz-dark-input option {
    color: #fff;
    background: #111;
}

@media (prefers-reduced-motion: reduce) {
    .sz-product-card:hover .sz-glass-sweep { animation: none !important; }
}
\n\n/* ========================================================================== */\n/* SpielZent v16 - searchable country picker + red custom scrollbar           */\n/* ========================================================================== */\n.sz-country-native {\n    position:absolute !important;\n    width:1px !important;\n    height:1px !important;\n    opacity:0 !important;\n    pointer-events:none !important;\n}\n.sz-country-picker { position:relative; width:100%; min-width:250px; }\n.sz-country-trigger {\n    width:100%; min-height:48px; display:flex; align-items:center; justify-content:space-between; gap:1rem;\n    padding:.72rem .9rem; border:1px solid rgba(255,255,255,.16); border-radius:.65rem;\n    color:#fff; background:#111; text-align:left;\n}\n.sz-country-trigger:hover,.sz-country-trigger:focus { border-color:rgba(220,35,45,.8); outline:none; box-shadow:0 0 0 .2rem rgba(210,0,15,.12); }\n.sz-country-menu {\n    position:absolute; z-index:1060; top:calc(100% + .4rem); left:0; width:max(100%, 340px); max-width:min(92vw, 430px);\n    padding:.55rem; border:1px solid rgba(220,35,45,.34); border-radius:.8rem;\n    background:rgba(13,13,15,.985); box-shadow:0 18px 45px rgba(0,0,0,.48); backdrop-filter:blur(14px);\n}\n.sz-country-search-wrap { display:flex; align-items:center; gap:.55rem; padding:.55rem .7rem; margin-bottom:.45rem; border:1px solid rgba(255,255,255,.12); border-radius:.6rem; background:#171719; color:rgba(255,255,255,.6); }\n.sz-country-search { width:100%; min-width:0; border:0; outline:0; color:#fff; background:transparent; }\n.sz-country-search::placeholder { color:rgba(255,255,255,.48); }\n.sz-country-options { max-height:360px; overflow-y:auto; overflow-x:hidden; padding-right:.2rem; scrollbar-width:thin; scrollbar-color:#d50b16 #242426; }\n.sz-country-options::-webkit-scrollbar { width:11px; }\n.sz-country-options::-webkit-scrollbar-track { background:#242426; border-radius:999px; }\n.sz-country-options::-webkit-scrollbar-thumb { background:linear-gradient(#ef2634,#9d0009); border:2px solid #242426; border-radius:999px; }\n.sz-country-option { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.68rem .75rem; border:0; border-radius:.5rem; color:#fff; background:transparent; text-align:left; }\n.sz-country-option:hover,.sz-country-option:focus,.sz-country-option[aria-selected="true"] { outline:0; background:rgba(213,11,22,.18); }\n.sz-country-option small { color:rgba(255,255,255,.48); font-size:.68rem; }\n.sz-country-empty { padding:1rem .75rem; color:rgba(255,255,255,.62); text-align:center; }\n@media (max-width:575.98px) { .sz-country-picker { min-width:0; } .sz-country-menu { width:100%; max-width:100%; } }\n
/* ========================================================================== */
/* SpielZent v17 - uniform game artwork + soft glass hover                     */
/* Based on the supplied reference's fixed artwork frame and 1.06 hover zoom. */
/* ========================================================================== */
.sz-product-artwork {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 10 !important;
    height: auto !important;
    overflow: hidden !important;
    border-radius: 1rem !important;
    background: #0b0b0d;
    isolation: isolate;
}

/* Every supplier image fills the exact same artwork box regardless of its
   original dimensions. Cropping is centered instead of stretching the image. */
.sz-product-artwork .sz-product-img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: inherit !important;
    clip-path: none !important;
    transform: scale(1);
    transform-origin: center center;
    transition: transform .38s cubic-bezier(.2,.7,.2,1) !important;
    will-change: transform;
}

/* Slightly grow the cover, matching the supplied card animation. */
.sz-product-card:hover .sz-product-artwork .sz-product-img {
    transform: scale(1.06) !important;
    filter: none !important;
}

/* A restrained diagonal glass reflection. It moves over the artwork only and
   remains transparent enough that the cover stays readable. */
.sz-product-artwork .sz-glass-sweep {
    display: block !important;
    position: absolute !important;
    z-index: 2 !important;
    top: -65% !important;
    left: -80% !important;
    width: 38% !important;
    height: 230% !important;
    pointer-events: none !important;
    opacity: 0;
    transform: rotate(18deg) translate3d(0,0,0);
    background: linear-gradient(108deg,
        transparent 0%,
        rgba(255,255,255,.012) 30%,
        rgba(255,255,255,.095) 48%,
        rgba(255,255,255,.026) 64%,
        transparent 100%) !important;
    will-change: left, top, opacity;
}

.sz-product-card:hover .sz-product-artwork .sz-glass-sweep {
    animation: sz-v17-glass-sweep 1.05s ease-out 1 !important;
}

@keyframes sz-v17-glass-sweep {
    0%   { left:-80%; top:-65%; opacity:0; }
    16%  { opacity:.68; }
    70%  { opacity:.38; }
    100% { left:138%; top:8%; opacity:0; }
}

@media (prefers-reduced-motion: reduce) {
    .sz-product-card:hover .sz-product-artwork .sz-product-img {
        transform: none !important;
    }
    .sz-product-card:hover .sz-product-artwork .sz-glass-sweep {
        animation: none !important;
    }
}

/* ========================================================================== */
/* SpielZent v18 - reliable artwork frame + scrollbar-free mega menu          */
/* ========================================================================== */
/* Use a real block height instead of relying only on aspect-ratio. This keeps
   the artwork visible even when older card rules or browser layout interact
   with absolutely-positioned supplier images. */
.sz-product-artwork {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    height: clamp(150px, 12vw, 190px) !important;
    min-height: 150px !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    border-radius: 1rem !important;
    background: #0b0b0d !important;
}

.sz-product-artwork .sz-product-img {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    opacity: 1 !important;
    visibility: visible !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: inherit !important;
    transform: scale(1) !important;
    transition: transform .42s cubic-bezier(.2,.72,.2,1) !important;
}

.sz-product-card:hover .sz-product-artwork .sz-product-img {
    transform: scale(1.055) !important;
}

/* Keep the glass reflection above the picture but below badges. */
.sz-product-artwork .sz-glass-sweep {
    z-index: 2 !important;
}
.sz-product-artwork .sz-card-badges {
    z-index: 3 !important;
}

/* The mega menu content fits naturally, so do not create a vertical scroll
   container or show a scrollbar when there is nothing useful to scroll. */
.sz-mega-menu {
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    scrollbar-width: none !important;
}
.sz-mega-menu::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

@media (max-width: 767.98px) {
    .sz-product-artwork {
        height: 155px !important;
        min-height: 155px !important;
    }
}


/* ========================================================================== */
/* SpielZent v19 - advanced checkout country search                           */
/* ========================================================================== */
.sz-country-picker { min-width: 0 !important; }
.sz-country-trigger { min-height: 50px; font-size: .95rem; }
.sz-country-trigger [data-country-label] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sz-country-menu {
    width: min(520px, 92vw) !important;
    min-width: 100% !important;
    max-width: 520px !important;
    padding: .7rem !important;
}
.sz-country-search-wrap { position: sticky; top: 0; z-index: 2; }
.sz-country-options {
    max-height: 410px !important;
    scrollbar-width: auto !important;
    scrollbar-color: #e31322 #211f22 !important;
}
.sz-country-options::-webkit-scrollbar { width: 12px !important; }
.sz-country-options::-webkit-scrollbar-track { background: #211f22 !important; border-radius: 999px; }
.sz-country-options::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg,#ff3342,#bd0010) !important;
    border: 2px solid #211f22 !important;
    border-radius: 999px !important;
}
.sz-country-option { min-height: 44px; }
.sz-country-option-name { min-width:0; white-space:normal; line-height:1.2; }
.sz-country-option small { flex:0 0 auto; min-width:44px; text-align:right; font-weight:700; }
@media (max-width: 767.98px) {
    .sz-country-menu { width:100% !important; max-width:100% !important; }
}


/* ========================================================================== */
/* SpielZent v20 - single searchable checkout country control                 */
/* ========================================================================== */
/* The real select is model-bound but never rendered as a second visual input. */
.sz-country-picker > select.sz-country-native[hidden] { display: none !important; }

.sz-country-picker {
    position: relative;
    width: 100%;
    min-width: 0 !important;
}

.sz-country-trigger {
    width: 100%;
    min-height: 52px;
    padding: .72rem 1rem;
    align-items: center;
}

/* Do not truncate long selected country names. */
.sz-country-trigger [data-country-label] {
    min-width: 0;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.sz-country-menu {
    top: calc(100% + .5rem) !important;
    bottom: auto !important;
    left: 0 !important;
    width: clamp(440px, 46vw, 640px) !important;
    min-width: 100% !important;
    max-width: min(640px, calc(100vw - 2rem)) !important;
    padding: .75rem !important;
}

/* JS applies this when there is not enough room below the field. */
.sz-country-menu.sz-country-menu-up {
    top: auto !important;
    bottom: calc(100% + .5rem) !important;
}

.sz-country-search-wrap {
    min-height: 48px;
    margin-bottom: .55rem;
}

.sz-country-search { font-size: 1rem; }

.sz-country-options {
    max-height: min(430px, 52vh) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.sz-country-option {
    min-height: 48px;
    padding: .72rem .85rem !important;
}

.sz-country-option-name {
    white-space: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.3 !important;
}

@media (max-width: 767.98px) {
    .sz-country-menu {
        width: min(94vw, 640px) !important;
        min-width: 100% !important;
        max-width: 94vw !important;
    }
}

/* ========================================================================== */
/* SpielZent v21 - single Select2 checkout country selector                   */
/* Uses the real <select>; Select2 adds searchable Bootstrap-friendly UI.      */
/* ========================================================================== */
.sz-country-select + .select2-container { width: 100% !important; }
.select2-container--default .select2-selection--single {
    min-height: 50px;
    display: flex;
    align-items: center;
    background: #111214;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: .65rem;
    color: #fff;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #dc3545;
    box-shadow: 0 0 0 .2rem rgba(220,53,69,.14);
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    width: 100%; padding: .7rem 2.8rem .7rem .9rem; color: #fff; line-height: 1.35;
    white-space: normal; overflow: visible; text-overflow: clip;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder { color: rgba(255,255,255,.55); }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 48px; right: .65rem; }
.select2-container--default .select2-selection--single .select2-selection__arrow b { border-top-color: #dc3545; }
.select2-dropdown {
    min-width: min(640px, calc(100vw - 2rem)) !important;
    background: #111214; border: 1px solid rgba(220,53,69,.55); border-radius: .7rem;
    color: #fff; box-shadow: 0 18px 45px rgba(0,0,0,.55); overflow: hidden;
}
.select2-search--dropdown { padding: .75rem; background: #111214; }
.select2-container--default .select2-search--dropdown .select2-search__field {
    min-height: 44px; padding: .55rem .75rem; background: #1a1b1e; color: #fff;
    border: 1px solid rgba(220,53,69,.55); border-radius: .5rem; outline: none;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #dc3545; box-shadow: 0 0 0 .2rem rgba(220,53,69,.12);
}
.select2-container--default .select2-results > .select2-results__options {
    max-height: 390px; overflow-y: auto; overflow-x: hidden;
    scrollbar-width: thin; scrollbar-color: #dc3545 #202124;
}
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar { width: 11px; }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-track { background: #202124; }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb { background: #dc3545; border: 2px solid #202124; border-radius: 999px; }
.select2-results__option { padding: .65rem .8rem; white-space: normal; overflow-wrap: anywhere; line-height: 1.3; }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: #dc3545; color: #fff; }
.select2-container--default .select2-results__option--selected { background: rgba(220,53,69,.22); color: #fff; }
@media (max-width: 767.98px) { .select2-dropdown { min-width: calc(100vw - 2rem) !important; } }


/* SpielZent v24 - active navigation + single-line product pricing. */
.sz-nav .navbar-nav .nav-link.active,
.sz-nav .navbar-nav .nav-link[aria-current="page"] {
    color:#ff2430 !important;
    font-weight:800;
}
.sz-nav .navbar-nav .nav-link.active::after {
    border-top-color:#ff2430;
}
.sz-card-price-wrap {
    display:flex !important;
    flex-direction:row !important;
    align-items:baseline !important;
    gap:.38rem !important;
    white-space:nowrap !important;
    flex-wrap:nowrap !important;
}
.sz-card-old-price, .sz-card-price {
    display:inline-block;
    margin-top:0 !important;
    white-space:nowrap;
}

/* SpielZent v25 - modern tag discovery + help/search surfaces */
.sz-tag-options{max-height:300px;overflow:auto;padding-right:.35rem;scrollbar-width:thin;scrollbar-color:#dc3545 #151518}.sz-tag-options::-webkit-scrollbar{width:7px}.sz-tag-options::-webkit-scrollbar-thumb{background:#dc3545;border-radius:20px}.sz-tag-search-icon{position:absolute;left:.85rem;top:50%;transform:translateY(-50%);z-index:2;color:#dc3545}.sz-tag-option{border-radius:.55rem;padding:.42rem .5rem;transition:background .18s ease,transform .18s ease}.sz-tag-option:hover{background:rgba(220,53,69,.1);transform:translateX(2px)}
.sz-help-search{max-width:850px;margin-inline:auto}.sz-help-card{height:100%;padding:1.4rem;border:1px solid rgba(255,255,255,.09);border-radius:1rem;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015));transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.sz-help-card:hover{transform:translateY(-4px);border-color:rgba(220,53,69,.55);box-shadow:0 1rem 2rem rgba(0,0,0,.2)}.sz-help-card i{font-size:1.6rem;color:#dc3545}.sz-help-card mark{background:rgba(220,53,69,.35);color:#fff;padding:0 .12rem}.sz-faq-nav{position:sticky;top:90px}.sz-faq-nav a{display:block;padding:.55rem .75rem;color:var(--bs-secondary-color);text-decoration:none;border-left:2px solid rgba(255,255,255,.1)}.sz-faq-nav a:hover{color:#fff;border-left-color:#dc3545;background:rgba(220,53,69,.07)}.sz-info-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.sz-info-strip>div{padding:1rem;border-radius:.9rem;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07)}.sz-info-strip strong,.sz-info-strip span{display:block}.sz-info-strip i{color:#dc3545;margin-right:.35rem}@media(max-width:991.98px){.sz-info-strip{grid-template-columns:repeat(2,1fr)}}@media(max-width:575.98px){.sz-info-strip{grid-template-columns:1fr}}


/* SpielZent v26 - tag filter diagnostics */
.sz-tag-empty { display:flex; flex-direction:column; gap:.35rem; padding:1rem; border:1px dashed rgba(220,53,69,.45); border-radius:.8rem; background:rgba(220,53,69,.06); color:var(--bs-secondary-color); font-size:.82rem; line-height:1.4; }
.sz-tag-empty strong { color:var(--bs-body-color); font-size:.9rem; }

/* ========================================================================== */
/* SpielZent v27 - accessibility, labels and premium card depth               */
/* ========================================================================== */
:root {
    --sz-text:#f8f9fa;
    --sz-text-soft:#d6d8dc;
    --sz-text-muted:#b8bdc5;
    --sz-primary:#ff1f2d;
    --sz-primary-rgb:255,31,45;
}

body { color:var(--sz-text); }
.text-secondary, .text-muted, .sz-readable-muted { color:var(--sz-text-muted) !important; }
.card, .accordion-item, .dropdown-menu, .list-group-item { color:var(--sz-text); }
.form-control::placeholder { color:#aeb4bd !important; opacity:1; }
.form-control, .form-select { color:#f8f9fa; }
.form-control:focus, .form-select:focus { color:#fff; }

/* Modern label badges: reusable across cards, filters and information pages. */
.bg-label-primary, .bg-label-danger, .bg-label-info, .bg-label-success,
.bg-label-warning, .bg-label-purple, .bg-label-cyan, .bg-label-dark {
    display:inline-flex; align-items:center; gap:.35rem; padding:.38rem .62rem;
    border-radius:999px; font-size:.72rem; font-weight:800; line-height:1;
    letter-spacing:.035em; border:1px solid transparent; backdrop-filter:blur(8px);
}
.bg-label-primary,.bg-label-danger { color:#ff8a92!important; background:rgba(255,31,45,.13)!important; border-color:rgba(255,65,78,.32)!important; box-shadow:0 0 18px rgba(255,31,45,.08); }
.bg-label-info,.bg-label-cyan { color:#78e8ff!important; background:rgba(13,202,240,.12)!important; border-color:rgba(13,202,240,.28)!important; }
.bg-label-success { color:#78e9ad!important; background:rgba(25,210,120,.12)!important; border-color:rgba(25,210,120,.28)!important; }
.bg-label-warning { color:#ffd978!important; background:rgba(255,193,7,.12)!important; border-color:rgba(255,193,7,.28)!important; }
.bg-label-purple { color:#d5a4ff!important; background:rgba(155,81,224,.14)!important; border-color:rgba(178,111,240,.3)!important; }
.bg-label-dark { color:#e4e7eb!important; background:rgba(255,255,255,.07)!important; border-color:rgba(255,255,255,.15)!important; }

/* Premium border/shadow utilities requested for the storefront. */
.card-border-shadow-primary,
.sz-product-card,
.sz-benefit-card,
.sz-help-card,
.sz-checkout-card,
.sz-mini-card,
.sz-platform-card,
.sz-stat-box,
.sz-hero-panel {
    border:1px solid rgba(var(--sz-primary-rgb),.24) !important;
    box-shadow:0 16px 44px rgba(0,0,0,.32), 0 0 0 1px rgba(255,255,255,.025), 0 0 24px rgba(var(--sz-primary-rgb),.045);
}
.card-border-shadow-primary:hover,
.sz-product-card:hover,
.sz-benefit-card:hover,
.sz-help-card:hover,
.sz-mini-card:hover,
.sz-platform-card:hover {
    border-color:rgba(var(--sz-primary-rgb),.58) !important;
    box-shadow:0 22px 58px rgba(0,0,0,.48), 0 0 28px rgba(var(--sz-primary-rgb),.13);
}
.shadow-lg { --bs-box-shadow-lg:0 1.25rem 3.5rem rgba(0,0,0,.5); }

/* Make badges readable on every dark surface. */
.badge { font-weight:800; letter-spacing:.02em; }
.badge.text-bg-danger { background:linear-gradient(135deg,#ff2635,#b5000c)!important; color:#fff!important; }
.badge.text-bg-dark { background:#1b1d21!important; color:#f4f5f7!important; border:1px solid #353941; }

/* Text links should remain visible before and during interaction. */
a:not(.btn):not(.dropdown-item):not(.nav-link) { text-underline-offset:.18em; }
a:not(.btn):hover { color:#ff5964; }

@media (prefers-reduced-motion:no-preference) {
    .sz-benefit-card,.sz-help-card,.sz-mini-card,.sz-platform-card,.card-border-shadow-primary {
        transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
    }
    .sz-benefit-card:hover,.sz-help-card:hover,.sz-mini-card:hover,.sz-platform-card:hover,.card-border-shadow-primary:hover {
        transform:translateY(-3px);
    }
}

/* v27 product labels stay compact and do not fight the card layout. */
.sz-card-meta { display:flex; flex-wrap:wrap; gap:.45rem; align-items:center; }
.sz-card-meta .bg-label-primary,.sz-card-meta .bg-label-info { font-size:.66rem; }
.sz-card-delivery.bg-label-success,.sz-card-delivery.bg-label-warning { width:max-content; max-width:100%; margin-top:.55rem; }
.sz-card-badges .bg-label-danger,.sz-card-badges .bg-label-purple { box-shadow:0 8px 24px rgba(0,0,0,.3); }

/* Bootstrap dark components: explicit contrast rather than relying on defaults. */
.accordion-button.bg-dark, .accordion-body, .dropdown-menu, .dropdown-item { color:#f4f5f7; }
.accordion-button.bg-dark:not(.collapsed) { color:#fff; background:#171719!important; box-shadow:inset 0 -1px 0 rgba(255,255,255,.08); }
.dropdown-item:hover,.dropdown-item:focus { color:#fff; background:rgba(255,31,45,.14); }
.table { --bs-table-color:#f4f5f7; --bs-table-striped-color:#f4f5f7; }

/* Keep long copy comfortable and legible on the black/red theme. */
p, li, dd { text-rendering:optimizeLegibility; }
.sz-page-hero .lead, .sz-hero-description { color:#c4c8cf!important; }

/* =========================================================
   v28 contrast fixes
   Keep support/navigation copy readable on every dark panel.
   ========================================================= */
.sz-faq-nav {
    color:#f8f9fa !important;
    background:linear-gradient(145deg,rgba(20,20,24,.96),rgba(8,8,10,.98));
    border:1px solid rgba(255,255,255,.10);
    border-radius:1rem;
    padding:1rem;
    box-shadow:0 14px 34px rgba(0,0,0,.28);
}
.sz-faq-nav strong { color:#fff !important; }
.sz-faq-nav a,
.sz-faq-nav a:visited {
    color:#d9dde3 !important;
    border-left-color:rgba(255,255,255,.16);
}
.sz-faq-nav a:hover,
.sz-faq-nav a:focus,
.sz-faq-nav a:active {
    color:#fff !important;
    border-left-color:#ff1f2d;
    background:rgba(255,31,45,.12);
}

/* The CTA uses a red gradient, so the eyebrow must not also be red. */
.sz-final-cta .sz-final-label {
    color:#fff !important;
    background:rgba(0,0,0,.24);
    border:1px solid rgba(255,255,255,.28);
    border-radius:999px;
    display:inline-flex;
    padding:.45rem .72rem;
    text-shadow:0 1px 10px rgba(0,0,0,.45);
}

/* Help security notice: guarantee a dark surface with readable foreground. */
.sz-help-security,
.alert.sz-help-security {
    color:#f8f9fa !important;
    background:linear-gradient(145deg,#17191d,#0d0e11) !important;
    border-color:rgba(255,31,45,.30) !important;
    box-shadow:0 14px 34px rgba(0,0,0,.28);
}
.sz-help-security strong { color:#fff !important; }
.sz-help-security p,
.sz-help-security .text-secondary { color:#c9ced6 !important; }

/* SpielZent v27: dark-catalog readability and compact wishlist action. */
.sz-catalog-page,
.sz-catalog-page h1, .sz-catalog-page h2, .sz-catalog-page h3,
.sz-catalog-page h4, .sz-catalog-page h5, .sz-catalog-page h6,
.sz-catalog-page p, .sz-catalog-page label,
.sz-catalog-page .breadcrumb-item,
.sz-catalog-page .breadcrumb-item.active,
.sz-catalog-page .breadcrumb-item + .breadcrumb-item::before {
    color: #fff !important;
}
.sz-catalog-page .breadcrumb a { color: #fff !important; text-decoration: none; }
.sz-catalog-page .breadcrumb a:hover { color: #ff5a64 !important; }
.sz-card-wishlist-button {
    width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid rgba(255,255,255,.16); border-radius: .65rem; background: rgba(10,10,12,.82);
    color: #ff3651; transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.sz-card-wishlist-button:hover { transform: translateY(-1px); border-color: #ff3651; background: rgba(255,54,81,.12); color: #ff6075; }
.sz-cart-login-notice { display:flex; gap:.8rem; align-items:flex-start; padding:1rem; border:1px solid rgba(239,68,68,.3); border-radius:.85rem; background:rgba(127,29,29,.12); color:#fff; }
.sz-cart-login-notice i { color:#ef4444; font-size:1.35rem; }
.sz-cart-login-notice span { color:rgba(255,255,255,.76); font-size:.875rem; }

/* SpielZent v28: three compact product action icons. Only the icon carries the action color. */
.sz-card-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .32rem;
    flex-wrap: nowrap;
}
.sz-card-actions form { flex: 0 0 auto !important; }
.sz-card-action-icon,
.sz-card-wishlist-button.sz-card-action-icon,
.sz-card-cart-button.sz-card-action-icon,
.sz-card-buy-button.sz-card-action-icon {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .58rem;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(10,10,12,.82);
    box-shadow: none;
    line-height: 1;
}
.sz-card-action-icon i { font-size: .92rem; }
.sz-card-wishlist-button.sz-card-action-icon i { color: #ff3651 !important; }
.sz-card-cart-button.sz-card-action-icon i { color: #31d7ff !important; }
.sz-card-buy-button.sz-card-action-icon i { color: #ff343f !important; }
.sz-card-action-icon:hover { transform: translateY(-1px); background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.28); }
@media (max-width:575.98px) {
    .sz-card-actions { width:auto; justify-content:flex-end; }
    .sz-card-action-icon,
    .sz-card-wishlist-button.sz-card-action-icon,
    .sz-card-cart-button.sz-card-action-icon,
    .sz-card-buy-button.sz-card-action-icon { width:32px !important; height:32px !important; min-width:32px; }
}


/* SpielZent v29: keep top-right navigation clickable while toasts are visible. */
.sz-toast-container-offset.swal2-container {
    top: 88px !important;
    bottom: auto !important;
    pointer-events: none !important;
    padding-top: .5rem !important;
}
.sz-toast-container-offset .swal2-popup { pointer-events: auto !important; }
.sz-card-wishlist-button.is-added i { color: #ff6075 !important; filter: drop-shadow(0 0 5px rgba(255,54,81,.5)); }
@media (max-width: 991.98px) {
    .sz-toast-container-offset.swal2-container { top: 76px !important; }
}

/* SpielZent: universal dark neutral action button. */
.btn-sz-neutral { background:#17171d !important; border:1px solid #3a3a44 !important; color:#f5f5f7 !important; }
.btn-sz-neutral:hover,.btn-sz-neutral:focus,.btn-sz-neutral:active { background:#292932 !important; border-color:#60606d !important; color:#fff !important; }


/* SpielZent localized footer bottom */
.footer-bottom{border-top:1px solid #222;background:#050505;color:#aaa}
.footer-bottom-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}
.footer-bottom-left{justify-self:start}.footer-bottom-center{justify-self:center}.footer-bottom-right{justify-self:end}
.footer-bottom .footer-legal-links a{display:inline;color:#aaa;margin:0}.footer-bottom .footer-legal-links a:hover{color:#fff}
.footer-language-icon{display:inline-flex!important;align-items:center;justify-content:center;color:#fff!important;margin:0!important;font-size:1.15rem}
.footer-social-link{display:inline-flex!important;margin:0!important}.footer-social-link img{width:30px;height:30px;object-fit:contain}
.footer-flags-container{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;margin-top:1rem;gap:1rem}
.footer-flag{display:flex;flex-direction:column;align-items:center;gap:.4rem}.footer-flag-left{justify-self:start}.footer-flag-center{justify-self:center}.footer-flag-right{justify-self:end}
.footer-flag img{width:44px;height:29px;object-fit:cover;border-radius:3px;border:1px solid #333}.footer-flag-text{font-size:.78rem;color:#aaa}
.sz-manage-logout .nav-link{border:0;background:transparent;color:#ff8f8f}.sz-manage-logout .nav-link:hover,.sz-manage-logout .nav-link:focus{color:#fff;background:rgba(255,42,42,.14)}
@media(max-width:767.98px){.footer-bottom-grid{grid-template-columns:1fr;text-align:center}.footer-bottom-left,.footer-bottom-center,.footer-bottom-right{justify-self:center}.footer-flags-container{grid-template-columns:1fr 1fr 1fr}.footer-flag-left,.footer-flag-center,.footer-flag-right{justify-self:center}}
