/*
Theme Name: Urna Child
Theme URI: https://urnawp.com/
Author: Thembay
Description: This is a child theme for Urna
Version: 1.0
Author URI: https://thembay.com/
Template: urna
Text Domain: urna-child
*/

/*  [ Add your custom css below ]
- - - - - - - - - - - - - - - - - - - - */

.tax-product_cat {
    .woof_container_inner_categories {
        display:none;
    }

    .woof_container_inner_productcolor {
        display:none;
    }

    .woof_container_product_cat {
        display:none;
    }

    .woof_container_pa_size {
        display:none;
    }

    .woof_container_pa_color {
        display:none;
    }

    .widget_media_image {
        display: none;
    }



    .sidebar {
        display:none;
    }

    /* Make product category page full width */
    .archive.tax-product_cat #main.archive-shop {
        width: 100% !important;
        max-width: 100% !important;
    }

    .archive.tax-product_cat #main.archive-shop.col-lg-9 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .archive.tax-product_cat #sidebar-shop-left {
        display: none;
    }
}

.tax-product_cat .pull-right.archive-shop.col-lg-9 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

/* Hide the sort ("orderby") dropdown on product category pages */
.tax-product_cat .woocommerce-ordering {
    display: none !important;
}

.post-type-archive-product {
    .widget_media_image {
        display:none;
    }
    .widget_product_tag_cloud {
        display:none;
    }
}

.urna-recent-viewed-products {
    display:none;
}

#track-order {
    display:none;
}

.top-contact {
    display:none;
}
h1,h2,h3,h4 {
    color: #1b7664;
}
.title-primary-color {
    h2 {
        color: #1b7664;
    }
    h3 {
        color: #1b7664 !important;
    }
    .tbay-addon-title {
        font-weight: 700;
    }
}

.comments-link {
    display:none;
}

.entry-date::after {
    display:none;
}

.tax-product_cat {
    h2 {
        color: #1b7664;
    }
}

.single-post {
    h1 {
        color: #1b7664;
    }
    h2 {
        color: #1b7664;
    }
    h3 {
        color: #1b7664;
    }
}

/* Nieuwsbericht: uitgelichte afbeelding weg IN het bericht zelf.
   Blijft wel staan op de voorpagina en op de nieuws-/archiefpagina. */
.single-post .entry-single > .entry-thumb {
    display: none;
}

/* Nieuws-/archiefpagina: alle uitgelichte afbeeldingen dezelfde vaste
   afmeting geven, zodat de kaarten netjes uitlijnen ongeacht bronformaat. */
.blog .entry-thumb,
.archive .entry-thumb,
.search .entry-thumb {
    margin: 0;
}

/* De thumbnail-link (<a class="post-...">) is in het parent-thema inline-block,
   waardoor hij tot de eigen breedte van een kleine afbeelding krimpt. Forceer
   block + 100% zodat de afbeelding altijd de volledige kolom vult, ongeacht het
   bronformaat. */
.blog .entry-thumb > a,
.archive .entry-thumb > a,
.search .entry-thumb > a {
    display: block;
    width: 100%;
}

.blog .entry-thumb img,
.archive .entry-thumb img,
.search .entry-thumb img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    object-position: center;
}

/*.onsale.only-featured .featured {*/
/*    display: none !important;*/
/*}*/

/* Brochure-knop in de product-popup gecentreerd */
.tbay-popup-content .tbay-brochure-btn-wrap {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 0;
}

/* Zelfde groene knopstijl als de "Offerte aanvragen"-knop */
.tbay-popup-content .tbay-brochure-btn {
    display: inline-block;
    padding: 10px 28px;
    background-color: #1b7664;
    border: 2px solid #1b7664;
    color: #ffffff;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 0;
    line-height: 1.5;
}

.tbay-popup-content .tbay-brochure-btn:hover {
    background-color: #155a4d;
    border-color: #155a4d;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(27, 118, 100, 0.3);
}

.tbay-popup-content .tbay-brochure-btn:active {
    background-color: #0f3d34;
    border-color: #0f3d34;
    transform: translateY(0);
}

.wp-block-woocommerce-cart-order-summary-coupon-form-block {
    display:none;
}

