/*
 Theme Name: Blocksy Child
 Theme URI: https://nicochap.com/
 Description: Thème enfant de Blocksy.
 Author: Nicolas Chapelain
 Author URI: https://nicochap.com/
 Template: blocksy
 Version: 1.0.0
*/

:root {
    --theme-font-family: 'Alte Haas Grotesk Bold'
}
@font-face {
    font-family: 'Alte Haas Grotesk Bold';
    src: url('fonts/AlteHaasGrotesk_Bold.woff2') format('woff2'),
         url('fonts/AlteHaasGrotesk_Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: var(--theme-font-family), sans-serif!important;
    font-weight: bold!important;
	position:relative!important;
}
body, p, h1, h2, h3, h4, h5, h6, em, ol, ul, li, tr, th, td, dl, ins, sub, sup, big, cite, code, form, small, label, table, figure, button, legend, strike, address, caption, fieldset, blockquote {
    letter-spacing: -0.05em !important;
    line-height: 1em !important;
}

/*MENU*/
.menu-item.cart-menu-item {
    position: relative;
}

.menu-item.cart-menu-item a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.menu-item.cart-menu-item svg {
    width: 30px; /* Ajustez la taille du SVG selon vos besoins */
    height: auto;
}

.menu-item.cart-menu-item .cart-count {
    position: absolute;
    top: 25%;
    right: -10px;
    background-color: #ff0000; /* Couleur de fond du compteur */
    color: #ffffff; /* Couleur du texte du compteur */
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
}
.menu-item.account-menu-item,.menu-item.search-menu-item {
	
    position: relative;
}

   .menu-item.account-menu-item{
       margin-right: -1vw
   }
   .menu-item.search-menu-item {
    margin-right:-1vw;
	   margin-left:10vw;
   }

.menu-item.account-menu-item a, .menu-item.search-menu-item a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.menu-item.account-menu-item svg,.menu-item.search-menu-item svg {
    width: 30px; /* Ajustez la taille du SVG selon vos besoins */
    height: auto;
}
#header [data-column-set="2"]>div {
    display: grid;
    grid-template-columns: 100px auto!important;
}
[data-column=end] [data-items=primary]>*:last-child {
    margin: 0 0 0 20px!important;
}
.sub-menu li.menu-item{
    display: inline-block!important;
}
.sub-menu li.menu-item a{

    text-transform: uppercase;
}
[data-header*="type-1"] .ct-header [data-id="menu"] .sub-menu {
    position: fixed;
    left: 0;
    top: 100px;
    width: 100%;
}
.ct-toggle-dropdown-desktop {
    display: none!important;
}
@keyframes rotation {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  
  .default-logo {
    animation: rotation 15s infinite linear;
  }

  @media screen AND (max-width:1500px) {
    [data-header*="type-1"] .ct-header [data-id="menu"] > ul > li > a {
        font-size: 28px!important;
    }
    .menu-item.account-menu-item svg, .menu-item.search-menu-item svg, .menu-item.cart-menu-item svg {
        width: 28px;

    }
    [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
        --logo-max-height: 65px;
    }
    [data-header*="type-1"] .ct-header [data-row*="middle"] {
        --height: 100px;
    }
}
  @media screen AND (max-width:1400px) {
    [data-header*="type-1"] .ct-header [data-id="menu"] > ul > li > a {
        font-size: 26px!important;
    }
    .menu-item.account-menu-item svg, .menu-item.search-menu-item svg, .menu-item.cart-menu-item svg {
        width: 26px;

    }
    [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
        --logo-max-height: 60px;
    }
    [data-header*="type-1"] .ct-header [data-row*="middle"] {
        --height: 96px;
    }
    [data-header*="type-1"] .ct-header [data-id="menu"] .sub-menu {
        top:96px!important
    }
}
@media screen AND (max-width:1300px) {
    [data-header*="type-1"] .ct-header [data-id="menu"] > ul > li > a {
        font-size: 22px!important;
    }
    .menu-item.account-menu-item svg, .menu-item.search-menu-item svg, .menu-item.cart-menu-item svg {
        width: 24px;

    }
    [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
        --logo-max-height: 55px;
    }
    [data-header*="type-1"] .ct-header [data-row*="middle"] {
        --height: 94px;
    }
    [data-header*="type-1"] .ct-header [data-id="menu"] .sub-menu {
        top:94px!important
    }
}
@media screen AND (max-width:1150px) {
    [data-header*="type-1"] .ct-header [data-id="menu"] > ul > li > a {
        font-size: 19px!important;
    }
    .menu-item.account-menu-item svg, .menu-item.search-menu-item svg, .menu-item.cart-menu-item svg {
        width: 21px;

    }
    [data-header*="type-1"] .ct-header [data-id="logo"] .site-logo-container {
        --logo-max-height: 50px;
    }
    [data-header*="type-1"] .ct-header [data-row*="middle"] {
        --height: 70px;
    }
    [data-header*="type-1"] .ct-header [data-id="menu"] .sub-menu {
        top:70px!important
    }
}
button.ct-header-search.ct-toggle{
    display: none;
}
nav  button.ct-header-search.ct-toggle{
    display: block;
    font: unset !important;
}
#header div[data-device="mobile"] div[data-row="bottom"]{
	position: fixed;
	width:100%
}
nav.mobile-menu > ul >li, nav.mobile-menu > ul >li a.ct-menu-link{
	text-transform:uppercase;
	color:white;
}
nav.mobile-menu > ul >li .sub-menu .menu-item{
	margin-right:10px
}
#header .entry-content{
	padding-top:0!important
}
#search-modal{
		top:100px
	}
