/*** ---------- Header image ---------- ***/
.wpb-header.wpb-header--image { position: relative; }
.wpb-header.wpb-header--image figure { padding-top: 3.25rem; }
.wpb-header.wpb-header--image figure::after { left: 50%; top: 0; transform: translateX(-50%); }
.wpb-header.wpb-header--image figure img { border-radius: 1.6rem; max-height: 30rem; object-fit: cover; }

@media (min-width: 992px) {
    .wpb-header.wpb-header--image .container { z-index: 2; }
    .wpb-header.wpb-header--image .container .wpb-text { width: 50%; }
    .wpb-header.wpb-header--image .container-fluid { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
    .wpb-header.wpb-header--image .container-fluid figure { width: 50%; margin-left: auto; padding-top: 0; padding-left: 4.5rem; height: 100%; }
    .wpb-header.wpb-header--image .container-fluid figure img { height: 100%; }
    .wpb-header.wpb-header--image figure::after { top: 50%; left: 0; transform: translate(0, -50%); }
    .wpb-header.wpb-header--image figure img { max-height: 100%; }
    .wpb-header.wpb-header--image.wpb-header__woocommerce-archive .term-description {max-width: 44vw;}
}

@media (max-width: 768px) {
    .wpb-header.wpb-header--image figure::after {left: unset; right: 0;}
    .wpb-header.wpb-header--image:has(.container-fluid) {padding-bottom: 0;}
    .wpb-header.wpb-header--image .container-fluid {padding-right: 0;}
    .wpb-header.wpb-header--image figure img {border-top-right-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0;}
}

/*** ---------- Block: Articles carousel ---------- ***/
.wpb-block__articles-carousel { overflow: hidden; }
.wpb-block__articles-carousel .wpb-section__header { padding-bottom: 2.4rem; }
.wpb-block__articles-carousel .blaze-slider { --slides-to-show: 1!important; --slide-gap: 1.6rem; }
.wpb-block__articles-carousel .blaze-nav-container { display: flex; align-items: center; position: absolute; top: calc(100% + 2.4rem); right: 0; z-index: 1; }
.wpb-block__articles-carousel .blaze-nav-container button { cursor: pointer; border: 1px solid var(--clr-border); background-color: #fff; width: 3.2rem; height: 2.8rem; border-radius: 3rem; display: inline-grid; place-items: center; transition: background-color var(--ts-15) ease, border-color var(--ts-15) ease; }
.wpb-block__articles-carousel .blaze-nav-container button i { --width: 1rem; --height: 1rem; }
.wpb-block__articles-carousel .blaze-nav-container button.blaze-prev { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.wpb-block__articles-carousel .blaze-nav-container button.blaze-next { margin-left: -1px; border-top-left-radius: 0; border-bottom-left-radius: 0; }
.wpb-block__articles-carousel .blaze-nav-container button:hover { background-color: var(--clr-blue); border-color: var(--clr-blue); }
.wpb-block__articles-carousel .blaze-nav-container button:hover i { background-color: #fff; }
.wpb-block__articles-carousel .blaze-slider.static .blaze-nav-container,
.wpb-block__articles-carousel .blaze-slider.start button.blaze-prev,
.wpb-block__articles-carousel .blaze-slider.end button.blaze-next { display: none; }
.wpb-block__articles-carousel .wpb-card { min-height: 25rem; }
.wpb-block__articles-carousel .wpb-card .wpb-card__body { padding: 2rem; }
.wpb-block__articles-carousel .wpb-section__footer { padding-top: 2.4rem; }

@media (min-width: 768px) {
    .wpb-block__articles-carousel .blaze-slider { --slides-to-show: 2!important; }
}

@media (min-width: 992px) {
    .wpb-block__articles-carousel .blaze-slider { --slides-to-show: 3!important; --slide-gap: 2.4rem; }
    .wpb-block__articles-carousel .wpb-card .wpb-card__body { padding: 2.4rem; }
}

@media (min-width: 1400px) {
    .wpb-block__articles-carousel .blaze-nav-container { left: -6.4rem; width: calc(100% + 12.8rem); top: 50%; transform: translateY(-50%); }
    .wpb-block__articles-carousel .blaze-nav-container button.blaze-next { margin-left: auto; }
    .wpb-block__articles-carousel .blaze-nav-container button { border-radius: 50%!important; width: 3.6rem; height: 3.6rem; }
    .wpb-block__articles-carousel .blaze-nav-container button i { --width: 1.2rem; --height: 1.2rem; }
    .wpb-block__articles-carousel .wpb-card { min-height: 32rem; }
    .wpb-block__articles-carousel .wpb-card .wpb-card__body { padding: 3.2rem; }
}

/*** ---------- Block: Product categorieën overzicht ---------- ***/
.wpb-block__about-transoplast :is(.wpb-image img, .wpb-card) { --border-radius: 1.2rem; border-radius: var(--border-radius); }
.wpb-block__about-transoplast .wpb-card .wpb-card__body { padding: 1.6rem; }
.wpb-block__about-transoplast .wpb-card:nth-of-type(3) .wpb-card__body { display: flex; flex-direction: column; justify-content: end; align-items: start; }

@media (min-width: 768px) {
    .wpb-block__about-transoplast .inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .wpb-block__about-transoplast .wpb-card .wpb-card__body { padding: 2.4rem; }
    .wpb-block__about-transoplast .wpb-card:nth-of-type(1) { order: -1; }
    .wpb-block__about-transoplast .wpb-card:nth-of-type(1),
    .wpb-block__about-transoplast .wpb-card:nth-of-type(3) { grid-column: span 2; }
}

@media (min-width: 1200px) { 
    .wpb-block__about-transoplast .inner { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(4, minmax(0, auto)); }
    .wpb-block__about-transoplast .inner > * { grid-row: span 2; }
    .wpb-block__about-transoplast figure img { height: 100%; object-fit: cover; }
    .wpb-block__about-transoplast figure:nth-of-type(1) { grid-row: span 3; }
    .wpb-block__about-transoplast .wpb-card .wpb-card__body { padding: 2.8rem; }
    .wpb-block__about-transoplast .wpb-card:nth-of-type(1) .wpb-card__body { padding: 4rem; }
    .wpb-block__about-transoplast .wpb-card:nth-of-type(3) .wpb-card__body { padding: 12rem 4rem 4rem 4rem; }
    .wpb-block__about-transoplast .wpb-card:nth-of-type(1) { order: inherit; }
    .wpb-block__about-transoplast .wpb-card:nth-of-type(2) { grid-row: span 1; order: 2; }
}

/*** ---------- Block: Text ---------- ***/
.wpb-block--text .inner + .btn-group { padding-top: 1.6rem; }

/*** ---------- Block: Youtube embed ---------- ***/
.wpb-youtube { --gc: 1; --gap: 2.2rem; }
.wpb-youtube .inner { display: grid; gap: var(--gap); grid-template-columns: repeat(var(--gc), minmax(0, 1fr)); }
.wpb-youtube .wpb-ratio .youtube-play { position: absolute; top: 0; right: 0; bottom: 0; left: 0; cursor: pointer; transition: opacity var(--ts-35) ease; 
    img { object-fit: cover; width: 100%; height: 100%; z-index: 1; position: relative; }
    .play-icon { position: absolute; bottom: 3.2rem; left: 3.2rem; z-index: 3; display: flex; align-items: center; column-gap: .9rem; font-weight: 700;
        i { font-size: 2.7rem; color: #ffffff; }
        .play-icon__text { font-size: 1.8rem; color: #fff; }
    }
    &::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 1.2rem; background: linear-gradient(0deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,0) 100%); z-index: 2; }
}

@media (min-width: 992px) {
    .wpb-youtube { --gc: 2; --gap: 4.8rem; }
    .wpb-youtube.wpb-youtube__primary .wpb-ratio { order: -1; }
}

@media (min-width: 1200px) {
    .wpb-youtube { --gap: 6.4rem; }
}

@media (min-width: 1400px) {
    .wpb-youtube { --gap: 9.8rem; }
}

/*** ---------- Block: Header ---------- ***/
.wpb-header .wpb-header__toolbar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 1.6rem; padding-bottom: 2.8rem; }
.wpb-header .wpb-header__toolbar .btn { white-space: nowrap; }
.wpb-header .wpb-header__toolbar .wpb-breadcrumbs { margin: 0; --excerpt-line-clamp: 1; display: -webkit-box; -webkit-line-clamp: var(--excerpt-line-clamp); -webkit-box-orient: vertical; overflow: hidden; }
.wpb-header .wpb-header__toolbar .wpb-breadcrumbs > span > span:not(.breadcrumb_last) { opacity: .65; }

.wpb-header:has(.wpb-header__assets) { position: relative; z-index: 2; }
.wpb-header .wpb-header__assets { z-index: -1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; }

/*** ---------- Block: Accordion ---------- ***/
.wpb-block--accordion {
    .wpb-row { column-gap: clamp(3.2rem, 3.5vw, 6.4rem); row-gap: 3.2rem; }

    &.wpb-bg-color--white .wpb-accordion { background-color: var(--clr-light);
        .accordion__button { background-color: var(--clr-light); }
    }
}

/*** ---------- Block: Blurb ---------- ***/
.wpb-block--blurb {
    .wpb-block__header { padding-bottom: 1.6rem; }

    .wpb-block__body .container { display: grid; grid-template-columns: repeat(var(--grid-columns, 1), minmax(0, 1fr)); gap: clamp(.8rem, 2.5vw, 3.2rem); }

    @media (min-width: 768px) {
        .wpb-block__header { padding-bottom: 3.2rem; }
    }
}

/*** ---------- Block: Media ---------- ***/
.wpb-block--media {
    .wpb-block__header { padding-bottom: 1.6rem; }

    .wpb-block__body .container { display: grid; grid-template-columns: repeat(var(--grid-columns, 1), minmax(0, 1fr)); gap: clamp(.8rem, 2.5vw, 3.2rem); }

    @media (min-width: 768px) {
        .wpb-block__header { padding-bottom: 3.2rem; }
    }
}

/*** ---------- Block: Text & Media ---------- ***/
.wpb-block--text-media { --gc: 1; --gap: 2.2rem; 
    .inner { display: -ms-grid; display: grid; gap: var(--gap); grid-template-columns: repeat(var(--gc), minmax(0, 1fr)); -ms-grid-columns: repeat(var(--gc), minmax(0, 1fr)); }

    @media (min-width: 992px) { 
        --gc: 2; --gap: 4.8rem;
    }
    
    @media (min-width: 1200px) {
        --gap: 6.4rem; 
    }
    
    @media (min-width: 1400px) {
        --gap: 9.8rem;
    }
}

/*** ---------- Block: Tabs ---------- ***/
.wpb-block__tabs .container .inner > .wpb-text { margin-bottom: 3.2rem; }
.wpb-tabs { display: grid; --padding: .85rem 1.25rem; --color: var(--clr-text); --bg-color: transparent; --border-radius: .5rem .5rem 0 0; --border: 1px solid transparent; --box-shadow: none; --active-color: var(--clr-text); --active-bg-color: #fff; --active-border: 1px solid var(--clr-border); 
    .tab__header { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; z-index: 1; margin-bottom: -0.1rem;
        .tab__button { display: inline-block; padding: var(--padding); color: var(--color); background-color: var(--bg-color); border-radius: var(--border-radius); border: var(--border); box-shadow: var(--box-shadow); text-align: center; text-decoration: none; vertical-align: middle; cursor: pointer; user-select: none; transition: color var(--ts-15) ease, background-color var(--ts-15) ease, border-color var(--ts-15) ease, box-shadow var(--ts-15) ease;
            &.is-active { color: var(--active-color); border-color: var(--active-color); background-color: var(--active-bg-color); border: var(--active-border); border-bottom: 1px solid #fff; }   
        }
    }
    .tab__content { display: grid; border: 1px solid var(--clr-border); border-radius: 0 0 .5rem .5rem; overflow: hidden;
        .tab__pane { background-color: #fff; grid-column: 1/-1; grid-row: 1/-1; pointer-events: none; opacity: 0;  padding: 1.6rem; transition: opacity 250ms ease;
            &.is-active { pointer-events: all; opacity: 1; }
        }
    }

    &.--secondary { --border-radius: .5rem; --gc: 15rem 1fr; display: grid; grid-template-columns: var(--gc); -ms-grid-columns: var(--gc); -webkit-box-align: start; -ms-flex-align: start; align-items: start; 
        .tab__header { margin-bottom: 0; margin-right: -0.1rem; 
            .tab__button { border-right: 0; margin: 0; width: 100%; border-radius: .5rem 0 0 .5rem; 
                &.is-active { border: var(--active-border); border-right: 0; }
            } 
        }
        .tab__content { border-radius: 0 .5rem .5rem 0; }
    }
}

/*** ---------- Block: Text Shortcode ---------- ***/
.wpb-block--text-shortcode { --gc: 1; --gap: 2.2rem; }
.wpb-block--text-shortcode .inner { display: -ms-grid; display: grid; gap: var(--gap); grid-template-columns: repeat(var(--gc), minmax(0, 1fr)); -ms-grid-columns: repeat(var(--gc), minmax(0, 1fr)); }

@media (min-width: 992px) {
    .wpb-block--text-shortcode { --gc: 1; --gap: 3.2rem; }
    :is(.wpb-block--text-shortcode.--primary, .wpb-block--text-shortcode.--secondary) { --gc: 2; }
    .wpb-block--text-shortcode.--primary .form { order: -1; }
}

.gform_wrapper {display: block!important;}

/*** ---------- Bestelling herroepen form ---------- ***/
body:has(.wuxnl-revocation) { background-color: #fff; }
.wuxnl-revocation { --primary: var(--clr-blue); --primary-hover: var(--clr-dark); --border: 1px solid var(--clr-border); --bg: var(--clr-light); padding: 0 1.8rem;

    .wuxnl-revocation__field {
        label { font-size: 1.3rem; font-weight: 600; line-height: 1.2; display: flex; align-items: center; margin-bottom: 8px; }
        input, textarea { min-height: 5rem; padding: 10px 16px;
            &:focus { border-width: 2px; border-color: var(--clr-blue); }
        }  
    }

    .wuxnl-revocation__btn { font-size: 1.5rem; width: 100%; min-height: 5rem;
        .wuxnl-revocation__btn-text { font-size: 1.5rem; color: #fff; }
    }
    .wuxnl-revocation__item-check:checked + .wuxnl-revocation__item-check-button span { color: #fff; }
    .wuxnl-revocation__item-check-button { min-height: 4rem;
        &:hover span { color: #fff; }
    }

    .wuxnl-revocation__details-table, .wuxnl-revocation__items-table { border: 1px solid var(--table-border-color); background: #fff; 
        .amount { white-space: nowrap; }
    }
}