/* Root variables */
 :root {    
    --theme-vdlp-font-size-xs: 12px;
    --theme-vdlp-font-size-sm: 14px;    
    --theme-vdlp-font-size-lg: 18px;    
    --theme-vdlp-font-weight-bold-500: 500;
    --theme-vdlp-font-weight-bold: 700;   
    --theme-vdlp-border-radius: 20px;   
    --theme-vdlp-card-padding: 40px;
    --theme-vdlp-card-border_radius: var(--theme-vdlp-border-radius);    
    --theme-form-selection-field-initial-color: var(--theme-palette-color-1);   
    --theme-default-spacer-1: 5px;
    --theme-default-spacer-2: 10px;
    --theme-default-spacer-3: 20px;
    --theme-default-spacer-4: 40px;
    --woo-separated-tabs-spacing: var(--theme-default-spacer-3);

}

/* ----- Header ----- */

header .menu > li > .ct-menu-link { height: auto; }
header nav[class*=menu] li.current-menu-item > .ct-menu-link {
    text-decoration: underline;
}
header nav[class*=menu] .sub-menu li.current-menu-item .ct-menu-link,
header nav[class*=menu] .sub-menu li > .ct-menu-link,
header nav[class*=menu] .sub-menu li:hover > .ct-menu-link {
    color: #fff;    
}
header a:not(.ct-button):hover { text-decoration: underline !important; }
@media screen and (max-width: 1150px) {
    header .ct-contact-info .ct-icon-container { display: none; }    
}
[data-header*="type-1"] .ct-header [data-id="menu-secondary"] > ul > li > a {
    font-size: var(--theme-vdlp-font-size-lg);    
}


/* ----- Footer ----- */

footer a:hover { text-decoration: underline !important; }
footer .footer-menu > p { margin-bottom: .5rem; font-weight: var(--theme-vdlp-font-weight-bold); font-size: var(--theme-vdlp-font-size-lg); }
footer .footer-payment-logo { max-width: 280px; }
footer .footer-logo { display: none; }
@media screen and (min-width: 1000px) { 
    footer .footer-logo { display: block; position: absolute; bottom: -110px; }
    footer .footer-logo img { width: 140px; }        
}


/* ----- Notification Bar ----- */

.notification-bar { background-color: var(--theme-palette-color-9); font-size: var(--theme-vdlp-font-size-sm); }
.notification-bar .gspb_row__content p:last-child { margin-bottom: 0; }


/* ----- Search modal ----- */

[data-header*="type-1"] #search-modal { background-color: var(--theme-palette-color-7); }
[data-header*="type-1"] #search-modal .ct-toggle-close svg { fill: var(--theme-palette-color-1); }
[data-header*="type-1"] #search-modal .ct-search-form {    
    --theme-link-initial-color: var(--theme-palette-color-1);
    --theme-form-text-initial-color: var(--theme-palette-color-1);
    --theme-form-text-focus-color: var(--theme-palette-color-2);
    --theme-form-field-border-initial-color: currentColor;
    --theme-button-text-initial-color: currentColor;
    --theme-button-text-hover-color: var(--theme-palette-color-2);
    --theme-button-background-initial-color: var(--theme-palette-color-1);
    --theme-button-background-hover-color: var(--theme-palette-color-1)
}
#search-modal form .ct-search-form-controls button { background-color: var(--theme-palette-color-1); color: #fff !important; }
#search-modal form .ct-search-form-controls button svg { fill: #fff !important; }
#search-modal form .ct-search-form-controls button:hover { background-color: var(--theme-palette-color-2); }

.ct-search-form input ~ .ct-search-form-controls [data-button*=inside],
.entry-content .ct-search-form input {    
    border-color: var(--theme-form-field-border-focus-color);
}        

.ct-search-form input:not(.modal-field) ~ .ct-search-form-controls {
    transition: all .12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    border-start-end-radius: var(--has-classic-forms, var(--theme-form-field-border-radius, 3px));
    border-end-end-radius: var(--has-classic-forms, var(--theme-form-field-border-radius, 3px));
}

.ct-search-form input:not(.modal-field) ~ .ct-search-form-controls:hover {
    background-color: var(--theme-palette-color-1);
}

.ct-search-form input:not(.modal-field) ~ .ct-search-form-controls:hover .ct-search-button-content {
    transition: all .12s cubic-bezier(0.455, 0.03, 0.515, 0.955);
    fill: #fff;
}
/* ----- Default elements ----- */