@media screen and (max-width:1000px){
	.mobile-menu>ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
	.mobile-menu>ul  .sub-menu{
		padding-left:0!important
	}
	.sub-menu li.menu-item{
		display:block!important
	}
	.mobile-menu>ul >li>a.ct-menu-link{
		font-size:20px;
		margin-top:15px
	}
	.sub-menu li.menu-item .ct-menu-link{
		padding:0!important;
		font-size:14px
	}
	#offcanvas, #search-modal{
		top:70px
	}
}
@media screen and (max-width:1000px){
	.menu-item.search-menu-item, .menu-item.account-menu-item, .menu-item.cart-menu-item{
		display:none!important
	}
}
#offcanvas{
	display:block!important
}
#offcanvas .ct-panel-content-inner{
	padding: 20px!important;
    padding-top: 0!important;
}
@media screen and (min-width:1000px){
	.sub-menu{display:none!important}
}
.new-sub-menu{
	width: 100% !important;
    max-width: 100% !important;
    color: white !important;
    list-style: none;
    margin: 0;
    position: fixed;
    z-index: 10;
    background: black;
    display: flex;
    padding: 10px;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 18px;
    gap: 40px;
}
.sub-menu-space{
	
}
.new-sub-menu > li{
	padding: 2px 10px;
}
.new-sub-menu > li a{
	font-size: 19px;
	text-decoration:none;
	text-transform:uppercase;
	color:white;
}
@media screen and (max-width:1000px){
	.new-sub-menu {
    width: 100% !important;
    max-width: 100% !important;
    color: white !important;
    list-style: none;
    margin: 0;
    position: sticky;
    z-index: 10;
    background: black;
    display: flex;
    padding: 10px;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 18px;
    gap: 10px;
    top: 110px;
    flex-wrap: wrap;
}
.wp-block-spacer.sub-menu-space {
        height: 12px !important;
    }
}

/*HP*/
.img-hp img{
    width: 100%;
    height: auto;
}

/*category*/
.relative{
    position: relative!important;
    margin: none!important;
    min-width: unset!important;
    width: 100%!important;
    padding:0;
    margin-left: -5px;
    margin-right: -10px;
    margin-block-end:unset!important
}
@media screen and (max-width:1000px){
	.relative{
    
    width: 100%!important;

}
}
.category-sub-menu{
    background: black;
    list-style: none;
    padding: 0;
}
.category-sub-menu >li {
    display: inline-block;
    padding: 13px 19px;
    text-transform: uppercase;
    font-size: 17px;
    line-height: 1em;
}
.category-sub-menu >li a {
    color: white;
}
@media screen AND (max-width:1500px) {
    .ct-sticky-container{
        height:98px!important
      
    }
    .relative{
        top: 0px;
    }
}
  @media screen AND (max-width:1400px) {
    .ct-sticky-container{
        height:96px!important
      }
}
@media screen AND (max-width:1300px) {
    .ct-sticky-container{
        height:94px!important
      }
}
@media screen AND (max-width:1150px) {
    .ct-sticky-container{
        height:70px!important
      }
}

