/******************/
/****RESPONSIVE****/
/******************/



@media screen and (max-width: 1228px) {
	.widzmain,
	.woocommerce-notices-wrapper {
		width: 100%;
		margin-left: 30px;
		margin-right: 30px;
		max-width: calc(100vw - 60px);
	}
	#navtop ul {
		gap: 20px;
	}

	/* Home : bannière */
	body.home .wp-block-cover__inner-container .wp-block-buttons {
		float: left;
	}

	/* Home : bloc espaces dédiés*/
	body.home .wp-container-core-group-is-layout-39d886d3 .wp-block-image {
		display: none;
	}
	body.home .wp-container-core-group-is-layout-39d886d3 .wp-block-theme-clickable-card {
		padding: 20px 25px !important;
	}
	body.home .wp-container-core-group-is-layout-39d886d3 .wp-container-core-columns-is-layout-7387b849 {
		margin: auto;
	}
	body.home .wp-container-core-group-is-layout-39d886d3 .wp-container-core-columns-is-layout-7387b849 > div:first-child {
		display: none;
	}
	body.home .wp-container-core-group-is-layout-39d886d3 .wp-container-core-columns-is-layout-7387b849 > div:last-child {
		flex-basis: 100% !important;
	}
	body.home .wp-container-core-group-is-layout-39d886d3 .wp-block-column .has-text-align-left {
		text-align: center !important;
	}

	/* Home + page produit : liste de produits & catégories en scroll horizontal (tous sur la même ligne) */
	body.home .wc-block-product-template.wc-block-product-template__responsive,
	.wp-container-core-group-is-layout-4f3a15b3,
	body.single-product .products.single_products_list {
		display: flex !important;
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		padding-bottom: 10px;
	}
}
@media screen and (max-width: 980px) {
	h1 {
		font-size: 40px;
	}
	h2 {
		font-size: 30px;
	}
	#header_content {
		gap: 0 10px;
		margin-bottom: 20px;
		align-items: center;
	}
	#navshop {
		padding-top: 0;
		width: 100%;
		max-width: 140px;
	}
	#navshop ul {
		justify-content: space-around;
	}
	#navtop_wrapper {
		justify-content: center;
	}
	.woocommerce ul.products li.product.single_product_inlist,
	.woocommerce-page ul.products li.product.single_product_inlist {
		width: var(--3-12);
	}
	.cart_totals_content {
		padding: 30px 20px;
	}
	.product_cat_archive__header {
		display: none;
	}
}
@media screen and (max-width: 782px) {
	/* Home + page produit : liste de produits & catégories en scroll horizontal (tous sur la même ligne) */
	body.home .wc-block-product-template.wc-block-product-template__responsive > li,
	.wp-container-core-group-is-layout-4f3a15b3 > div,
	body.single-product .products.single_products_list > li {
		flex: 0 0 330px;
	}
	/* Home : cover en mode "floating-text" : on empile image puis texte */
	body.home .wp-block-cover.is-style-floating-text {
		flex-direction: column;
		padding-left: 0;
		padding-right: 0;
		background-color: var(--vert1) !important;
		border-radius: 5px;
	}
	body.home .wp-block-cover.is-style-floating-text > .wp-block-cover__image-background {
		position: relative;
		width: calc(100% - 40px);
		height: auto;
		order: 0;
		border-radius: 5px;
	}
	body.home .wp-block-cover.is-style-floating-text > .wp-block-cover__background {
		display: none;
	}
	body.home .wp-block-cover.is-style-floating-text > .wp-block-cover__inner-container {
		position: static;
		inset: auto;
		order: 1;
		height: auto;
	}
	body.home .wp-block-cover.is-style-floating-text > .wp-block-cover__inner-container > * {
		height: auto;
	}
}
@media screen and (max-width: 768px) {
	.wp-block-group.is-style-vertical-center {
		padding: var(--g20) !important;
	}
	.woocommerce ul.products li.product.single_product_inlist,
	.woocommerce-page ul.products li.product.single_product_inlist {
		width: var(--2-12);
	}
	/* panier */
	.woocommerce-cart-form__cart-item .product-quantity .quantity {
		display: flex;
		justify-content: flex-end;
	}
	.cart_item_product_name::before {
		right: 0;
		left: auto;
	}
	.woocommerce table.shop_table td.product-remove,
	.woocommerce table.shop_table_responsive tr:nth-child(2n) td.product-remove,
	.woocommerce-page table.shop_table_responsive tr:nth-child(2n) td.product-remove {
		border-top: 0;
		background: none;
	}
	.cart_form_customization_strap_main {
		flex-direction: column;
	}
	.woocommerce-checkout .woocommerce form .form-row {
		width: 100%;
	}
	#place_order {
		margin-top: 20px;
	}
}
@media screen and (max-width: 680px) {
	/* styles globaux */
	body .is-layout-flex:not(.wp-block-theme-clickable-card) {
		flex-direction: column;
	}

	/* Boutons */
	.wp-block-buttons > .wp-block-button.wp-block-button__width-50 {
		width: 100% !important; /* Btn 50% affichés à 100%*/
	}

	/* blocs */
	.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content {
		margin-top: var(--g20);
		padding-right: 0;
	}
	.wp-block-media-text > .wp-block-media-text__content {
		padding-left: 0;
	}
	.wp-block-media-text.is-style-float-image {
		padding: var(--g40) var(--g20) !important;
	}
	.wp-block-media-text.is-stacked-on-mobile {
		gap: 20px;
	}
	/* filtres produits */
	.product_cat_filters {
		flex-direction: column;
		padding: var(--g30);
	}
	.woocommerce ul.products li.product.single_product_inlist,
	.woocommerce-page ul.products li.product.single_product_inlist {
		width: var(--1-12);
	}
	.page-faq__list {
		padding-bottom: var(--g20);
	}
	/* reassurance */
	#reassurance_strap {
		margin: 20px auto;
	}
	/* footer */
	.footer_content {
		justify-content: center;
	}
	.footer_content_nav_list {
		justify-content: center;
	}
	/*page produit */
	.single_product_decli_table.single_product_decli_table_th {
		display: none;
	}
	.single_product_decli_table.single_product_decli_table_tr {
		flex-direction: column;
	}
	.single_product_decli_block {
		width: 100vw;
		margin-left: calc(50% - 50vw);
		border-radius: 0;
	}
	.single_product_decli_table_cell {
		display: flex;
		gap: 15px;
	}
	input.single_product_decli_table_cell_number::before {
		content: "QUANTITÉ :";
		font-weight: 700;
		text-transform: uppercase;
		margin-right: 10px;
	}
	.single_product_decli_table_pdts_list,
	.single_product_rassurance_list {
		flex-direction: column;
	}
	/* panier */
	.woocommerce .cart-collaterals .cart_totals,
	.woocommerce-page .cart-collaterals .cart_totals {
		width: 100%;
	}
	.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1,
	.woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 {
		padding: 20px 30px;
	}
	/* compte client */
	.woocommerce table.my_account_orders tbody {
		display: inline-block;
		width: 100%;
	}
	.account_login {
		padding: var(--g30) 0;
	}
	.woocommerce form.login.account_login__card,
	.account_login__card {
		padding: var(--g30) var(--g20) ;
	}
	/* blog */
	.wp-block-button.is-style-fleche .wp-block-button__link,
	.post-navigation-link-previous a,
	.post-navigation-link-next a {
		padding: 12px 80px 12px 30px !important;
	}
	.wp-block-button.is-style-fleche .wp-block-button__link::after,
	.post-navigation-link-previous a::after,
	.post-navigation-link-next a::after {
		right: 30px;
	}
	.post-navigation-link-previous a {
		padding: 12px 30px 12px 80px !important;
	}
	.post-navigation-link-previous a::after {
		left: 30px;
	}
	.wp-block-buttons > .wp-block-button.wp-block-button__width-75 {
		width: 100% !important;
	}
	/* contact */
	.wp-container-core-columns-is-layout-0e2dd97a {
		padding: var(--g30) var(--g20) !important;
	}
}
@media screen and (max-width: 480px) {
	#logo {
		max-width: 120px;
	}

	/* Product page */
	#single_product_img_window_wrapp {
		height: 320px;
	}
	.single_product_img_window_pic_link {
		height: 100%;
	}
	.woocommerce .single_product_img_window_pic_link img {
		object-fit: contain;
	}

	/* Cart */
	#add_payment_method #payment ul.payment_methods,
	.woocommerce-cart #payment ul.payment_methods,
	.woocommerce-checkout #payment ul.payment_methods {
		padding: 0;
	}
	#add_payment_method #payment ul.payment_methods li,
	.woocommerce-cart #payment ul.payment_methods li,
	.woocommerce-checkout #payment ul.payment_methods li {
		line-height: 1.5;
		margin-top: 2em;
	}
}

