/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/

/* Header */
body #header-outer .full-width-section .row-bg-wrap, body .nectar_hook_global_section_footer .wpb_row.full-width-content, body .full-width-section .row-bg-wrap {margin-left: -50vw;width: 100vw;}

.headertop {font-size: 12px;color: #000;}
.headertop .topnav {width: 100%;text-align: right;}
.headertop .topnav ul {display: inline-flex;gap: 8px;}
.headertop .topnav ul a {color: #000;}

body #header-outer[data-format=centered-menu-under-logo] #top .span_9 nav {justify-content: space-between;}
body #header-outer[data-format=centered-menu-under-logo] #top nav>.sf-menu>li ul.tracked-pos {border-top: 2px solid #d8c176}
#header-outer header {border-bottom: 2px solid #d8c176}
.scrolled-down .nectar_hook_before_secondary_header {display: none;}

body #header-outer[data-format=centered-menu-bottom-bar] .span_3 {max-height: 70px;transition: max-height 0.4s ease, opacity 0.3s ease, transform 0.4s ease, padding 0.4s ease, margin 0.4s ease;}
body #header-outer[data-format=centered-menu-bottom-bar].scrolled-down .span_3 {opacity:0;max-height: 0;transform:translateY(-20px);z-index:0 !important}
body #header-outer[data-format=centered-menu-bottom-bar].scrolled-down .span_9 {padding-top:20px}
#header-outer nav .category-overview ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border: 0 !important;
}
#header-outer nav .category-overview ul li {
    padding: 5px 0;
}
#header-outer nav .category-overview ul li a {font-size: 14px;padding:0 !important}

/* Navigatie */

body.material #top nav ul #custom-header-icon a span {font-size: 20px;}
body.material #top nav ul #custom-header-icon a {margin:0 !important;line-height: 0;}
body.material #top nav ul #custom-header-icon a:hover {color:#d8c176;}
body.material #top nav ul #custom-header-icon a span {color:#000 !important}

#header-outer li.sfHover .nectar-global-section-megamenu {border-top:2px solid #d8c176;overflow: hidden;}
#header-outer .sf-menu li.sfHover .sub-menu {border-top:2px solid #d8c176;}

/* Footer */

