/*
Theme Name: Mazel Galerie 2025
Author: eZoulou.be
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Version: 0.300
*/

/* manage theme translation with polylang + custom classes */
html:not([lang="fr-BE"]) .show-fr {
    display: none;
}
html:not([lang="en-GB"]) .show-en {
    display: none;
}
/* no link style on taxonomy links */
.wp-block-post-terms a {
    text-decoration: none;
    color: var(--wp--preset--color--foreground);
}
/* No Links styles on titles */
a.kb-advanced-heading-link {
    text-decoration: none;
}
/* separator KB fix */
.kt-divider-stripe {
    height: 20% !important;
}
/* 
 * LAYOUT
 */
/* HEADER */
header.wp-block-template-part {
    position: relative;
    z-index: 100; /* fixes bug on single product: image magnifier is over sub-menu */
}

/* Header house logo */
.custom-logo2 {
    flex-shrink: 0;
}
/* LANGUAGE MENU */
.polylang_langswitcher,
.polylang_langswitcher li {
    display: flex;
    gap: .2rem;
}
.polylang_langswitcher li:not(:first-child):before {
    content: '/';
    display: block;
}
.polylang_langswitcher a {
    text-decoration: none;
    text-transform: uppercase;
}
.polylang_langswitcher :not(.current-lang) a {
    color: var(--wp--preset--color--primary);
}
/* MAIN MENU */
header.wp-block-template-part ul.wp-block-navigation a {
    padding: .7rem; 
}
header.wp-block-template-part ul.wp-block-navigation li.current-menu-item,
header.wp-block-template-part ul.wp-block-navigation li.current-menu-ancestor {
    background-color: var(--wp--preset--color--primary) !important;
    color: var(--wp--preset--color--background) !important;
}
header.wp-block-template-part .wp-block-navigation__submenu-icon {
    margin-left: -.25rem;
    margin-right: .25rem;
}
/* artistes list page */
body.page-id-13406 .wp-block-post-content, 
body.page-id-18992 .wp-block-post-content
    /* FIXME HARDCODED */
    {
    --img-w: 450px;
    --img-h: 600px;
    position: relative;
    max-width: calc(var(--wp--style--global--content-size));
    margin-left: auto !important;
    margin-right: auto !important;
    /* padding-left: 0;
    padding-right: 0; */
    min-height: var(--img-h);
    padding-top: calc(var(--img-h) + 2rem);
}
.custom-artists-list {
    margin-left: 0 !important;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}
.custom-artists-list li {
    display: block;
    flex-basis: 50%;
}
.custom-artists-list a {
    text-transform: uppercase;
    font-weight: bold;
    color: var(--wp--preset--color--foreground);
    text-decoration: none;
    padding: .1rem .5rem;
    display: inline-block;
}
.custom-artists-list li .vignette {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    text-align: right;
    height: var(--img-h);
    display: flex;
    justify-content: center;
    align-items: center;
}
.custom-artists-list li .vignette img {
    max-width: 100%;
    width: auto;
    display: block;
    max-height: var(--img-h);
}
.custom-artists-list .focus .vignette {
    z-index: 100;
    opacity: 1;
}
.custom-artists-list .focus > a {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--background);
}
@media (min-width: 800px) {
    .custom-artists-list {
        max-width: calc(100% - var(--img-w));
    }
    .custom-artists-list li .vignette {
        width: var(--img-w);
    }
    body.page-id-13406 .wp-block-post-content, 
    body.page-id-18992 .wp-block-post-content {
        padding-top: 0;
    }
    
}
/* artist detail page */
img.portrait {
    max-height: 50vh;
}
/* Product categories pages */
body.archive:is(.tax-product_cat, .tax-product_tag) .wp-block-kadence-query {
    margin-top: -1rem;
}
body.archive:is(.tax-product_cat, .tax-product_tag) .wp-block-kadence-query select.kb-filter {
    margin-top: -1rem;
    position: relative;
    top: -1rem;
}

/* Artist artwork by category */
.artist_works_per_category {
    margin-bottom: 3rem;
}
.artist_works_per_category .product {
    transition: all .3s ease-in-out;
}
.artist_works_per_category .display-stock-status-instock .product:not(.stock-status-instock) {
    opacity: .5;
}
ul.grid {
    --item_width: 150px;
    display: grid;
    grid-template-columns: repeat( auto-fit, minmax(var(--item_width), 1fr) );
    gap: 2rem;
    padding: 0;
    margin: 1rem 0 3rem;
}
ul.grid li {
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 .5rem rgba(0,0,0,.5);
}
ul.grid img:first-child {
    aspect-ratio: 1;
    object-fit: cover;
    display: block;
    width: 100%;
    height: 100%;
}
@media (min-width: 600px) {
    ul.grid {
        --item_width: 200px;
    }
}
/* artist with store products */
.artist-store-products {
    margin-bottom: 3rem;
}
body:not(.artist-with-store-products) .artist-store-products {
    display: none;
}

/* SINGLE PRODUCT */

/* 
 * Removes default ZOOM functionnality. 
 * BUG : made via CSS 
 */
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .zoomImg {
    display: none !important;    
}

    /* product VS artwork */
        /* NO JS = no Fancybox */
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) header.wp-block-template-part, 
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) footer.wp-block-template-part, 
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) .wp-block-woocommerce-product-meta,
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) .wp-block-woocommerce-product-details, 
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) .wp-block-woocommerce-product-collection,
     /* JS is on = Fancybox is on */