/* Financiering / inruilen / brochure-knoppen (.tbay-button-popup-wrap) staan op mobiel te
   dicht op elkaar door de horizontale flex-layout met verticale scheidingsstreepjes. Zet
   ze op mobiel onder elkaar als nette, gecentreerde knoppen met een rand en verberg de
   scheidingsstreepjes. */
@media (max-width: 767px) {
    .tbay-button-popup-wrap {
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: stretch;
        align-items: stretch;
        gap: 12px;
    }

    .tbay-button-popup-wrap li {
        margin-right: 0;
        width: 100%;
    }

    .tbay-button-popup-wrap li::after {
        display: none;
    }

    .tbay-button-popup-wrap li > a {
        -ms-flex-pack: center;
        justify-content: center;
        width: 100%;
        padding: 12px 16px;
        border: 1px solid #1b7664;
        color: #1b7664;
        background: #fff;
        transition: background-color 0.2s ease, color 0.2s ease;
    }

    .tbay-button-popup-wrap li > a:hover,
    .tbay-button-popup-wrap li > a:focus {
        background: #1b7664;
        color: #fff;
    }

    .tbay-button-popup-wrap li > a:hover i,
    .tbay-button-popup-wrap li > a:focus i {
        color: #fff;
    }

    .tbay-button-popup-wrap li > a i {
        color: #1b7664;
    }
}

.wp-block-woocommerce-checkout-order-summary-coupon-form-block {
    display:none;
}

.woocommerce-fillter {
    .dropdown_product_cat {
        display:none;
    }
}

.woof_term_15 {
    display:none;
}

/* Mobile padding for entry */
@media screen and (max-width: 768px) {
    .entry-single {
        padding: 20px 15px;
    }

    /* Additional padding for the content area */
    .post-excerpt.entry-content {
        padding: 15px;
    }

    /* Adjust header padding */
    .entry-header {
        padding: 0 0 15px 0;
    }
}

/* Product attributes (Werkhoogte, Personen, Laadcapaciteit) */
.product-attributes {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 6px;
}

.product-attribute {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    color: #555;
    background: #f4f4f4;
    border-radius: 3px;
    padding: 2px 6px;
    white-space: nowrap;
    justify-content: center;
}

.product-attribute svg.attribute-icon {
    flex-shrink: 0;
    color: #1b7664;
    vertical-align: middle;
}

.product-attribute .attribute-label {
    font-weight: 600;
    color: #333;
}

.product-attribute .attribute-value {
    color: #555;
}

/* For smaller mobile devices */
@media screen and (max-width: 480px) {
    .entry-single {
        padding: 15px 12px;
    }

    .post-excerpt.entry-content {
        padding: 12px;
    }
}


.image.psnav {
    display: none !important;
}

.singular-shop .tbay-modalButton, .single-product .tbay-modalButton {
    background: #1b7664;
    color: white;
    right: auto !important;
    left: 10px !important;
    top: 10px !important;
}

.rating {
    display:none !important;
}

.header-right {
    .top-cart {
        display:none !important;
    }
}


#sticky-menu-bar {
    display:none !important;
}

