:root {
    --ts-green: #0a8a24;       /* frisches Logo-Grün */
    --ts-green-dark: #05661b;  /* dunkler Kontrastton */
    --ts-green-soft: #edf8ef;  /* sehr helles Grün für Flächen */
    --ts-ink: #20262b;
    --ts-muted: #687078;
    --ts-line: #e2e8e4;
    --ts-surface: #ffffff;
    --ts-radius: 0.65rem;
    --ts-shadow: 0 0.35rem 1.2rem rgba(20, 54, 30, 0.09);
}

/* =========================================================
   Unterkategorien: kompaktes, zentriertes Raster
   ========================================================= */

/* NOVA nutzt hier normalerweise vier sehr breite Spalten. Die Bilder selbst
   sind deutlich kleiner; deshalb bekommen die Eintraege ein eigenes Raster. */
#content .content-cats-small {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, 11.25rem) !important;
    justify-content: center !important;
    align-items: start !important;
    gap: 1.25rem 1.5rem !important;
    margin: 0 auto 2rem !important;
}

#content .content-cats-small > [class*="col-"] {
    display: block !important;
    flex: 0 0 11.25rem !important;
    width: 11.25rem !important;
    max-width: 11.25rem !important;
    margin: 0 !important;
    padding: 0 !important;
}

#content .content-cats-small .sub-categories {
    width: 100% !important;
    height: auto !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
}

#content .content-cats-small .subcategories-image {
    width: 100% !important;
    height: 9.375rem !important;
    margin: 0 0 0.45rem !important;
    align-items: center !important;
    justify-content: center !important;
}

#content .content-cats-small .subcategories-image img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 9.375rem !important;
    max-height: 9.375rem !important;
    margin: auto !important;
    object-fit: contain !important;
}

#content .content-cats-small .caption {
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    text-align: center !important;
}

@media (max-width: 991.98px) {
    #content .content-cats-small {
        grid-template-columns: repeat(auto-fit, 9.5rem) !important;
        gap: 1rem !important;
    }

    #content .content-cats-small > [class*="col-"] {
        flex-basis: 9.5rem !important;
        width: 9.5rem !important;
        max-width: 9.5rem !important;
    }

    #content .content-cats-small .subcategories-image {
        height: 8rem !important;
    }

    #content .content-cats-small .subcategories-image img {
        max-width: 8rem !important;
        max-height: 8rem !important;
    }
}

@media (max-width: 575.98px) {
    #content .content-cats-small {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.9rem 0.65rem !important;
        width: 100% !important;
    }

    #content .content-cats-small > [class*="col-"] {
        flex-basis: auto !important;
        width: 100% !important;
        max-width: none !important;
    }

    #content .content-cats-small .subcategories-image.d-none {
        display: flex !important;
        height: 6.5rem !important;
    }

    #content .content-cats-small .subcategories-image img {
        max-width: 6.5rem !important;
        max-height: 6.5rem !important;
    }

    #content .content-cats-small .caption {
        font-size: 0.85rem !important;
    }
}

/* =========================================================
   Warenkorb-Dropdown – auf allen Bildschirmgrößen lesbar
   ========================================================= */
#cart-dropdown-container .cart-dropdown-buttons {
    row-gap: 0.45rem !important;
}

#cart-dropdown-container .cart-dropdown-buttons > [class*="col-"] {
    padding-right: 0.35rem !important;
    padding-left: 0.35rem !important;
}

#cart-dropdown-container .cart-dropdown-buttons .btn {
    display: flex !important;
    min-height: 2.4rem !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.48rem 0.75rem !important;
    font-size: 0.88rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
}

#jtl-nav-wrapper #cart-dropdown-container .cart-dropdown-buttons .btn-outline-primary {
    color: var(--ts-green-dark) !important;
    background: #fff !important;
    border-color: var(--ts-green-dark) !important;
}

#jtl-nav-wrapper #cart-dropdown-container .cart-dropdown-buttons .btn-outline-primary:hover,
#jtl-nav-wrapper #cart-dropdown-container .cart-dropdown-buttons .btn-outline-primary:focus {
    color: #fff !important;
    background: var(--ts-green) !important;
    border-color: var(--ts-green) !important;
}

#jtl-nav-wrapper #cart-dropdown-container .cart-dropdown-buttons .btn-primary,
#jtl-nav-wrapper #cart-dropdown-container .cart-dropdown-buttons .btn-primary:hover,
#jtl-nav-wrapper #cart-dropdown-container .cart-dropdown-buttons .btn-primary:focus {
    color: #fff !important;
    background: var(--ts-green-dark) !important;
    border-color: var(--ts-green-dark) !important;
}

/* Hinweis im geöffneten, leeren Warenkorb */
#jtl-nav-wrapper #cart-dropdown-container .alert,
#jtl-nav-wrapper #cart-dropdown-container [class*="empty"] {
    color: var(--ts-ink) !important;
    background: rgba(237, 248, 239, 0.96) !important;
    border-color: rgba(10, 138, 36, 0.28) !important;
}

/* Hinweis an der Anmeldung */
.ts-registration-hint {
    color: var(--ts-ink) !important;
    background: rgba(237, 248, 239, 0.96) !important;
    border-color: rgba(10, 138, 36, 0.28) !important;
}

.ts-registration-hint .ts-registration-hint__link {
    color: var(--ts-green-dark) !important;
    font-weight: 700 !important;
}

.ts-registration-hint .ts-registration-hint__link:hover,
.ts-registration-hint .ts-registration-hint__link:focus {
    color: var(--ts-green) !important;
}

/* =========================================================
   Leerer Warenkorb – kompakte, freundliche Shopansicht
   ========================================================= */
body.ts-cart-empty-page main,
body.ts-cart-empty-page #content-wrapper {
    min-height: 0 !important;
}

body.ts-cart-empty-page main h1,
body.ts-cart-empty-page #content-wrapper h1 {
    margin: 1.35rem 0 1rem !important;
    color: var(--ts-ink) !important;
    font-size: clamp(1.55rem, 2.4vw, 2.15rem) !important;
    font-weight: 750 !important;
    line-height: 1.15 !important;
    text-align: center !important;
}

.ts-empty-cart-message {
    width: min(100%, 46rem) !important;
    margin: 0 auto !important;
    padding: 1.75rem 1.25rem !important;
    color: var(--ts-ink) !important;
    background: rgba(237, 248, 239, 0.96) !important;
    border: 1px solid rgba(10, 138, 36, 0.28) !important;
    border-radius: 1rem !important;
    box-shadow: var(--ts-shadow) !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    text-align: center !important;
}

.ts-empty-cart-message .fas,
.ts-empty-cart-message .fa,
.ts-empty-cart-message svg {
    color: var(--ts-green-dark) !important;
}

.ts-empty-cart-message [class*="icon"],
.ts-empty-cart-message > span:first-child,
.ts-empty-cart-message > div:first-child:not(:last-child) {
    border-color: rgba(10, 138, 36, 0.2) !important;
    background-color: #fff !important;
}

.ts-empty-cart-action {
    margin-top: 1rem !important;
    text-align: center !important;
}

.ts-empty-cart-button {
    min-width: 11rem !important;
    padding: 0.68rem 1.25rem !important;
    color: #fff !important;
    background: var(--ts-green) !important;
    border: 1px solid var(--ts-green) !important;
    border-radius: 0.65rem !important;
    box-shadow: 0 0.28rem 0.75rem rgba(5, 102, 27, 0.16) !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.ts-empty-cart-button:hover,
.ts-empty-cart-button:focus {
    color: #fff !important;
    background: var(--ts-green-dark) !important;
    border-color: var(--ts-green-dark) !important;
    transform: translateY(-1px);
}

@media (max-width: 767.98px) {
    body.ts-cart-empty-page main h1,
    body.ts-cart-empty-page #content-wrapper h1 {
        margin-top: 0.85rem !important;
        font-size: 1.45rem !important;
    }

    .ts-empty-cart-message {
        width: calc(100% - 1rem) !important;
        padding: 1.35rem 0.9rem !important;
        border-radius: 0.8rem !important;
        font-size: 0.92rem !important;
    }

    .ts-empty-cart-button {
        min-width: 10rem !important;
        padding: 0.62rem 1rem !important;
        font-size: 0.9rem !important;
    }
}

/* =========================================================
   Grunddesign
   ========================================================= */

body {
    color: var(--ts-ink);
    background-color: #f8faf8;
    background-image: url("background.jpg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-attachment: fixed;
}

a {
    color: var(--ts-green-dark);
    text-decoration: none !important;
}

a:hover,
a:focus,
a:active {
    color: var(--ts-green);
    text-decoration: none !important;
}

a:visited {
    text-decoration: none !important;
}

a:focus-visible {
    outline: 2px solid var(--ts-green);
    outline-offset: 2px;
}

#jtl-nav-wrapper {
    background: var(--ts-surface);
    border-bottom: 0;
    box-shadow: none;
}

#jtl-nav-wrapper > .container,
#jtl-nav-wrapper > .container-fluid {
    padding-top: 0.85rem;
}

/* =========================================================
   Logo
   ========================================================= */

.teamsportler-logo .navbar-brand {
    display: flex;
    align-items: center;
    margin-right: 1.5rem;
    padding: 0.2rem 0;
}

.teamsportler-logo #shop-logo {
    width: clamp(15rem, 32vw, 34rem);
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* =========================================================
   Suche – allgemeine Basis
   ========================================================= */

.main-search-wrapper .form-control,
.search-form-wrapper .form-control {
    min-height: 2.85rem;
    border: 2px solid var(--ts-green);
    border-radius: var(--ts-radius) 0 0 var(--ts-radius);
}

.main-search-wrapper .btn,
.search-form-wrapper .btn {
    color: #fff;
    background: var(--ts-green);
    border-color: var(--ts-green);
}

.main-search-wrapper .btn:hover,
.main-search-wrapper .btn:focus,
.search-form-wrapper .btn:hover,
.search-form-wrapper .btn:focus {
    background: var(--ts-green-dark);
    border-color: var(--ts-green-dark);
}

#shop-nav .nav-link,
#shop-nav .btn {
    color: var(--ts-ink);
}

#shop-nav .nav-link:hover,
#shop-nav .nav-link:focus,
#shop-nav .btn:hover,
#shop-nav .btn:focus {
    color: var(--ts-green);
}

/* =========================================================
   HAUPTNAVIGATION
   ========================================================= */

#mainNavigation {
    background: var(--ts-green-dark) !important;
    border-radius: 0.7rem !important;
    overflow: hidden;
}

/* Kategorie-Container immer transparent */
#mainNavigation .nav-item,
#mainNavigation .nav-scrollbar-item,
#mainNavigation .nav-item.active,
#mainNavigation .nav-scrollbar-item.active,
#mainNavigation .nav-item.show,
#mainNavigation .nav-scrollbar-item.show,
#mainNavigation .nav-item:hover,
#mainNavigation .nav-scrollbar-item:hover {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Links normal */
#mainNavigation .nav-link {
    color: #fff !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0.95rem 1.25rem !important;
}

/* Hover / geöffnet / aktive Kategorie:
   KEIN Kasten, nur Schrift etwas heller */
#mainNavigation .nav-link:hover,
#mainNavigation .nav-link:focus,
#mainNavigation .nav-item.show > .nav-link,
#mainNavigation .nav-scrollbar-item.show > .nav-link,
#mainNavigation .nav-item.active > .nav-link,
#mainNavigation .nav-scrollbar-item.active > .nav-link,
#mainNavigation .nav-link.active {
    color: #b9efc5 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* NOVA-Markierungen vollständig entfernen */
#mainNavigation .nav-item::before,
#mainNavigation .nav-item::after,
#mainNavigation .nav-scrollbar-item::before,
#mainNavigation .nav-scrollbar-item::after,
#mainNavigation .nav-link::before,
#mainNavigation .nav-link::after {
    content: none !important;
    display: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* =========================================================
   Seiteninhalt / Karten / Buttons / Footer
   ========================================================= */

#main-wrapper {
    background: transparent;
}

@media (max-width: 991.98px) {
    body {
        background-position: 20% top;
        background-attachment: scroll;
    }
}

.productbox-inner,
.card,
.dropdown-menu {
    border-color: var(--ts-line);
    border-radius: var(--ts-radius);
}

.productbox-inner {
    height: 100%;
    padding: 0.9rem;
    transition: box-shadow 160ms ease, transform 160ms ease;
}

.productbox-inner:hover {
    box-shadow: var(--ts-shadow);
    transform: translateY(-2px);
}

.btn-primary {
    color: #fff;
    background: var(--ts-green);
    border-color: var(--ts-green);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
    color: #fff;
    background: var(--ts-green-dark);
    border-color: var(--ts-green-dark);
}

.badge-primary,
.badge-success {
    background: var(--ts-green);
}

footer {
    border-top: 0.25rem solid var(--ts-green);
}

/* =========================================================
   Mobil
   ========================================================= */