blockquote {
    margin-bottom: var(--theme-default-spacer-3) !important;
}

.hero-section[data-type=type-1].is-width-constrained {
    margin-top: var(--theme-default-spacer-3);    
}

.grecaptcha-badge { 
    visibility: hidden; 
}


/* ----- Widgets ----- */

/* Social links */
.wp-block-social-links .wp-block-social-link.wp-social-link:hover { transform: scale(1); }
.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor:hover { color: var(--theme-palette-color-2); fill: var(--theme-palette-color-2); }
.wp-block-social-links .wp-block-social-link.wp-social-link .wp-block-social-link-anchor { font-size: 28px; }
footer ul.wp-block-social-links { margin-bottom: var(--theme-default-spacer-3) !important; } 

/* Widget: opening-hours */
table.opening-hours th,
table.opening-hours td {
    padding: .5rem var(--theme-vdlp-card-padding) 0 0;
    text-align: left;
}

/* Widget: Klanten vertellen */
.klantenvertellen { font-family: Arial; font-size: var(--theme-vdlp-font-size-xs); color: #000; display: flex; align-items: center; }
.klantenvertellen .klantenvertellen-content { display: flex; flex-direction: column; align-self: center; }
.klantenvertellen .klantenvertellen-content .klantenvertellen-stars { display: flex; }
.klantenvertellen .klantenvertellen-content .klantenvertellen-stars .vdlp-star-rating { margin-right: 4px; }
.klantenvertellen .klantenvertellen-content .klantenvertellen-stars .dashicons { color: gold; font-size: 15px; height: 15px; width: 15px; }
.klantenvertellen .klantenvertellen-content .klantenvertellen-rating-text { margin-bottom: 4px; }
.klantenvertellen .klantenvertellen-content .klantenvertellen-rating-text .klantenvertellen-rating { font-weight: var(--theme-vdlp-font-weight-bold); }
.klantenvertellen .klantenvertellen-logo { margin-left: 10px; }
.klantenvertellen .klantenvertellen-logo a,
.klantenvertellen .klantenvertellen-logo img { display: inline-block; margin: 0; }
.klantenvertellen .klantenvertellen-logo img { width: 40px; }
header .klantenvertellen { margin: 0 0 0 24px; }
footer .klantenvertellen { font-size: var(--theme-vdlp-font-size-sm); color: #fff}

/* vdlp-blocks-card */
.vdlp-blocks-card {
    padding: var(--theme-vdlp-card-padding) !important;
    border-radius: var(--theme-vdlp-card-border_radius);
}


/* -----  WooCommerce Produtcs / category ----- */

/* Spacing elementen in summary product page */
.entry-summary-items > .woocommerce-product-details__short-description,
.entry-summary-items > .ct-breadcrumbs {
    --product-element-spacing: var(--theme-default-spacer-3);
}
.product-entry-wrapper .summary .variations {
    margin-bottom: var(--theme-default-spacer-1);
}
.product-entry-wrapper .summary .woocommerce-variation-description {
    margin-bottom: var(--theme-default-spacer-3);
}
.product-entry-wrapper .summary .variations-additional-information {
    font-size: var(--theme-vdlp-font-size-sm);
    margin-bottom: var(--theme-default-spacer-3);
}
.product[class*=gallery] .entry-summary-items > .product_title {
    margin-bottom: 0;
}
.product[class*=gallery] .entry-summary-items > .price {
    margin-bottom: var(--theme-default-spacer-2);
}

#block-30 {
    margin-bottom: var(--theme-default-spacer-2);
}

body .entry-summary-items > .ct-product-add-to-cart {
    margin-bottom: var(--theme-default-spacer-2) !important;
}

.entry-summary-items > .ct-product-add-to-cart > .cart {
    --theme-button-max-width: 100% !important;
    --theme-button-min-height: 55px !important;
}

@media screen and (min-width: 600px) {
    .entry-summary-items > .ct-product-add-to-cart > .cart {
        --theme-button-max-width: 70% !important;
    }
}

/* Verbeterde styling voor product attributen tabel (woocommerce-product-attributes) */
body table.woocommerce-group-attributes-public {    
  width: var(--theme-block-width) !important;
  max-width: var(--wp--style--global--content-size) !important;
}

body table.woocommerce-product-attributes {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0 auto var(--theme-default-spacer-3) auto;

  th,
  td {
    text-align: left;
    border-bottom: 1px solid var(--theme-palette-color-6);
  }

  th {
    width: 25%;
  }

  td {
    
  }
}



/* Product overview and detail */
.products .product .sale-price { flex-direction: column; }

/* Hide some default elements on product page */
.woocommerce-tabs.wc-tabs-wrapper .entry-content > h2,
.product-entry-wrapper .summary .checkout-button.button.alt.wc-forward,
.product-entry-wrapper .summary .ct-cart-actions .quantity {
    display: none !important;
}
.product-entry-wrapper .summary .ct-cart-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: var(--theme-default-spacer-3);
}
.product-entry-wrapper .summary .ct-cart-actions {
    flex-direction: column;
    
}

