
/* ==========================================================================
   Wij Thuisbatterij - Complete Footer, Hero & Header Overrides
   ========================================================================== */

/* 1. Maak alle teksten, koppen, widgets en links in de footer helder wit */
.site-footer,
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6,
.site-footer p,
.site-footer span,
.site-footer li,
.site-footer .widget-title,
.site-footer .widget,
.site-footer .widget a {
    color: #ffffff !important;
}

/* 2. Subtiele lichtblauwe hover-kleur voor links in de footer */
.site-footer a:hover {
    color: #D0E8FF !important;
    text-decoration: underline !important;
}

/* 3. Verwijder de gekleurde ronde/vierkante achtergronden van social media knoppen */
.site-footer ul.wp-block-social-links li.wp-social-link,
.site-footer .wp-block-social-links a,
.site-footer .wp-block-social-link,
.site-footer a.wp-block-social-link-anchor,
.site-footer .social-links .social-link-item,
.site-footer .social-link-item {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0 !important;
}

/* 4. Dwing de SVG-icoontjes af op helder wit */
.site-footer .wp-block-social-links svg,
.site-footer .wp-block-social-links svg path,
.site-footer a.wp-block-social-link-anchor svg,
.site-footer a.wp-block-social-link-anchor svg path,
.site-footer .social-links svg,
.site-footer .social-links svg path {
    fill: #ffffff !important;
    color: #ffffff !important;
}

/* 5. Subtiel lichtblauw hover-effect op de social media icoontjes */
.site-footer a.wp-block-social-link-anchor:hover svg path,
.site-footer .wp-block-social-links a:hover svg path {
    fill: #D0E8FF !important;
}

footer a,
footer a:visited,
footer a:hover,
footer a:active {
    color: #ffffff !important;
}


/************************ aanpassingen handmatig ************************/

/* Background colour */
.wtb-hero {
    position: relative;
}

.wtb-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        to right,
        rgba(0, 0, 0, 0.6) 0%,
        rgba(0, 0, 0, 0.3) 45%,
        rgba(0, 0, 0, 0) 100%
    );
    z-index: 1;
}

.wtb-hero > .kt-row-column-wrap {
    position: relative;
    z-index: 2;
}


/* ==========================================================================
   PRODUCTPAGINA'S + ACTIEPAGINA: VASTE BLAUWE HEADER (#024AAD)
   Desktop en mobiel
   ========================================================================== */

.post-type-archive-product .site-header-row-container,
.tax-product_cat .site-header-row-container,
.woocommerce-cart .site-header-row-container,
.woocommerce-checkout .site-header-row-container,
.woocommerce-account .site-header-row-container,
.single-product .site-header-row-container,
.page-anker-solix-ac-max-stapelkorting .site-header-row-container,

.post-type-archive-product .mobile-header-row-container,
.tax-product_cat .mobile-header-row-container,
.woocommerce-cart .mobile-header-row-container,
.woocommerce-checkout .mobile-header-row-container,
.woocommerce-account .mobile-header-row-container,
.single-product .mobile-header-row-container,
.page-anker-solix-ac-max-stapelkorting .mobile-header-row-container,

.post-type-archive-product .site-mobile-header-wrap,
.tax-product_cat .site-mobile-header-wrap,
.woocommerce-cart .site-mobile-header-wrap,
.woocommerce-checkout .site-mobile-header-wrap,
.woocommerce-account .site-mobile-header-wrap,
.single-product .site-mobile-header-wrap,
.page-anker-solix-ac-max-stapelkorting .site-mobile-header-wrap {
    background-color: #024aad !important;
}


/************************ WINKELMAND ICOON FIX ************************/
/*************** FIXED/STICKY VS TRANSPARANT **************************/

/* 1. Kadence sticky/fixed state: achtergrond wegslopen en kleur zwart/donker (#111111) dwingen */

#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) .header-cart-wrap .header-cart-button,
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) .header-mobile-cart-wrap .header-cart-button,
header.is-sticky .menu-item-kadence-cart svg,
.is-sticky .menu-item-kadence-cart svg,
.site-header.is-sticky .menu-item-kadence-cart svg,
.kadence-sticky-header .menu-item-kadence-cart svg,
body.is-scrolling .menu-item-kadence-cart svg {
    background: transparent !important;
    background-color: transparent !important;
    fill: #111111 !important;
    color: #111111 !important;
}

/* 2. Uitsluitend op de echte transparante header (bovenop de hero): wit maken */

.transparent-header .menu-item-kadence-cart svg {
    fill: #ffffff !important;
    color: #ffffff !important;
}


/* Zorg dat de knoptekst en pijl op de shop-pagina nooit afbreken */

.products .product .button,
.woocommerce ul.products li.product .button {
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
}


/* WooCommerce-meldingen verbergen */

.woocommerce-notices-wrapper {
    display: none !important;
}

/* =========================================
   ANKER SOLIX ACTIEPAGINA - BLAUWE HEADER
   Pagina ID: 2154
========================================= */

/* Desktop header */
body.page-id-2154 .site-header-row-container,
body.page-id-2154 .site-header-row-container-inner,
body.page-id-2154 .site-main-header-wrap {
    background-color: #024AAD !important;
    background-image: none !important;
}

/* Mobiele header */
body.page-id-2154 .mobile-header-row-container,
body.page-id-2154 .site-mobile-header-wrap {
    background-color: #024AAD !important;
    background-image: none !important;
}

/* Transparante header uitschakelen voor deze pagina */
body.page-id-2154.transparent-header .site-header,
body.page-id-2154.mobile-transparent-header .site-header {
    background-color: #024AAD !important;
    background-image: none !important;
}