@media (max-width: 991.98px) {
    #jtl-nav-wrapper > .container,
    #jtl-nav-wrapper > .container-fluid {
        padding-top: 0.45rem;
    }

    .toggler-logo-wrapper {
        display: flex;
        align-items: center;
        width: min(55vw, 28rem);
        max-width: calc(100% - 11rem);
        justify-content: flex-start;
    }

    .toggler-logo-wrapper .logo-wrapper {
        flex: 1 1 auto;
        min-width: 0;
    }

    .teamsportler-logo .navbar-brand {
        margin-right: 0;
    }

    .teamsportler-logo #shop-logo {
        display: block;
        width: 100%;
        max-width: 22rem;
        max-height: 4rem;
    }

    #jtl-nav-wrapper #shop-nav {
        position: relative;
        z-index: 2;
        flex-wrap: nowrap;
        margin-left: auto;
        white-space: nowrap;
    }

    /* Tablet- und Handy-Kopfzeile in den Teamsportler-Farben */
    #jtl-nav-wrapper #burger-menu,
    #jtl-nav-wrapper #shop-nav .nav-link,
    #jtl-nav-wrapper #shop-nav .btn,
    #jtl-nav-wrapper .ts-account-link,
    #jtl-nav-wrapper .ts-account-link .fas,
    #jtl-nav-wrapper .cart-icon-dropdown,
    #jtl-nav-wrapper .cart-icon-dropdown .fas,
    #jtl-nav-wrapper .cart-icon-dropdown-price {
        color: var(--ts-green-dark) !important;
    }

    #jtl-nav-wrapper .ts-account-link {
        display: inline-flex;
        align-items: center;
        gap: 0.3rem;
        font-size: 1rem;
        font-weight: 600;
    }

    #jtl-nav-wrapper .cart-icon-dropdown-price {
        font-size: 0.95rem;
        font-weight: 600;
    }

    /* Die mobile Suche bleibt kompakt und wirkt wie die Desktop-Suche. */
    #jtl-nav-wrapper .search-form-wrapper-fixed {
        display: flex !important;
        justify-content: center;
        padding: 0.4rem 1rem 0.7rem;
        background: transparent !important;
    }

    #jtl-nav-wrapper .search-form-wrapper-fixed .search-wrapper {
        width: min(100%, 28rem) !important;
    }

    #jtl-nav-wrapper .search-form-wrapper-fixed .main-search,
    #jtl-nav-wrapper .search-form-wrapper-fixed .input-group {
        width: 100%;
    }

    #jtl-nav-wrapper #search-header-mobile-top {
        height: 2.65rem !important;
        min-height: 2.65rem !important;
        padding: 0.45rem 0.8rem !important;
        color: var(--ts-ink) !important;
        background: #fff !important;
        border: 2px solid var(--ts-green-dark) !important;
        border-right: 0 !important;
        border-radius: var(--ts-radius) 0 0 var(--ts-radius) !important;
        box-shadow: none !important;
    }

    #jtl-nav-wrapper #search-header-mobile-top::placeholder {
        color: var(--ts-muted) !important;
    }

    #jtl-nav-wrapper .search-form-wrapper-fixed .btn {
        width: 3.2rem;
        height: 2.65rem !important;
        min-height: 2.65rem !important;
        padding: 0 !important;
        color: #fff !important;
        background: var(--ts-green-dark) !important;
        border: 2px solid var(--ts-green-dark) !important;
        border-radius: 0 var(--ts-radius) var(--ts-radius) 0 !important;
    }

    #jtl-nav-wrapper .search-form-wrapper-fixed .btn:hover,
    #jtl-nav-wrapper .search-form-wrapper-fixed .btn:focus {
        color: #fff !important;
        background: var(--ts-green) !important;
        border-color: var(--ts-green) !important;
    }

    #mainNavigation {
        margin-top: 0;
        background: #fff;
        border-radius: 0;
    }

    #mainNavigation .nav-link {
        color: var(--ts-ink);
        background: transparent;
    }

    #mainNavigation .nav-link:hover,
    #mainNavigation .nav-link:focus,
    #mainNavigation .nav-item.show > .nav-link,
    #mainNavigation .nav-item.active > .nav-link,
    #mainNavigation .nav-link.active {
        color: var(--ts-green-dark);
        background: var(--ts-green-soft);
    }
}

@media (max-width: 767.98px) {
    /* Auf Smartphones nur die eindeutigen Konto- und Warenkorb-Symbole zeigen. */
    #jtl-nav-wrapper > .container,
    #jtl-nav-wrapper > .container-fluid {
        padding-top: 0;
    }

    #jtl-nav-wrapper .toggler-logo-wrapper {
        top: 0;
        height: 3.75rem;
        align-items: center;
    }

    #jtl-nav-wrapper .toggler-logo-wrapper .burger-menu-wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 3.75rem;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #jtl-nav-wrapper .teamsportler-logo .navbar-brand {
        display: flex;
        align-items: center;
        height: 3.75rem;
        padding-top: 0;
        padding-bottom: 0;
    }

    #jtl-nav-wrapper #shop-nav {
        height: 3.75rem;
        margin-right: 0.65rem;
        align-items: center;
    }

    #jtl-nav-wrapper .account-icon-dropdown,
    #jtl-nav-wrapper .cart-icon-dropdown {
        display: flex !important;
        height: 3.75rem;
        align-items: center !important;
    }

    #jtl-nav-wrapper .ts-account-link {
        gap: 0 !important;
        font-size: 0 !important;
    }

    #jtl-nav-wrapper .ts-account-link .fas,
    #jtl-nav-wrapper .account-icon-dropdown > .nav-link .fas,
    #jtl-nav-wrapper .cart-icon-dropdown-icon {
        font-size: 1.35rem !important;
    }

    #jtl-nav-wrapper .cart-icon-dropdown-price {
        display: none !important;
    }

    #jtl-nav-wrapper .account-icon-dropdown > .nav-link,
    #jtl-nav-wrapper .cart-icon-dropdown > .nav-link {
        display: flex !important;
        height: 3.75rem;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 2.75rem;
    }
}

@media (max-width: 575.98px) {
    #jtl-nav-wrapper > .container,
    #jtl-nav-wrapper > .container-fluid {
        padding-right: 0.6rem;
        padding-left: 0.6rem;
    }

    .toggler-logo-wrapper {
        width: calc(100% - 7.25rem);
        max-width: none;
    }

    .toggler-logo-wrapper .burger-menu-wrapper {
        flex: 0 0 2.75rem;
        width: 2.75rem;
        padding-right: 0.45rem;
        padding-left: 0.2rem;
    }

    .teamsportler-logo .navbar-brand {
        width: 100%;
        min-width: 0;
        padding-right: 0;
        padding-left: 0;
    }

    .teamsportler-logo #shop-logo {
        max-width: 100%;
        max-height: 2.75rem;
    }

    #jtl-nav-wrapper #shop-nav .nav-link {
        padding-right: 0.45rem;
        padding-left: 0.45rem;
    }

    #jtl-nav-wrapper .search-form-wrapper-fixed {
        padding-top: 0.3rem;
        padding-bottom: 0.6rem;
    }

    #jtl-nav-wrapper .search-form-wrapper-fixed .search-wrapper {
        width: min(100%, 22rem) !important;
    }
}

/* =========================================================
   Desktop-Header
   Zeile 1: Logo | Suche | Anmelden/Mein Konto | Warenkorb
   Zeile 2: Kategorien
   ========================================================= */

@media (min-width: 992px) {
    /* obere doppelte Konto-Leiste ausblenden */
    #header-top-bar {
        display: none !important;
    }

    /* Header als zweizeiliges Grid */
    #jtl-nav-wrapper > .container-fluid {
        display: grid;
        grid-template-columns: minmax(32rem, auto) minmax(0, 1fr);
        grid-template-areas:
            "logo shopnav"
            "categories categories";
        align-items: center;
        column-gap: 3rem;
        padding-top: 0.75rem;
    }

    #jtl-nav-wrapper .toggler-logo-wrapper {
        grid-area: logo;
        width: auto;
        min-width: 32rem;
    }

    #jtl-nav-wrapper > .container-fluid > nav.navbar {
        display: contents;
    }

    /* Logo */
    #jtl-nav-wrapper .teamsportler-logo #shop-logo {
        width: clamp(28rem, 34vw, 40rem) !important;
        max-height: 7.5rem !important;
    }

    /* Suche + Konto + Warenkorb */
    #jtl-nav-wrapper #shop-nav {
        grid-area: shopnav;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 1.6rem !important;
        width: 100% !important;
        margin: 0 !important;
    }

    #jtl-nav-wrapper #shop-nav > #search {
        flex: 0 1 38rem !important;
        width: 38rem !important;
        min-width: 32rem !important;
        max-width: 38rem !important;
        margin: 0 !important;
    }

    #jtl-nav-wrapper #search .form-control {
        height: 3.6rem !important;
        min-height: 3.6rem !important;
        padding-left: 1.1rem !important;
        font-size: 1.15rem !important;
        color: var(--ts-ink);
        background: #fff;
        border: 2px solid var(--ts-green-dark) !important;
        border-right: 0 !important;
    }

    #jtl-nav-wrapper #search .form-control:focus {
        border-color: var(--ts-green) !important;
        box-shadow: 0 0 0 0.15rem rgba(10, 138, 36, 0.15);
    }

    #jtl-nav-wrapper #search .btn {
        height: 3.6rem !important;
        min-height: 3.6rem !important;
        min-width: 4rem !important;
        font-size: 1.25rem !important;
        color: #fff !important;
        background: var(--ts-green-dark) !important;
        border: 2px solid var(--ts-green-dark) !important;
    }

    #jtl-nav-wrapper #search .btn:hover,
    #jtl-nav-wrapper #search .btn:focus {
        color: #fff !important;
        background: var(--ts-green) !important;
        border-color: var(--ts-green) !important;
    }

    /* Anmelden / Mein Konto */
    #jtl-nav-wrapper .account-icon-dropdown {
        flex: 0 0 auto !important;
        margin-left: 0 !important;
        white-space: nowrap;
    }

    #jtl-nav-wrapper .account-icon-dropdown > .nav-link {
        padding-right: 0.4rem !important;
    }

    /* Anmelden / Mein Konto */
#jtl-nav-wrapper .ts-account-link {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem !important;
    white-space: nowrap;

    color: var(--ts-green-dark) !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
}

#jtl-nav-wrapper .ts-account-link .fas {
    color: var(--ts-green-dark) !important;
    font-size: 1.55rem !important;
}

/* nur bei Hover heller */
#jtl-nav-wrapper .account-icon-dropdown:hover .ts-account-link,
#jtl-nav-wrapper .account-icon-dropdown:focus-within .ts-account-link,
#jtl-nav-wrapper .account-icon-dropdown:hover .ts-account-link .fas,
#jtl-nav-wrapper .account-icon-dropdown:focus-within .ts-account-link .fas {
    color: var(--ts-green) !important;
}

/* Registrierungslink im Konto-Dropdown */
#jtl-nav-wrapper .account-icon-dropdown .dropdown-menu a[href*="Registrier"],
#jtl-nav-wrapper .account-icon-dropdown .dropdown-menu a[href*="passwort-vergessen" i] {
    color: var(--ts-green-dark) !important;
}

#jtl-nav-wrapper .account-icon-dropdown .dropdown-menu a[href*="Registrier"]:hover,
#jtl-nav-wrapper .account-icon-dropdown .dropdown-menu a[href*="Registrier"]:focus,
#jtl-nav-wrapper .account-icon-dropdown .dropdown-menu a[href*="passwort-vergessen" i]:hover,
#jtl-nav-wrapper .account-icon-dropdown .dropdown-menu a[href*="passwort-vergessen" i]:focus {
    color: var(--ts-green) !important;
}


/* =========================================================
   Warenkorb
   ========================================================= */

#jtl-nav-wrapper .cart-icon-dropdown {
    flex: 0 0 auto !important;
    margin-left: -1.6rem !important;

    display: flex !important;
    align-items: center !important;
    transform: none !important;

    white-space: nowrap !important;

    color: var(--ts-green-dark) !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
}

/* Link + Icon + Betrag in einer Zeile */
#jtl-nav-wrapper .cart-icon-dropdown > .nav-link {
    display: flex !important;
    align-items: center !important;
    flex-direction: row !important;

    gap: 0.25rem !important;

    padding: 0.75rem 0.4rem !important;
    margin: 0 !important;

    color: var(--ts-green-dark) !important;
    font-size: 1.2rem !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

/* NOVA-Abstand des leeren Warenkorbs aufheben */
#jtl-nav-wrapper .cart-icon-dropdown-icon {
    margin-right: 0 !important;
}

/* Betrag */
#jtl-nav-wrapper .cart-icon-dropdown-price {
    display: inline-flex !important;
    align-items: center !important;

    white-space: nowrap !important;

    color: var(--ts-green-dark) !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

/* Nur beim Hover heller */
#jtl-nav-wrapper .cart-icon-dropdown:hover > .nav-link,
#jtl-nav-wrapper .cart-icon-dropdown:focus-within > .nav-link,
#jtl-nav-wrapper .cart-icon-dropdown:hover > .nav-link .fas,
#jtl-nav-wrapper .cart-icon-dropdown:focus-within > .nav-link .fas,
#jtl-nav-wrapper .cart-icon-dropdown:hover > .nav-link .cart-icon-dropdown-price,
#jtl-nav-wrapper .cart-icon-dropdown:focus-within > .nav-link .cart-icon-dropdown-price {
    color: var(--ts-green) !important;
}