body.single-product:not(.product_cat-oeuvres):not(.product_cat-artworks) .custom-inquire {
    display: none;
}
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) .wp-block-columns {
    flex-direction: row-reverse;
}
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) main > .wp-block-cover.alignfull {
    min-height: 100vh;
}
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) .woocommerce.product  {
    margin-block: 0;
}
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) main > a.close {
    position: fixed;
    top: 0; 
    right: var(--wp--preset--spacing--x-small);
    z-index: 100;
    text-decoration: none;
    color: var(--wp--preset--color--primary);
    font-size: 1.5rem;
    font-weight: bold;  
}
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) .taxonomy-artist_tax:after {
    display: none;
}

/* remove zoom button on artwork pages */
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) a.woocommerce-product-gallery__trigger {
    background: transparent !important;
    border-radius: 0 !important;
    width: 100% !important;
    height: 100% !important;
    inset: 0 !important;
}
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) a.woocommerce-product-gallery__trigger:before,
body.single-product:is(.product_cat-oeuvres, .product_cat-artworks) a.woocommerce-product-gallery__trigger:after {
    display: none !important;
}

/* PRODUCT GRID */
    /* add a 'out of stock' marker to product */ 
    /* recopy default woocommerce style */
li.kb-query-item.product.outofstock { 
    --marker-height: 14px;
    --marker-width: 65px;
    --marker-padd: .3em; 
}
li.kb-query-item.product.outofstock a.kb-advanced-image-link::before {
    content: ' ';
    display: block;
    position: absolute;
    top: 0;
    left: 0;    
    background-color: #e06641;
    height: calc(var(--marker-height) + var(--marker-padd) * 2);
    transform: skew(-30deg);
    transform-origin: left bottom;
    width: calc(var(--marker-width) + var(--marker-padd) * 2);
}
li.kb-query-item.product.outofstock a.kb-advanced-image-link::after {
    content: 'Sold out';
    display: block;
    position: absolute;
    top: 0;
    left: 0;    
    background-color: #e06641;
    color: white;
    padding: var(--marker-padd);
    font-size: var(--marker-height);
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0px;
    width: var(--marker-width);
    text-align: center;
}

    /* EVENT STATES */
.taxonomy-event-state a {
    --pad: .1rem .5rem;
    display: none;
    font-size: 90%;
    background-color: var(--wp--preset--color--cyan-bluish-gray);
    color: var(--wp--preset--color--foreground);
    padding: var(--pad);
    font-weight: bold;
}
    /* en cours / A venir. Based on href. */
.taxonomy-event-state a[href*="/en-cours/"],
.taxonomy-event-state a[href*="/current/"],
.taxonomy-event-state a[href*="/a-venir/"],
.taxonomy-event-state a[href*="/upcoming/"] {
    display: block;
}

/* past expos, displayed under current*/ 
.wp-block-kadence-query-filtermg25__taxonomy-event-state-passees_1fe505-f6, 
.wp-block-kadence-query-filtermg25__taxonomy-event-state-en-cours_a2bdf0-7d {
    margin-left: auto;
}
/* too many artists :-) */
.taxonomy-artist_tax {
    max-height: 4em;
    overflow: hidden;
    position: relative;
    transition: all .25s ease-in-out;
}
.taxonomy-artist_tax:after {
    content: "…";
    display: block;
    position: absolute;
    top: 2.6em;
    right: 0;
    width: 100%;
    height: 1.5em;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
    text-align: right;
}
.taxonomy-artist_tax:hover,
.taxonomy-artist_tax:focus {
    max-height: none;
}
.taxonomy-artist_tax:hover:after,
.taxonomy-artist_tax:focus:after {
    display: none;
}

/* newsletter form */
.mc4wp-form {
    max-width: 400px;
}
.mc4wp-form p {
    margin-block: .1rem;
    padding: .2rem .8rem;
    background-color: #eee;
    display: flex;
    gap: .5rem;
}
.mc4wp-form label {
    flex-basis: 30%;
    text-align: right;
    display: inline-block;
}
.mc4wp-form input {
    color: var(--wp--preset--color--foreground);
    font-family: var(--wp--preset--font-family--hanken-grotesk);
    font-size: var(--wp--preset--font-size--x-small);
    font-style: normal;
    font-weight: 200;
}
.mc4wp-form button {
    margin-top: .1rem;
    width: 100%;
}

/* custom artwork navigation */
.custom-artworks-nav a {
    position: fixed;
    top: 0;
    text-decoration: none;
    font-size: 3rem;
    color: var(--wp--preset--color--primary);
    z-index: 100;
    display: none;
}
body.product_cat-oeuvres .custom-artworks-nav a,
body.product_cat-artworks .custom-artworks-nav a {
    display: block;
}
.custom-artworks-nav a[rel='next'] {
    left: var(--wp--preset--spacing--x-small);
}
.custom-artworks-nav a[rel='prev'] {
    right: calc(100% - (var(--wp--preset--spacing--x-small) + 2ch));
    margin-top: 1px;
}