/* HUSKY filter label list */
.woof_list.woof_list_label {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.woof_list.woof_list_label li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 7px 12px;
    border: 1px solid #e5e5e5;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.woof_list.woof_list_label li:hover,
.woof_list.woof_list_label li.woof_term_selected {
    border-color: #1b7664;
    background: #f0f9f7;
}

.woof_list.woof_list_label .woof_label_term {
    font-size: 13px;
    color: #333;
}

.woof_list.woof_list_label .woof_label_count {
    font-size: 11px;
    color: #fff;
    background: #1b7664;
    border-radius: 10px;
    padding: 1px 7px;
    min-width: 20px;
    text-align: center;
    order: 2;
}

/* Single product page: hide quantity, add-to-cart and buy-now buttons */
.single-product .quantity,
.single-product .single_add_to_cart_button,
.single-product .tbay-buy-now {
    display: none !important;
}

.tbay-popup-content {
    padding-top: 0 !important;
}

.tbay-popup-content .mfp-close {
    font-size: 28px !important;
    line-height: 44px !important;
    color: #000 !important;
}
.tbay-popup-content .mfp-close::after {
    display: none !important;
}

.entry-summary p.price {
    display: block;
    margin: 20px 0 !important;
    color: #1b7664 !important;
}

.entry-summary p.price .amount,
.entry-summary p.price ins .amount {
    color: #1b7664 !important;
}

/* Push button to bottom of product card — both buttons now live in .group-buttons */
.product-block .caption {
    display: flex;
    flex-direction: column;
}

.product-block .caption .group-buttons {
    margin-top: auto;
}

.service-afspraak-button .vc_general {
    background-color: #1b7664 !important;
    border-color: #1b7664 !important;
    color: #ffffff !important;
    transition: all 0.3s ease;
}

.service-afspraak-button .vc_general:hover {
    background-color: #155a4d !important;
    border-color: #155a4d !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(27, 118, 100, 0.3);
}

.service-afspraak-button .vc_general:active {
    background-color: #0f3d34 !important;
    transform: translateY(0);
}

.wpcf7-submit {
    display: inline-block;
    padding: 10px 28px;
    background-color: #1b7664 !important;
    border: 2px solid #1b7664 !important;
    color: #ffffff !important;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
    border-radius: 0;
    line-height: 1.5;
}

.wpcf7-submit:hover {
    background-color: #155a4d !important;
    border-color: #155a4d !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(27, 118, 100, 0.3);
}

.wpcf7-submit:active {
    background-color: #0f3d34 !important;
    border-color: #0f3d34 !important;
    transform: translateY(0);
}

.offerte-btn {
    display: inline-block;
    padding: 10px 28px;
    background-color: #1b7664;
    border: 2px solid #1b7664;
    color: #ffffff;
    font-weight: 600;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 15px;
    border-radius: 0;
    line-height: 1.5;
}

.offerte-btn:hover {
    background-color: #155a4d;
    border-color: #155a4d;
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(27, 118, 100, 0.3);
}

.offerte-btn:active {
    background-color: #0f3d34;
    border-color: #0f3d34;
    transform: translateY(0);
}

.voorraad-all-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 20px;
    color: #888;
    font-size: 14px;
    text-decoration: none;
    transition: color 0.2s ease;
}

.voorraad-all-btn:hover {
    color: #1b7664;
}

.category-faq .vc_toggle {
    margin-bottom: 4px;
}

.category-faq .vc_toggle_title {
    padding-top: 10px;
    padding-bottom: 10px;
}

.woof_checkbox_featured_container {
    display:none;
}
.woof_redraw_zone {
    .woof_submit_search_form_container {
        .woof_submit_search_form {
            display:none;
        }
    }
}

.woof_products_top_panel {
    display:none !important;
}



/* Advisor block */
.category-advisor-wrap {
    margin-top: 40px;
}

.category-advisor-block {
    display: flex;
    min-height: 340px;
    overflow: hidden;
    gap: 4px;
    background: #fff;
}

/* Left column – image with dark overlay */
.advisor-col--left {
    flex: 1 1 50%;
    position: relative;
    background-color: #1a1a1a;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: flex-end;
}

.advisor-col--left::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.25) 60%, transparent 100%);
}

.advisor-col-left-inner {
    position: relative;
    z-index: 1;
    padding: 32px 36px;
    color: #fff;
}

.advisor-left-title {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 12px;
    line-height: 1.3;
}

.advisor-left-content {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255,255,255,0.88);
    margin-bottom: 20px;
}

.advisor-left-btn {
    display: inline-block;
    background: #1b7664;
    color: #fff;
    font-weight: 700;
    font-size: 13px;
    padding: 10px 22px;
    border-radius: 3px;
    text-decoration: none;
    transition: background 0.2s ease;
}

.advisor-left-btn:hover {
    background: #155a4d;
    color: #fff;
}

/* Right column – yellow background */
.advisor-col--right {
    flex: 1 1 50%;
    background: #1b7664;
    padding: 36px 40px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
    gap: 24px;
}

.advisor-right-pretitle {
    font-size: 18px;
    font-weight: 600;
    color: #a0ddd0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0;
    flex: 0 0 100%;
}

.advisor-right-title {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0;
    line-height: 1.3;
    flex: 0 0 100%;
    margin-top: 0;
}

/* Advisor profile row */
.advisor-profile {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
    align-self: stretch;
    gap: 8px;
}

