/*
 * Platz für eigene Änderungen direkt als CSS
 * Die hier gemachten Änderungen überschreiben ggfs. andere Styles, da diese Datei als letzte geladen wird.

/* SnackBase24 Footer minimal */

:root {
    --sb-yellow: #ffcc00;
}

/* Footer Hintergrund + gelbe Linie */
#footer {
    background: linear-gradient(180deg, #202020 0%, #111111 100%) !important;
    border-top: 4px solid var(--sb-yellow) !important;
    color: #ffffff !important;
}

/* Innenbereiche transparent lassen */
#footer .container,
#footer .row,
#footer [class*="col-"],
#footer .box,
#footer .footer-box {
    background: transparent !important;
    border-color: transparent !important;
}

/* Footer-Überschriften */
#footer .productlist-filter-headline,
#footer .newsletter-footer-heading,
#footer .box-title,
#footer .footer-title {
    color: #ffffff !important;
    opacity: 1 !important;
}

/* Footer-Links und Texte */
#footer a:not(.btn),
#footer p,
#footer span,
#footer li,
#footer small {
    color: #d6d6d6 !important;
}

/* Hover-Farbe */
#footer a:not(.btn):hover {
    color: var(--sb-yellow) !important;
    text-decoration: none !important;
}

/* Footer-Buttons */
#footer .btn,
#footer button,
#footer input[type="submit"] {
    background: var(--sb-yellow) !important;
    border-color: var(--sb-yellow) !important;
    color: #000000 !important;
}

/* Unterer Footerbereich */
#copyright,
#footer .copyright,
#footer .subfooter {
    background: #101010 !important;
    color: #d6d6d6 !important;
}

/* Scroll-to-top Button */
#to-top,
.back-to-top,
.scroll-to-top {
    background: var(--sb-yellow) !important;
    border-color: var(--sb-yellow) !important;
    color: #ffffff !important;
}
	
	
	
	
/* SnackBase Top Info Bar */
.sb-top-benefits {
    width: 100%;
    background: linear-gradient(90deg, #111111 0%, #252525 50%, #111111 100%);
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    border-bottom: 2px solid #ffcc00;
    z-index: 1000;
}

.sb-top-benefits-inner {
    max-width: 1600px;
    margin: 0 auto;
    padding: 9px 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 42px;
    white-space: nowrap;
}

.sb-benefit-item {
    position: relative;
    display: flex;
    align-items: center;
    color: #ffffff;
}

.sb-benefit-item::before {
    content: "";
    width: 9px;
    height: 9px;
    margin-right: 8px;
    border-radius: 50%;
    background: #fcc302;
    box-shadow: 0 0 8px rgba(252, 195, 2, 0.8);
}

/* Mobile */
@media (max-width: 991px) {
    .sb-top-benefits-inner {
        justify-content: flex-start;
        overflow-x: auto;
        gap: 28px;
        padding: 9px 16px;
        scrollbar-width: none;
    }

    .sb-top-benefits-inner::-webkit-scrollbar {
        display: none;
    }

    .sb-benefit-item {
        flex: 0 0 auto;
        font-size: 13px;
    }
}

@media (max-width: 575px) {
    .sb-top-benefits {
        font-size: 12px;
    }

    .sb-top-benefits-inner {
        padding: 8px 12px;
        gap: 24px;
    }
}

/* Registrierungsbanner */
.banner > .area.sb-register-zone {
    left: 7.05% !important;
    top: 69% !important;
    width: 26.5% !important;
    height: 16.1% !important;

    position: absolute !important;
    display: block !important;
    cursor: pointer;
    border: 3 !important;
    border-radius: 9px !important;
    background: transparent !important;
    overflow: hidden !important;
    transition: box-shadow 0.2s ease, filter 0.2s ease;
}

.banner > .area.sb-register-zone:hover {
    box-shadow: 0 0 0 3px rgba(255, 204, 0, 0.55);
    filter: brightness(1.04);
}


/* Widerrufsbutton */
a.withdrawal-link {
    display: none !important;
}

.mt-3:has(> a.withdrawal-link) {
    display: none !important;
}