/* Die Links im geöffneten Warenkorb behalten lesbare Shopfarben. */
#cart-dropdown-container .cart-dropdown-buttons .btn {
    min-height: 2.4rem !important;
    padding: 0.48rem 0.75rem !important;
    font-size: 0.88rem !important;
    line-height: 1.25 !important;
    text-align: center !important;
}

#cart-dropdown-container .cart-dropdown-buttons .btn-outline-primary {
    color: var(--ts-green-dark) !important;
    background: #fff !important;
    border-color: var(--ts-green-dark) !important;
}

#cart-dropdown-container .cart-dropdown-buttons .btn-outline-primary:hover,
#cart-dropdown-container .cart-dropdown-buttons .btn-outline-primary:focus {
    color: #fff !important;
    background: var(--ts-green) !important;
    border-color: var(--ts-green) !important;
}

#cart-dropdown-container .cart-dropdown-buttons .btn-primary,
#cart-dropdown-container .cart-dropdown-buttons .btn-primary:hover,
#cart-dropdown-container .cart-dropdown-buttons .btn-primary:focus {
    color: #fff !important;
    background: var(--ts-green-dark) !important;
    border-color: var(--ts-green-dark) !important;
}

    /* Kategorien als zweite Zeile */
    #jtl-nav-wrapper #mainNavigation {
        grid-area: categories;
        width: 100%;
        min-height: 0 !important;
        height: auto !important;
        margin-top: 0.75rem;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        background: var(--ts-green-dark) !important;
        border-radius: 0.7rem !important;
        overflow: hidden;
    }

   #jtl-nav-wrapper #mainNavigation .navbar-nav {
    height: 4rem !important;
    min-height: 4rem !important;
    align-items: stretch !important;
}

#jtl-nav-wrapper #mainNavigation .nav-item {
    height: 4rem !important;
    min-height: 4rem !important;
    display: flex !important;
    align-items: stretch !important;
}

#jtl-nav-wrapper #mainNavigation .nav-link {
    height: 4rem !important;
    min-height: 4rem !important;

    display: flex !important;
    align-items: center !important;

    padding: 0 1.4rem !important;

    font-size: 1.16rem !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

   #jtl-nav-wrapper #mainNavigation .nav-link:hover,
#jtl-nav-wrapper #mainNavigation .nav-link:focus,
#jtl-nav-wrapper #mainNavigation .nav-item.show > .nav-link,
#jtl-nav-wrapper #mainNavigation .nav-item.active > .nav-link,
#jtl-nav-wrapper #mainNavigation .nav-link.active {
    color: #b9efc5 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
}

@media (prefers-reduced-motion: reduce) {
    .productbox-inner {
        transition: none;
    }
}

/* =========================================================
   Desktop-Untermenüs – Vereins- und Kategorie-Kacheln
   ========================================================= */

@media (min-width: 992px) {
    /* Ruhiges, helles Megamenü unter der grünen Navigation */
    #mainNavigation .dropdown-full > .dropdown-menu {
        padding: 1.4rem 0 1.65rem !important;
        background: #fff !important;
        border: 1px solid var(--ts-line) !important;
        border-top: 0 !important;
        border-radius: 0 0 var(--ts-radius) var(--ts-radius) !important;
        box-shadow: 0 0.75rem 1.8rem rgba(20, 54, 30, 0.12) !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu > .dropdown-body {
        padding: 0 !important;
    }

    /* Bootstrap-Spalten durch ein belastbares Raster ersetzen */
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 1rem !important;
        margin: 0 !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > [class*="col-"] {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Jede Kategorie wird zu einer einheitlichen Kachel */
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item {
        display: flex !important;
        flex-direction: column !important;
        min-height: 6.5rem !important;
        align-items: stretch !important;
        background: #fff !important;
        border: 1px solid var(--ts-line) !important;
        border-radius: var(--ts-radius) !important;
        box-shadow: 0 0.18rem 0.55rem rgba(20, 54, 30, 0.05) !important;
        transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease !important;
    }

    /* NOVAs nur mobil sichtbaren Link am Desktop weiterhin ausblenden */
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item.d-lg-none {
        display: none !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item:hover,
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item:focus-within {
        border-color: rgba(10, 138, 36, 0.45) !important;
        box-shadow: var(--ts-shadow) !important;
        transform: translateY(-2px);
    }

    #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 1rem !important;
        align-items: center !important;
        justify-content: center !important;
        flex-direction: column !important;
        gap: 0.65rem !important;
        color: var(--ts-ink) !important;
        background: transparent !important;
        border: 0 !important;
        text-align: center !important;
        font-family: inherit !important;
        font-size: 1rem !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel:hover,
    #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel:focus {
        color: var(--ts-green-dark) !important;
    }

    /* Lange Vereinsnamen dürfen umbrechen und überlappen nicht mehr */
    #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel .text-truncate {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
        white-space: normal !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
    }

    /* Einheitlicher Bildbereich, sobald Vereinslogos in JTL hinterlegt sind */
    #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-image,
    #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-image img {
        display: block !important;
        width: auto !important;
        max-width: 100% !important;
        height: 3.75rem !important;
        margin: 0 auto !important;
        object-fit: contain !important;
    }

    /* Unterkategorien innerhalb einer Vereins-Kachel */
    #mainNavigation .dropdown-full > .dropdown-menu .categories-recursive-dropdown {
        width: 100% !important;
        padding: 0 1rem 0.85rem !important;
        background: transparent !important;
        border: 0 !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .categories-recursive-dropdown .nav-link {
        height: auto !important;
        min-height: 0 !important;
        padding: 0.35rem 0 !important;
        color: var(--ts-muted) !important;
        font-size: 0.92rem !important;
        font-weight: 400 !important;
        white-space: normal !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .categories-recursive-dropdown .nav-link:hover,
    #mainNavigation .dropdown-full > .dropdown-menu .categories-recursive-dropdown .nav-link:focus {
        color: var(--ts-green-dark) !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item {
        transition: none !important;
    }
}

/* =========================================================
   Untermenü-Feinschliff
   ========================================================= */

/* Den zusätzlichen NOVA-Link „… anzeigen“ vollständig ausblenden */
#mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper .d-lg-none {
    display: none !important;
}

/* NOVA setzt den „Kategorie anzeigen“-Link immer als erstes Element ein. */
#jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > :first-child {
    display: none !important;
}

@media (min-width: 992px) {
    /* Vereinskacheln dienen als Bezugspunkt für das schwebende Untermenü */
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item {
        position: relative !important;
    }

    /* Zweite Kategorieebene zunächst verbergen */
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown {
        display: none !important;
        position: absolute !important;
        z-index: 1050 !important;
        top: calc(100% - 0.15rem) !important;
        left: 0 !important;
        width: max-content !important;
        min-width: 100% !important;
        max-width: min(24rem, 80vw) !important;
        padding: 0.65rem 1rem !important;
        background: #fff !important;
        border: 1px solid rgba(10, 138, 36, 0.35) !important;
        border-radius: 0 0 var(--ts-radius) var(--ts-radius) !important;
        box-shadow: 0 0.8rem 1.6rem rgba(20, 54, 30, 0.15) !important;
    }

    /* Mit Maus oder Tastatur öffnen */
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item:hover > .categories-recursive-dropdown,
    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item:focus-within > .categories-recursive-dropdown {
        display: block !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown .nav {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
    }

    #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown .nav-item {
        width: 100% !important;
        min-height: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }
}

/* =========================================================
   Vereinsmenü – kompakte Unterpunkte und Logoplatz
   ========================================================= */

@media (min-width: 992px) {
    /* Nur horizontal ausweichen; keinen vertikalen Scrollbalken in der grünen Leiste */
    #jtl-nav-wrapper #mainNavigation .nav-scrollbar-inner {
        height: 4rem !important;
        min-height: 4rem !important;
        padding-bottom: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        align-self: stretch !important;
        scrollbar-width: none;
    }

    #jtl-nav-wrapper #mainNavigation .nav-scrollbar-inner::-webkit-scrollbar {
        display: none;
    }

    /* Mobilkopf „Verein anzeigen“ auch gegen die starke Header-Regel ausblenden */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper .categories-recursive-dropdown .nav-item.d-lg-none {
        display: none !important;
    }

    /* Fester, ruhiger Bereich für das Vereinslogo */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel {
        height: 8.5rem !important;
        min-height: 8.5rem !important;
        max-height: none !important;
        box-sizing: border-box !important;
        padding: 0.8rem !important;
        gap: 0.5rem !important;
    }

    /* Platzhalter verschwindet automatisch, sobald ein echtes Kategoriebild vorhanden ist */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel::before {
        content: "" !important;
        display: block !important;
        flex: 0 0 4.25rem !important;
        width: 4.25rem !important;
        height: 4.25rem !important;
        background: var(--ts-green-soft) !important;
        border: 1px dashed rgba(10, 138, 36, 0.38) !important;
        border-radius: 0.55rem !important;
        box-shadow: none !important;
        transform: none !important;
    }

    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel:has(.submenu-headline-image)::before {
        content: none !important;
        display: none !important;
    }

    /* Unterkategorien dicht und gut lesbar untereinander */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown > .nav {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 0.1rem !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Erster Eintrag ist NOVAs zusätzliche Überschrift „Verein anzeigen“ */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown > .nav > .nav-item:first-child {
        display: none !important;
    }

    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown > .nav > .nav-item {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown > .nav > .nav-item > .nav-link,
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .categories-recursive-dropdown > .nav > .nav-item > a {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0.32rem 0 !important;
        color: var(--ts-muted) !important;
        font-size: 0.95rem !important;
        font-weight: 500 !important;
        line-height: 1.25 !important;
        white-space: normal !important;
    }
}

/* =========================================================
   Vereinsmenü – transparente Fläche und korrekte Kachelhöhe
   ========================================================= */

@media (min-width: 992px) {
    /* Nur die Kacheln bleiben sichtbar */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu {
        padding: 1.35rem 0 1.75rem !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu > .dropdown-body,
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper {
        background: transparent !important;
    }

    /* Mehr Abstand zwischen den Vereinskacheln */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row {
        gap: 1.25rem !important;
    }

    /* Alte 4rem-Höhe des Hauptmenüs für diese Kacheln sicher aufheben */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item {
        display: flex !important;
        flex-direction: column !important;
        height: 9.5rem !important;
        min-height: 9.5rem !important;
        max-height: none !important;
        overflow: visible !important;
    }

    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item > .submenu-headline-toplevel {
        display: flex !important;
        flex: 1 1 auto !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 9.5rem !important;
        max-height: none !important;
        padding: 0.85rem 0.75rem !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }

    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel .text-truncate {
        flex: 0 0 auto !important;
        width: 100% !important;
        padding: 0 0.2rem !important;
        overflow: visible !important;
        white-space: normal !important;
        text-overflow: clip !important;
        text-align: center !important;
        line-height: 1.25 !important;
    }
}

/* Muss als letzte Menüregel stehen: NOVAs Zusatzkachel endgültig entfernen */
@media (min-width: 992px) {
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item.d-lg-none:first-child,
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .subcategory-wrapper > .row > .nav-item:first-child {
        display: none !important;
    }
}

/* Kleine Vereinslogos neben den Unterkategorien im Desktop-Menü */
@media (min-width: 992px) {
    #jtl-nav-wrapper #mainNavigation .categories-recursive-dropdown a.nav-link:has(.ts-subcategory-logo) {
        display: flex !important;
        align-items: center !important;
        gap: 0.5rem !important;
    }

    #jtl-nav-wrapper #mainNavigation .categories-recursive-dropdown .ts-subcategory-logo {
        display: block !important;
        flex: 0 0 1.45rem !important;
        width: 1.45rem !important;
        max-width: 1.45rem !important;
        height: 1.45rem !important;
        margin: 0 !important;
        object-fit: contain !important;
    }
}

/* Endgültige Desktop-Darstellung des Megamenüs */
@media (min-width: 992px) {
    /* Helle ruhige Fläche statt durchscheinender dunkler Seiten-Abdeckung */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu {
        background: rgba(247, 250, 247, 0.98) !important;
        border: 0 !important;
        box-shadow: 0 0.65rem 1.5rem rgba(20, 54, 30, 0.1) !important;
    }

    /* Alle ausschließlich mobilen NOVA-Kopfzeilen im Desktop-Menü entfernen */
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .d-lg-none {
        display: none !important;
    }
}

/* Megamenü als zentrierte Box statt über die gesamte Seitenbreite */
@media (min-width: 992px) {
    #jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu {
        left: 0 !important;
        right: 0 !important;
        width: calc(100% - 3rem) !important;
        max-width: 78rem !important;
        margin: 0.45rem auto 0 !important;
        padding: 1.35rem !important;
        box-sizing: border-box !important;
        background: rgba(247, 250, 247, 0.99) !important;
        border: 1px solid var(--ts-line) !important;
        border-radius: 0.85rem !important;
        box-shadow: 0 1rem 2.2rem rgba(20, 54, 30, 0.16) !important;
    }

    /* NOVA-Abdunklung unsichtbar, Klickfläche zum Schließen bleibt erhalten */
    .modal-backdrop.zindex-dropdown,
    .modal-backdrop.zindex-dropdown.show {
        background: transparent !important;
        background-color: transparent !important;
        opacity: 0 !important;
    }
}