/******HEADER******/
/*nav bt*/
#navtop_bt{
	order: 1;
	display: none;
	box-sizing: border-box;
	width: 26px;
	height: 15px;
	margin: 5px auto 0;
	padding: 0;
	background: transparent;
	border: 0;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	position: relative;
	z-index: 888;
}
/* Cible tactile élargie (44x44 minimum RGAA) sans impacter la mise en page. */
#navtop_bt::before{
	content: '';
	position: absolute;
	inset: -15px;
}
#navtop_bt:focus-visible{
	outline: 2px solid var(--focus-outline-color);
	outline-offset: 6px;
	border-radius: 2px;
}
#navtop_bt_span{
	display: block;
	width: 26px;
	height: 15px;
	background: var(--blk);
	margin: auto;
	position: relative;
}
#navtop_bt_span:before,
#navtop_bt_span:after{
	content: '';
	display: block;
	width: 26px;
	height: 6px;
	background: var(--wh);
	position: absolute;
	transition: all 0.3s;
}
#navtop_bt_span:before{
	top: 1px;
}
#navtop_bt_span:after{
	bottom: 1px;
}
.bt_navtop_hover #navtop_bt_span,
.bt_navtop_hover #navtop_bt_span:before,
.bt_navtop_hover #navtop_bt_span:after{
	transition: all 0.3s;
}
.bt_navtop_hover #navtop_bt_span:before,
.bt_navtop_hover #navtop_bt_span:after{
	width: 30px;
	height: 1px;
	background: var(--blk);
}
.bt_navtop_hover #navtop_bt_span{
	background: none;
}
.bt_navtop_hover #navtop_bt_span:before{
	transform: rotate(45deg);
	top: 8px;
}
.bt_navtop_hover #navtop_bt_span:after{
	transform: rotate(-45deg);
	bottom: 6px;
}

