/*
Theme Name:     Borealis creativist studio
Theme URI:      https://borealis.creativiststudio.com/
Template:       kadence
Author:         creativist studio
Author URI:     https://creativist.studio
Description:    A modern and minimal Kadence child theme designed for creatives and small shop owners who seek clarity, calm, and elegance. With its clean layout and serene aesthetic, Borealis offers a beautiful canvas to highlight your products and stories with natural sophistication.
Version:        0.1
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/
.woocommerce ul.products li.product .product-action-wrap {
	margin-top: 1em ; display: none;
}

.wc-block-product-template {
	
	margin-left: 0 !important;
    padding-left: 0 !important;
}



/* Ou cibler le conteneur interne */
.wp-block-woocommerce-handpicked-products .wc-block-grid__products {
    margin-left: 0;
    padding-left: 0;
}

/* Pour les produits individuels */
.wp-block-woocommerce-handpicked-products .wc-block-grid__product {
    margin-left: 0;
}


.customBlockSingle {
    position: sticky;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transform-origin: center top;
    z-index: 100;
    /* Suppression des styles de largeur et couleur forcés */
}


    

.customBlockSingle:nth-of-type(1),
.customBlockSingle.block-1 { top: 1cm; width: 100% !important;
    max-width: 100%;
     }

.customBlockSingle:nth-of-type(2),
.customBlockSingle.block-2 { top: 1.3cm;  width: 100% !important;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;}

.customBlockSingle:nth-of-type(3),
.customBlockSingle.block-3 { top: 1.6cm;  width: 100% !important;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;}

.customBlockSingle:nth-of-type(4),
.customBlockSingle.block-4 { top: 1.9cm;  width: 100% !important;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;}

.customBlockSingle:nth-of-type(5),
.customBlockSingle.block-5 { top: 2.2cm;  width: 100% !important;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important;}

.customBlockSingle:nth-of-type(6),
.customBlockSingle.block-6 { top: 2.5cm; width: 100% !important;
    max-width: 100%;
    margin-left: auto !important;
    margin-right: auto !important; }

/* États de réduction - seulement transform et z-index */
.customBlockSingle.reduce-1 {
    transform: scale(0.9);
    z-index: 99 !important;
}

.customBlockSingle.reduce-2 {
    transform: scale(0.81);
    z-index: 98 !important;
}

.customBlockSingle.reduce-3 {
    transform: scale(0.729);
    z-index: 97 !important;
}

.customBlockSingle.reduce-4 {
    transform: scale(0.6561);
    z-index: 96 !important;
}

.customBlockSingle.reduce-5 {
    transform: scale(0.59049);
    z-index: 95 !important;
}

.customBlockSingle.reduce-6 {
    transform: scale(0.531441);
    z-index: 94 !important;
}

/* Responsive - suppression des largeurs forcées */
@media (max-width: 900px) {
    .customBlockSingle:nth-of-type(1), .customBlockSingle.block-1 { top: 0.8cm; }
    .customBlockSingle:nth-of-type(2), .customBlockSingle.block-2 { top: 1cm; }
    .customBlockSingle:nth-of-type(3), .customBlockSingle.block-3 { top: 1.2cm; }
    .customBlockSingle:nth-of-type(4), .customBlockSingle.block-4 { top: 1.4cm; }
    .customBlockSingle:nth-of-type(5), .customBlockSingle.block-5 { top: 1.6cm; }
    .customBlockSingle:nth-of-type(6), .customBlockSingle.block-6 { top: 1.8cm; }
}

/* Compatibilité Kadence - styles minimalistes */
.site-header-upper-inner-wrap.child-is-fixed {
    height: 0px !important;
    margin-top: 20px;
}

.wp-site-blocks .customBlockSingle,
.entry-content .customBlockSingle {
    position: sticky;
}

.customBlockSingle * {
    will-change: transform;
}

.sticky-blocks-container {
    display: flex; /* Arrange children in a row */
    flex-wrap: wrap; /* Allow items to wrap to the next line on smaller screens */
    gap: 20px; /* Space between your blocks */
    align-items: flex-start; /* Align items to the top if they have different heights */
}

.sticky-blocks-container .customBlockSingle {
    flex: 1 1 calc(33.333% - 20px); /* Example: 3 columns with gap */
    /* Or a fixed width: */
    /* width: 300px; */
    /* max-width: 100%; */
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
    .sticky-blocks-container .customBlockSingle {
        flex: 1 1 calc(50% - 20px); /* 2 columns on tablets */
    }
}

@media (max-width: 480px) {
    .sticky-blocks-container .customBlockSingle {
        flex: 1 1 100%; /* 1 column on mobile */
    }
}