.advisor-photo {
    width: 175px;
    flex: 1;
    min-height: 120px;
    border-radius: 0;
    object-fit: cover;
    border: 2px solid rgba(0,0,0,0.12);
    display: block;
}

.advisor-profile-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

.advisor-name {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    text-align: center;
}

.advisor-rol {
    font-size: 14px;
    color: #a0ddd0;
    text-align: center;
    display: block;
}

.advisor-rol::after {
    content: '';
    display: block;
    width: 60%;
    height: 3px;
    background: #a0ddd0;
    margin: 12px auto 0;
}

.advisor-job-title {
    font-size: 13px;
    color: rgba(255,255,255,0.75);
}

/* Contact buttons */
.advisor-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.advisor-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    width: 100%;
}

.advisor-btn::after {
    content: '→';
    color: #fff;
    font-size: 16px;
    flex-shrink: 0;
    margin-left: auto;
}

.advisor-btn--phone {
    background: rgba(255,255,255,0.15);
    color: #fff;
    border: 2px solid #fff;
}

.advisor-btn--phone:hover {
    background: rgba(255,255,255,0.25);
    color: #fff;
}

.advisor-btn--whatsapp {
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
}

.advisor-btn--whatsapp:hover {
    background: rgba(255,255,255,0.15);
    color: #fff;
}

.advisor-btn--email {
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
}

.advisor-btn--email:hover {
    background: rgba(255,255,255,0.15);
    color: #fff;
}

.advisor-btn--contact {
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
}

.advisor-btn--contact:hover {
    background: rgba(255,255,255,0.15);
    color: #fff;
}

@media (max-width: 768px) {
    .category-advisor-block {
        flex-direction: column;
    }
    .advisor-col--left {
        min-height: 240px;
    }
}

.woocommerce-Price-amount {
    color: #1b7664;
}

#SR7_1_1-3 {
    background: linear-gradient(to top,
    rgba(27, 118, 100, 0.9) 0%,
    rgba(27, 118, 100, 0.6) 20%,
    rgba(27, 118, 100, 0.3) 25%,
    rgba(27, 118, 100, 0.1) 35%,
    transparent 50%);
}

.tbay-copyright a {
    text-align: center;
}

.tbay-copyright .vc_column_container {
    display: flex;
    justify-content: center;
    align-items: center;
}

.tbay-copyright .vc_column-inner {
    text-align: center;
}

/* "zie ook"-kop in kleine letters en bold; het thema zet .tbay-addon-title standaard op
   uppercase. */
#product-related .tbay-addon-title,
#product-related .tbay-addon-title span {
    text-transform: none;
    font-weight: 700;
}

/* Related products ("Zie ook"): zelfde kleurschema als het voorraad-overzicht —
   producttitel donkergrijs, prijs groen. */
#product-related .caption h3.name a {
    color: #333;
}

#product-related .caption .price,
#product-related .caption .price .woocommerce-Price-amount {
    color: #1b7664;
}

/* Voorraad-overzicht (/shop/): productprijzen in de groene thema-kleur. Gescoped op de
   shop-body zodat categorie- en productpagina's ongemoeid blijven. */
body.woocommerce-shop .price,
body.woocommerce-shop .price .woocommerce-Price-amount {
    color: #1b7664;
}

/* Voorraad-overzicht: producttitels in donkergrijs (prijs is groen), zodat de titel
   niet met de prijs concurreert. */
body.woocommerce-shop .product-block .caption h3.name a {
    color: #333;
}

/* Productpagina: producttitel donkergrijs, gelijk aan de voorraad-kaarten (thema zet h1
   standaard op groen). */
body.single-product .entry-summary .product_title {
    color: #333;
}

/* "OP AANVRAAG" overal in de groene themakleur (matcht de prijzen; nooit rood) */
.op-aanvraag {
    color: #1b7664 !important;
}

.tbay-copyright .wpb_text_column {
    text-align: center;
}

.prlt0 {
    display:none;
}

/* HUSKY toont tijdens de AJAX-draw een "Loading ..."-popup (#woof_html_buffer). De
   tekst is al leeggemaakt (gettext), maar HUSKY fadet de container toch even in tot een
   leeg donker blokje ("dot") en zet 'display:none' pas ná de draw terug. Verberg de
   container volledig zodat er niets oplicht. */