/* Breadcrumb direkt unter der Kategorienavigation statt mit großem Leerraum */
@media (min-width: 992px) {
    #content-wrapper:not(.has-fluid) {
        padding-top: 0.75rem !important;
    }

    #content-wrapper .breadcrumb-container {
        margin-top: 0 !important;
    }
}

/* Einheitliche Überschrift auf allen Kategorie- und Artikellistenseiten */
#content-wrapper.is-item-list #content .title {
    width: 100% !important;
    text-align: center !important;
}

#content-wrapper.is-item-list #content .title > h1.h2 {
    margin: 1rem auto 1.5rem !important;
    color: var(--ts-green-dark) !important;
    font-size: clamp(2rem, 2.6vw, 2.75rem) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;
}

/* Inhaltsfläche transparent, damit das Hintergrundmotiv sichtbar bleibt */
#content-wrapper,
#content-wrapper #content,
#content-wrapper #result-wrapper,
#content-wrapper .breadcrumb-container {
    background-color: transparent !important;
    background-image: none !important;
}

/* Großen weißen Header-Hintergrund entfernen */
#jtl-nav-wrapper,
#jtl-nav-wrapper > .container,
#jtl-nav-wrapper > .container-fluid {
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* Produkt-Slider boxed statt über die gesamte Bildschirmbreite */
.product-slider-wrapper.container-fluid {
    position: relative !important;
    left: auto !important;
    width: min(calc(100vw - 4rem), 99.125rem) !important;
    max-width: 99.125rem !important;
    margin-top: 1.25rem !important;
    margin-right: 0 !important;
    margin-bottom: 2rem !important;
    margin-left: calc(50% - min(calc(50vw - 2rem), 49.5625rem)) !important;
    padding-right: 1rem !important;
    padding-left: 1rem !important;
    box-sizing: border-box !important;
    transform: none !important;
    background: transparent !important;
}

/* NOVAs zusätzliche innere Breitenbegrenzung aufheben */
.product-slider-wrapper .slick-slider-other,
.product-slider-wrapper .slick-slider-other-container {
    width: 100% !important;
    max-width: none !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

@media (max-width: 767.98px) {
    .product-slider-wrapper.container-fluid {
        position: static !important;
        left: auto !important;
        width: calc(100% - 1rem) !important;
        max-width: none !important;
        margin-top: 0.75rem !important;
        margin-right: auto !important;
        margin-bottom: 1.25rem !important;
        margin-left: auto !important;
        padding-right: 0.5rem !important;
        padding-left: 0.5rem !important;
        transform: none !important;
    }
}

/* =========================================================
   Kategorieansicht: Artikeltexte und obere Werkzeugleiste
   ========================================================= */

/* Artikelname und Preis innerhalb jeder Kachel zentrieren */
#product-list.layout-gallery .productbox-title,
#product-list.layout-gallery .productbox-title a,
#product-list.layout-gallery .price_wrapper,
#product-list.layout-gallery .productbox-price,
#product-list.layout-gallery .productbox-price .price,
#product-list.layout-gallery .productbox-price span {
    text-align: center !important;
}

#product-list.layout-gallery .productbox-title a {
    width: 100% !important;
    display: block !important;
}

/* „ab“ und Preis bilden eine gemeinsame Zeile. */
#product-list.layout-gallery .price_wrapper {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: baseline !important;
    justify-content: center !important;
    column-gap: 0.28rem !important;
    width: 100% !important;
}

#product-list.layout-gallery .price_wrapper > .price_label,
#product-list.layout-gallery .price_wrapper > .productbox-price,
#product-list.layout-gallery .productbox-price > span {
    display: inline-block !important;
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* Sortierung, Artikelanzahl und Ansichtswechsel im Shop-Grün */
#result-wrapper .productlist-page-nav-header-m {
    align-items: center !important;
    gap: 0.45rem !important;
    margin: 0 0 1.15rem !important;
    padding: 0.65rem 0.8rem !important;
    color: var(--ts-green-dark) !important;
    background: rgba(232, 246, 235, 0.94) !important;
    border: 1px solid rgba(5, 102, 27, 0.18) !important;
    border-radius: 0.65rem !important;
}

#result-wrapper .productlist-page-nav-header-m .displayoptions {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 0 !important;
}

#result-wrapper .productlist-page-nav-header-m .productlist-item-info {
    margin-left: auto !important;
    color: var(--ts-green-dark) !important;
}

#result-wrapper .productlist-page-nav-header-m .btn-outline-secondary,
#result-wrapper .productlist-page-nav-header-m .btn-option {
    color: var(--ts-green-dark) !important;
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: var(--ts-green-dark) !important;
    box-shadow: none !important;
}

#result-wrapper .productlist-page-nav-header-m .btn-outline-secondary:hover,
#result-wrapper .productlist-page-nav-header-m .btn-outline-secondary:focus,
#result-wrapper .productlist-page-nav-header-m .btn-outline-secondary.active,
#result-wrapper .productlist-page-nav-header-m .btn-outline-secondary[aria-expanded="true"],
#result-wrapper .productlist-page-nav-header-m .btn-option:hover,
#result-wrapper .productlist-page-nav-header-m .btn-option:focus,
#result-wrapper .productlist-page-nav-header-m .btn-option.active {
    color: #fff !important;
    background: var(--ts-green-dark) !important;
    border-color: var(--ts-green-dark) !important;
}

#result-wrapper .productlist-page-nav-header-m .dropdown-menu {
    border-color: rgba(5, 102, 27, 0.22) !important;
}

#result-wrapper .productlist-page-nav-header-m .dropdown-item:hover,
#result-wrapper .productlist-page-nav-header-m .dropdown-item:focus,
#result-wrapper .productlist-page-nav-header-m .dropdown-item.active {
    color: #fff !important;
    background: var(--ts-green-dark) !important;
}

@media (max-width: 1199.98px) {
    #result-wrapper .productlist-page-nav-header-m .displayoptions {
        width: 100% !important;
    }

    #result-wrapper .productlist-page-nav-header-m .productlist-item-info {
        margin-left: 0 !important;
    }
}

/* =========================================================
   Kategorie-Kachelansicht: kompakt und ohne Schnellauswahl
   ========================================================= */

/* Varianten, Schnellaktionen und Kaufoptionen gehören auf die Artikelseite. */
#product-list.layout-gallery .productbox-variations,
#product-list.layout-gallery .productbox-onhover,
#product-list.layout-gallery .productbox-options,
#product-list.layout-gallery .productbox-actions {
    display: none !important;
}

/* Keine aufspringende oder vergrößerte Kachel beim Darüberfahren. */
#product-list.layout-gallery .productbox,
#product-list.layout-gallery .productbox:hover,
#product-list.layout-gallery .productbox:focus,
#product-list.layout-gallery .productbox.focus,
#product-list.layout-gallery .productbox.transition,
#product-list.layout-gallery .productbox .productbox-inner,
#product-list.layout-gallery .productbox:hover .productbox-inner,
#product-list.layout-gallery .productbox .productbox-inner.pos-abs {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    margin: 0 !important;
    transform: none !important;
}

#product-list.layout-gallery .productbox .productbox-inner::before,
#product-list.layout-gallery .productbox:hover .productbox-inner::before {
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    box-shadow: none !important;
}

/* Flacherer Bildbereich statt übergroßer quadratischer Leerfläche. */
#product-list.layout-gallery .productbox-images .productbox-image.square::before {
    padding-bottom: 76% !important;
}

#product-list.layout-gallery .product-wrapper {
    display: flex !important;
    margin-bottom: 1.5rem !important;
}

#product-list.layout-gallery .product-wrapper > .productbox {
    width: 100% !important;
    height: 100% !important;
}

@media (min-width: 992px) {
    #product-list.layout-gallery > .product-wrapper {
        flex: 0 0 25% !important;
        max-width: 25% !important;
    }
}

@media (min-width: 1300px) {
    #product-list.layout-gallery > .product-wrapper {
        flex: 0 0 20% !important;
        max-width: 20% !important;
    }
}

@media (min-width: 1600px) {
    #product-list.layout-gallery > .product-wrapper {
        flex: 0 0 16.666667% !important;
        max-width: 16.666667% !important;
    }
}

/* =========================================================
   Produkt-Slider: Pfeile und Artikelfarben
   ========================================================= */

/* Beide Pfeile gleich groß, mittig und symmetrisch im Slider */
.product-slider-wrapper .slick-arrow {
    /* Die Bildmitte liegt etwas oberhalb der Mitte der gesamten Artikelkachel. */
    top: calc(50% - 1.7rem) !important;
    width: 2.75rem !important;
    height: 2.75rem !important;
    padding: 0 !important;
    color: #fff !important;
    background: var(--ts-green-dark) !important;
    border: 0 !important;
    border-radius: 0.45rem !important;
    opacity: 0.96 !important;
    transform: translateY(-50%) !important;
    z-index: 5 !important;
}

.product-slider-wrapper .slick-arrow:hover,
.product-slider-wrapper .slick-arrow:focus {
    color: #fff !important;
    background: var(--ts-green) !important;
}

.product-slider-wrapper .slick-prev {
    right: auto !important;
    left: 0.35rem !important;
}

.product-slider-wrapper .slick-next {
    right: 0.35rem !important;
    left: auto !important;
}

@media (min-width: 768px) {
    /* Außerhalb der Bildkante mit identischem Abstand auf beiden Seiten */
    .product-slider-wrapper .slick-prev {
        left: -1rem !important;
    }

    .product-slider-wrapper .slick-next {
        right: -1rem !important;
    }
}

.product-slider-wrapper .slick-prev::after,
.product-slider-wrapper .slick-next::after {
    color: #fff !important;
}

/* Kein gelb/orange mehr bei Artikelname und Preis */
.productbox-inner .productbox-title,
.productbox-inner .productbox-title a,
.productbox-inner .productbox-price,
.productbox-inner .productbox-price .price,
.productbox-inner .productbox-price span {
    color: var(--ts-green-dark) !important;
}

.productbox-inner:hover .productbox-title,
.productbox-inner:hover .productbox-title a,
.productbox-inner .productbox-title a:hover,
.productbox-inner .productbox-title a:focus,
.productbox-inner:hover .productbox-price,
.productbox-inner:hover .productbox-price .price,
.productbox-inner:hover .productbox-price span {
    color: var(--ts-green) !important;
}

/* Kompakte Slider-Artikel besitzen in NOVA einen einzigen äußeren Link */
.product-slider-wrapper .slick-slide > a,
.product-slider-wrapper .slick-slide > a .item-slider-desc,
.product-slider-wrapper .slick-slide > a .item-slider-desc span,
.product-slider-wrapper .slick-slide > a .item-slider-price,
.product-slider-wrapper .slick-slide > a .item-slider-price .productbox-price,
.product-slider-wrapper .slick-slide > a .item-slider-price span {
    color: var(--ts-green-dark) !important;
}

.product-slider-wrapper .slick-slide > a,
.product-slider-wrapper .slick-slide > a:hover,
.product-slider-wrapper .slick-slide > a:focus,
.product-slider-wrapper .slick-slide > a .item-slider-desc,
.product-slider-wrapper .slick-slide > a .item-slider-desc span,
.product-slider-wrapper .slick-slide > a .item-slider-price,
.product-slider-wrapper .slick-slide > a .item-slider-price * {
    text-decoration: none !important;
}

.product-slider-wrapper .slick-slide > a:hover,
.product-slider-wrapper .slick-slide > a:focus,
.product-slider-wrapper .slick-slide > a:hover .item-slider-desc,
.product-slider-wrapper .slick-slide > a:focus .item-slider-desc,
.product-slider-wrapper .slick-slide > a:hover .item-slider-desc span,
.product-slider-wrapper .slick-slide > a:focus .item-slider-desc span,
.product-slider-wrapper .slick-slide > a:hover .item-slider-price,
.product-slider-wrapper .slick-slide > a:focus .item-slider-price,
.product-slider-wrapper .slick-slide > a:hover .item-slider-price .productbox-price,
.product-slider-wrapper .slick-slide > a:focus .item-slider-price .productbox-price,
.product-slider-wrapper .slick-slide > a:hover .item-slider-price span,
.product-slider-wrapper .slick-slide > a:focus .item-slider-price span {
    color: var(--ts-green) !important;
}

/* Startseite: Produktbilder bleiben sichtbar, Preisangaben werden ausgeblendet. */
body[data-page="18"] .product-slider-wrapper .item-slider-price {
    display: none !important;
}

