/*
Theme Name: Bridge Child Sprankel Zeep
Theme URI: https://www.sprankelzeep.nl
Template: bridge
Author: Sprankel Zeep
Author URI: https://www.sprankelzeep.nl
Description: Child theme voor Sprankel Zeep, gebaseerd op Bridge Pottery demo
Tags: child-theme, bridge, woocommerce, sprankelzeep, handmade, sprankel, soap shop
Version: 1.0.0.1757856401
Updated: 2025-09-14 13:26:41

*/

/* =====================================================
   SPRANKEL ZEEP – COMPLETE HUISSTIJL + FIXES
   ===================================================== */

/* ---------------- KOPPEN & BODY ------------------- */
h1,h2,h3,h4,h5,h6 {
    font-family:'Libre Baskerville',serif;
    color:#000;
    line-height:1.4;
    margin-bottom:.6em;
}
h1 {font-size:2.2em;font-weight:700;}
h2 {font-size:1.8em;font-weight:600;color:#C89200;}
h3,h4 {font-size:1.4em;font-weight:600;color:#FF6F61;}

body,p {
    font-family:'Poppins',sans-serif;
    font-size:1em;
    line-height:1.7;
    color:#000;
}

/* ---------------- LINKS --------------------------- */
a {color:#B7AFA6;text-decoration:none;}
a:hover {color:#FF6F61!important;text-decoration:underline;}

/* =====================================================
   KNOPPEN GLOBAAL (Elementor, WooCommerce, CF7)
   ===================================================== */
.elementor-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wpcf7 input[type="submit"],
.woocommerce #payment #place_order,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    font-family:'Poppins',sans-serif!important;
    font-weight:600;
    background-color:#C89200!important;     /* goud */
    color:#fff!important;
    border:none!important;
    border-radius:0!important;
    padding:12px 28px!important;
    font-size:1em;
    transition:all .3s ease;
    text-decoration:none!important;
}
.elementor-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.wpcf7 input[type="submit"]:hover,
.woocommerce #payment #place_order:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background-color:#FF6F61!important;          /* koraal hover */
    color:#fff!important;
}

/* Compactere knop op productpagina */
.single-product .single_add_to_cart_button {
    padding:8px 20px!important;
    font-size:.9em!important;
    line-height:1.4em!important;
}

/* =====================================================
   MENU & FOOTER
   ===================================================== */
.main-menu li a {
    font-family:'Poppins',sans-serif!important;
    color:#000!important;
}
.main-menu li a:hover {color:#FF6F61!important;}

footer .widget_nav_menu li a {
    font-family:'Poppins',sans-serif!important;
    color:#B7AFA6!important;
}
footer .widget_nav_menu li a:hover {color:#FF6F61!important;}

/* =====================================================
   CONTACT FORM
   ===================================================== */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea {
    font-family:'Poppins',sans-serif!important;
    color:#000!important;
    border:1px solid #B7AFA6!important;
    background:#fff!important;
    padding:10px;
    font-size:.95em;
    width:100%;
}
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 textarea:focus {
    border-color:#C89200!important;
    outline:none;
}

/* =====================================================
   WOO – PRIJZEN, PRODUCTEN, CART
   ===================================================== */
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
    font-family:'Libre Baskerville',serif!important;
    color:#C89200!important;
    font-size:1.2em;
    font-weight:700;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family:'Libre Baskerville',serif!important;
    font-size:1.1em;
    font-weight:600;
    color:#000!important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title:hover {
    color:#FF6F61!important;
}

/* Sale-badge */
.woocommerce span.onsale {
    background:#FF6F61!important;
    color:#fff!important;
    font-family:'Poppins',sans-serif!important;
    border-radius:0;
    padding:6px 10px;
    font-size:.9em;
    font-weight:600;
}

/* Meldingen */
.woocommerce-message,
.woocommerce-info {border-top-color:#C89200!important;}
.woocommerce-error {border-top-color:#FF6F61!important;}

/* =====================================================
   MINI-CART DROPDOWN & HEADER-ICOON
   ===================================================== */

.qodef-shopping-cart-dropdown,
.woocommerce .widget_shopping_cart,
.woocommerce-mini-cart {
    background:#F2C9D6!important;                     /* zachtroze */
    font-family:'Poppins',sans-serif!important;
    border:none!important;
}
.qodef-shopping-cart-dropdown .qodef-woo-title,
.qodef-shopping-cart-dropdown .qodef-woo-price {
    color:#000!important;
}
.qodef-shopping-cart-dropdown a.button,
.qodef-shopping-cart-dropdown .woocommerce-mini-cart__buttons a.button {
    background:#C89200!important;
    color:#fff!important;
    font-family:'Poppins',sans-serif!important;
    border-radius:0;
    padding:8px 20px;
}
.qodef-shopping-cart-dropdown a.button:hover,
.qodef-shopping-cart-dropdown .woocommerce-mini-cart__buttons a.button:hover {
    background:#FF6F61!important;
    color:#fff!important;
}

/* =====================================================
   PRODUCT-META, TAGS & WISHLIST
   ===================================================== */
.product_meta>span,
.product_meta>span a,
.woocommerce table.shop_attributes th {
    font-family:'Poppins',sans-serif;
    font-weight:500;
    text-transform:none!important;
    color:#000!important;                     /* zwart i.p.v. grijs */
}
.product_meta span a:hover {color:#FF6F61!important;}  /* koraal hover */

.product_meta span.sku {color:#000!important;}         /* artikelnummer zwart */

.single-product .qode-wishlist,
.single-product .qode-wishlist a,
.single-product .qode-wishlist span {
    color:#FF6F61!important;                           /* koraal */
    background:transparent!important;
    font-family:'Poppins',sans-serif!important;
    text-decoration:none!important;
}
.single-product .qode-wishlist:hover,
.single-product .qode-wishlist a:hover {
    color:#C89200!important;                           /* goud hover */
}

/* =====================================================
   PLUS / MIN
   ===================================================== */
.quantity .qty-button,
.quantity button {
    font-family:'Poppins',sans-serif!important;
    background:#C89200!important;
    color:#fff!important;
    border:none!important;
    border-radius:50%!important;         /* kleine ronde knopjes */
    width:30px;
    height:30px;
    line-height:30px;
}
.quantity .qty-button:hover,
.quantity button:hover {
    background:#FF6F61!important;
}

/* =====================================================
   LAYOUT FIXES UIT BRIDGE
   ===================================================== */
.woocommerce .widget_price_filter .ui-slider-horizontal .ui-slider-range {background:#C89200;}
.woocommerce div.product .cart .quantity {padding-top:0;padding-bottom:30px;}
p.price {padding-bottom:13px;}
.woocommerce ul.products li.product .image-wrapper {overflow:visible;}
.woocommerce .product .onsale:not(.out-of-stock-button),
.woocommerce .product .single-onsale {top:-27px;}

@media(max-width:768px){
 .wpcf7-form.cf7_custom_style_1 .two_columns_form_without_space,
 .wpcf7-form.cf7_custom_style_1 .two_columns_form_without_space .column_left,
 .wpcf7-form.cf7_custom_style_1 .two_columns_form_without_space .column_right{
     display:block;width:100%;
 }
 .cf7_custom_style_1 input.wpcf7-form-control.wpcf7-text{margin-bottom:10px;}
 .cf7_custom_style_1 input.wpcf7-form-control.wpcf7-submit{
     width:100%;box-sizing:border-box;text-align:center;
 }
}

.shopping_cart_dropdown span.total,
.shopping_cart_dropdown ul li {
    font-size:14px;
    text-transform:none;
    font-weight:600;
}

@media(max-width:1366px){
 .woocommerce .widget_price_filter .button,
 .woocommerce-page .widget_price_filter .button{float:none;margin:0 0 10px;}
 .woocommerce .widget_price_filter .price_label,
 .woocommerce-page .widget_price_filter .price_label{
     display:block;width:100%;margin:0 0 40px;
 }
}

/* =====================================================
   ELEMENTOR DECOR
   ===================================================== */
blockquote {
    font-family:'Sacramento',cursive;
    font-size:1.5em;
    color:#C89200;
    border-left:4px solid #F2C9D6;
    padding-left:15px;
    margin:20px 0;
}
.sprankel-bg {
    background:#F2C9D6;
    padding:20px;
    border-radius:0;
}

.woocommerce .quantity .minus, .woocommerce #content .quantity .minus, .woocommerce-page .quantity .minus, .woocommerce-page #content .quantity .minus, .woocommerce .quantity .plus, .woocommerce #content .quantity .plus, .woocommerce-page .quantity .plus, .woocommerce-page #content .quantity .plus{
    border-radius: 0;
   line-height: 16px;
    width: 59px;
    height: 55px;
    font-size: 24px;
}

.woocommerce-accordion.q_accordion_holder.accordion.boxed .ui-accordion-header{
    background-color: #FFFFFF;
    border: 1px solid #C89200;
    font-family: Poppins;
    font-size: 13px;
    padding-top: 8px;
    color: #C89200;
}
.woocommerce-accordion.q_accordion_holder.accordion.boxed .ui-accordion-header.ui-state-hover{
    background-color: #FF6F61;
    border: 1px solid #FF6F61;
    font-family: Poppins;
    font-size: 13px;
    padding-top: 8px;
    color: #FF6F61;
}
/* Stijl voor de titel 'Mijn Sprankellijst' */
.qwfw-m-heading,
.qwfw-m-section-heading {
    font-family: 'Libre Baskerville', serif !important;
    font-weight: 600 !important;       /* semibold */
    color: #FF6F61 !important;         /* koraal */
    font-size: 28px !important;        /* groter als H2 */
    line-height: 1.3em !important;     /* prettige leesafstand */
    margin-bottom: 1em;                /* wat extra ruimte eronder */
}

/* --- Knopstijl voor 'Verder met bestellen' in winkelwagen --- */
.wc-block-components-button.wc-block-cart__submit-button {
    display: inline-block;
    background-color: #C89200;       /* Goud als basis */
    color: #ffffff !important;       /* Witte tekst */
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;
    padding: 12px 28px;
    border: none;
    border-radius: 0;                 /* rechte hoeken */
    text-align: center;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover-effect: koraal */
.wc-block-components-button.wc-block-cart__submit-button:hover {
    background-color: #FF6F61;        /* Koraal bij hover */
    color: #ffffff !important;
}

/* Tekst binnenin de knop goed centreren */
.wc-block-components-button__text {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

/* --- Knopstijl voor 'Plaats bestelling' op de afrekenpagina --- */
.wc-block-components-button.wc-block-components-checkout-place-order-button {
    display: inline-block;
    background-color: #C89200;        /* Goud */
    color: #ffffff !important;        /* Witte tekst */
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;
    padding: 12px 28px;
    border: none;
    border-radius: 0;                  /* Rechte hoeken */
    text-align: center;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover-effect: koraal */
.wc-block-components-button.wc-block-components-checkout-place-order-button:hover {
    background-color: #FF6F61;         /* Koraal bij hover */
    color: #ffffff !important;
}

/* Tekst binnen de knop */
.wc-block-components-checkout-place-order-button__text {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

/* --- Shopping Cart Dropdown Sprankel-stijl --- */

/* Achtergrondkleur dropdown */
.shopping_cart_dropdown,
.shopping_cart_dropdown_inner {
    background-color: #F2C9D6 !important;      /* Lichtroze */
    border: none;
}

/* Tekstkleur voor producten en prijzen */
.shopping_cart_dropdown .product_list_widget li a,
.shopping_cart_dropdown .product_list_widget li span,
.shopping_cart_dropdown span.total,
.shopping_cart_dropdown .amount,
.shopping_cart_dropdown .quantity {
    color: #000000 !important;                 /* Zwart voor leesbaarheid */
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
}

/* 'Totaal'-tekst iets prominenter */
.shopping_cart_dropdown span.total {
    font-weight: 600;
    font-size: 15px;
}

/* Verwijderknop (het kruisje) subtieler maken */
.shopping_cart_dropdown .remove_from_cart_button {
    color: #FF6F61 !important;                 /* Koraal kruisje */
    font-size: 18px;
}
.shopping_cart_dropdown .remove_from_cart_button:hover {
    color: #C89200 !important;                 /* Goud bij hover */
}

/* Fix voor euroteken in totaalprijs */
.shopping_cart_dropdown span.total .woocommerce-Price-currencySymbol {
    color: #000000 !important;      /* Zwart euroteken */
}

/* ==== Verberg thumbnails in shopping cart dropdown (robust) ==== */

/* Verberg alle images / picture / noscript thumbnails */
.shopping_cart_dropdown .product_list_widget img,
.shopping_cart_dropdown .product_list_widget picture,
.shopping_cart_dropdown .product_list_widget source,
.shopping_cart_dropdown .product_list_widget .woocommerce-placeholder,
.shopping_cart_dropdown .product_list_widget .wp-post-image,
.shopping_cart_dropdown .product_list_widget .product-thumbnail,
.shopping_cart_dropdown .product_list_widget .thumb {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

/* Zorg dat eventuele background-images of pseudo-elementen ook verdwijnen */
.shopping_cart_dropdown .product_list_widget li,
.shopping_cart_dropdown .product_list_widget li a,
.shopping_cart_dropdown .product_list_widget li .thumb,
.shopping_cart_dropdown .product_list_widget li::before,
.shopping_cart_dropdown .product_list_widget li a::before,
.shopping_cart_dropdown .product_list_widget li .thumb::before {
    background: transparent !important;
    background-image: none !important;
    content: none !important;
}

/* Ruim tekst en prijzen op zodat niets overlapt */
.shopping_cart_dropdown .product_list_widget li {
    padding-left: 0.4rem !important;
    padding-right: 0.4rem !important;
    min-height: 1.8em !important;
    overflow: visible !important;
}

/* Zorg dat producttekst boven eventuele vlakjes staat */
.shopping_cart_dropdown .product_list_widget li a,
.shopping_cart_dropdown .product_list_widget li span,
.shopping_cart_dropdown .product_list_widget li .quantity {
    position: relative;
    z-index: 2 !important;
}

/* Als het thema een specifieke wrapper gebruikt (extra veilig) */
.shopping_cart_dropdown .cart_list.product_list_widget .product-thumbnail,
.shopping_cart_dropdown .cart_list.product_list_widget .thumb {
    display: none !important;
}

/* Optioneel: als je wél thumbnails wilt behouden, commentaarregel hierboven uit en gebruik dit i.p.v. verbergen:
.shopping_cart_dropdown .product_list_widget img { width:40px;height:40px;object-fit:cover;margin-right:10px;float:left; }
*/

/* Herstel layout van link/knop en totaal */
.shopping_cart_dropdown .qbutton.white.view-cart,
.shopping_cart_dropdown .total {
    z-index: 3 !important;
}

/* ==== Layout-fix voor totaal en Winkelwagentje-knop ==== */

/* Zorg dat de totaalprijs bovenaan staat met wat ruimte */
.shopping_cart_dropdown .total {
    display: block;
    position: relative;
    margin-top: 0.5rem !important;
    margin-bottom: 1.2rem !important;   /* ruimte boven de knop */
    z-index: 2 !important;
}

/* Plaats de Winkelwagentje-knop eronder en uitgelijnd */
.shopping_cart_dropdown .qbutton.white.view-cart {
    display: inline-block;
    position: relative;
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
    z-index: 3 !important;
}

/* Zorg dat de container zelf genoeg hoogte heeft en geen overlapping forceert */
.shopping_cart_dropdown {
    padding-bottom: 1rem !important;
}

/* ==== Layout-fix voor totaal en Winkelwagentje-knop ==== */

/* Totaalregel met ruimte en lijn eronder */
.shopping_cart_dropdown .total {
    display: block;
    position: relative;
    margin-top: 0.5rem !important;
    margin-bottom: 1.2rem !important;   /* ruimte boven de knop */
    padding-bottom: 0.6rem !important;   /* ruimte voor de scheidingslijn */
    border-bottom: 1px solid rgba(0, 0, 0, 0.15); /* subtiele scheiding */
    z-index: 2 !important;
}

/* Knop onder de totaalregel */
.shopping_cart_dropdown .qbutton.white.view-cart {
    display: inline-block;
    position: relative;
    margin-top: 0.8rem !important;
    margin-bottom: 0.5rem !important;
    z-index: 3 !important;
}

/* Extra ruimte onderaan de dropdown */
.shopping_cart_dropdown {
    padding-bottom: 1rem !important;
}

/* --- Topmenu winkelmand icoon en teller --- */

/* Icoon zelf zwart maken */
.header_cart.cart_icon::before,
.cart_icon::before {
    color: #000000 !important;        /* Zwart icoon */
}

/* Teller-bolletje zwart met witte tekst */
.header_cart_span {
    background-color: #000000 !important;   /* Zwart bolletje */
    color: #ffffff !important;              /* Witte cijfers */
    font-family: 'Poppins', sans-serif;
    font-size: 10px;
    font-weight: 600;
    border-radius: 50%;                     /* Rond bolletje */
    padding: 1px 1px;
    line-height: 1.4;
}

/* Verwijder slagschaduw bij ALLE afbeeldingen */
img {
    box-shadow: none !important;
}

/* Pastel schaduw voor afbeeldingen met class .sprankel-shadow */
img.sprankel-shadow {
    box-shadow: 0 6px 18px rgba(242, 201, 214, 0.4);  /* zacht lichtroze */
    border-radius: 6px; /* zachte afgeronde hoeken, optioneel */
    transition: box-shadow 0.3s ease; /* subtiele overgang bij hover */
}

/* Extra diepte als je erover hovert */
img.sprankel-shadow:hover {
    box-shadow: 0 8px 22px rgba(242, 201, 214, 0.55);
}

/* ===========================
   Sprankel Zeep — CF7 fixes
   Lost: afstand label/veld, labelkleur en schaduwen
   =========================== */

/* forceer zwarte labels + meer ruimte onder label */
.wpcf7-form label,
.wpcf7-form p label,
.wpcf7-form .wpcf7-form-control-wrap label,
.wpcf7-form .wpcf7-form-control-wrap .wpcf7-form-control-placeholder {
    display: block !important;
    color: #000000 !important;        /* zwart */
    margin-bottom: 10px !important;   /* meer ruimte tussen label en veld */
    line-height: 1.3 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 15px !important;
}

/* Zorg dat velden niet “opgeplakt” zijn: geef velden een lichte top-marge */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form textarea,
.wpcf7-form select,
.wpcf7-form .wpcf7-form-control,
.wpcf7-form .wpcf7-form-control-wrap input,
.wpcf7-form .wpcf7-form-control-wrap textarea,
.wpcf7-form .wpcf7-form-control-wrap select {
    margin-top: 4px !important;       /* voorkomt plakken met bovenliggend element */
}

/* verwijder alle schaduwen en forceer nette borders */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form textarea,
.wpcf7-form select,
.wpcf7-form .wpcf7-form-control,
.wpcf7-form .wpcf7-form-control-wrap input,
.wpcf7-form .wpcf7-form-control-wrap textarea,
.wpcf7-form .wpcf7-form-control-wrap select {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    outline: none !important;
    background: #ffffff !important;
    border: 1px solid #B7AFA6 !important;
    border-radius: 4px !important;
}

/* focus-stijl (a11y) zonder harde schaduw, subtiele gouden rand */
.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,
.wpcf7-form input[type="number"]:focus,
.wpcf7-form textarea:focus,
.wpcf7-form select:focus {
    box-shadow: none !important;
    border-color: #C89200 !important;       /* goud bij focus */
    background-color: #fff !important;
}

/* Als thema nog steeds een wrapper met schaduw gebruikt, verwijder die ook */
.wpcf7-form .qodef-field-holder,
.wpcf7-form .form-field,
.wpcf7-form .field,
.wpcf7-form .cf7-form-control,
.wpcf7-form .input-holder {
    box-shadow: none !important;
    background: transparent !important;
}

/* Specifieke fix voor placeholders/labels die als kleine grijze tekst verschijnen */
.wpcf7-form ::placeholder {
    color: #B7AFA6 !important; /* placeholder mag lichtgrijs blijven */
}

/* Zorg dat label niet overlapt bij compactere thema-layouts */
.wpcf7-form p,
.wpcf7-form .form-row {
    margin-bottom: 18px !important;
}

/* =========================================
   SPRANKEL – Contact Form 7 meldingen
   Overschrijf Bridge-styling
   ========================================= */

/* Algemene stijl voor alle meldingen */
.wpcf7 form .wpcf7-response-output,
div.wpcf7-response-output {
    position: relative !important;          /* behoud ruimte voor icoon links */
    padding: 17px 30px 17px 55px !important;/* laat ruimte voor duim-icoon */
    font-size: 15px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    line-height: 1.6 !important;
    border: none !important;
    border-radius: 6px !important;
    color: #000 !important;                 /* zwarte tekst */
    background: #F2C9D6 !important;         /* zachtroze standaard */
    z-index: 2 !important;
}

/* SUCCES: verzonden */
.wpcf7 form.sent .wpcf7-response-output,
div.wpcf7-response-output.wpcf7-mail-sent-ok {
    background: #F2C9D6 !important;         /* zachtroze */
    border-left: 4px solid #C89200 !important; /* goud accent */
    color: #000 !important;
}

/* FOUT / VALIDATIE */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
div.wpcf7-response-output.wpcf7-validation-errors {
    background: #FFF0F2 !important;         /* lichtroze voor fouten */
    border-left: 4px solid #FF6F61 !important; /* koraal accent */
    color: #FF6F61 !important;
}

/* Zet tekst NIET over het duimpje – duimpje blijft links staan */
.wpcf7 form .wpcf7-response-output:before {
    position: absolute;
    left: 20px;
}

/* Meerdere regels netjes onder elkaar */
.wpcf7 .wpcf7-response-output p,
.wpcf7 .wpcf7-response-output br {
    display: block !important;
    margin: 0 0 0.4em !important;
    line-height: 1.6 !important;
    white-space: normal !important;
    word-wrap: break-word !important;
}

/* Eventuele inline tips onder velden */
.wpcf7-not-valid-tip {
    display: block !important;
    background: transparent !important;
    color: #FF6F61 !important;
    margin-top: 6px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
}


/* =====================================================
   ACCORDEON / TABS PRODUCTPAGINA
   ===================================================== */
.woocommerce div.product .woocommerce-tabs ul.tabs,
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    background:none!important;
    border:none!important;
    box-shadow:none!important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    border-bottom:1px solid #E0E0E0;
    padding-left:0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    border-bottom:1px solid #E0E0E0;
    padding:10px 0;
    font-family:'Poppins',sans-serif;
    font-weight:500;
    text-transform:none!important;
    color:#000!important;
    display:flex;
    justify-content:space-between;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color:#C89200!important;
    border-bottom:2px solid #C89200!important;
}
.woocommerce-Tabs-panel {
    border-top:1px solid #E0E0E0;
    padding-top:15px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a::after {
    content:"+";
    font-weight:bold;
    color:#C89200;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a::after {
    content:"–";
    color:#C89200;
}

/* ================================================
   SPRANKEL – Productknop + Link styling (fix dubbel)
   ================================================ */

/* Knop styling blijft hetzelfde */
.sprankel-product-buttons .qbutton {
    background-color: #C89200 !important; /* goud */
    color: #fff !important;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    padding: 10px 24px;
    border-radius: 4px;
    display: inline-block;
    border: none;
    cursor: pointer;
    transition: all 0.25s ease;
}
.sprankel-product-buttons .qbutton:hover {
    background-color: #FF6F61 !important; /* koraal */
    color: #fff !important;
}

/* ❗ Verberg WooCommerce's automatische 'added_to_cart' link */
.sprankel-product-buttons .added_to_cart {
    display: none !important;
}

/* Link onder de knop ('Bekijk winkelmandje') */
.link-winkelwagen {
    display: block;
    margin-top: 14px; /* ruimte tussen knop en link */
    text-align: center;
    font-family: 'Poppins', sans-serif;
    font-size: 11px; /* iets kleiner, gelijk aan knop-font */
    color: #000;
    text-decoration: underline;
    transition: color 0.3s ease;
}
.link-winkelwagen:hover {
    color: #FF6F61;
}

/* 📱 Mobiel iets compacter */
@media (max-width: 768px) {
    .sprankel-product-buttons .qbutton {
        padding: 8px 18px;
        font-size: 13px;
    }
    .link-winkelwagen {
        font-size: 11px;
        margin-top: 12px;
    }
}

.product-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  background-color: #C89200; /* goud */
  color: white;
  font-size: 11px;
  padding: 4px 10px;
  border-radius: 20px;
  font-family: 'Poppins', sans-serif;
}

/* =====================================================
   SPRANKEL – Search Form 2 styling (eindversie)
   - lost vaststaand vergrootglas op (zichtbaar alleen bij open)
   - nette positionering, responsive fixes, geen schaduw
   ===================================================== */

/* ===== Container ===== */
.qode_search_form_2 .form_holder {
    background-color: #fff8f7 !important; /* zacht roze-beige */
    box-shadow: none !important;
    border: none !important;
    padding: 25px 0 35px !important;
    position: relative !important;
    text-align: center !important;
}

/* ===== Zoekveld ===== */
.qode_search_form_2 .form_holder .qode_search_field {
    width: 80% !important;
    max-width: 600px !important;
    margin: 0 auto !important;
    display: inline-block !important;
    padding: 12px 48px 12px 18px !important; /* ruimte rechts voor icoon */
    border: 1px solid #b7afa6 !important;
    border-radius: 6px !important;
    background-color: #ffffff !important;
    color: #000 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 15px !important;
    letter-spacing: 0.3px !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    outline: none !important;
}

/* Placeholder */
.qode_search_form_2 .form_holder .qode_search_field::placeholder {
    color: #b7afa6 !important;
    opacity: 0.9 !important;
}

/* ===== Focus – veld blijft stabiel ===== */
.qode_search_form_2 .form_holder .qode_search_field:focus {
    border-color: #C89200 !important;
    background-color: #ffffff !important;
    box-shadow: none !important;
    border-radius: 6px !important;
}

/* ===== Zoekicoon ín het veld ( standaard VERBORGEN ) =====
   - het interne icoon verschijnt alleen als de zoekbalk daadwerkelijk geopend is
   - we benutten class selectors die Qode gebruikt bij openen:
     .qode_search_form_2.opened (en ook een paar andere veilige varianten)
*/
.qode_search_form_2 .form_holder .qode_search_submit {
    display: none !important;               /* standaard verbergen */
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: 10% !important;                  /* nette uitlijning t.o.v. centered veld */
    color: #C89200 !important;              /* goudkleurig icoon */
    font-size: 18px !important;
    line-height: 1 !important;
    transition: color 0.3s ease !important;
    z-index: 50 !important;                 /* boven content, niet achter menu */
}

/* Toon intern icoon wanneer zoekbalk geopend is.
   Qode gebruikt soms 'opened', soms 'active' of 'qodef-search-open' - we vangen de meest gebruikte varianten */
.qode_search_form_2.opened  .form_holder .qode_search_submit,
.qode_search_form_2.active  .form_holder .qode_search_submit,
.qode_search_form_2.qodef-search-open .form_holder .qode_search_submit {
    display: block !important;
}

/* Hover kleur intern icoon */
.qode_search_form_2 .form_holder .qode_search_submit:hover {
    color: #FF6F61 !important; /* koraal bij hover */
}

/* ===== Sluiticoon (X) ===== */
.qode_search_close {
    color: #C89200 !important;
    font-size: 18px !important;
    top: 25px !important;
    right: 25px !important;
    transition: color 0.3s ease !important;
}

.qode_search_close:hover {
    color: #FF6F61 !important;
}

/* ===== Resultaten overzichtelijk ===== */
.qode_search_page_holder article {
    border-bottom: 1px solid #eaeaea !important;
    margin-bottom: 25px !important;
    padding-bottom: 20px !important;
}

.qode_search_page_holder article .post_info {
    display: none !important; /* verberg meta info zoals auteur/likes */
}

.qode_search_page_holder article .post_text_inner h4 a {
    font-family: 'Libre Baskerville', serif !important;
    color: #000 !important;
    transition: color 0.3s ease !important;
}

.qode_search_page_holder article .post_text_inner h4 a:hover {
    color: #FF6F61 !important;
}

/* kleinere thumbnails in resultaatlijst */
.qode_search_page_holder .post_image img {
    max-width: 120px !important;
    border-radius: 6px !important;
    display: none !important; /* verberg miniatuur (optioneel) */
}

/* toon wel thumbnail voor specifieke wensen: verwijder display:none !important hierboven */

/* ===== Mobiel ===== */
@media (max-width: 767px) {
    .qode_search_form_2 .form_holder .qode_search_field {
        width: 90% !important;
        font-size: 14px !important;
        padding-right: 44px !important;
    }
    .qode_search_form_2 .form_holder .qode_search_submit {
        right: 8% !important;
        font-size: 16px !important;
    }

    /* Zorg dat overlay/knoppen niet buiten kaart vallen op mobiel */
    .qode_search_page_holder article {
        padding-bottom: 16px !important;
        margin-bottom: 18px !important;
    }
}


/* =====================================================
   SPRANKEL – Zoekresultaten (lichte variant)
   ===================================================== */

/* Datum verbergen */
.search-results .post_date {
  display: none !important;
}

/* Grote afbeelding verbergen */
.search-results .post_image,
.search-results .post_image img {
  display: none !important;
}

/* Samenvatting korter maken */
.search-results .post_text_inner p {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important; /* Toon slechts 2 regels tekst */
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ==========================
   SPRANKEL — Composite Product styling (rechte hoeken + goud)
   ========================== */

/* Kaartblok: rechte hoeken, gouden rand */
.wooco_component_product_selection_list_item {
  border: 1px solid #C89200 !important;      /* goud */
  border-radius: 0 !important;               /* rechte hoeken */
  background: #fff !important;
  transition: border-color .2s ease, box-shadow .2s ease;
  box-shadow: none !important;
}

/* Hover: koraalaccent */
.wooco_component_product_selection_list_item:hover {
  border-color: #FF6F61 !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

/* =============== Keuzecirkel vervangen door custom =============== */
.wooco_component_product_selection_list_item_choose span {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 2px solid #C89200 !important;   /* goud */
  background: #fff !important;
  border-radius: 50% !important;
  box-sizing: border-box;
  margin: 6px;
  transition: all .2s ease;
}

/* Verwijder eventuele groene standaard-checkbox of achtergrond */
.wooco_component_product_selection_list_item_choose input,
.wooco_component_product_selection_list_item_choose span::before {
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* Geselecteerd: gouden cirkel met wit puntje */
.wooco_component_product_selection_list_item.wooco_item_selected .wooco_component_product_selection_list_item_choose span {
  background: #C89200 !important;
  border-color: #C89200 !important;
}

/* Wit puntje binnenin */
.wooco_component_product_selection_list_item.wooco_item_selected .wooco_component_product_selection_list_item_choose span::after {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
}

/* Hover op cirkel: rand koraal */
.wooco_component_product_selection_list_item_choose span:hover {
  border-color: #FF6F61 !important;
}

/* =============== Tekst & overige details =============== */
.wooco_component_product_selection_list_item_info,
.wooco_component_product_selection_list_item_name,
.wooco_component_product_selection_list_item_desc {
  font-family: 'Poppins', sans-serif;
  color: #000;
}

.wooco_component_product_selection_list_item_desc .stock {
  color: #7a7a7a;
  font-size: 13px;
}

/* Geselecteerd product: titel iets sterker */
.wooco_component_product_selection_list_item.wooco_item_selected .wooco_component_product_selection_list_item_name {
  font-weight: 600;
  color: #000;
}

/* Responsief kleiner rondje op mobiel */
@media (max-width: 767px) {
  .wooco_component_product_selection_list_item_choose span {
    width: 18px;
    height: 18px;
    border-width: 1.8px;
    margin: 5px;
  }
  .wooco_component_product_selection_list_item.wooco_item_selected .wooco_component_product_selection_list_item_choose span::after {
    top: 4px;
    left: 4px;
    width: 6px;
    height: 6px;
  }
}

/* ===== WooCommerce 'Nieuw in de winkel' knoppen voor fix lege winkelwagen ===== */
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wp-block-button.wc-block-grid__product-add-to-cart a {
    background-color: #C89200 !important; /* goud */
    color: #ffffff !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0.5px !important;
    padding: 10px 20px !important;
    border-radius: 4px !important;
    border: none !important;
    text-transform: uppercase !important;
    transition: background-color 0.3s ease, color 0.3s ease !important;
}

/* Hover – Sprankel koraal */
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wp-block-button.wc-block-grid__product-add-to-cart a:hover {
    background-color: #FF6F61 !important; /* koraal */
    color: #fff !important;
}

/* Optioneel: nette uitlijning en ruimte */
.wc-block-grid__product-add-to-cart {
    text-align: center !important;
    margin-top: 12px !important;
}

/* ===== Sprankelstijl tabs op productpagina (versie 2) ===== */

/* Breder maken van het tabgedeelte */
.q_tabs.horizontal.center {
  border-top: 1px solid #e6e2dd;
  border-bottom: none; /* onderste lijn weg */
  margin-top: 50px;
  padding-top: 20px;
  max-width: 1100px; /* volledige breedte */
  margin-left: auto;
  margin-right: auto;
}

/* Navigatiebalk met tabtitels */
.q_tabs.horizontal.center .tabs-nav {
  display: flex;
  justify-content: flex-start;
  border-bottom: 2px solid #e6e2dd;
  list-style: none;
  padding: 0;
  margin: 0 0 25px;
  flex-wrap: wrap;
}

/* Individuele tabtitels */
.q_tabs.horizontal.center .tabs-nav li {
  margin-right: 25px;
  padding: 10px 0;
  border-bottom: 2px solid transparent;
  transition: all 0.25s ease;
}

.q_tabs.horizontal.center .tabs-nav li a {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 500;
  color: #000;
  text-decoration: none;
  letter-spacing: 0.2px;
}

/* Hover en actieve tab */
.q_tabs.horizontal.center .tabs-nav li:hover,
.q_tabs.horizontal.center .tabs-nav li.active {
  border-color: #c89200; /* goud accent */
}

.q_tabs.horizontal.center .tabs-nav li:hover a,
.q_tabs.horizontal.center .tabs-nav li.active a {
  color: #c89200;
}

/* Tab-inhoud */
.q_tabs.horizontal.center .tabs-container {
  padding-top: 10px;
  max-width: 100%; /* laat tekstblok meeschalen met volledige breedte */
}

/* Tekstopmaak in tab-inhoud */
.q_tabs.horizontal.center .tabs-container .tab-content {
  text-align: left;
  font-family: "Poppins", sans-serif;
  font-size: 15px;
  color: #4b4b4b;
  line-height: 1.7;
}

/* H4 en sterke titels volgens Sprankelstijl */
.q_tabs.horizontal.center .tabs-container h4 {
  font-family: "Libre Baskerville", serif !important;
  color: #ff6f61 !important; /* koraalkleur */
  font-size: 20px;
  margin-top: 25px;
  margin-bottom: 10px;
}

.q_tabs.horizontal.center .tabs-container strong {
  color: #000;
}

/* Onderste lijntje verwijderen (onder het tabblok) */
.q_tabs.horizontal.center + .product_meta {
  border-top: none !important;
}

/* Optioneel: zachte fade animatie bij tabwissel */
.q_tabs.horizontal.center .tab-content {
  animation: fadeIn 0.4s ease;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Doorbreek Bridge-container voor producttabs */
.single-product .q_tabs.horizontal.center {
  width: 100vw; /* neem volledige schermbreedte */
  max-width: none !important;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  padding-left: calc((100vw - 1100px)/2);
  padding-right: calc((100vw - 1100px)/2);
  box-sizing: border-box;
}

/* Optioneel: lichte achtergrond om het visueel los te maken van de productinformatie */
.single-product .q_tabs.horizontal.center {
  background-color: #fffefc; /* zachte warme tint */
}

/* ==== Sprankel Zeep productpagina – kolombreedte-aanpassing ==== */

/* Forceer de productafbeeldingen en productinformatie op 50/50 verhouding */
.qode-product-with-gallery .woocommerce-product-gallery {
  width: 50% !important;
  float: left !important;
  margin-right: 2% !important;
}

.qode-product-with-gallery .summary.entry-summary {
  width: 48% !important;
  float: right !important;
  margin: 0 !important;
}

/* Zorg dat alles onder de productinformatie netjes naar beneden schuift */
.qode-product-with-gallery::after {
  content: "";
  display: block;
  clear: both;
}

/* Mobiel: weer volledig onder elkaar */
@media screen and (max-width: 768px) {
  .qode-product-with-gallery .woocommerce-product-gallery,
  .qode-product-with-gallery .summary.entry-summary {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
  }
}

/* Extra ruimte onder de productinformatie */
.qode-product-with-gallery .summary.entry-summary {
  margin-bottom: 30px !important;
}

/* === Sprankel Zeep: linkkleuren in product_meta netjes afgestemd op huisstijl === */
/* Super-forcering — voor als thema/inline-styles erg dominant zijn */
.single-product .product_meta a:hover,
.single-product .product_meta a:focus,
.single-product .product_meta a:active,
.single-product .product_meta a:visited,
.single-product .product_meta a {
  color: #000000 !important;
  text-shadow: none !important;
  -webkit-text-fill-color: #000000 !important; /* Safari workaround */
  mix-blend-mode: normal !important; /* voorkomt rare blend effecten */
}

/* === Sprankel: extra padding voor tab-inhoud op mobiel === */
@media screen and (max-width: 768px) {
  .single-product .tab-content,
  .single-product .tabs-container .tab-content {
    box-sizing: border-box;
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}

/* === Sprankel-stijl voor cross-sell / cart cross-sells knoppen (Woo Gutenberg / WC blocks (net afgeronde hoeken) === */

.wp-block-button.wc-block-components-product-button .wp-block-button__link,
.wp-block-button.wc-block-components-product-button button.wp-block-button__link,
.wp-block-button.wc-block-components-product-button .add_to_cart_button,
.wp-block-button.wc-block-components-product-button .wp-element-button,
.wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button,
.wp-block-cart-cross-sells-product__product-add-to-cart .wp-block-button__link,
.wp-block-cart-cross-sells-product__product-add-to-cart button.wp-block-button__link {
  background-color: #C89200 !important;   /* goud (normaal) */
  color: #ffffff !important;
  border: none !important;
  border-radius: 6px !important;          /* subtiel afgerond */
  padding: 10px 22px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  display: inline-block !important;
  min-width: 140px !important;
  text-align: center !important;
  box-shadow: none !important;
  transition: transform .18s ease, background-color .18s ease, color .18s ease !important;
}

/* hover / focus — koraal en witte tekst */
.wp-block-button.wc-block-components-product-button .wp-block-button__link:hover,
.wp-block-button.wc-block-components-product-button button.wp-block-button__link:hover,
.wp-block-button.wc-block-components-product-button .add_to_cart_button:hover,
.wp-block-button.wc-block-components-product-button .wp-element-button:hover,
.wp-block-button.wc-block-components-product-button .wc-block-components-product-button__button:hover,
.wp-block-cart-cross-sells-product__product-add-to-cart .wp-block-button__link:hover,
.wp-block-cart-cross-sells-product__product-add-to-cart button.wp-block-button__link:hover,
.wp-block-button.wc-block-components-product-button .wp-block-button__link:focus,
.wp-block-button.wc-block-components-product-button button.wp-block-button__link:focus {
  background-color: #FF6F61 !important;   /* koraal bij hover */
  color: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.08) !important;
}

/* focus-visible (toegankelijkheid toetsenbord) */
.wp-block-button.wc-block-components-product-button .wp-block-button__link:focus-visible,
.wp-block-button.wc-block-components-product-button button.wp-block-button__link:focus-visible {
  outline: 3px solid rgba(200,146,0,0.12) !important;
  outline-offset: 3px !important;
}

/* reset voor Gutenberg outlines */
.wp-block-button__link.wp-element-button,
.wp-block-button__link.add_to_cart_button {
  -webkit-appearance: none !important;
  appearance: none !important;
}

/* === Sprankel Zeep - uniforme afgeronde hoeken voor alle knoppen === */
button,
input[type="button"],
input[type="submit"],
.qbutton,
.qode-btn,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce-page button.button,
.woocommerce-page a.button,
.woocommerce-page input.button,
.wp-block-button__link,
.wp-element-button,
.elementor-button,
.elementor-button-link,
.elementor-button.elementor-size-sm,
.elementor-button.elementor-size-md,
.elementor-button.elementor-size-lg 
.add_to_cart_button,
.wp-block-button.wp-block-button__link,
.wpcf7-submit,
.wpcf7-form input[type="submit"] {
  border-radius: 6px !important; /* overal zachte afgeronde hoeken */
  -webkit-border-radius: 6px !important;
  -moz-border-radius: 6px !important;
  overflow: hidden;
  transition: all 0.2s ease-in-out;
}

/* optioneel: subtiele hover-‘sprankel’ */
.elementor-button:hover,
.qbutton:hover,
.woocommerce a.button:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

/* === Sprankel Zeep — uniforme WooCommerce functionele knoppen (zonder Add-to-Cart) === */
/* Herstelt line-height en padding zodat tekst niet wordt afgeknipt in My Account e.d.,
   maar laat de winkelmand-knoppen met hun eigen styling intact. */

.woocommerce button.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce-page button.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce a.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce input.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce-page input.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce form .form-row input.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce form .form-row button.button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce-address-fields button.button,
.woocommerce-MyAccount-content button.button,
.woocommerce-MyAccount-content input.button {
  line-height: 1.4em !important;
  padding: 0.6em 1.2em !important;
  min-height: 40px !important;
  box-sizing: border-box !important;
  border-radius: 6px !important;
  vertical-align: middle !important;
}

/* Sommige Bridge-elementen forceren inline-block + kleine hoogte */
.woocommerce .button:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce-page .button:not(.single_add_to_cart_button):not(.add_to_cart_button) {
  display: inline-block !important;
  height: auto !important;
}

/* Voor input[type=submit] in formulieren zoals adres opslaan */
.woocommerce form button[type="submit"]:not(.single_add_to_cart_button):not(.add_to_cart_button),
.woocommerce form input[type="submit"]:not(.single_add_to_cart_button):not(.add_to_cart_button) {
  line-height: 1.4em !important;
  padding: 0.6em 1.2em !important;
}

/* === Sprankel Zeep – Wishlist tabel mobiel responsive === */
@media (max-width: 768px) {
  /* Zorg dat de tabel in een scrollbare container staat */
  .qwfw-wishlist-table,
  .woocommerce table.shop_table.wishlist_table,
  table.wishlist_table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; /* soepel scrollen op iPhone/iPad */
    border-collapse: separate; /* voorkomt rare overlap bij scroll */
  }

  /* Voorkom dat cellen zich samenpersen */
  .wishlist_table table,
  .wishlist_table tbody,
  .wishlist_table tr,
  .wishlist_table th,
  .wishlist_table td {
    white-space: nowrap;
  }

  /* Eventueel wat spacing zodat de scrollbar niet tegen tekst aanzit */
  .wishlist_table {
    padding-bottom: 8px;
  }
}

/* === Sprankel Zeep – Subtiele visuele hint bij horizontaal scrollen === */
@media (max-width: 768px) {
  .wishlist_table {
    position: relative;
  }

  /* Zachte fade aan rechterkant */
  .wishlist_table::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(to left, rgba(255, 246, 246, 1), rgba(255, 246, 246, 0)); 
    /* zelfde zachtroze als tabs (#fff6f6), transparant naar binnen toe */
  }

  /* Laat fade verdwijnen zodra gebruiker helemaal naar rechts scrollt */
  .wishlist_table:has(table)::-webkit-scrollbar {
    display: none; /* verberg scrollbar op mobiel */
  }
}

/* Sprankel: kleinere koraalkleurige kop voor cross-sell / cart blocks */
.wc-block-cart .wp-block-heading,
.wc-block-cart .wp-block-heading.has-large-font-size,
.wp-block-woocommerce-cart .wp-block-heading,
.woocommerce-cart .wp-block-heading,
.wp-block-heading.has-large-font-size {
  color: #ff6f61 !important;          /* koraal */
  font-size: 1.2rem !important;      /* ~15px, kleiner */
  line-height: 1.25 !important;
  font-family: 'Libre Baskerville', serif !important; /* past bij Sprankel */
  font-weight: 600 !important;
  margin: 14px 0 10px !important;
}

/* Zorg dat ook H2/H4 inside het block klein worden (als editor tag gekozen) */
.wc-block-cart .wp-block-heading h2,
.wc-block-cart .wp-block-heading h4,
.wp-block-woocommerce-cart .wp-block-heading h2,
.wp-block-woocommerce-cart .wp-block-heading h4 {
  font-size: 1.2rem !important;
  margin: 0 !important;
}

/* Mobiel iets ruimer en iets groter voor leesbaarheid */
@media (max-width: 767px) {
  .wc-block-cart .wp-block-heading,
  .wp-block-woocommerce-cart .wp-block-heading {
    font-size: 1,2rem !important;
    margin-top: 12px !important;
    margin-bottom: 10px !important;
  }
}

/* Welkomstbox Mijn account pagina aangepaste layout icm snippet */

.sprankel-account-welcome h2 {
    font-size: 24px;
    margin: 0 0 10px;
    font-weight: 600;
    color: #c89200;
}

.sprankel-account-welcome p {
    font-size: 16px;
    color: #000000;
}

.sprankel-sub {
    margin-top: 14px;
    font-weight: 600;
    color: #ff6f61;
}

/* Opsommingslijst */
.sprankel-account-actions {
    list-style: none;
    padding: 0;
    margin: 14px 0 0;
}

.sprankel-account-actions li {
    margin: 6px 0;
}

.sprankel-account-actions li a {
    color: #c89200;
    text-decoration: underline;
    font-size: 15px;
}

.sprankel-account-actions li a:hover {
    color: #ff6f61;
}

/* Verberg WooCommerce standaard welkomsttekst op Mijn Account */
.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type {
    display: none;
}
/* Verberg de standaard WooCommerce dashboard-teksten */
.woocommerce-account .woocommerce-MyAccount-content > p:first-of-type,
.woocommerce-account .woocommerce-MyAccount-content > p:nth-of-type(2) {
    display: none !important;
}

/* Stijl van de tekst in de WP Front Notification Bar */
#wpfront-notification-bar {
    color: #ffffff !important;     /* witte tekst */
    font-size: 14px !important;    /* kleinere tekst */
    font-weight: 500;              /* iets duidelijker */
}

/* Tekstkleur in notificatiebalk forceren */
#wpfront-notification-bar,
#wpfront-notification-bar * {
    color: #ffffff !important;
}

/* ============================================
   0. FIXES WINKELMANDJE PAGINA
   ============================================ */

/* Foto weer klein */
.wc-block-cart-item__image img {
  width: 70px !important;
  height: 70px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

/* Omschrijving volledig verbergen */
.wc-block-components-product-metadata {
  display: none !important;
}

/* Titel: links, zwart, geen centering */
.wc-block-components-product-name {
  font-size: 15px !important;
  font-weight: 600 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #000 !important;
  text-align: left !important;
  display: inline-block !important;
}

/* Houd productnaam en prijs netjes bij elkaar */
.wc-block-cart-item__wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

/* ============================================
   1. PRIJS & BADGES
   ============================================ */

.wc-block-cart-item__prices {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 14px !important;
  display: inline-block !important;
}

/* Badge mooi en compact */
.wc-block-components-product-low-stock-badge,
.wc-block-components-product-out-of-stock-badge,
.wc-block-components-product-in-stock-badge {
  background: #ff6f61 !important;
  color: #fff !important;
  font-size: 11px !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  width: fit-content !important;
  display: inline-block !important;
}

/* voorkom uitrekken bij lange tekst */
.wc-block-cart-item__wrap > .wc-block-components-product-badge {
  max-width: fit-content !important;
}


/* ============================================
   2. QUANTITY + VERWIJDERKNOP
   ============================================ */

.wc-block-cart-item__quantity {
  margin: 0 !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
}

/* perfect uitgelijnde + en - knoppen */
.wc-block-components-quantity-selector__button {
  background: #ff6f61 !important;
  width: 24px !important;
  height: 24px !important;
  font-size: 14px !important;
  border-radius: 4px !important;
  padding: 0 !important;
  color: #fff !important;
}

.wc-block-components-quantity-selector__input {
  width: 36px !important;
  height: 24px !important;
  font-size: 14px !important;
  border-radius: 4px !important;
  text-align: center !important;
}

/* Verwijderknop: duidelijk kruisje naast quantity + eigen tooltip */
.wc-block-cart-item__remove-link {
  background: none !important;
  border: none !important;
  margin: 0 !important;

  /* positionering */
  display: inline-flex !important;
  align-items: center !important;

  /* tekst verbergen */
  font-size: 0 !important;
  overflow: visible !important;

  cursor: pointer;
  position: relative;
}

.wc-block-cart-item__remove-link::before {
  content: "×";
  font-size: 18px !important;
  font-weight: 400;
  line-height: 1;
  color: #888;
  margin-left: 6px; /* visueel naast + */
}

.wc-block-cart-item__remove-link:hover::before {
  color: #ff6f61 !important;
}

.wc-block-cart-item__remove-link::after {
  content: attr(aria-label);
  position: absolute;
  bottom: 120%;
  left: 50%;
  transform: translateX(-50%);

  background: #333;
  color: #fff;
  font-size: 12px;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;

  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease;
  z-index: 10;
}

.wc-block-cart-item__remove-link:hover::after {
  opacity: 1;
}

/* ============================================
   3. TOTAALPRIJS
   ============================================ */

.wc-block-cart-item__total {
  font-size: 14px !important;
  font-weight: 600 !important;
  margin: 0 !important;
  padding-left: 6px !important;
}


/* ============================================
   4. ULTRACOMPACTE LAYOUT
   ============================================ */

.wc-block-cart-items__row {
  padding: 8px 0 !important;
  border-bottom: 1px solid #eee !important;
}


/* ============================================
   5. MOBIEL SCROLLBAAR MET ZICHTBARE SCROLLBAR
   ============================================ */

.wp-block-woocommerce-cart-items-block,
.wc-block-cart-items {
  overflow-x: auto !important;
  display: block !important;
}

/* zichtbare scrollbar */
.wc-block-cart-items::-webkit-scrollbar {
  height: 8px !important;
}

.wc-block-cart-items::-webkit-scrollbar-thumb {
  background: #ff6f61 !important;
  border-radius: 4px !important;
}

.wc-block-cart-items::-webkit-scrollbar-track {
  background: #f1f1f1 !important;
}

/* minimale breedte zodat items nooit afgesneden worden */
.wc-block-cart-items__row {
  min-width: 360px !important;
}

.wc-block-cart-item__prices {
  text-align: left !important;
  justify-content: flex-start !important;
  display: flex !important;
}

.wc-block-components-quantity-selector__input {
  line-height: 24px !important;
  padding: 0 !important;
}

.wc-block-components-quantity-selector__button {
  line-height: 24px !important;
}

/* Composite-child: subtiele styling */
.sprankel-composite-child .wc-block-components-product-name {
  color: #666 !important;
  font-weight: 400 !important;
  font-size: 14px !important;
}

/* Extra visuele indentatie voor onderdelen */
.sprankel-composite-child {
  padding-left: 12px !important;
  border-left: 2px solid #f0f0f0 !important;
  margin-left: 4px !important;
}

/* Veiligheids-net: als JS faalt, verberg sale-badge toch in composite wrapper (defensive) */
.sprankel-composite-child .wc-block-components-sale-badge {
  display: none !important;
}

/* behoud voorraadbadges zichtbaar — geen styling hier zodat je huidige kleuren blijven */

/* ============================================
    WOOCOMMERCE FOUTMELDINGEN (ERROR NOTICES) STYLEN
   ============================================ */
.woocommerce-error {
    background-color: #fff0f0; /* zacht roze/roodachtig achtergrondje */
    border-left: 4px solid #ff6f61; /* koraalkleur accent */
    color: #ff6f61; /* koraal tekst */
    font-family: 'Poppins', sans-serif; /* jouw merklettertype */
    font-size: 14px; /* niet te groot */
    padding: 10px 15px;
    margin-bottom: 15px;
    border-radius: 6px;
    line-height: 1.4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* Optioneel: iets subtieler animatie/fade-in effect */
.woocommerce-error {
    opacity: 0;
    transform: translateY(-5px);
    animation: fadeInNotice 0.25s ease-in-out forwards;
}

@keyframes fadeInNotice {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Kleine responsieve tweak: smaller font op mobiel */
@media (max-width: 768px) {
    .woocommerce-error {
        font-size: 13px;
        padding: 8px 12px;
    }
}

/* ============================================
    WOOCOMMERCE GEEN TEKSTTRANSFORMATIE NAAR HOOFDLETTERS
   ============================================ */
/* Forceer normale hoofdlettergebruik in WooCommerce */
.woocommerce,
.woocommerce * {
    text-transform: none !important;
}

/* ============================================
    DROPDOWN VARIATIE ARTIKELEN
   ============================================ */
/* Mooie Sprankel Zeep dropdown-styling */
.variations_form select,
.variations_form .value select,
.woocommerce-variation .value select {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid #ddd;
    border-radius: 12px;
    background-color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    line-height: 1.4;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    color: #333;
}

/* Pijl rechts vervangen door subtiel pijltje */
.variations_form select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px;
}

/* Mooie hover */
.variations_form select:hover {
    border-color: #bbb;
}

/* Mooie focus */
.variations_form select:focus {
    outline: none;
    border-color: #ff6f61; /* zachte koraalaccent */
    box-shadow: 0 0 0 2px rgba(255, 111, 97, 0.25);
}

/* Maak de variatie-knop hoger en consistent met andere producten */
.woocommerce-variation-add-to-cart .single_add_to_cart_button {
    height: 48px !important;       /* vaste mooie hoogte */
    line-height: 48px !important;  /* middelt tekst mooi */
    padding: 0 28px !important;    /* horizontale ruimte */
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

/* ============================================
    VARIATIES WINKELMAND IN SPRANKELSTIJL EN LINKS UITGELIJND
   ============================================ */
.sprankel-variation-info {
    font-family: "Poppins", sans-serif;
    font-size: 0.85rem;
    color: #5a5a5a;
    margin-top: 4px;
    text-align: left; /* Variatie nu links uitgelijnd */
}

/* ==============================
   Koptekst samenvatting bestelling gemaakt van bedankt voor je bestelling op dankpagina
   ============================== */
.woocommerce-order-received .woocommerce-notice.woocommerce-thankyou-order-received {
    color: #c89200 !important;
    font-family: "Baskerville", "Libre Baskerville", serif !important;
    font-weight: 600 !important;
    font-size: 1.0rem !important; /* vergelijkbaar met H2 in Bridge */
    margin-bottom: 1.2rem !important;
}

/* ==============================
   MailPoet aanpassingen
   ============================== */
form.mailpoet-manage-subscription {
    text-align: left !important; /* alles links uitlijnen */
    max-width: 600px;
    margin: 0 auto;
    font-family: 'Poppins', sans-serif !important;
    color: #000000 !important;
}

/* Labels */
form.mailpoet-manage-subscription label,
form.mailpoet-manage-subscription .mailpoet_text_label,
form.mailpoet-manage-subscription .mailpoet_select_label,
form.mailpoet-manage-subscription .mailpoet_segment_label {
    color: #000000 !important;
    font-weight: normal !important; /* niet vet */
    display: block;
    margin-bottom: 8px; /* ruimte tussen label en veld */
}

/* Invoervelden */
form.mailpoet-manage-subscription input[type="text"],
form.mailpoet-manage-subscription select.mailpoet_select {
    width: 100% !important;
    padding: 10px 12px !important;
    font-size: 1rem !important;
    border: 1px solid #c89200 !important; /* goudkleurige rand */
    border-radius: 4px !important; /* vierkante hoeken klein afgerond */
    box-shadow: none !important; /* geen schaduw */
    font-family: 'Poppins', sans-serif !important;
    margin-bottom: 15px !important;
}

/* Knop 'Opslaan' */
form.mailpoet-manage-subscription input.mailpoet_submit {
    background-color: #ff6b6b !important; /* koraal */
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    display: inline-block !important;
    margin-top: 10px !important;
    text-align: center !important;
}

form.mailpoet-manage-subscription input.mailpoet_submit:hover {
    background-color: #c89200 !important; /* goud hover */
}

/* Fouten / validatie */
form.mailpoet-manage-subscription .mailpoet_error_l5q8p,
form.mailpoet-manage-subscription .mailpoet_error_qws4c,
form.mailpoet-manage-subscription .mailpoet_error_1ddhk,
form.mailpoet-manage-subscription .mailpoet_error_1u5ia {
    color: #ff6b6b !important;
    font-size: 0.85rem !important;
    margin-top: 3px !important;
    display: block !important;
}

/* Velden netjes uit elkaar */
form.mailpoet-manage-subscription .mailpoet_paragraph {
    margin-bottom: 15px !important;
}

/* Dropdown tekst Poppins */
form.mailpoet-manage-subscription select.mailpoet_select {
    font-family: 'Poppins', sans-serif !important;
}

/* Laadanimatie verbergen */
form.mailpoet-manage-subscription .mailpoet_form_loading {
    display: none !important;
}

/* Ruimte tussen label en veld */
form.mailpoet-manage-subscription label,
form.mailpoet-manage-subscription .mailpoet_text_label,
form.mailpoet-manage-subscription .mailpoet_select_label,
form.mailpoet-manage-subscription .mailpoet_segment_label {
    margin-bottom: 12px !important; /* meer ruimte onder label */
}

/* ==============================
   WooCommerce geplaatste bestellingen / bevestigingspagina Table Styling
   ============================== */

/* Tabel breedte en uitlijning */
.woocommerce-table--order-details,
.woocommerce-account .woocommerce-orders-table,
.woocommerce-page table.shop_table {
    width: 100% !important;
    table-layout: auto !important; /* kolommen passen aan content */
}

/* Tekst standaard zwart */
.woocommerce-table--order-details td,
.woocommerce-table--order-details th,
.woocommerce-account .woocommerce-orders-table td,
.woocommerce-account .woocommerce-orders-table th {
    color: #000 !important;
    text-align: left !important;
}

/* Productnamen */
.woocommerce-table--order-details td.product-name a {
    color: #000 !important;
    text-decoration: none;
}

.woocommerce-table--order-details td.product-name a:hover {
    color: #c89200 !important; /* koraal/goud bij hover */
}

/* Aantallen */
.woocommerce-table--order-details .product-quantity {
    color: #000 !important;
}

/* Prijzen / bedragen */
.woocommerce-table--order-details .woocommerce-Price-amount,
.woocommerce-table--order-details tfoot .woocommerce-Price-amount {
    color: #000 !important;
}

/* Kleine extra tekst, bijv. verzendwijze */
.woocommerce-table--order-details .shipped_via {
    color: #000 !important;
}

/* Footer tekstopmaak (totaal, verzendkosten, betaalsysteem, notities) */
.woocommerce-table--order-details tfoot th,
.woocommerce-table--order-details tfoot td {
    color: #000 !important;
    font-weight: normal;
}

/* Maak koptekst Product en Totaal vet */
.woocommerce-table--order-details thead th {
    font-weight: 600;
}

/* Verwijder lijnen tussen productregels, maar behoud voor footer */
.woocommerce-table--order-details tbody tr {
    border-bottom: none;
}

/* Behoud scheiding bij footer */
.woocommerce-table--order-details tfoot tr {
    border-bottom: 1px solid #e5e5e5;
}

/* Responsive tekstwrapping */
.woocommerce-table--order-details td.product-name {
    white-space: normal !important;
}

/* Extra padding */
.woocommerce-table--order-details td,
.woocommerce-table--order-details th {
    padding: 0.5em 0.75em !important;
}

/* Geen achtergrondkleur bij hover van hele rij */
.woocommerce-table--order-details tr:hover td {
    background-color: transparent;
}
/* --- KOPTEKST: vet --- */
.woocommerce-order-details .woocommerce-table--order-details thead th {
    font-weight: 600 !important;
}

/* ===========================
   SPRANKEL GEURWIJZER
   =========================== */

.sprankel-geurwijzer {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 2rem 0;
  font-family: inherit;
  font-size: 16px;
  color: #000000;
  line-height: 1.5;
}

/* Algemene cellen en headers */
.sprankel-geurwijzer th,
.sprankel-geurwijzer td {
  padding: 14px 16px;
  vertical-align: top;
  text-align: left;
  line-height: 1.6;
  word-wrap: break-word;
}

/* Headers vet en met subtiele onderlijn */
.sprankel-geurwijzer th {
  font-weight: 600;
  border-bottom: 2px solid #f1f1f1;
}

/* Cellen onderlijn */
.sprankel-geurwijzer td {
  border-bottom: 1px solid #f3f3f3;
}

/* Eerste kolom labels vet en links uitgelijnd */
.sprankel-geurwijzer td:first-child {
  font-weight: 600;
  text-align: left;
}

/* Afbeeldingen in de header (boven de naam) */
.sprankel-geurwijzer thead tr:first-child th img {
  display: block;
  margin: 0 auto 5px auto;
  max-width: 100px;
  height: auto;
}

/* Tekst onder de afbeelding vet maken */
.sprankel-geurwijzer thead tr:first-child th span {
  display: block;
  font-weight: 600;
}

/* Mobiel vriendelijk */
@media (max-width: 768px) {
  .sprankel-geurwijzer th,
  .sprankel-geurwijzer td {
    padding: 12px;
    font-size: 14px;
  }
}

/* Extra typografie voor leesbaarheid */
.sprankel-geurwijzer td p,
.sprankel-geurwijzer td span,
.sprankel-geurwijzer td br {
  margin: 0;
  padding: 0;
}

.sprankel-geurwijzer td ul {
  margin: 0;
  padding-left: 20px;
}

.sprankel-geurwijzer td li {
  list-style: disc;
}

/* Voeg een scrollbare container toe */
.sprankel-geurwijzer-wrapper {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* soepel scrollen op iOS */
}

/* Optioneel: zorg dat de tabel minimaal de breedte behoudt */
.sprankel-geurwijzer {
  min-width: 600px; /* of een waarde die past bij jouw tabel */
}

/* ===========================
   SHOPPING CART OP MOBIEL ZICHTBAAR EN GROOTTE ICOON
   =========================== */

@media (max-width: 480px) {
  .shopping_cart_outer {
    display: block !important;
  }
}

@media (max-width: 1300px) {
  .header_inner_left .mobile_menu_button i {
    font-size: 30px !important; /* pas hier het icoon aan, bijv 30px */
  }
}