div.woof_info_popup,
#woof_html_buffer {
    display: none !important;
}

/* HUSKY vervangt bij paginering/filteren de productlijst via AJAX en wrapt die in
   .woof_shortcode_output. Forceer daar hetzelfde grid als de eerste (server-)render.
   Breakpoints: desktop 3, tablet 3, mobiel 1. */
.woof_shortcode_output .display-products:not(.products-list) .row > div {
    -ms-flex: 33.33333%;
    flex: 33.33333%;
    max-width: 33.33333%;
}

@media (max-width: 991px) {
    .woof_shortcode_output .display-products:not(.products-list) .row > div {
        -ms-flex: 33.33333%;
        flex: 33.33333%;
        max-width: 33.33333%;
    }
}

@media (max-width: 767px) {
    .woof_shortcode_output .display-products:not(.products-list) .row > div {
        -ms-flex: 50%;
        flex: 50%;
        max-width: 50%;
    }
}

.products-grid .product-block {
    width: 100%;
}

.products-grid .product-content {
    width: 100%;
}

.slick-slide .products-grid {
    width: 100%;
}

/* Remove any unwanted padding/margin */
.slick-slide .item {
    padding: 0;
}

.product-block.grid.v1 {
    width: 100% !important;
}

.product-block .block-inner,
.product-block figure.image {
    width: 100%;
}

.product-block figure.image a {
    display: block;
    width: 100%;
}

/* Ensure caption is visible */
.product-block .caption {
    display: block;
    width: 100%;
}

/* Lange productnamen mogen niet uit de kaart lopen; laat ze netjes afbreken. De
   naam-link is inline en kan breder worden dan de kaart, dus block + word-break. */
.product-block .caption,
.product-block .caption h3.name {
    overflow-wrap: break-word;
    word-wrap: break-word;
    min-width: 0;
    max-width: 100%;
}
.product-block .caption h3.name a {
    display: block;
    max-width: 100%;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
    /* Ruimte voor 2 regels titel, zodat kaarten gelijk uitlijnen. */
    line-height: 1.3;
    min-height: 2.6em;
}

.woof_checkbox_instock_container {
    display:none;
}

.tbay-addon-product-tabs .product-tabs-title {
    display: none;
}

/* Categories grid: a bit more spacing below the category name */
.tbay-addon-grid.tbay-addon-categories .item-cat .content {
    padding-bottom: 16px;
}

/* Features bar: stack icon above text and center everything */
.tbay-addon-features .inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
}
.tbay-addon-features .inner > div {
    display: block;
}
.tbay-addon-features .fbox-icon,
.tbay-addon-features .fbox-image {
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 10px;
}
.tbay-addon-features .fbox-content {
    text-align: center;
}

/* Categories carousel → plain list on mobile */
@media (max-width: 767px) {
    /* Break out of owl carousel track */
    .tbay-addon-carousel.tbay-addon-categories .owl-carousel .owl-stage-outer,
    .tbay-addon-carousel.tbay-addon-categories .owl-carousel .owl-stage {
        display: block !important;
        transform: none !important;
        width: auto !important;
    }

    .tbay-addon-carousel.tbay-addon-categories .owl-carousel .owl-item {
        display: block !important;
        width: auto !important;
        float: none !important;
        opacity: 1 !important;
    }

    /* Each .item stacks as a list row */
    .tbay-addon-carousel.tbay-addon-categories .item {
        display: block !important;
        width: auto !important;
        float: none !important;
    }

    /* Hide the image link */
    .tbay-addon-carousel.tbay-addon-categories .item-cat > a:first-child {
        display: none !important;
    }

    /* List row styling */
    .tbay-addon-carousel.tbay-addon-categories .item-cat {
        display: block;
        border-bottom: 1px solid #e5e5e5;
    }

    .tbay-addon-carousel.tbay-addon-categories .owl-item:first-child .item-cat {
        border-top: 1px solid #e5e5e5;
    }

    /* Remove any extra padding/margin from .content wrapper */
    .tbay-addon-carousel.tbay-addon-categories .item-cat .content {
        display: block;
        padding: 0;
        margin: 0;
        text-align: left;
    }

    /* Name link spans full row with chevron */
    .tbay-addon-carousel.tbay-addon-categories .item-cat .content .cat-name {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        padding: 12px 16px;
        font-size: 15px;
        font-weight: 600;
        color: #333;
        text-decoration: none;
    }

    .tbay-addon-carousel.tbay-addon-categories .item-cat .content .cat-name::after {
        content: '\203A';
        font-size: 22px;
        color: #1b7664;
        line-height: 1;
        flex-shrink: 0;
    }

    .tbay-addon-carousel.tbay-addon-categories .item-cat .content .cat-name:hover {
        color: #1b7664;
    }

    /* Hide item count */
    .tbay-addon-carousel.tbay-addon-categories .item-cat .count-item {
        display: none;
    }

    /* Hide carousel nav/dots */
    .tbay-addon-carousel.tbay-addon-categories .owl-nav,
    .tbay-addon-carousel.tbay-addon-categories .owl-dots {
        display: none !important;
    }
}
/* ─── Product attributes table ─────────────────────────────────────────────── */
/* Class-based zodat dezelfde opmaak geldt in de gewone tab, het mobiele uitschuif-panel
   én de mobiele accordion (waar de tabel niet in #tab-additional_information zit). */