@media (max-width: 767.98px) {
    .product-slider-wrapper .slick-arrow {
        display: flex !important;
        visibility: visible !important;
        align-items: center !important;
        justify-content: center !important;
        width: 2.5rem !important;
        height: 2.5rem !important;
        opacity: 0.96 !important;
        pointer-events: auto !important;
    }

    .product-slider-wrapper .slick-list {
        touch-action: pan-y pinch-zoom !important;
    }

    .product-slider-wrapper .slick-prev {
        left: 0.15rem !important;
    }

    .product-slider-wrapper .slick-next {
        right: 0.15rem !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .product-slider-wrapper .slick-arrow {
        display: flex !important;
        visibility: visible !important;
        align-items: center !important;
        justify-content: center !important;
        opacity: 0.96 !important;
        pointer-events: auto !important;
    }

    .product-slider-wrapper .slick-list {
        touch-action: pan-y pinch-zoom !important;
    }
}

/* =========================================================
   Footer – boxed, transparent und besser lesbar
   ========================================================= */
#footer {
    position: relative !important;
    width: min(calc(100% - 4rem), 99.125rem) !important;
    max-width: 99.125rem !important;
    margin: 2rem auto 0 !important;
    padding: 2rem 2rem 1rem !important;
    color: var(--ts-ink) !important;
    background: transparent !important;
    border-top: 0 !important;
    box-sizing: border-box !important;
}

/* Bildbanner anstelle des grünen Footer-Streifens */
#footer::before {
    content: "";
    display: block;
    width: calc(100% + 4rem);
    aspect-ratio: 2216 / 230;
    margin: 0 -2rem 2rem;
    background: url("Footy.png") center / contain no-repeat;
}

#footer > .container {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
}

#footer-boxes {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 2rem 3rem !important;
    width: calc(100% + 4rem) !important;
    margin: 0 -2rem !important;
    text-align: center !important;
}

#footer-boxes > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

#footer .card,
#footer .card-body,
#footer-boxes .box,
#footer-boxes .text-left-util {
    color: var(--ts-ink) !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: center !important;
}

#footer-boxes .productlist-filter-headline,
#footer-boxes .nav,
#footer-boxes .nav-item,
#footer-boxes .nav-link {
    justify-content: center !important;
    text-align: center !important;
}

#footer .card ul,
#footer .card-body ul {
    padding-left: 0 !important;
    list-style: none !important;
}

#footer .card-title,
#footer .box-normal-link,
#footer .productlist-filter-headline,
#footer h4 {
    margin-bottom: 0.85rem !important;
    color: var(--ts-green-dark) !important;
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-align: center !important;
}

#footer a:not(.btn) {
    color: var(--ts-ink) !important;
    font-size: 0.98rem !important;
    line-height: 1.55 !important;
}

#footer a:not(.btn):hover,
#footer a:not(.btn):focus {
    color: var(--ts-green) !important;
}

#footer .withdrawal-link-wrapper {
    display: flex !important;
    justify-content: center !important;
    margin-top: 1.25rem !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
}

/* Widerrufslink gehört ausschließlich in den Footer, niemals ins Kategorienmenü */
#jtl-nav-wrapper #mainNavigation .withdrawal-link,
#jtl-nav-wrapper #mainNavigation a[href*="widerruf" i],
#jtl-nav-wrapper #mainNavigation a[href*="withdrawal" i] {
    display: none !important;
}

#jtl-nav-wrapper #mainNavigation li:has(> a[href*="widerruf" i]),
#jtl-nav-wrapper #mainNavigation li:has(> a[href*="withdrawal" i]) {
    display: none !important;
}

/* Sicherheitsregel: Widerrufsbutton außerhalb des echten Footers ausblenden */
body .withdrawal-link-wrapper,
body .withdrawal-link {
    display: none !important;
}

#footer .withdrawal-link-wrapper {
    display: flex !important;
}

#footer .withdrawal-link {
    display: block !important;
}

/* Auch separat gerenderte Widerrufslinks anhand ihrer Zieladresse abfangen */
body a[href*="widerruf" i],
body a[href*="withdrawal" i],
body a[href*="wrb" i] {
    display: none !important;
}

#footer a[href*="widerruf" i],
#footer a[href*="withdrawal" i],
#footer a[href*="wrb" i] {
    display: block !important;
}

#footer .withdrawal-link-wrapper > [class*="col-"] {
    flex: 0 1 20rem !important;
    width: 100% !important;
    max-width: 20rem !important;
    padding: 0 !important;
}

#footer .footnote-vat {
    margin-top: 0.5rem !important;
    color: var(--ts-muted) !important;
}

/* Copyrightbereich ohne dunklen Vollbreiten-Balken */
#footer #copyright {
    width: 100% !important;
    margin-top: 1.25rem !important;
    padding-top: 0.85rem !important;
    color: var(--ts-muted) !important;
    background: transparent !important;
    border-top: 1px solid var(--ts-line) !important;
}

#footer #copyright > .container-fluid {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
}

#footer #copyright a {
    color: var(--ts-green-dark) !important;
}

#footer #copyright .ts-footer-copyright {
    display: inline-block !important;
    margin-left: 0.85rem !important;
    color: var(--ts-green-dark) !important;
    font-weight: 600 !important;
}

#footer #copyright .ts-footer-copyright::before {
    content: "•";
    margin-right: 0.85rem;
    color: var(--ts-muted);
}

@media (max-width: 991.98px) {
    #footer {
        width: calc(100% - 2rem) !important;
        padding: 1.5rem 1rem 1rem !important;
    }

    #footer-boxes {
        width: calc(100% + 2rem) !important;
        margin-right: -1rem !important;
        margin-left: -1rem !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 1.5rem !important;
    }

    #footer::before {
        width: calc(100% + 2rem);
        margin-right: -1rem;
        margin-left: -1rem;
    }
}

@media (max-width: 575.98px) {
    #footer {
        width: calc(100% - 1rem) !important;
    }

    #footer-boxes {
        grid-template-columns: 1fr !important;
    }
}

/* Header beim Scrollen normal mit der Seite nach oben bewegen */
#jtl-nav-wrapper,
#jtl-nav-wrapper.sticky-top,
#jtl-nav-wrapper.fixed-navbar {
    position: relative !important;
    top: auto !important;
}

/* =========================================================
   Austauschbarer Blickfang auf der Startseite
   ========================================================= */
.ts-blickfang {
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 3fr);
    gap: 0.85rem;
    width: min(calc(100% - 4rem), 99.125rem);
    margin: 0.5rem auto 1.5rem;
}

.ts-blickfang__tile {
    position: relative;
    height: clamp(15rem, 20vw, 22rem);
    overflow: hidden;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(5, 102, 27, 0.16);
    border-radius: 0.85rem;
    box-shadow: 0 0.5rem 1.5rem rgba(20, 54, 30, 0.1);
}

.ts-blickfang__tile > a {
    display: block;
    width: 100%;
    height: 100%;
}

.ts-blickfang__tile img,
.ts-blickfang__tile video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ts-blickfang__tile--center img,
.ts-blickfang__tile--center video {
    object-fit: contain;
}

.ts-blickfang__tile > a:focus-visible {
    outline: 3px solid var(--ts-green);
    outline-offset: -3px;
}

@media (min-width: 992px) {
    /* Blickfang näher unter die Kategorienavigation ziehen */
    .ts-blickfang {
        margin-top: -2rem;
    }
}

@media (max-width: 767.98px) {
    #footer #copyright .ts-footer-copyright {
        display: block !important;
        margin-top: 0.25rem !important;
        margin-left: 0 !important;
    }

    #footer #copyright .ts-footer-copyright::before {
        content: none !important;
    }

    .ts-blickfang {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
        width: calc(100% - 1rem);
        margin-top: 0.75rem;
        margin-bottom: 1.5rem;
    }

    .ts-blickfang__tile {
        height: 11rem;
    }

    .ts-blickfang__tile--center {
        grid-column: 1 / -1;
        grid-row: 1;
        height: min(22rem, 82vw);
    }
}

/* =========================================================
   Artikeldetailseite – kompakt, klar und im Shop-Design
   ========================================================= */

#buy_form #product-offer.product-detail {
    align-items: flex-start !important;
    margin-top: 0.75rem !important;
    margin-bottom: 2rem !important;
}

@media (min-width: 992px) {
    #buy_form #product-offer.product-detail {
        align-items: center !important;
    }

    #buy_form #product-offer > .product-gallery {
        flex: 0 0 42% !important;
        max-width: 42% !important;
    }

    #buy_form #product-offer > .product-info {
        flex: 0 0 58% !important;
        max-width: 58% !important;
    }
}

/* Produktgalerie als kompakte, ruhige Karte */
#buy_form #image_wrapper {
    margin-bottom: 1.25rem !important;
    padding: 1rem !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, 0.78) !important;
    border: 1px solid rgba(5, 102, 27, 0.16) !important;
    border-radius: 0.85rem !important;
    box-shadow: 0 0.45rem 1.35rem rgba(20, 54, 30, 0.08) !important;
}

#buy_form #image_wrapper .gallery-with-action-main {
    width: 100% !important;
    margin: 0 !important;
}

#buy_form #image_wrapper .gallery-with-action-main > [class*="col-"] {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* Der Bildbereich bleibt groß genug, dominiert aber nicht mehr die Seite. */
#buy_form #gallery_wrapper,
#buy_form #gallery,
#buy_form #gallery .slick-list,
#buy_form #gallery .slick-track,
#buy_form #gallery .js-gallery-images,
#buy_form #gallery .js-gallery-images > .inner {
    max-height: 31rem !important;
}

#buy_form #gallery .js-gallery-images::before {
    padding-bottom: min(100%, 31rem) !important;
}

#buy_form #gallery .product-image {
    object-fit: contain !important;
}

#buy_form .product-detail-image-preview-bar {
    margin-top: 0.75rem !important;
}

#buy_form .product-thumbnails-wrapper,
#buy_form .product-thumbnails {
    min-height: 4.75rem !important;
    height: 4.75rem !important;
}

#buy_form .product-thumbnails .product-image {
    max-width: 4rem !important;
    max-height: 4rem !important;
}

/* Aktives Vorschaubild: Shop-Grün statt NOVA-Gelb. */
#buy_form .carousel-thumbnails .slick-slide.slick-current {
    border-color: var(--ts-green) !important;
    box-shadow: 0 0 0 1px var(--ts-green) !important;
}

/* Rechte Produktspalte als eigenständige Informationskarte */
#buy_form .product-info-inner {
    padding: 1.5rem 1.65rem !important;
    background: rgba(255, 255, 255, 0.84) !important;
    border: 1px solid rgba(5, 102, 27, 0.16) !important;
    border-radius: 0.85rem !important;
    box-shadow: 0 0.45rem 1.35rem rgba(20, 54, 30, 0.08) !important;
}

#buy_form .product-title {
    margin: 0 0 0.8rem !important;
    color: var(--ts-green-dark) !important;
    font-size: clamp(1.55rem, 2.2vw, 2rem) !important;
    line-height: 1.2 !important;
    font-weight: 750 !important;
    text-align: left !important;
}

#buy_form .product-info .info-essential {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.35rem 1.25rem !important;
    margin: 0 0 0.9rem !important;
    padding-bottom: 0.85rem !important;
    color: var(--ts-muted) !important;
    border-bottom: 1px solid rgba(5, 102, 27, 0.14) !important;
}

#buy_form .product-info .info-essential strong {
    color: var(--ts-ink) !important;
}

#buy_form .product-info .shortdesc {
    margin: 0 0 1rem !important;
    padding: 0.7rem 0.85rem !important;
    color: var(--ts-ink) !important;
    background: rgba(237, 248, 239, 0.92) !important;
    border-left: 0.25rem solid var(--ts-green) !important;
    border-radius: 0 0.45rem 0.45rem 0 !important;
}

#buy_form .product-info .shortdesc > :last-child {
    margin-bottom: 0 !important;
}

#buy_form .product-info .product-offer {
    margin: 0 !important;
}

/* Varianten kompakter und besser lesbar */
#buy_form .product-info .variations {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

#buy_form .product-info .variations > .col,
#buy_form .product-info .variations > [class*="col-"] {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

#buy_form .product-info .variations dl {
    margin-bottom: 0.3rem !important;
}

#buy_form .product-info .variation-wrapper {
    margin-bottom: 0.75rem !important;
}

#buy_form .product-info .variation-wrapper dt {
    margin-bottom: 0.3rem !important;
    color: var(--ts-ink) !important;
    font-weight: 700 !important;
}

#buy_form .product-info .variation-wrapper dd {
    margin-bottom: 0 !important;
}

#buy_form .product-info .variation-wrapper .custom-select,
#buy_form .product-info .variation-wrapper .bootstrap-select,
#buy_form .product-info .variation-wrapper .bootstrap-select > .dropdown-toggle {
    width: 100% !important;
    min-height: 2.85rem !important;
    color: var(--ts-ink) !important;
    background-color: rgba(255, 255, 255, 0.98) !important;
    border-color: rgba(5, 102, 27, 0.42) !important;
    border-radius: 0.45rem !important;
    box-shadow: none !important;
}

#buy_form .product-info .variation-wrapper .bootstrap-select > .dropdown-toggle:hover,
#buy_form .product-info .variation-wrapper .bootstrap-select > .dropdown-toggle:focus,
#buy_form .product-info .variation-wrapper .custom-select:focus {
    border-color: var(--ts-green) !important;
    box-shadow: 0 0 0 0.18rem rgba(10, 138, 36, 0.12) !important;
}