.nectar_hook_global_section_footer h4 {
    color: #000;
    font-size: 16px;
    text-transform: uppercase;
}
.nectar_hook_global_section_footer a {
    color:#000;
}
.nectar_hook_global_section_footer {
    font-size: 0.9vw;
    color: #000;
}
.nectar_hook_global_section_footer .nieuwsbrief form div div {margin-bottom:15px}
.nectar_hook_global_section_footer .nieuwsbrief form label {display: none;}
.nectar_hook_global_section_footer .nieuwsbrief form input {background-color:rgba(255, 255, 255, 0.5);}
.nectar_hook_global_section_footer .nieuwsbrief form button {background-color: #fff;color:#000;text-transform: uppercase;padding: 10px 25px;}
.nectar_hook_global_section_footer .nieuwsbrief form button:hover {background-color: #000 !important;color: #fff;}
.openingsuren strong {min-width:30px;display: inline-block;}

#footer-outer {display: none;}


/* Homepage */

.homepagetekst h1 {font-size: 42px;margin-bottom: 20px;}
.homepagetekst p {font-size: 16px;}
.homepagetekst p, .homepagetekst h1 {color:#fff;}

/* Pages */
#sidebar .klanten-nav .wp-block-heading {
    color: #000;
    text-transform: uppercase;
    font-weight: normal;
}
#sidebar .klanten-nav .wp-block-list {
    padding-left: 10px;
}

/* Categorie */

.category-overview {
    padding: 15px;
    margin: 0 !important;
}
.category-overview h3 {
    font-size: 15px;
    text-transform: uppercase;
    font-weight: normal;
    margin: 0 !important;
}
.category-overview h3:hover {color: #d8c176}

.woocommerce.archive #page-header-wrap + .container-wrap {padding-top:15px !important}

.term-description h2 {font-size: 20px;}

.page-title {color:#000}

.tax-product_cat .term-description {background-color: #f5f5f5;padding: 25px;border-radius: 4px;} 

.bapf_slidr .irs--sharp .irs-max, .bapf_slidr .irs--sharp .irs-min, .bapf_slidr .irs--sharp .irs-from, .bapf_slidr .irs--sharp .irs-single, .bapf_slidr .irs--sharp .irs-to {background-color: #d8c176;}
.bapf_slidr .irs--sharp .irs-bar, .bapf_slidr .irs--sharp .irs-handle {background-color: #d8c176;}
.bapf_slidr .irs--sharp .irs-from:before, .bapf_slidr .irs--sharp .irs-single:before, .bapf_slidr .irs--sharp .irs-to:before, .bapf_slidr .irs--sharp .irs-handle>i:first-child {border-top-color: #d8c176;}
.berocket_single_filter_widget h3 {color:#000;text-transform: uppercase;font-weight: normal;font-size: 20px;}

.woo-custom-brand {color: #000;text-transform: uppercase;display: inline-block;margin-bottom:3px;border-bottom:2px solid #d8c176}
.woo-custom-product-name {display: block;font-size: 15px;min-height: 50px;}

.carousel-wrap .woo-custom-product-name {font-size: 15px;}
.woocommerce-result-count {display: none;}
.inner .bapf_hideckbox li label, .inner .bapf_hideckbox li label a {color:#000;}
.inner .bapf_hideckbox li label:hover, .inner .bapf_hideckbox li label:hover a {color:#d8c176}
#sidebar .berocket_single_filter_widget_42392 ul {margin-left: 15px !important}

/* Product page */
.woocommerce .variations, .woocommerce div.product form.cart .variations {margin-bottom: 15px !important}
.woocommerce div.product form.cart .variations label {font-weight: normal;font-size: 16px;text-transform: uppercase;}
.yith-add-to-wishlist-button-block.yith-add-to-wishlist-button-block--single {
    width: 100%;
    align-items: center;
    background: #f5f5f5;
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 15px;
}
.yith-add-to-wishlist-button-block.yith-add-to-wishlist-button-block--single a {color:#000}
.woocommerce-page button[type=submit].single_add_to_cart_button, body[data-form-submit=regular].woocommerce-page .container-wrap button[type=submit].single_add_to_cart_button {margin-top:15px;}
.woocommerce div.product form.cart {margin-bottom: 15px !important}
.bestelnummer_label {text-transform: capitalize;}
.woocommerce .single-product-summary {padding-left:0}
.single-product .product_title .woo-custom-product-name {font-size: 26px;}

@media only screen and (max-width: 1000px) {
    .nectar_hook_before_secondary_header {display: none;}
    #header-outer header {padding:20px 0}
    body[data-header-resize="0"] .container-wrap, body[data-header-resize="0"] .project-title {padding-top:20px;}
}
@media (max-width: 767px) {
    body #top #logo img, #header-outer[data-permanent-transparent="false"] #logo .dark-version {height: 18px !important;}
    .homepagetekst h1 {font-size: 24px;}
    .home h2 {font-size: 25px;line-height: 30px;}
    p {font-size: 16px;}
    .products li.product.minimal .product-meta {padding: 15px 5px;}
    .woo-custom-brand {font-size: 16px;}
    .woocommerce ul.products li.product.minimal .price, .woocommerce-page ul.products li.product.minimal .price {font-size: 14px;}
    .single-product-summary .woo-custom-brand {font-size: 26px;}
}
@media (max-width:350px) {
    body #top #logo img, #header-outer[data-permanent-transparent="false"] #logo .dark-version {height: 14px !important;}
}

/* De Grid Container */
.lingerie-masonry-banner {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 15px;
    width: 100%;
    height: 600px; /* Totale hoogte op desktop */
    margin-bottom: 30px;
}

.lingerie-masonry-banner .banner-item,
.lingerie-masonry-banner .banner-item a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
}

/* Zorg dat zowel afbeeldingen als video's de hele cel vullen */
.lingerie-masonry-banner .banner-item img,
.lingerie-masonry-banner .banner-item video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
    transition: transform 0.5s ease;
}

/* Zoom-effect bij hover op afbeelding óf video */
.lingerie-masonry-banner .banner-item:hover img,
.lingerie-masonry-banner .banner-item:hover video {
    transform: scale(1.04);
}

/* --- De Chique Titel Overlay --- */
.lingerie-masonry-banner .banner-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    /* Subtiel verloop van transparant naar donkergrijs voor leesbaarheid */
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
    padding: 30px 20px 20px 20px;
    color: #ffffff;
    pointer-events: none; /* Zorgt dat je door de tekst heen kunt klikken op de link */
    z-index: 2;
}

.lingerie-masonry-banner .banner-overlay span {
    font-size: 1.1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    display: block;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.2); /* Extra bescherming voor leesbaarheid */
}

/* --- Grid Positionering --- */
.lingerie-masonry-banner .banner-item:nth-child(1) { grid-column: 1; grid-row: 1 / span 2; }
.lingerie-masonry-banner .banner-item:nth-child(2) { grid-column: 2; grid-row: 1; }
.lingerie-masonry-banner .banner-item:nth-child(3) { grid-column: 2; grid-row: 2; }
.lingerie-masonry-banner .banner-item:nth-child(4) { grid-column: 3; grid-row: 1 / span 2; }

/* --- Responsiviteit --- */
@media (max-width: 991px) {
    .lingerie-masonry-banner {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto;
        height: auto;
        grid-auto-rows: 300px;
    }
    .lingerie-masonry-banner .banner-item:nth-child(1),
    .lingerie-masonry-banner .banner-item:nth-child(4) { grid-row: span 2; grid-column: auto; }
    .lingerie-masonry-banner .banner-item:nth-child(2),
    .lingerie-masonry-banner .banner-item:nth-attr(3) { grid-row: span 1; grid-column: auto; }
}

@media (max-width: 767px) {
    .lingerie-masonry-banner {
        grid-template-columns: 1fr;
        grid-auto-rows: 350px;
    }
    .lingerie-masonry-banner .banner-item:nth-child(1),
    .lingerie-masonry-banner .banner-item:nth-child(4) { grid-row: span 1; }
}

/* Nieuwe Video Masonry Container */
.lingerie-video-masonry {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 gelijke kolommen */
    grid-template-rows: repeat(3, 300px);  /* 3 rijen van 300px (totaal 900px hoog) */
    gap: 15px;
    width: 100%;
    margin-bottom: 30px;
}

.lingerie-video-masonry .video-item,
.lingerie-video-masonry .video-item a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 4px;
}

.lingerie-video-masonry .video-item img,
.lingerie-video-masonry .video-item video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.6s ease;
}

.lingerie-video-masonry .video-item:hover img,
.lingerie-video-masonry .video-item:hover video {
    transform: scale(1.05);
}

/* --- De Grid Posities --- */

/* 1. Grote Video: Links boven (2x2 blokken) */
.lingerie-video-masonry .video-item:nth-child(1) {
    grid-column: span 2;
    grid-row: span 2;
}

/* 2. Staande Foto: Rechts (1x2 blokken) */
.lingerie-video-masonry .video-item:nth-child(2) {
    grid-column: 3;
    grid-row: span 2;
}

/* 3, 4, 5. De drie kleine vierkanten op de onderste rij */
.lingerie-video-masonry .video-item:nth-child(3),
.lingerie-video-masonry .video-item:nth-child(4),
.lingerie-video-masonry .video-item:nth-child(5) {
    grid-row: 3;
}

/* --- Overlays --- */
.lingerie-video-masonry .banner-overlay {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%);
    padding: 30px 20px 20px 20px;
    color: #fff;
    z-index: 2;
    pointer-events: none;
}
.lingerie-video-masonry .banner-overlay span {
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 600;
}

/* --- Mobiel --- */

@media (max-width: 767px) {
    .lingerie-video-masonry {
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }
    .lingerie-video-masonry .video-item {
        grid-column: auto !important;
        grid-row: auto !important;
        height: 400px;
    }
}