/********************************/
/****ARCHIVE CATEGORIES PARENT***/
/********************************/
.categories_archive{
    padding: var(--g12) 0 var(--g90);
}
.categories_archive__header{
    margin-bottom: var(--g40);
}
.categories_archive__grid{
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(var(--c3), 1fr);
    gap: var(--g29);
}
.categories_archive__card{
	padding: var(--g20) var(--g60) var(--g29);
	border: 1px solid var(--vert3);
	border-radius: 5px;
    list-style: none;
}
.categories_archive__card_link{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	height: 100%;
    text-decoration: none;
}
.categories_archive__card_link:hover{
	text-decoration: underline;
	color: var(--vert1);
}
.categories_archive__card_image{
    display: block;
    width: 100%;
    height: 100%;
	max-height: 110px;
    object-fit: cover;
	margin-bottom: var(--g20);
}
.categories_archive__card_title{
    text-align: center;
	margin-top: auto;
	margin-bottom: var(--g20);
}
.categories_archive__card_picto{
    margin-top: auto;
}
.categories_archive__empty{
    line-height: 1.6;
    padding: var(--g40) 0;
    text-align: center;
}
@media (max-width: 900px){
    .categories_archive__grid{
        grid-template-columns: repeat(var(--c2), 1fr);
    }
}
@media (max-width: 560px){
    .categories_archive__grid{
        grid-template-columns: 1fr;
    }
}


/*******************************/
/****ARCHIVE CATEGORIE ENFANT****/
/*******************************/
.product_cat_archive {
    padding: var(--g12) 0 var(--g90);
}
.product_cat_archive__body {
    display: grid;
    grid-template-columns: 273px 1fr;
    gap: var(--g40);
    margin-top: var(--g40);
    align-items: start;
}
.product_cat_archive__main {
    min-width: 0;
}

/* Boutons d'accordéon mobile — cachés par défaut en desktop.
   Le body reste visible normalement, comme sans accordéon.
   Les styles mobile (bouton visible, body toggle-able) sont dans responsive.css. */
.product_cat_filters__toggle,
.product_cat_nav__toggle {
    display: none;
}

/* Navigation gauche */
.product_cat_nav {
    background: var(--gris1);
    border-radius: var(--r10);
    padding: 30px 28px;
}
.product_cat_nav__back {
    display: block;
    color: var(--tc);
    text-decoration: none;
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 10%;
    text-transform: uppercase;
}
.product_cat_nav__back:visited {
	color: var(--tc);
}
.product_cat_nav__back:hover {
    text-decoration: underline;
}
.product_cat_nav__title {
    margin: var(--g20) 0 0;
    padding-top: var(--g20);
    border-top: 1px solid var(--vert3);
    color: var(--tc);
    font-family: var(--default-font);
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 10%;
    text-transform: uppercase;
}
.product_cat_nav__list {
    list-style: none;
    margin: var(--g12) 0 0;
    padding: 0;
}
.product_cat_nav__item {
    line-height: 1.4;
	margin-bottom: var(--g12);
}
.product_cat_nav__item a {
    color: var(--vert1);
    font-size: 16px;
    text-decoration: none;
}
.product_cat_nav__item a:hover,
.product_cat_nav__item.is-current a {
    text-decoration: underline;
}

/* Barre de filtres (Group 699) */
.product_cat_filters {
    border: 1px solid var(--vert2);
    border-radius: var(--r10);
    padding: var(--g20) var(--g60);
    display: flex;
    align-items: flex-end;
    gap: var(--g29);
    flex-wrap: wrap;
}
.product_cat_filters__fields {
    display: flex;
    align-items: flex-end;
    gap: var(--g29);
    flex: 1;
    flex-wrap: wrap;
}
.product_cat_filters__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 180px;
    flex: 1;
}
.product_cat_filters__label {
    color: var(--vert1);
    font-size: 14px;
    line-height: 22px;
    letter-spacing: 10%;
    text-transform: uppercase;
}
.product_cat_filters__select_wrap {
    position: relative;
    display: block;
}
.product_cat_filters__select {
    display: block;
    width: 100%;
    height: 45px;
    padding: 0 40px 0 16px;
    background-color: var(--gris1);
    background-image: url('../img/pic_arrow_bott.svg');
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 12px auto;
    border: 0;
    border-radius: var(--r5);
    color: var(--blk);
    font-family: var(--default-font);
    font-size: 16px;
    line-height: 1.6;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}