/* Verrou du scroll body quand le menu mobile est ouvert. */
body.menu-open{
	overflow: hidden;
}

/* Bouton disclosure sous-menu — caché en desktop, la nav utilise hover/keyboard.
   Injecté par app.js à côté de chaque lien parent. Rendu mobile plus bas. */
#navtop .submenu-toggle{
	display: none;
}

@media screen and (max-width: 980px){
	#navtop_bt{
		display: block;
	}

	/* Menu mobile : overlay plein écran sous le header.
	   Header (#header, z-index 100) reste au-dessus → le burger (X) reste
	   cliquable pour refermer. Transition transform + opacity avec fallback
	   pointer-events pour éviter l'interception du clic à l'état fermé. */
	#navtop{
		display: block;
		box-sizing: border-box;
		position: fixed;
		inset: 0;
		width: auto; /* override desktop `width: fit-content` — l'overlay doit remplir le viewport */
		padding: 120px var(--g30) var(--g40);
		background: var(--wh);
		overflow-y: auto;
		overscroll-behavior: contain;
		transform: translateY(-100%);
		opacity: 0;
		pointer-events: none;
		transition: transform 0.3s ease, opacity 0.3s ease;
		z-index: 90;
	}
	#navtop.navtop_hover{
		transform: translateY(0);
		opacity: 1;
		pointer-events: auto;
	}

	/* Niveau 1 : liste verticale, pleine largeur, séparateurs discrets. */
	#navtop ul{
		display: block;
		gap: 0;
	}
	#navtop .header_nav > ul > li{
		padding: 0;
		border-bottom: 1px solid var(--vert3);
	}
	#navtop .header_nav > ul > li > a{
		display: block;
		padding: var(--g20) 0;
		font-size: 16px;
		line-height: 1.3;
	}
	/* Item parent : lien et bouton disclosure sur la même ligne,
	   sous-menu en dessous (grâce à flex-wrap). */
	#navtop .header_nav > ul > li.menu-item-has-children{
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		padding-right: 0;
	}
	#navtop .header_nav > ul > li.menu-item-has-children > a{
		flex: 1;
		min-width: 0;
		padding-right: 0;
	}
	/* Le chevron pseudo du lien est remplacé par le bouton disclosure en mobile. */
	#navtop .header_nav > ul > li.menu-item-has-children > a:after{
		display: none;
	}

	/* Bouton disclosure sous-menu — cible tactile 44x44 (RGAA),
	   chevron pivotant à l'ouverture. Rendu injecté par app.js. */
	#navtop .submenu-toggle{
		display: block;
		box-sizing: border-box;
		width: 44px;
		height: 44px;
		padding: 0;
		margin: 0;
		background: transparent;
		border: 0;
		appearance: none;
		-webkit-appearance: none;
		cursor: pointer;
		flex-shrink: 0;
		position: relative;
	}
	#navtop .submenu-toggle::before{
		content: '';
		display: block;
		width: 10px;
		height: 6px;
		mask: url('../img/pic_arrow_bott.svg') no-repeat center;
		-webkit-mask: url('../img/pic_arrow_bott.svg') no-repeat center;
		mask-size: 100% auto;
		-webkit-mask-size: 100% auto;
		background-color: var(--vert1);
		position: absolute;
		inset: 0;
		margin: auto;
		transition: transform 0.25s ease, background-color 0.3s;
	}
	#navtop .submenu-toggle[aria-expanded="true"]::before{
		transform: rotate(180deg);
	}
	#navtop .submenu-toggle:hover::before,
	#navtop .submenu-toggle:focus-visible::before{
		background-color: var(--tc);
	}
	#navtop .submenu-toggle:focus-visible{
		outline: 2px solid var(--focus-outline-color);
		outline-offset: -4px;
		border-radius: 2px;
	}

	/* Sous-menus : accordéon inline, reset des styles desktop
	   (largeur fixe, position absolue, radius, padding gauche décalé).
	   L'affichage est piloté par l'aria-expanded du bouton disclosure —
	   même source que la rotation du chevron, donc pas de désync possible
	   entre l'état visuel et l'état déplié. */
	#navtop ul li.menu-item-has-children:hover > ul{
		display: none;
	}
	#navtop ul li.menu-item-has-children > .submenu-toggle[aria-expanded="true"] ~ ul{
		display: block;
	}
	#navtop ul li.menu-item-has-children.is-expanded > ul{
		display: block;
	}
	#navtop ul ul{
		flex-basis: 100%;
		width: 100%;
		position: static;
		padding: 0 0 var(--g20) var(--g20);
		border-radius: 0;
		background: transparent;
		left: auto;
		top: auto;
	}
	#navtop ul ul li{
		padding: 0;
	}
	#navtop ul ul li:not(:last-child){
		margin-bottom: 0;
	}
	#navtop ul ul li a{
		padding: var(--g12) 0;
		font-size: 15px;
	}
	#navtop ul ul li.current-menu-item:before{
		left: -12px;
		top: 18px;
	}
	#navtop .header_nav a:focus-visible{
		outline: 2px solid var(--focus-outline-color);
		outline-offset: -2px;
	}
}