/*titre tournants*/
.titretournant {
    overflow: hidden;
    height: 110px; /* Ajuste selon la hauteur de ton texte */
    background-color: white; /* Fond blanc */
  }
  .soustitretournant {
    overflow: hidden;
    padding-top: 4px;
    height: 70px; /* Ajuste selon la hauteur de ton texte */
    background-color: black; /* Fond blanc */
  }
  
  .scrolling-text {
    display: flex; /* Pour permettre un défilement continu */
    white-space: nowrap; /* Empêche la ligne de texte de se casser */
  }
  
  .titretournant .scrolling-text p {
    white-space: nowrap;
    display: inline-block;
    font-size: 100px; /* Ajuste la taille du texte si nécessaire */
    text-transform: uppercase;
    color: black; /* Couleur du texte */
    margin: 0; /* Supprime les marges par défaut */
    padding-right: 25px; /* Espacement entre les répétitions du texte */
    line-height: 1em;
  }
  .soustitretournant .scrolling-text p {
    white-space: nowrap;
    display: inline-block;
    font-size: 60px; /* Ajuste la taille du texte si nécessaire */
    text-transform: uppercase;
    color: white; /* Couleur du texte */
    margin: 0; /* Supprime les marges par défaut */
    padding-right: 20px; /* Espacement entre les répétitions du texte */
    line-height: 1em;
  }
@media screen and (max-width:600px){
	.titretournant {
    height: 60px; 
  	}
	.titretournant p {
    font-size:60px!important
  	}
	.soustitretournant {
    height: 50px; 
  	}
	.soustitretournant p {
    font-size:40px!important
  	}
}
.titretournant.negatif{
	background:black
}
.titretournant.negatif p{
	color:white
}


  /*liste produits*/
  .product-image1, .product-image2{
    width: 100%;
    height: auto;
  }
  ul.products > li.product .product-image2{
    opacity: 0;
    position: absolute;
  }
  ul.products > li.product:hover .product-image2{
    opacity: 1;
  }
  ul.products > li.product .product-infos{
    padding: 10px;
  }
   ul.products > li.product .product-infos p{
    margin: 0;
  }
  ul.products > li.product:hover .product-infos{
    background: black;
  }
  ul.products > li.product:hover .product-infos p{
    color: white;
  }
@media (min-width: 800px) {
  .spotlight .products {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 colonnes de même largeur */
    grid-auto-rows: auto; /* Hauteur automatique des lignes */
    gap: 20px; /* Espacement entre les produits */
  }

  .spotlight .products li:nth-child(1),
  .spotlight .products li:nth-child(2) {
    grid-column: span 2; /* Chaque produit occupe 2 colonnes */
  }

  .spotlight .products li:nth-child(3),
  .spotlight .products li:nth-child(4),
  .spotlight .products li:nth-child(5),
  .spotlight .products li:nth-child(6) {
    grid-column: span 1; /* Chaque produit occupe 1 colonne */
  }
}

/*footer*/
footer .widget-area-5, footer .widget-area-5 .ct-widget, footer .ct-container-fluid{
	width:100%;
	margin-left:none;
	margin-right:none;
	max-width:100%;
}
footer .relative{
	margin-left:0;
	margin-right:0
}


/*footer*/
.footer-post-content h2.mailpoet-heading{
    text-transform: uppercase;
    font-size: 28px;
    line-height: 1em;
}

/*Mailpoet*/
#mailpoet_form_1 form.mailpoet_form {
    padding: 0px!important;
    max-width: 500px;
}
#mailpoet_form_1 input.mailpoet_text{
    border:1px solid black;
    border-radius: 0;
}
#mailpoet_form_1 p.mailpoet_form_paragraph{
    font-family: Helvetica, sans-serif;
    font-weight: normal;
}
#mailpoet_form_1 input.mailpoet_submit{
    border-radius: 0!important;
    padding: 8px 35px !important;
}