.woocommerce-product-attributes.shop_attributes {
    display: grid;
    grid-template-columns: max-content 1fr max-content 1fr;
    width: 100%;
    font-size: 14px;
    border-top: 1px solid #eee;
    border-left: 1px solid #eee;
}

.woocommerce-product-attributes.shop_attributes tbody,
.woocommerce-product-attributes.shop_attributes tr {
    display: contents;
}

.woocommerce-product-attributes.shop_attributes th,
.woocommerce-product-attributes.shop_attributes th,
.woocommerce-product-attributes.shop_attributes td {
    padding: 10px 16px;
    text-align: left;
    display: flex;
    align-items: center;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    box-sizing: border-box;
    min-width: 0;
}

.woocommerce-product-attributes.shop_attributes th {
    font-weight: 600;
    color: #1b7664;
    white-space: nowrap;
    background: #f7f9f8;
    width: auto;
}

/* WooCommerce kleurt even rijen (tr:nth-child(even) td) grijs; forceer alle waarden wit
   zodat labels grijs en waarden wit blijven. */
.woocommerce-product-attributes.shop_attributes td,
.woocommerce table.shop_attributes tr:nth-child(even) td {
    color: #333;
    background: #fff;
}

/* Even-rij labels dezelfde grijstint als de overige labels houden. */
.woocommerce table.shop_attributes tr:nth-child(even) th {
    background: #f7f9f8;
}

.woocommerce-product-attributes.shop_attributes td p,
.woocommerce-product-attributes.shop_attributes th p {
    margin: 0;
    padding: 0;
}

/* Op mobiel de specificaties onder elkaar tonen (label boven waarde) in plaats van twee
   label-waarde-paren naast elkaar; anders zijn ze te smal om te lezen. Elk label en elke
   waarde pakt de volledige breedte. */
@media (max-width: 767px) {
    .woocommerce-product-attributes.shop_attributes {
        grid-template-columns: 1fr;
    }

    /* Het thema zet .woocommerce table.shop_attributes th op width:150px; overschrijf dat
       met gelijke specificiteit zodat het label op mobiel full-width wordt. */
    .woocommerce table.shop_attributes.woocommerce-product-attributes th,
    .woocommerce-product-attributes.shop_attributes th,
    .woocommerce-product-attributes.shop_attributes td {
        display: flex;
        width: 100%;
        max-width: 100%;
        padding: 12px 16px;
        white-space: normal;
        word-break: break-word;
    }
}

/* Hide empty paragraphs wpautop injects around raw HTML blocks in WPBakery content (e.g. homepage hero) */
.wpb_wrapper > p:empty {
    display: none;
}

/* HUSKY voorraadfilter: subcategorieën van Categorieën altijd uitgeklapt tonen
   en de losse in-/uitklap-toggle verbergen (overbodig nu alles openstaat). */
.woof_container_product_cat .woof_childs_list {
    display: block !important;
}

.woof_container_product_cat .woof_childs_list_opener {
    display: none !important;
}