/* Preis als klarer Abschluss der Konfiguration */
#buy_form .product-info .price_wrapper {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    gap: 0.15rem 0.4rem !important;
    margin: 0.65rem 0 0 !important;
    padding: 0.9rem 0 0.65rem !important;
    border-top: 1px solid rgba(5, 102, 27, 0.16) !important;
}

#buy_form .product-info .price_wrapper > .price_label {
    color: var(--ts-muted) !important;
    font-size: 1rem !important;
}

#buy_form .product-info .price_wrapper > .price,
#buy_form .product-info .price_wrapper .price.h1 {
    margin: 0 !important;
    color: var(--ts-green-dark) !important;
    font-size: clamp(1.8rem, 2.6vw, 2.35rem) !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
}

#buy_form .product-info .price_wrapper > .price-note {
    flex: 0 0 100% !important;
    margin-top: 0.2rem !important;
    color: var(--ts-muted) !important;
    font-size: 0.88rem !important;
}

/* Lager- und Warenkorbbereich */
#buy_form .product-info .stock-information {
    margin: 0 !important;
    padding: 0.6rem 0 !important;
    border-color: rgba(5, 102, 27, 0.14) !important;
}

#buy_form #add-to-cart.product-buy {
    margin-top: 0.85rem !important;
    padding: 0.85rem !important;
    background: rgba(237, 248, 239, 0.88) !important;
    border: 1px solid rgba(5, 102, 27, 0.15) !important;
    border-radius: 0.65rem !important;
}

#buy_form #add-to-cart .choose-variations {
    margin: 0 !important;
    color: var(--ts-green-dark) !important;
    background: rgba(255, 255, 255, 0.92) !important;
    border: 0 !important;
    border-left: 0.25rem solid var(--ts-green) !important;
}

#buy_form #add-to-cart .basket-form-inline {
    align-items: stretch !important;
}

#buy_form #add-to-cart .choose_quantity,
#buy_form #add-to-cart .btn-primary {
    min-height: 3.05rem !important;
}

#buy_form #add-to-cart .btn-primary {
    font-size: 1.05rem !important;
    font-weight: 750 !important;
    border-radius: 0.45rem !important;
}

/* Beschreibung unterhalb des Produktes */
#buy_form + .product-tabs,
#buy_form ~ .product-tabs,
#product-tabs {
    border-bottom: 0 !important;
}

#product-tabs .nav-link {
    color: var(--ts-green-dark) !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

#product-tabs .nav-link:hover,
#product-tabs .nav-link:focus,
#product-tabs .nav-link.active {
    color: var(--ts-green-dark) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

#product-tabs .nav-link::before,
#product-tabs .nav-link::after,
#product-tabs .nav-link.active::before,
#product-tabs .nav-link.active::after {
    content: none !important;
    display: none !important;
}

#tab-content-product-tabs {
    padding: 1.4rem 1.5rem !important;
    background: rgba(255, 255, 255, 0.8) !important;
    border: 1px solid rgba(5, 102, 27, 0.14) !important;
    border-top: 0 !important;
    border-radius: 0 0 0.75rem 0.75rem !important;
}

@media (max-width: 991.98px) {
    #buy_form #product-offer > .product-info {
        margin-top: 1rem !important;
    }

    #buy_form #gallery_wrapper,
    #buy_form #gallery,
    #buy_form #gallery .slick-list,
    #buy_form #gallery .slick-track,
    #buy_form #gallery .js-gallery-images,
    #buy_form #gallery .js-gallery-images > .inner {
        max-height: 29rem !important;
    }
}

@media (max-width: 575.98px) {
    #buy_form #image_wrapper,
    #buy_form .product-info-inner {
        padding: 0.9rem !important;
        border-radius: 0.65rem !important;
    }

    #buy_form .product-title {
        font-size: 1.5rem !important;
    }

    #buy_form .product-info .info-essential {
        display: block !important;
    }

    #buy_form .product-info .info-essential > li + li {
        margin-top: 0.25rem !important;
    }

    #tab-content-product-tabs {
        padding: 1rem !important;
    }
}

/* =========================================================
   Artikeldetailseite – Tablet und Smartphone
   ========================================================= */

/* Tablet: Bild und Auswahl bleiben nebeneinander statt zu einer
   unnötig langen Seite untereinander zu werden. */
@media (min-width: 768px) and (max-width: 991.98px) {
    #buy_form #product-offer.product-detail {
        align-items: center !important;
    }

    #buy_form #product-offer > .product-gallery {
        flex: 0 0 42% !important;
        max-width: 42% !important;
    }

    #buy_form #product-offer > .product-info {
        flex: 0 0 58% !important;
        max-width: 58% !important;
        margin-top: 0 !important;
    }

    #buy_form #image_wrapper {
        padding: 0.75rem !important;
    }

    #buy_form .product-info-inner {
        padding: 1.1rem 1.2rem !important;
    }

    #buy_form .product-title {
        margin-bottom: 0.6rem !important;
        font-size: 1.45rem !important;
    }

    #buy_form .product-info .info-essential {
        gap: 0.2rem 0.75rem !important;
        margin-bottom: 0.65rem !important;
        padding-bottom: 0.6rem !important;
        font-size: 0.88rem !important;
    }

    #buy_form .product-info .shortdesc {
        margin-bottom: 0.7rem !important;
        padding: 0.55rem 0.7rem !important;
        font-size: 0.9rem !important;
    }

    #buy_form .product-info .variation-wrapper {
        margin-bottom: 0.55rem !important;
    }

    #buy_form .product-info .variation-wrapper .custom-select,
    #buy_form .product-info .variation-wrapper .bootstrap-select,
    #buy_form .product-info .variation-wrapper .bootstrap-select > .dropdown-toggle {
        min-height: 2.65rem !important;
    }

    #buy_form .product-info .price_wrapper {
        margin-top: 0.45rem !important;
        padding-top: 0.7rem !important;
    }

    #buy_form .product-info .price_wrapper > .price,
    #buy_form .product-info .price_wrapper .price.h1 {
        font-size: 1.9rem !important;
    }

    #buy_form #add-to-cart.product-buy {
        margin-top: 0.65rem !important;
        padding: 0.7rem !important;
    }
}

/* Smartphone: kompakt untereinander und ohne horizontales Überlaufen. */
@media (max-width: 767.98px) {
    #buy_form,
    #buy_form #product-offer.product-detail {
        max-width: 100% !important;
    }

    #buy_form #product-offer.product-detail {
        margin-right: -0.5rem !important;
        margin-left: -0.5rem !important;
    }

    #buy_form #product-offer > .product-gallery,
    #buy_form #product-offer > .product-info {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 0.5rem !important;
        padding-left: 0.5rem !important;
    }

    #buy_form #image_wrapper,
    #buy_form .product-info-inner {
        width: 100% !important;
        max-width: 31rem !important;
        margin-right: auto !important;
        margin-left: auto !important;
    }

    #buy_form #image_wrapper {
        margin-bottom: 0 !important;
        padding: 0.7rem !important;
    }

    #buy_form #gallery_wrapper,
    #buy_form #gallery,
    #buy_form #gallery .slick-list,
    #buy_form #gallery .slick-track,
    #buy_form #gallery .js-gallery-images,
    #buy_form #gallery .js-gallery-images > .inner {
        max-height: none !important;
    }

    #buy_form #gallery .js-gallery-images::before {
        padding-bottom: 82% !important;
    }

    #buy_form .product-detail-image-preview-bar {
        margin-top: 0.45rem !important;
    }

    #buy_form .product-thumbnails-wrapper,
    #buy_form .product-thumbnails {
        min-height: 4rem !important;
        height: 4rem !important;
    }

    #buy_form .product-thumbnails .product-image {
        max-width: 3.25rem !important;
        max-height: 3.25rem !important;
    }

    #buy_form #product-offer > .product-info {
        margin-top: 0.75rem !important;
    }

    #buy_form .product-info-inner {
        padding: 1rem !important;
    }

    #buy_form .product-title {
        margin-bottom: 0.55rem !important;
        font-size: 1.4rem !important;
        text-align: center !important;
    }

    #buy_form .product-info .info-essential {
        margin-bottom: 0.65rem !important;
        padding-bottom: 0.65rem !important;
        font-size: 0.86rem !important;
        text-align: center !important;
    }

    #buy_form .product-info .shortdesc {
        margin-bottom: 0.75rem !important;
        padding: 0.55rem 0.65rem !important;
        font-size: 0.9rem !important;
        text-align: center !important;
    }

    #buy_form .product-info .variation-wrapper {
        margin-bottom: 0.6rem !important;
    }

    #buy_form .product-info .variation-wrapper dt {
        font-size: 0.92rem !important;
    }

    #buy_form .product-info .variation-wrapper .custom-select,
    #buy_form .product-info .variation-wrapper .bootstrap-select,
    #buy_form .product-info .variation-wrapper .bootstrap-select > .dropdown-toggle {
        min-height: 2.75rem !important;
        font-size: 0.92rem !important;
    }

    #buy_form .product-info .price_wrapper {
        justify-content: center !important;
        margin-top: 0.35rem !important;
        padding-top: 0.7rem !important;
        text-align: center !important;
    }

    #buy_form .product-info .price_wrapper > .price,
    #buy_form .product-info .price_wrapper .price.h1 {
        font-size: 1.9rem !important;
    }

    #buy_form .product-info .price_wrapper > .price-note,
    #buy_form .product-info .stock-information {
        text-align: center !important;
    }

    #buy_form #add-to-cart.product-buy {
        margin-top: 0.65rem !important;
        padding: 0.7rem !important;
    }

    #product-tabs {
        justify-content: center !important;
        margin-top: 0.5rem !important;
    }

    #product-tabs .nav-link {
        padding: 0.6rem 0.8rem !important;
        font-size: 1rem !important;
    }

    #tab-content-product-tabs {
        padding: 0.9rem !important;
        font-size: 0.94rem !important;
        border-radius: 0.65rem !important;
    }

    /* Lange Brotkrumen bleiben in einer Zeile scrollbar statt das Layout aufzublähen. */
    .breadcrumb-wrapper,
    .breadcrumb-container {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
        scrollbar-width: none !important;
    }

    .breadcrumb-wrapper::-webkit-scrollbar,
    .breadcrumb-container::-webkit-scrollbar {
        display: none !important;
    }
}

@media (max-width: 575.98px) {
    /* Kategorie-Werkzeugleiste: mobil kompakt statt Desktop-Abmessungen. */
    #result-wrapper .productlist-page-nav-header-m {
        gap: 0.35rem !important;
        margin-bottom: 0.8rem !important;
        padding: 0.5rem 0.55rem !important;
        border-radius: 0.55rem !important;
    }

    #result-wrapper .productlist-page-nav-header-m .displayoptions {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 0.35rem !important;
    }

    #result-wrapper .productlist-page-nav-header-m #improve_search,
    #result-wrapper .productlist-page-nav-header-m #result-options,
    #result-wrapper .productlist-page-nav-header-m #result-options > .row,
    #result-wrapper .productlist-page-nav-header-m .filter-collapsible-control {
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 0 0 auto !important;
    }

    #result-wrapper .productlist-page-nav-header-m .btn,
    #result-wrapper .productlist-page-nav-header-m .btn-option,
    #result-wrapper .productlist-page-nav-header-m .dropdown-toggle {
        min-height: 2.25rem !important;
        padding: 0.38rem 0.58rem !important;
        font-size: 0.78rem !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    #result-wrapper .productlist-page-nav-header-m .btn-option {
        width: 2.25rem !important;
        min-width: 2.25rem !important;
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    #result-wrapper .productlist-page-nav-header-m .dropdown-toggle::after {
        margin-left: 0.3rem !important;
    }

    #result-wrapper .productlist-page-nav-header-m .productlist-item-info {
        margin-top: 0.05rem !important;
        padding: 0.1rem 0 !important;
        font-size: 0.8rem !important;
        line-height: 1.3 !important;
    }

    #buy_form #add-to-cart .basket-form-inline > [class*="col-"] + [class*="col-"] {
        margin-top: 0.65rem !important;
    }
}

/* =========================================================
   Einheitlicher Maßstab für Tablet und Smartphone
   ========================================================= */

@media (max-width: 991.98px) {
    #content-wrapper:not(.has-fluid) {
        padding-top: 1rem !important;
    }

    #content-wrapper.is-item-list #content .title > h1.h2 {
        margin: 0.65rem auto 1rem !important;
        font-size: 1.75rem !important;
    }

    .hr-sect {
        margin: 0.8rem 0 !important;
        padding: 0.7rem 0 !important;
        font-size: 1.4rem !important;
    }

    #footer .card-title,
    #footer .box-normal-link,
    #footer .productlist-filter-headline,
    #footer h4 {
        font-size: 1.1rem !important;
    }
}