.product_cat_filters__actions {
    display: flex;
    align-items: center;
    gap: var(--g29);
}
.product_cat_filters__reset {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--vert1);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.435;
    text-transform: uppercase;
}
.product_cat_filters__reset .icon {
	text-decoration: none;
}
.product_cat_filters__reset:hover {
    text-decoration: none;
}

/* Entête WC (compteur + tri) en pleine largeur au-dessus du body */
.product_cat_archive__header {
    display: flex;
    justify-content: end;
    align-items: center;
    gap: var(--g20);
    flex-wrap: wrap;
    margin-top: var(--g40);
}
.product_cat_archive__header .woocommerce-result-count,
.product_cat_archive__header .woocommerce-ordering {
    margin: 0;
}
.product_cat_archive__header .woocommerce-result-count {
	display: none;
}
.product_cat_archive__header + .product_cat_archive__body {
    margin-top: var(--g20);
}

/* Select "Trier par" : reprend le look du calque "Filtrer par" (Crimson + chevron). */
.product_cat_archive__header .woocommerce-ordering select.orderby {
    display: inline-block;
    padding: 0 24px 0 0;
    background-color: transparent;
    background-image: url('../img/pic_arrow_bott.svg');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 10px auto;
    border: 0;
    border-radius: 0;
    color: var(--vert1);
    font-family: var(--title-font);
    font-size: 16px;
    line-height: 1.25;
	text-align: right;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
}
/* Focus visible clavier — cohérent avec la règle globale de screen.css.
 * `:focus:not(:focus-visible)` neutralise juste le halo souris (le select
 * garde son style natif clic-only) sans casser le focus clavier. */
.product_cat_archive__header .woocommerce-ordering select.orderby:focus:not(:focus-visible) {
    outline: none;
}
.product_cat_archive__header .woocommerce-ordering select.orderby:focus-visible {
    outline: 2px solid var(--focus-outline-color);
    outline-offset: var(--g2);
}

/* Grille produits : 3 colonnes dans une catégorie enfant.
 * `.woocommerce` est sur le <body> donc ancêtre — il faut le placer avant
 * `.product_cat_archive__main` pour battre la règle du thème (spécificité 0,3,2). */
.woocommerce .product_cat_archive__main ul.products li.product.single_product_inlist,
.woocommerce-page .product_cat_archive__main ul.products li.product.single_product_inlist {
    width: var(--3-12);
}

/* Flèche terra-cotta au hover — carte produit (thème + bloc Gutenberg). */
.woocommerce ul.products li.product.single_product_inlist,
.wc-block-product {
    position: relative;
}
.woocommerce ul.products li.product.single_product_inlist .woocommerce-loop-product__link {
    position: relative;
}
.woocommerce ul.products li.product.single_product_inlist .woocommerce-loop-product__link::after,
.wc-block-product::after {
    content: '';
    position: absolute;
    right: 20px;
    bottom: 20px;
    width: 20px;
    height: 17px;
    background: url('../img/arrow-right.svg') no-repeat center;
    background-size: contain;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s;
    z-index: 3;
}
.woocommerce ul.products li.product.single_product_inlist:hover .woocommerce-loop-product__link::after,
.wc-block-product:hover::after {
    opacity: 1;
}