/* Homepage hero (.tl-hero) op mobiel: minder hoog én edgeless (volledige breedte zonder de
   standaard WPBakery-kolompadding aan de zijkanten). De inline min-height vereist
   !important om overschreven te worden. */
@media (max-width: 767px) {
    .tl-hero {
        min-height: 260px !important;
    }

    /* Het thema zet op mobiel 15px zijkant-padding op de kolom van elke full-width vc_row:
       body .vc_row[data-vc-full-width="true"]>div[class*="col-"] { padding: 0 15px }.
       Voor de hero-rij die padding weghalen zodat de hero edgeless loopt. */
    body .vc_row[data-vc-full-width="true"]:has(.tl-hero) > div[class*="col-"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
/* Zoekbalk op mobiel: de "Search in.."-categoriekeuze verbergen zodat er altijd in alle
   categorieën gezocht wordt. */
@media (max-width: 767px) {
    .tbay-search-form .select-category,
    .tbay-search-form .select-category.input-group-addon {
        display: none !important;
    }
}

/* De categorie-tabs-widget toont soms alleen een lege "All"-tab (data-value="") die niets
   doet. Verberg die overbodige tab-balk. Alleen wanneer de enige tab de lege "All" is. */
.product-categories-tabs-title:has(> li:only-child > a[data-value=""]) {
    display: none !important;
}

/* Merklogo's op de homepage weer klikbaar maken; de thema-opties custom-CSS zet
   pointer-events:none op de brand-links. */
.tbay-addon-brands.carousel .item a {
    pointer-events: auto !important;
    cursor: pointer !important;
}

/* Merken-sectie op mobiel: minder witruimte eronder (de merkenrij en de lege
   footer-spacer-row eronder hebben veel ondermarge/padding). */
@media (max-width: 767px) {
    .vc_custom_1776261552462 {
        padding-bottom: 10px !important;
    }

    /* Lege spacer-row bovenaan de footer inklappen op mobiel. */
    .tbay-footer .vc_custom_1548400491861 {
        padding-bottom: 0 !important;
    }
}

/* Merken-carousel op mobiel: logo's centreren binnen de slide (bij 1 per view staan ze
   anders links uitgelijnd). */
@media (max-width: 767px) {
    /* Slick geeft elke slide een vaste breedte en floats; centreer de inhoud van de slide
       via flex zodat het logo horizontaal in het midden staat. */
    .tbay-addon-brands .owl-carousel.brands .slick-slide {
        display: flex !important;
        align-items: center;
        justify-content: center;
        text-align: center !important;
    }

    .tbay-addon-brands .owl-carousel.brands .slick-slide > .item,
    .tbay-addon-brands .owl-carousel.brands .slick-slide .item a {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 100% !important;
        float: none !important;
    }

    .tbay-addon-brands .owl-carousel.brands .slick-slide img {
        display: block !important;
        float: none !important;
        margin: 0 auto !important;
    }
}

/* De padding-top van 50px op de footer weghalen. */
#tbay-footer {
    padding-top: 0;
}

/* ActiveCampaign nieuwsbrief-formulier in de footer: margins/padding weghalen en de velden
   + knop op één rij tonen met de verzendknop rechts ernaast. Het AC-formulier heeft veel
   eigen inline CSS, dus overrulen met !important. */
.tbay-footer ._form,
.tbay-footer ._form_24,
.tbay-footer ._form-content {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
}

/* Velden en knop naast elkaar; knop rechts. */
.tbay-footer ._form_24 ._form-content {
    display: flex !important;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 10px;
}

.tbay-footer ._form_24 ._form_element {
    margin: 0 !important;
    padding: 0 !important;
    flex: 1 1 auto;
    min-width: 0;
}

.tbay-footer ._form_24 ._button-wrapper {
    margin: 0 !important;
    padding: 0 !important;
    flex: 0 0 auto;
}

.tbay-footer ._form_24 ._button-wrapper ._submit {
    margin: 0 !important;
    top: 0 !important;
}

.tbay-footer ._form_24 input[type="text"] {
    width: 100% !important;
}

.tbay-footer ._form_24 ._clear-element {
    display: none !important;
}

/* Specificatie-waardes van globale attributen zijn links naar het term-archief. Die moeten
   niet klikbaar zijn, maar wél hun opmaak behouden: schakel alleen de klik uit. */
.woocommerce-product-attributes-item__value a {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: inherit;
}

/* Het Nijland-logo is een transparante WebP met zwarte tekst; op de donkere footer valt
   die tekst weg. De witte achtergrond hoort op het element dat even groot is als het beeld
   (de afbeelding-wrapper/img), niet op de omliggende .wpb_single_image-div — daar dekt de
   img de achtergrond volledig af. */
.nijland-footer-logo .vc_single_image-wrapper,
.nijland-footer-logo .vc_single_image-img {
    background-color: #fff;
}

/* Vergroot het footer-logo. De inline VC-css cap't het blok; forceer daarom de
   blok-/beeldbreedte binnen de bestaande kolom. */
.nijland-footer-logo.wpb_single_image {
    width: 100px !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    float: none !important;
    text-align: left !important;
}
/* Overrule de rechts-uitlijning van het thema (.payment) en vc_align_right. */
.nijland-footer-logo.vc_align_right,
.tbay-footer .payment.nijland-footer-logo {
    text-align: left !important;
    float: none !important;
}
.nijland-footer-logo.vc_align_right .vc_figure {
    text-align: left !important;
}
.nijland-footer-logo .vc_figure,
.nijland-footer-logo .vc_single_image-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}
.nijland-footer-logo .vc_single_image-img {
    width: 100% !important;
    height: auto !important;
}