@media (max-width: 767.98px) {
    #content-wrapper:not(.has-fluid) {
        padding-top: 0.6rem !important;
    }

    #main-wrapper h1 {
        font-size: 1.5rem !important;
        line-height: 1.2 !important;
    }

    #main-wrapper h2 {
        font-size: 1.25rem !important;
        line-height: 1.25 !important;
    }

    #main-wrapper h3,
    #main-wrapper .h3 {
        font-size: 1.08rem !important;
        line-height: 1.3 !important;
    }

    #content-wrapper.is-item-list #content .title > h1.h2 {
        margin: 0.45rem auto 0.8rem !important;
        font-size: 1.45rem !important;
    }

    .breadcrumb-wrapper {
        margin-bottom: 0.7rem !important;
    }

    .hr-sect {
        margin: 0.65rem 0 !important;
        padding: 0.55rem 0 !important;
        font-size: 1.2rem !important;
    }

    /* Startseiten-Blickfang: dieselbe ruhige Größenordnung wie der Header. */
    .ts-blickfang {
        gap: 0.55rem !important;
        width: calc(100% - 1.5rem) !important;
        max-width: 30rem !important;
        margin-top: 0 !important;
        margin-bottom: 1rem !important;
    }

    .ts-blickfang__tile {
        height: 8.75rem !important;
        border-radius: 0.65rem !important;
        box-shadow: 0 0.3rem 0.9rem rgba(20, 54, 30, 0.08) !important;
    }

    .ts-blickfang__tile--center {
        height: 12.5rem !important;
    }

    /* Kategorie- und Sliderbilder kompakter, Texte klar und gleichmäßig. */
    #product-list.layout-gallery .productbox-images .productbox-image.square::before,
    .product-slider-wrapper .item-slider.productbox-image.square::before {
        padding-bottom: 68% !important;
    }

    #product-list.layout-gallery .product-wrapper {
        margin-bottom: 0.9rem !important;
    }

    #product-list.layout-gallery .productbox-title,
    #product-list.layout-gallery .productbox-title a,
    .product-slider-wrapper .item-slider-desc {
        font-size: 0.92rem !important;
        line-height: 1.3 !important;
    }

    #product-list.layout-gallery .price_wrapper,
    #product-list.layout-gallery .productbox-price,
    .product-slider-wrapper .item-slider-price {
        font-size: 1rem !important;
        line-height: 1.25 !important;
    }

    .product-slider-wrapper .slick-arrow {
        width: 2.1rem !important;
        height: 2.1rem !important;
        border-radius: 0.35rem !important;
    }

    /* Artikelbild und Artikeldaten erhalten denselben kompakten Maßstab. */
    #buy_form #image_wrapper,
    #buy_form .product-info-inner {
        max-width: 27rem !important;
    }

    #buy_form #gallery .js-gallery-images::before {
        padding-bottom: 68% !important;
    }

    #buy_form .product-title {
        font-size: 1.28rem !important;
    }

    #buy_form .product-info .info-essential,
    #buy_form .product-info .shortdesc,
    #tab-content-product-tabs {
        font-size: 0.86rem !important;
    }

    #buy_form .product-info .price_wrapper > .price,
    #buy_form .product-info .price_wrapper .price.h1 {
        font-size: 1.6rem !important;
    }

    #product-tabs .nav-link {
        padding: 0.5rem 0.65rem !important;
        font-size: 0.9rem !important;
    }

    /* Footer: flache Zeilen, kleineres Bildband und kompakter Widerruf. */
    #footer {
        margin-top: 1rem !important;
        padding: 0.75rem 0.5rem 0.6rem !important;
    }

    #footer::before {
        width: calc(100% + 1rem) !important;
        margin: 0 -0.5rem 0.7rem !important;
    }

    #footer-boxes {
        width: calc(100% + 1rem) !important;
        margin-right: -0.5rem !important;
        margin-left: -0.5rem !important;
        gap: 0 !important;
    }

    #footer-boxes > [class*="col-"] {
        border-bottom: 1px solid var(--ts-line) !important;
    }

    #footer-boxes .box-normal {
        margin: 0 !important;
        padding: 0 !important;
    }

    #footer-boxes .box-normal-hr {
        display: none !important;
        margin: 0 !important;
    }

    #footer .card-title,
    #footer .box-normal-link,
    #footer .productlist-filter-headline,
    #footer h4 {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0.7rem 0.2rem !important;
        font-size: 1rem !important;
        line-height: 1.2 !important;
    }

    #footer-boxes .box-normal-link {
        display: flex !important;
        width: 100% !important;
        align-items: center !important;
        justify-content: space-between !important;
        text-align: left !important;
    }

    #footer-boxes .box-normal-link::after {
        flex: 0 0 auto;
        margin-left: 0.75rem !important;
    }

    #footer a:not(.btn) {
        font-size: 0.9rem !important;
        line-height: 1.4 !important;
    }

    #footer .withdrawal-link-wrapper {
        margin-top: 0.8rem !important;
    }

    #footer .withdrawal-link-wrapper > [class*="col-"] {
        flex-basis: 14rem !important;
        max-width: 14rem !important;
    }

    #footer .withdrawal-link {
        padding: 0.55rem 0.7rem !important;
        font-size: 0.9rem !important;
    }

    #footer .footnote-vat {
        margin-top: 0.7rem !important;
        font-size: 0.82rem !important;
    }

    #footer #copyright {
        margin-top: 0.75rem !important;
        padding-top: 0.6rem !important;
        font-size: 0.9rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
    }

    #footer #copyright .row,
    #footer #copyright [class*="col-"] {
        justify-content: center !important;
        font-size: inherit !important;
        text-align: center !important;
    }

    #footer #system-credits {
        margin-top: 0.2rem !important;
    }
}

/* Vollstaendige Produktvorschau: Bild an den Rahmen anpassen. */
#buy_form #gallery_wrapper,
#buy_form #gallery,
#buy_form #gallery .slick-list,
#buy_form #gallery .slick-track {
    max-height: none !important;
}

#buy_form #gallery .js-gallery-images {
    height: clamp(15rem, 42vw, 31rem) !important;
    max-height: none !important;
    position: relative;
}

#buy_form #gallery .js-gallery-images::before,
#productImagesModal .square-image::before {
    display: none !important;
    padding-bottom: 0 !important;
}

#buy_form #gallery .js-gallery-images > .inner,
#productImagesModal .square-image > .inner {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
}

#buy_form #gallery .js-gallery-images picture,
#productImagesModal .square-image picture {
    display: block;
    width: 100%;
    height: 100%;
}

#buy_form #gallery .js-gallery-images img.product-image,
#productImagesModal .square-image img.product-image {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
}

#productImagesModal .square-image {
    position: relative;
    height: 75vh !important;
    height: 75dvh !important;
    max-height: none !important;
}

/* Startseite: mehr Bildflaeche, weisser Fotohintergrund optisch ausgeblendet. */
body[data-page="18"] .product-slider-wrapper .slick-slide {
    padding-left: 6px !important;
    padding-right: 6px !important;
}

body[data-page="18"] .product-slider-wrapper .item-slider,
body[data-page="18"] .product-slider-wrapper .item-slider > .inner,
body[data-page="18"] .product-slider-wrapper .item-slider picture {
    background: transparent !important;
}

body[data-page="18"] .product-slider-wrapper .item-slider {
    mix-blend-mode: multiply;
}

body[data-page="18"] .product-slider-wrapper .item-slider .product-image {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}

body[data-page="18"] .product-slider-wrapper .item-slider-desc {
    margin-top: 0.5rem;
}