.product-entry-wrapper .summary .ct-cart-actions > * {
    width: 100%;
    min-width: 1px;
}

@media screen and (min-width: 600px) {
    .product-entry-wrapper .summary .ct-cart-actions {
        flex-direction: row;
    }

    .product-entry-wrapper .summary .ct-cart-actions > * {
        width: 50%;        
    }
}


[data-products=type-2] .ct-woo-card-actions .more-info-button {
    font-size: var(--theme-vdlp-font-size-sm);    
}

[data-products=type-2] .ct-woo-card-actions .more-info-button:hover {
    color: #fff;
    font-weight: 500;
    background-color: var(--theme-palette-color-2);
}

[data-products=type-2] .ct-woo-card-actions>* {
    align-content: center;
}

[data-swatches-type="button"] .ct-swatch {    
    --swatch-button-text-color: #fff;
    --swatch-button-border-color: var(--theme-palette-color-1);
    --swatch-button-background-color: var(--theme-palette-color-1);
}

[data-swatches-type="button"] .ct-swatch-container .ct-swatch:hover,
[data-swatches-type="button"] > *.active .ct-swatch {
    --swatch-button-border-color: var(--theme-palette-color-2);
    --swatch-button-background-color: var(--theme-palette-color-2);
}

[data-swatches-type="color"] .ct-swatch-container .ct-swatch:hover,
[data-swatches-type="color"] > *.active .ct-swatch {
    --swatch-border-color: var(--theme-palette-color-2);
}

/* Productcard */
.product.type-product .ct-card-variation-swatches {
    margin-bottom: var(--theme-default-spacer-1);
}

.product.type-product .ct-product-content-block .color-info-text {
    font-size: var(--theme-vdlp-font-size-xs);    
    margin-bottom: var(--theme-default-spacer-2);
}

.product.type-product .ct-product-content-block .gspb-pricebox {
    font-weight: var(--theme-vdlp-font-weight-bold);
}

/* Reset width for CTA blocks in product overview */
.woocommerce ul.products li.product-cta-break {
    grid-column: 1 / -1;
    padding: 0;
}

/* Category product overview */
.seo-category-title {
  margin-bottom: var(--theme-default-spacer-1);
}

.seo-category-description {
    margin: 0;
}

/* ----- Winkelwagen ----- */
#woo-cart-panel .woocommerce-mini-cart__buttons .button.checkout {
    display: none;
}
#woo-cart-panel .woocommerce-mini-cart__buttons .button.wc-forward {
    --gridColumn: initial;
}

/* ----- Greenshift Blocks ----- */

/* Greenshift Blocks Row for type winkel */
.wp-block-greenshift-blocks-row .wp-block-post.type-winkel .ct-dynamic-media,
.wp-block-greenshift-blocks-row .wp-block-post.type-winkel .ct-dynamic-media img {
    border-radius: var(--theme-vdlp-card-border_radius) var(--theme-vdlp-card-border_radius) 0 0;
}

.wp-block-greenshift-blocks-row .wp-block-post.type-winkel .wp-block-group {
    border-radius: 0 0 var(--theme-vdlp-card-border_radius) var(--theme-vdlp-card-border_radius);    
}

/* Greenshift Blocks Image, add default border radius */
.wp-block-greenshift-blocks-image img {
    border-radius: var(--theme-vdlp-card-border_radius);
}


/* ----- Gravity Froms ----- */

html .gform_wrapper.gravity-theme {
    --theme-form-field-border-initial-color: var(--theme-palette-color-1);
    --theme-form-field-border-focus-color: var(--theme-palette-color-9);
}
html .gform_wrapper.gravity-theme .gsection { font-size: var(--theme-vdlp-font-size-lg); border: none; padding: 0; }
html .gform_wrapper.gravity-theme .gsection .gsection_title { font-weight: var(--theme-vdlp-font-weight-bold); }
html .gform_wrapper.gravity-theme .ginput_container_date { width: 100%; }