@media (prefers-reduced-motion: reduce){
	#navtop{
		transition: none;
	}
	#navtop_bt_span,
	#navtop_bt_span:before,
	#navtop_bt_span:after{
		transition: none;
	}
}


/******404******/
@media screen and (max-width: 1080px){
	#page_404{
	display: flex;
	flex-wrap: wrap;
	padding: 94px 0 94px;
	}
	#page_404_ill_block{
	width: 46%;
	margin: 0 8% 0 0;
	}
}
@media screen and (max-width: 880px){
	#page_404_ill_block{
	width: 100%;
	margin: 0;
	text-align: center;
	}
	#page_404_ill_block object{
	margin: auto;
	}
	#page_404_ill_main{
	flex: none;
	width: 100%;
	text-align: center;
	}
}


/*******************************************/
/**** Accordéon mobile — Filtres + Nav  ****/
/*******************************************/
/* Breakpoint 900px aligné sur celui de `.product_cat_archive__body` qui
   passe en 1 colonne à cette même largeur (woo.css). En dessous, filtres
   et nav catégories deviennent des accordéons repliés par défaut ; le body
   est révélé quand le bouton `__toggle` bascule `.is-open` sur le parent
   (via app.js). En desktop les boutons sont `display: none` (woo.css) et
   les bodys restent visibles normalement. */
@media screen and (max-width: 900px) {
	.product_cat_filters,
	.product_cat_nav {
		display: block;
		padding: 0;
	}

	.product_cat_filters__toggle,
	.product_cat_nav__toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: var(--g12);
		width: 100%;
		padding: var(--g20) var(--g30);
		background: transparent;
		border: 0;
		appearance: none;
		-webkit-appearance: none;
		color: var(--vert1);
		font-family: var(--default-font);
		font-size: 14px;
		font-weight: 400;
		line-height: 22px;
		letter-spacing: 0.1em;
		text-transform: uppercase;
		text-align: left;
		cursor: pointer;
	}
	.product_cat_filters__toggle::after,
	.product_cat_nav__toggle::after {
		content: '';
		display: block;
		width: 12px;
		height: 8px;
		mask: url('../img/pic_arrow_bott.svg') no-repeat center;
		-webkit-mask: url('../img/pic_arrow_bott.svg') no-repeat center;
		mask-size: 100% auto;
		-webkit-mask-size: 100% auto;
		background-color: var(--vert1);
		flex-shrink: 0;
		transition: transform 0.25s ease;
	}
	.product_cat_filters__toggle[aria-expanded="true"]::after,
	.product_cat_nav__toggle[aria-expanded="true"]::after {
		transform: rotate(180deg);
	}
	.product_cat_filters__toggle:focus-visible,
	.product_cat_nav__toggle:focus-visible {
		outline: 2px solid var(--focus-outline-color);
		outline-offset: -2px;
		border-radius: var(--r10);
	}

	/* Body : caché par défaut, révélé quand le parent a `.is-open`. */
	.product_cat_filters__body,
	.product_cat_nav__body {
		display: none;
	}
	.product_cat_filters.is-open .product_cat_filters__body {
		display: block;
		padding: 0 var(--g30) var(--g30);
	}
	.product_cat_nav.is-open .product_cat_nav__body {
		display: block;
		padding: 0 28px 30px;
	}
}