/* Bloc Gutenberg wc-block-product : tout le bloc devient cliquable via
 * l'anchor du titre étendu en overlay. Les CTA (add-to-cart, boutons) restent
 * cliquables grâce à un z-index plus élevé. */
.wc-block-product .wp-block-post-title a::after,
.wc-block-product .wc-block-components-product-name::after,
.wc-block-product > a.wc-block-grid__product-link::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
}
.wc-block-product .wp-block-post-title,
.wc-block-product .wc-block-components-product-name {
    position: static;
}
.wc-block-product .wp-block-post-title a:hover,
.wc-block-product .wc-block-components-product-name a:hover {
	color: var(--vert1);
}
.wc-block-product .wp-block-button,
.wc-block-product .wc-block-components-product-button,
.wc-block-product .add_to_cart_button,
.wc-block-product .wc-block-components-product-add-to-cart {
    position: relative;
    z-index: 2;
}

/* Focus global : le lien du titre porte déjà un ::after inset:0 qui couvre la
 * carte — quand il reçoit le focus clavier, on encadre le <li> entier plutôt
 * que le simple texte. Le lien image est retiré du tab order via le filtre
 * render_block_woocommerce/product-image (inc/blocks.php) pour éviter un
 * second stop redondant.
 *
 * Implémentation : box-shadow (pas outline) — suit le border-radius, pas de
 * clipping par un ancêtre `overflow: hidden`, et cumulable avec le shadow
 * existant de la carte. */
.wc-block-product:has(.wp-block-post-title a:focus-visible),
.wc-block-product:has(.wc-block-components-product-name a:focus-visible) {
    border-radius: var(--r5);
    box-shadow: 0 0 0 2px var(--focus-outline-color);
}
.wc-block-product .wp-block-post-title a:focus-visible,
.wc-block-product .wc-block-components-product-name a:focus-visible {
    outline: none;
}
@media screen and (max-width: 1200px) {
	.woocommerce .product_cat_archive__main ul.products li.product.single_product_inlist,
	.woocommerce-page .product_cat_archive__main ul.products li.product.single_product_inlist {
		width: var(--2-12);
	}
}
@media screen and  (max-width: 900px) {
    .product_cat_archive__body {
        grid-template-columns: 1fr;
    }
    .product_cat_filters__fields {
        width: 100%;
    }
}
@media screen and  (max-width: 560px) {
    .woocommerce .product_cat_archive__main ul.products li.product.single_product_inlist,
    .woocommerce-page .product_cat_archive__main ul.products li.product.single_product_inlist {
        width: 100%;
    }
}

/********************/
/**** PAGINATION ****/
/********************/
.woocommerce nav.woocommerce-pagination ul {
	border: 0;
}
.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
}
.woocommerce nav.woocommerce-pagination ul li .page-numbers::after {
	content: ".";
	padding-left: 5px;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	color: var(--vert1);
}
.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
	background: none;
	font-weight: bold;
	color: var(--vert1);
}
.woocommerce nav.woocommerce-pagination ul li .page-numbers.prev,
.woocommerce nav.woocommerce-pagination ul li .page-numbers.next {
	display: none;
}

/*********************/
/**** FORMULAIRES ****/
/*********************/

.woocommerce form .form-row .input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row .select2-selection {
	display: block;
	width: 100%;
	height: 45px;
	padding: 0 16px;
	background: var(--gris1);
	border: 0;
	border-radius: var(--r5);
	box-sizing: border-box;
	color: var(--blk);
	font-family: var(--default-font);
	font-size: 16px;
	line-height: 1.6;
}
:where(.woocommerce) .select2-container .select2-selection--single .select2-selection__rendered {
	line-height: 2;
}
/* Compte client */
.woocommerce .woocommerce-MyAccount-content button.button {
	margin-top: var(--g40);
}

/*********************/
/**** PANIER      ****/
/*********************/
.woocommerce-cart-form {
	margin-top: var(--g40);
}