/* Productgrid op mobiel: 1 product per rij i.p.v. 2. De theme-JS zet op basis van
   data-mobile een breedte (50%) op elk .product; forceer volledige breedte onder 767px.
   loop-start.php zet data-mobile al op 1, deze CSS overrulet de inline breedte van de JS. */
@media (max-width: 767px) {
    .row[data-mobile="1"] > .product {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        clear: both !important;
    }

    /* De theme-JS zet een vaste px-breedte op .product die op smalle schermen breder
       is dan de viewport, waardoor kaarten uitsteken. Forceer een breedte relatief aan
       het scherm: 50% bij 2 kolommen, 100% bij 1 kolom. */
    .row[data-mobile="2"] > .product {
        width: 50% !important;
        max-width: 50% !important;
    }
    .row[data-mobile] > .product,
    .row[data-mobile] > .product .product-block,
    .row[data-mobile] > .product .product-content,
    .row[data-mobile] > .product .caption {
        box-sizing: border-box !important;
        max-width: 100% !important;
    }
    .row[data-mobile] > .product .product-block {
        overflow: hidden !important;
    }
    .row[data-mobile] > .product figure.image img,
    .row[data-mobile] > .product .caption h3.name a,
    .row[data-mobile] > .product .price {
        max-width: 100% !important;
        overflow-wrap: break-word !important;
        word-break: break-word !important;
    }
    /* Titel dwingend binnen de kaart houden: geen nowrap, wél afbreken. */
    .row[data-mobile] > .product .caption h3.name,
    .row[data-mobile] > .product .caption h3.name a,
    .row[data-mobile] > .product .caption .name,
    .row[data-mobile] > .product .caption .name a {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
        box-sizing: border-box !important;
    }
}

/* Het thema zet op smalle schermen white-space:nowrap + overflow:hidden op de
   productnaam, waardoor lange titels uit de kaart steken. Laat ze afbreken. */
@media (max-width: 599px) {
    .product-block .name:not(.full_name) a {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }
}

/* Lege knopblok verbergen: als .add-cart geen echte knop (<a>) bevat, is de
   group-buttons leeg en hoeft 'ie geen ruimte in te nemen. */
.product-block .group-buttons:not(:has(.add-cart a)) {
    display: none;
}

/* Toegankelijkheid: #888 op wit haalt de WCAG-contrastnorm (4.5:1) niet.
   #767676 is de donkerste grijstint die er nog hetzelfde uitziet en wel 4.54:1
   haalt. Geldt voor categorie-tellers, "alles bekijken"-links en doorgestreepte
   prijzen. */
.item-cat .content .count-item,
.tbay-addon a.show-all,
.tbay-addon a.voorraad-all-btn,
.price del .woocommerce-Price-amount bdi {
    color: #767676;
}