/* adjust */
h1{
	text-transform:uppercase!important;
}
nav.ct-breadcrumbs{
	margin-top:20px
}
.mobileon{
	display:none
}
.mobileof{
	display:block
}
@media screen and (max-width:1000px){
	.mobileon{
	display:block
}
	.mobileof{
	display:none
}
}
@media screen and (min-width:1000px){
	body.single-product main{
		padding-top:20px
	}
}
@media screen and (max-width:1000px){
	main#main{
		padding-top:0px
	}
	body.single-product main#main{
		padding-top:50px
	}
	.wp-block-spacer{height:38px!important}
}
@media screen and (max-width:600px){
	main#main{
		padding-top:0px
	}
	body.single-product main#main{
		padding-top:50px
	}
}

/*woocommerce*/
.product-entry-wrapper.ct-constrained-width{
	display: block!important
}
.woocommerce-product-gallery{
	
    width: 100%!important;
}
.ct-product-gallery-container .flexy-container{
	width:100%!important;
	height:390px
}
.flexy-items > *{
	max-height:350px;
	max-width:350px!important;
}

.flexy-items .ct-media-container {
    max-height: 350px;
	height:350px;
	width:100%
	
}
.flexy-items .ct-media-container >* {
    width:100%;
	max-height:350px
	
}
.flexy-items{
	background:black;
	padding:20px;
	gap:20px
}
.single-product-infos{
	max-width: 350px;
    position: absolute;
    z-index: 10;
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    margin: 20px 60px 0 0;
    right: 0;
}
p.price{
	border-bottom:1px solid black;
	font-size:25px
}
.product_title, .header-product p{

	line-height:1.2em;
	margin-bottom:0px
}
.header-product{
	padding-bottom:20px
}
.flexy-arrow-prev, .flexy-arrow-next {
	opacity:1!important;
	display: flex!important;

}
.hero-section[data-type="type-1"] {
   margin-bottom:20px!important
}

@media screen and (max-width:600px){
.product_title{
	font-size:35px;

}
	.ct-breadcrumbs{
		display:none
	}
}


/*single_product*/
.product-descriptions{
	display:flex;
	flex-wrap: wrap;
}
.product-descriptions .product-description{
	font-family: helvetica, sans-serif;
	font-weight:300;
flex: 1 1 200px;
	
}

/* anim front*/
@media screen and (min-width:600px){
section.front-anim{
	position: absolute;
    top: 0;
    left: 0;
    width: 100vw!important;
    height: 100vh;
    overflow: hidden;
    text-align: center;
z-index:50
}
.front-anim .front-logo{
	 animation: rotation 10s infinite linear;
	height:120vh;
	width:120vh;
	transition: 1s linear; 
	}
}
body.openthedoor section.front-anim{
	height: auto; /* Par exemple, tu peux définir des valeurs par défaut ici */
    width: var(--theme-default-editor, var(--theme-block-width))!important;
    position: relative; /* Remettre la position relative si besoin */
    z-index: auto;
    transition: 1s linear; 
	margin-bottom: 20px!important;
	aspect-ratio:16/9;
}

body.openthedoor .front-anim .front-logo{
	animation: rotation 10s infinite linear;
    height: 65px;
    width: 65px;
    transition: 1s linear;
    position: fixed;
    left: 1.5vw;
    top: 1vw;
	opacity:0
	
}
body.openthedoor .site-logo-container img{
opacity:1!important;
transition:0.3s linear;
transition-delay:0.9s;
}
@media screen and (max-width:600px){
	body.openthedoor section.front-anim, section.front-anim{
		max-height: 300px!important;
		margin-top:20px;
		height: 300px; /* Par exemple, tu peux définir des valeurs par défaut ici */
    width: var(--theme-default-editor, var(--theme-block-width))!important;
    position: relative; /* Remettre la position relative si besoin */
    z-index: auto;
    transition: 1s linear; 
	margin-bottom: 20px!important;
	aspect-ratio:16/9!important;
         }
	.wp-block-cover, .wp-block-cover-image {
		min-height:unset
	}
	body.openthedoor section.front-anim img.front-logo, body.openthedoor section.front-anim img.front-logo, section.front-anim .wp-block-cover__inner-container{
	display:none!important
}
}
@media screen and (max-width:1000px){
	body.openthedoor section.front-anim{
		
		margin-top:20px;
		
}
}