/* Startseite 1.0.4 */
body[data-page="18"] {
    background-image: linear-gradient(rgba(255,255,255,.72), rgba(255,255,255,.72)), url("background.jpg");
}
.ts-home-intro {
    width: calc(100% - 32px);
    max-width: 1440px;
    margin: 28px auto 44px;
    color: #202d24;
}
.ts-home-hero {
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 32px;
    padding: clamp(24px, 4vw, 56px);
    background: linear-gradient(120deg, #f0f8f1, #fff);
    border: 1px solid #dceade;
    border-radius: 18px;
}
.ts-home-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: .09em; color: #05661b; }
.ts-home-copy h2 { font-size: clamp(32px, 4.5vw, 64px); line-height: 1.07; font-weight: 800; margin: 20px 0; }
.ts-home-copy h2 span { color: #05661b; }
.ts-home-lead { font-size: 17px; line-height: 1.65; max-width: 560px; }
.ts-home-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.ts-home-button {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 46px; padding: 12px 22px;
    border: 1px solid #05661b; border-radius: 8px;
    background: #05661b; color: #fff !important; font-size: 15px; font-weight: 700;
}
.ts-home-button--secondary { background: transparent; color: #05661b !important; }
.ts-home-button:hover { background: #0a8a24; color: white !important; }
.ts-home-button:focus-visible { outline: 3px solid #202d24; outline-offset: 4px; }
.ts-home-feature {
    display: flex; flex-direction: column; justify-content: center;
    padding: clamp(24px, 3vw, 40px); border-radius: 12px;
    background: #05661b; color: white;
}
.ts-home-feature-label { font-size: 12px; letter-spacing: .1em; }
.ts-home-feature p { font-size: clamp(28px, 3vw, 44px); line-height: 1.2; margin: 24px 0; }
.ts-home-feature > span:last-child { font-size: 14px; line-height: 1.5; }
.ts-home-benefits { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; margin-top: 24px; }
.ts-home-benefits article { padding: 24px; border-bottom: 2px solid #d6e7d9; }
.ts-home-number { color: #05661b; font-size: 13px; font-weight: 700; }
.ts-home-benefits h3 { font-size: 20px; font-weight: 700; margin: 10px 0; }
.ts-home-benefits p { font-size: 15px; line-height: 1.6; margin: 0; }
body[data-page="18"] .ts-blickfang { grid-template-columns: repeat(var(--ts-media-count, 3), minmax(0, 1fr)); margin: 24px auto 40px !important; }
body[data-page="18"] .product-slider-wrapper { margin-top: 0 !important; margin-bottom: 40px !important; }
body[data-page="18"] .product-slider-wrapper h2,
body[data-page="18"] .product-slider-wrapper .h2 { font-size: clamp(24px, 2.3vw, 28px) !important; font-weight: 700 !important; margin-bottom: 24px !important; }
body[data-page="18"] .product-slider-wrapper .slick-slide { padding: 0 10px !important; }
body[data-page="18"] .product-slider-wrapper .slick-slide > a,
body[data-page="18"] .product-slider-wrapper .item-slider,
body[data-page="18"] .product-slider-wrapper .item-slider .inner { background: transparent !important; box-shadow: none !important; }
body[data-page="18"] .product-slider-wrapper .slick-slide > a { display: block; mix-blend-mode: multiply; }
body[data-page="18"] .product-slider-wrapper .item-slider-desc {
    font-size: 16px !important; line-height: 1.4 !important; min-height: 2.8em;
    margin-top: 12px !important; text-align: center; color: #202d24 !important;
}
body[data-page="18"] .product-slider-wrapper .item-slider-desc span { font-size: inherit !important; }
body[data-page="18"] #footer { margin-top: 24px !important; }
@media (max-width: 767.98px) {
    .ts-home-hero { grid-template-columns: 1fr; gap: 20px; }
    .ts-home-feature { padding: 24px; }
    .ts-home-feature p { margin: 12px 0; }
    .ts-home-benefits { grid-template-columns: 1fr; gap: 0; }
    .ts-home-benefits article { padding: 18px 8px; }
    .ts-home-lead { font-size: 16px; }
    body[data-page="18"] .ts-blickfang { grid-template-columns: 1fr; }
}
@media (max-width: 575.98px) {
    .ts-home-intro { width: calc(100% - 24px); margin-top: 16px; }
    .ts-home-eyebrow { font-size: 10px; letter-spacing: .04em; }
    .ts-home-actions { flex-direction: column; }
    body[data-page="18"] .product-slider-wrapper .slick-slide { padding: 0 6px !important; }
    body[data-page="18"] .product-slider-wrapper .item-slider-desc { font-size: 14px !important; }
}

/* 1.0.6: kompakter Einstieg und begrenzte Produktbilder */
.ts-home-intro { margin: 16px auto 24px; }
.ts-home-hero { padding: 22px 28px; gap: 24px; border-radius: 12px; }
.ts-home-copy h2 { font-size: clamp(26px, 2.4vw, 36px); margin: 8px 0 12px; }
.ts-home-eyebrow { margin-bottom: 8px; }
.ts-home-lead { font-size: 15px; line-height: 1.5; margin-bottom: 0; }
.ts-home-actions { margin-top: 14px; }
.ts-home-button { padding: 9px 16px; min-height: 44px; font-size: 14px; }
.ts-home-feature { padding: 18px 24px; }
.ts-home-feature p { font-size: clamp(24px, 2vw, 30px); margin: 10px 0; }
.ts-home-benefits { margin-top: 12px; gap: 20px; }
.ts-home-benefits article { padding: 10px 12px; }
.ts-home-benefits h3 { font-size: 17px; margin: 6px 0; }
.ts-home-benefits p { font-size: 14px; line-height: 1.45; }
body[data-page="18"] .product-slider-wrapper .item-slider.square-image {
    width: 100% !important;
    max-width: 260px !important;
    height: 240px !important;
    padding: 0 !important;
    margin: 0 auto !important;
}
body[data-page="18"] .product-slider-wrapper .item-slider.square-image::before { display: none !important; }
body[data-page="18"] .product-slider-wrapper .item-slider.square-image > .inner {
    position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important;
}
body[data-page="18"] .product-slider-wrapper .item-slider.square-image picture { display: block; height: 100%; }
@media (max-width: 767.98px) {
    .ts-home-hero { padding: 18px; gap: 14px; }
    .ts-home-feature { display: none; }
    .ts-home-benefits article { padding: 10px 4px; }
    body[data-page="18"] .product-slider-wrapper .item-slider.square-image { height: 190px !important; max-width: 210px !important; }
}
@media (max-width: 575.98px) {
    body[data-page="18"] .product-slider-wrapper .item-slider.square-image { height: 155px !important; max-width: 180px !important; }
}

/* 1.0.8: Firmen-/Vereinslogos in den Menükacheln größer */
#jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-toplevel:has(.submenu-headline-image) {
    height: auto !important;
    min-height: 10rem !important;
    padding: 0.75rem !important;
    gap: 0.6rem !important;
}
#jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 12rem !important;
    height: 6.25rem !important;
    flex: 0 0 6.25rem !important;
    margin: 0 auto !important;
    object-fit: contain !important;
}
#jtl-nav-wrapper #mainNavigation .dropdown-full > .dropdown-menu .submenu-headline-image img {
    width: 100% !important;
    max-width: 12rem !important;
    height: 6.25rem !important;
    max-height: 6.25rem !important;
    object-fit: contain !important;
    margin: 0 auto !important;
}

/* 1.0.9: Kategorienübersicht – sechs Spalten am Desktop */
@media (min-width: 992px) {
    #content .content-cats-small {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 1.5rem 1.25rem !important;
    }
    #content .content-cats-small > [class*="col-"] {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        flex-basis: auto !important;
    }
}

/* 1.0.10: Kassenkopf ohne Überlagerung der Bestellschritte */
body[data-page="11"] #jtl-nav-wrapper > :is(.container, .container-fluid, .container-fluid-xl) {
    display: flex !important; flex-wrap: wrap !important;
    align-items: center !important; justify-content: space-between !important;
    gap: 16px !important; padding-top: 12px !important; padding-bottom: 16px !important;
    height: auto !important; min-height: 96px !important;
}
body[data-page="11"] #jtl-nav-wrapper nav.navbar {
    display: flex !important; flex-wrap: wrap !important; align-items: center !important;
    position: static !important; height: auto !important; margin: 0 !important;
}
body[data-page="11"] #jtl-nav-wrapper .ts-header-main > nav.navbar { width: 100% !important; }
body[data-page="11"] #jtl-nav-wrapper .toggler-logo-wrapper,
body[data-page="11"] #jtl-nav-wrapper .nav-logo-wrapper,
body[data-page="11"] #jtl-nav-wrapper .logo-wrapper {
    width: auto !important; min-width: 0 !important; height: auto !important;
    position: static !important; transform: none !important; margin: 0 !important;
}
body[data-page="11"] #jtl-nav-wrapper .teamsportler-logo .navbar-brand { margin: 0 !important; padding: 0 !important; }
body[data-page="11"] #jtl-nav-wrapper .teamsportler-logo #shop-logo {
    width: 300px !important; max-width: 100% !important; height: auto !important;
    max-height: 72px !important; object-fit: contain !important;
}
body[data-page="11"] .secure-checkout-icon { color: var(--ts-green-dark) !important; font-size: 14px; }
body[data-page="11"] .checkout-steps { clear: both; margin-top: 20px !important; background: var(--ts-green-soft) !important; border-color: var(--ts-line) !important; }
body[data-page="11"] .checkout-steps .step { background: var(--ts-green-soft) !important; }
body[data-page="11"] .checkout-steps .step::after { border-left-color: var(--ts-green-soft) !important; }
body[data-page="11"] .checkout-steps .step-active { background: #fff !important; }
body[data-page="11"] .checkout-steps .step-active::after { border-left-color: #fff !important; }
body[data-page="11"] .checkout-steps .step-content::after { background: var(--ts-green) !important; }
body[data-page="11"] .checkout-steps .badge { background: var(--ts-green-dark) !important; color: #fff !important; }
body[data-page="11"] .checkout-steps .step-text { color: var(--ts-green-dark) !important; }
@media (max-width: 575.98px) {
    body[data-page="11"] #jtl-nav-wrapper .teamsportler-logo #shop-logo { width: 220px !important; max-height: 52px !important; }
    body[data-page="11"] #jtl-nav-wrapper > :is(.container, .container-fluid, .container-fluid-xl) { gap: 8px !important; }
}

/* 1.0.11: ruhige Kasse, kompakte Zahlungsarten */
body[data-page="11"] #jtl-nav-wrapper .search-form-wrapper-fixed,
body[data-page="11"] header .fixed-search,
body[data-page="11"] header .main-search-wrapper,
body[data-page="11"] header .search-form-wrapper,
body[data-page="11"] header #search {
    display: none !important;
}
body[data-page="11"] .checkout-payment-method {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid var(--ts-line);
}
body[data-page="11"] .checkout-payment-method img.img-sm {
    display: inline-block !important;
    width: 104px !important;
    height: 64px !important;
    max-width: 104px !important;
    max-height: 64px !important;
    object-fit: contain !important;
    vertical-align: middle;
    margin: 0 12px 6px 0 !important;
}
body[data-page="11"] .checkout-payment-method .custom-control-label {
    min-height: 44px;
    font-size: 16px;
    line-height: 1.5;
}
body[data-page="11"] .checkout-payment-method-note {
    display: block;
    margin-top: 6px;
    line-height: 1.5;
}
body[data-page="11"] .checkout-payment-method-note small { font-size: 13px; }
body[data-page="11"] .custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--ts-green-dark) !important;
    background-color: var(--ts-green-dark) !important;
}
body[data-page="11"] .btn-outline-primary {
    color: var(--ts-green-dark) !important;
    border-color: var(--ts-green-dark) !important;
    background: white !important;
}
body[data-page="11"] .btn-outline-primary:hover {
    color: white !important;
    background: var(--ts-green-dark) !important;
}

/* 1.0.14: Sicherheitshinweis für bestehende Kundenkonten */
.ts-password-security-notice {
 display: flex !important; align-items: flex-start; gap: 16px;
 width: calc(100% - 32px); max-width: 1440px; margin: 20px auto;
 padding: 20px 24px; box-sizing: border-box;
 background: #edf8ef; color: #20262b;
 border: 2px solid #05661b; border-left-width: 6px; border-radius: 10px;
}
.ts-password-security-notice__icon { flex: 0 0 auto; font-size: 26px; line-height: 1.3; }
.ts-password-security-notice__content { min-width: 0; }
.ts-password-security-notice__content strong { display: block; font-size: 19px; line-height: 1.35; color: #05661b; }
.ts-password-security-notice__content p { font-size: 15px; line-height: 1.6; margin: 8px 0 0; }
.ts-password-security-notice__content a { color: #05661b !important; font-weight: 700; text-decoration: underline !important; }
.ts-password-security-notice__content a:focus-visible { outline: 3px solid #05661b; outline-offset: 3px; }
@media (max-width: 575.98px) {
 .ts-password-security-notice { width: calc(100% - 24px); padding: 16px; gap: 10px; }
 .ts-password-security-notice__icon { font-size: 22px; }
 .ts-password-security-notice__content strong { font-size: 17px; }
}

.ts-password-security-notice__content p strong { display: inline; font-size: inherit; line-height: inherit; }

/* 1.0.17: Mobile Menükontraste und kompaktere Ballbilder */
@media (max-width: 991.98px) {
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header,
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .nav-offcanvas-title,
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .nav-offcanvas-title *,
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .navbar-toggler {
        color: #fff !important;
        opacity: 1 !important;
    }
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .navbar-toggler-icon {
        color: #fff !important;
        background: transparent !important;
    }
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .navbar-toggler-icon::before,
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .navbar-toggler-icon::after {
        background-color: #fff !important;
    }
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header .navbar-toggler,
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header a[data-menu-back] {
        min-width: 44px;
        min-height: 44px;
    }
    body #jtl-nav-wrapper #mainNavigation .nav-mobile-header :is(button, a):focus-visible {
        outline: 2px solid #fff; outline-offset: 2px;
    }
    body #jtl-nav-wrapper #mainNavigation .dropdown-menu a,
    body #jtl-nav-wrapper #mainNavigation .dropdown-menu a:visited,
    body #jtl-nav-wrapper #mainNavigation .dropdown-menu a:hover,
    body #jtl-nav-wrapper #mainNavigation .dropdown-menu a:focus,
    body #jtl-nav-wrapper #mainNavigation .dropdown-menu a.active,
    body #jtl-nav-wrapper #mainNavigation .dropdown-menu a span {
        color: #000 !important;
        opacity: 1 !important;
    }
}
/* Nur die beiden abgebildeten Ballmodelle im Startseiten-Slider. */
body[data-page="18"] .product-slider-wrapper .item-slider.square-image:has(img[alt*="Ultimo" i]),
body[data-page="18"] .product-slider-wrapper .item-slider.square-image:has(img[alt*="Planet" i]) {
    max-width: 190px !important;
    height: 190px !important;
    margin: 0 auto !important;
}
@media (max-width: 767.98px) {
    body[data-page="18"] .product-slider-wrapper .item-slider.square-image:has(img[alt*="Ultimo" i]),
    body[data-page="18"] .product-slider-wrapper .item-slider.square-image:has(img[alt*="Planet" i]) {
        max-width: 125px !important;
        height: 125px !important;
    }
}

/* 1.0.18: Zentrierter Vereinskopf und Unterkategoriekacheln */
#content .ts-category-heading {
    max-width: 1440px; margin: 16px auto 28px; padding: 22px 16px;
    text-align: center;
    background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(237,248,239,.55));
    border-bottom: 1px solid #dceade; border-radius: 12px;
}
#content .ts-category-heading .productlist-header-description-image {
    display: block !important; width: 128px !important; height: 128px !important;
    max-width: 100% !important; object-fit: contain !important; margin: 0 auto 14px !important;
}
#content .ts-category-heading .title { margin: 0 !important; text-align: center !important; }
#content .ts-category-heading .title h1 {
    font-size: clamp(24px, 2.5vw, 34px) !important; line-height: 1.2 !important;
    font-weight: 700 !important; color: #05661b !important; margin: 0 !important;
}
#content .content-cats-small {
    display: flex !important; flex-wrap: wrap !important;
    justify-content: center !important; align-items: stretch !important;
    gap: 20px !important; width: 100% !important; max-width: 1440px;
    margin: 0 auto 28px !important;
}
#content .content-cats-small > [class*="col-"] {
    flex: 0 0 calc((100% - 100px) / 6) !important;
    width: calc((100% - 100px) / 6) !important;
    max-width: calc((100% - 100px) / 6) !important; min-width: 0 !important;
    padding: 0 !important;
}
#content .content-cats-small .sub-categories {
    display: flex !important; flex-direction: column; height: 100% !important;
    padding: 16px 10px !important; box-sizing: border-box;
    background: rgba(255,255,255,.85); border: 1px solid #dceade;
    border-radius: 12px; box-shadow: 0 3px 12px rgba(20,54,30,.05);
}
#content .content-cats-small .sub-categories:hover,
#content .content-cats-small .sub-categories:focus-within { border-color: #05661b; }
#content .content-cats-small .subcategories-image {
    display: flex !important; width: 100% !important; height: 140px !important;
    margin: 0 0 12px !important;
}
#content .content-cats-small .subcategories-image img {
    width: auto !important; height: auto !important;
    max-width: 100% !important; max-height: 140px !important; object-fit: contain !important;
}
#content .content-cats-small .caption,
#content .content-cats-small .caption a {
    text-align: center !important; color: #20262b !important;
    font-size: 15px !important; font-weight: 600; line-height: 1.4 !important;
    white-space: normal !important;
}
@media (max-width: 991.98px) {
    #content .content-cats-small > [class*="col-"] {
        flex-basis: calc((100% - 40px) / 3) !important;
        width: calc((100% - 40px) / 3) !important; max-width: calc((100% - 40px) / 3) !important;
    }
}
@media (max-width: 575.98px) {
    #content .ts-category-heading { padding: 16px 12px; margin-bottom: 18px; }
    #content .ts-category-heading .productlist-header-description-image { width: 96px !important; height: 96px !important; }
    #content .content-cats-small { gap: 12px !important; }
    #content .content-cats-small > [class*="col-"] {
        flex-basis: calc((100% - 12px) / 2) !important;
        width: calc((100% - 12px) / 2) !important; max-width: calc((100% - 12px) / 2) !important;
    }
    #content .content-cats-small .subcategories-image { height: 112px !important; }
    #content .content-cats-small .subcategories-image img { max-height: 112px !important; }
}

/* 1.0.19: Beschriftungen unter bebilderten Unterkategorien entfernen */
#content .content-cats-small .sub-categories:has(.subcategories-image img) .caption {
    display: none !important;
}
#content .content-cats-small .sub-categories:has(.subcategories-image img) .subcategories-image {
    margin-bottom: 0 !important;
}