/* ==========================================================================
   Shop Layout - Page boutique WooCommerce

   Structure :
   - .shop-banner : Bannière avec image et titre
   - .shop-layout : Grille 2 colonnes (sidebar + contenu)
   - .shop-sidebar : Sidebar gauche (filtres + catégories)
   - .shop-content : Zone principale (produits)

   Note: .product-card est dans woocommerce.css (centralisé)
   ========================================================================== */

/* ==========================================================================
   Éléments masqués (demande client)
   ========================================================================== */

/* Fil d'ariane */
.breadcrumb {
	display: none;
}

/* Flèche de retour sur le lien parent */
.shop-parent-link svg {
	display: none;
}

/* Nombre de résultats */
.woocommerce-result-count,
.shop-controls__count {
	display: none;
}

/* Nombre de produits dans les catégories */
.shop-categories__count {
	display: none;
}

/* ==========================================================================
   Titre de la page shop
   ========================================================================== */

/* Titre quand PAS dans une sous-catégorie */
.shop-title {
	margin: 0 0 var(--cav-space-md);
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-xl);
	font-weight: 700;
	color: var(--cav-text);
}

@media (min-width: 992px) {
	.shop-title {
		margin: 0 0 var(--cav-space-lg);
		font-size: var(--cav-font-2xl);
	}
}

/* ==========================================================================
   Hiérarchie parent / enfant (sous-catégories)
   ========================================================================== */

/* Lien parent = visuellement comme un h1 */
.shop-parent-link {
	display: flex;
	align-items: center;
	gap: var(--cav-space-xs);
	margin: 0 0 var(--cav-space-xs);
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-xl);
	font-weight: 700;
	color: var(--cav-text);
	text-decoration: none;
	transition: color var(--cav-transition-fast);
}

.shop-parent-link:hover {
	color: var(--cav-primary);
}

.shop-parent-link svg {
	flex-shrink: 0;
	color: var(--cav-primary);
}

@media (min-width: 992px) {
	.shop-parent-link {
		font-size: var(--cav-font-2xl);
	}
}

/* Titre enfant = plus petit quand il y a un parent */
.shop-parent-link + .shop-title {
	font-size: var(--cav-font-lg);
	font-weight: 600;
	color: var(--cav-text-light);
	margin-bottom: var(--cav-space-md);
}

@media (min-width: 992px) {
	.shop-parent-link + .shop-title {
		font-size: var(--cav-font-xl);
		margin-bottom: var(--cav-space-lg);
	}
}

/* ==========================================================================
   Bannière Catégorie / Boutique (desktop uniquement)
   ========================================================================== */

.shop-banner {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 180px;
	margin-top: var(--cav-space-md);
	padding: var(--cav-space-xl) var(--cav-space-lg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: var(--cav-radius-lg);
	overflow: hidden;
}

@media (min-width: 768px) {
	.shop-banner {
		min-height: 220px;
		padding: var(--cav-space-2xl) var(--cav-space-xl);
	}
}

/* Masquer bannière complètement (remplacée par titre simple) */
.shop-banner {
	display: none;
}

.shop-banner__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom,
			rgba(0, 0, 0, 0.3) 0%,
			rgba(0, 0, 0, 0.5) 100%);
	z-index: 1;
}

.shop-banner__content {
	position: relative;
	z-index: 2;
	text-align: center;
}

.shop-banner__title {
	margin: 0;
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-2xl);
	font-weight: 700;
	color: var(--cav-text-inverse);
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

@media (min-width: 768px) {
	.shop-banner__title {
		font-size: var(--cav-font-3xl);
	}
}

/* ==========================================================================
   Layout Principal
   ========================================================================== */

.shop-layout {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: var(--cav-space-xl);
}

@media (min-width: 768px) {
	.shop-layout {
		margin-top: var(--cav-space-lg);
	}
}

@media (max-width: 991px) {
	.shop-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	.shop-layout {
		padding-top: var(--cav-space-md);
	}
}

/* ==========================================================================
   Sidebar (desktop uniquement)
   ========================================================================== */

.shop-sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-lg);
}

@media (max-width: 991px) {
	.shop-sidebar {
		display: none;
	}
}

/* Section catégories sticky (desktop uniquement) */
.shop-sidebar__sticky {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-lg);
}

@media (min-width: 992px) {
	.shop-sidebar__sticky {
		position: sticky;
		top: max(calc(var(--cav-header-height) + var(--cav-space-lg)), 25vh);
	}
}

.shop-sidebar__section {
	padding-bottom: var(--cav-space-md);
	border-bottom: 1px solid var(--cav-border);
}

.shop-sidebar__section:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.shop-sidebar__title {
	margin: 0 0 var(--cav-space-sm);
	font-size: var(--cav-font-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--cav-text);
}

.shop-sidebar__back {
	display: inline-flex;
	align-items: center;
	gap: var(--cav-space-xs);
	font-size: var(--cav-font-sm);
	color: var(--cav-primary);
	text-decoration: none;
	transition: color var(--cav-transition-fast);
}

.shop-sidebar__back:hover {
	color: var(--cav-primary-dark);
	text-decoration: underline;
}

/* ==========================================================================
   Filtres (Checkboxes Bio / Local)
   ========================================================================== */

.shop-filters {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-sm);
}

.shop-filter {
	display: flex;
	align-items: center;
	gap: var(--cav-space-sm);
	cursor: pointer;
}

.shop-filter__checkbox {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.shop-filter__checkmark {
	position: relative;
	width: 20px;
	height: 20px;
	border: 2px solid var(--cav-border-dark);
	border-radius: var(--cav-radius-full);
	background: var(--cav-bg-alt);
	transition: all var(--cav-transition-fast);
}

.shop-filter__checkbox:checked+.shop-filter__checkmark {
	background: var(--cav-primary);
	border-color: var(--cav-primary);
}

.shop-filter__checkmark::after {
	content: '';
	position: absolute;
	display: none;
	left: 5px;
	top: 5px;
	width: 6px;
	height: 6px;
	background: var(--cav-text-inverse);
	border-radius: var(--cav-radius-full);
}

.shop-filter__checkbox:checked+.shop-filter__checkmark::after {
	display: block;
}

.shop-filter__checkbox:focus+.shop-filter__checkmark {
	box-shadow: 0 0 0 3px rgba(59, 154, 156, 0.2);
}

.shop-filter__label {
	font-size: var(--cav-font-base);
	color: var(--cav-text);
}

.shop-filters__submit {
	margin-top: var(--cav-space-sm);
	padding: var(--cav-space-xs) var(--cav-space-sm);
	font-size: var(--cav-font-sm);
	background: var(--cav-primary);
	color: var(--cav-text-inverse);
	border: none;
	border-radius: var(--cav-radius-sm);
	cursor: pointer;
}

/* ==========================================================================
   Radio Buttons (Tri)
   ========================================================================== */

.shop-radio {
	display: flex;
	align-items: center;
	gap: var(--cav-space-sm);
	cursor: pointer;
}

.shop-radio__input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.shop-radio__checkmark {
	position: relative;
	width: 20px;
	height: 20px;
	border: 2px solid var(--cav-border-dark);
	border-radius: var(--cav-radius-full);
	background: var(--cav-bg-alt);
	transition: all var(--cav-transition-fast);
}

.shop-radio__input:checked+.shop-radio__checkmark {
	border-color: var(--cav-primary);
}

.shop-radio__checkmark::after {
	content: '';
	position: absolute;
	display: none;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 10px;
	height: 10px;
	background: var(--cav-primary);
	border-radius: var(--cav-radius-full);
}

.shop-radio__input:checked+.shop-radio__checkmark::after {
	display: block;
}

.shop-radio__input:focus+.shop-radio__checkmark {
	box-shadow: 0 0 0 3px rgba(59, 154, 156, 0.2);
}

.shop-radio__label {
	font-size: var(--cav-font-base);
	color: var(--cav-text);
}

/* ==========================================================================
   Catégories (sidebar desktop)
   ========================================================================== */

.shop-categories {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-xs);
}

.shop-categories__item {
	margin: 0;
}

.shop-categories__link {
	display: inline-flex;
	align-items: center;
	gap: var(--cav-space-xs);
	padding: var(--cav-space-xs) var(--cav-space-sm);
	font-size: var(--cav-font-base);
	color: var(--cav-text);
	text-decoration: none;
	border-radius: var(--cav-radius-md);
	transition: all var(--cav-transition-fast);
}

.shop-categories__link:hover {
	background: var(--cav-bg);
	color: var(--cav-primary);
}

.shop-categories__link--active {
	background: var(--cav-bg);
	color: var(--cav-text);
	font-weight: 600;
}

.shop-categories__count {
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
}

/* ==========================================================================
   Navigation Mobile 2 Barres (catégories parentes + sous-catégories)
   ========================================================================== */

/* Masquer en desktop */
.shop-mobile-nav {
	display: none;
}

@media (max-width: 767px) {
	/* Afficher les 2 barres en mobile - pleine largeur */
	.shop-mobile-nav {
		display: flex;
		align-items: center;
		gap: var(--cav-space-sm);
		padding: var(--cav-space-sm) var(--cav-space-md);
		position: sticky;
		z-index: 100;
		/* Marges négatives pour toucher les bords */
		margin-left: calc(-1 * var(--cav-space-md));
		margin-right: calc(-1 * var(--cav-space-md));
		width: calc(100% + 2 * var(--cav-space-md));
	}

	/* LIGNE 1 - Catégories parentes (fond bleu) */
	.shop-mobile-nav--parents {
		top: 0;
		background-color: var(--cav-primary);
		color: var(--cav-text-inverse);
		/* Marge négative pour annuler le padding-top de .site-main */
		margin-top: calc(-1 * var(--cav-space-xl));
	}

	/* LIGNE 2 - Sous-catégories + filtre (fond clair) */
	.shop-mobile-nav--children {
		top: 44px; /* Hauteur de la ligne 1 */
		background-color: var(--cav-bg);
		border-bottom: 1px solid var(--cav-border);
	}

	/* Track scrollable horizontal */
	.shop-mobile-nav__track {
		display: flex;
		align-items: center;
		gap: var(--cav-space-sm);
		flex: 1;
		min-width: 0;
		overflow-x: auto;
		scroll-behavior: smooth;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		-ms-overflow-style: none;
	}

	.shop-mobile-nav__track::-webkit-scrollbar {
		display: none;
	}

	/* Bouton retour */
	.shop-mobile-nav__back {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-shrink: 0;
		width: 28px;
		height: 28px;
		color: var(--cav-text-inverse);
		background-color: rgba(255, 255, 255, 0.2);
		border-radius: var(--cav-radius-full);
		text-decoration: none;
		transition: background-color var(--cav-transition-fast);
	}

	.shop-mobile-nav__back:hover {
		background-color: rgba(255, 255, 255, 0.3);
		color: var(--cav-text-inverse);
	}

	/* Items de navigation */
	.shop-mobile-nav__item {
		flex-shrink: 0;
		padding: var(--cav-space-xs) var(--cav-space-md);
		font-size: var(--cav-font-sm);
		font-weight: 500;
		white-space: nowrap;
		text-decoration: none;
		border-radius: var(--cav-radius-full);
		transition: all var(--cav-transition-fast);
	}

	/* Items ligne 1 (fond bleu) */
	.shop-mobile-nav--parents .shop-mobile-nav__item {
		color: var(--cav-text-inverse);
		background-color: transparent;
	}

	.shop-mobile-nav--parents .shop-mobile-nav__item:hover {
		background-color: rgba(255, 255, 255, 0.2);
		color: var(--cav-text-inverse);
	}

	.shop-mobile-nav--parents .shop-mobile-nav__item--active {
		background-color: var(--cav-text-inverse);
		color: var(--cav-primary);
	}

	/* Items ligne 2 (fond blanc sur barre claire) */
	.shop-mobile-nav--children .shop-mobile-nav__item {
		color: var(--cav-text);
		background-color: var(--cav-bg-alt);
		border: 1px solid var(--cav-border);
	}

	.shop-mobile-nav--children .shop-mobile-nav__item:hover {
		border-color: var(--cav-secondary);
		color: var(--cav-secondary);
	}

	.shop-mobile-nav--children .shop-mobile-nav__item--active,
	.shop-mobile-nav--children .shop-mobile-nav__item--active:hover {
		background-color: var(--cav-secondary);
		border-color: var(--cav-secondary);
		color: var(--cav-text-inverse);
	}

	/* Bouton filtre dans ligne 2 */
	.shop-mobile-nav--children .shop-filters-toggle {
		flex-shrink: 0;
		padding: var(--cav-space-xs) var(--cav-space-sm);
		margin: 0;
		font-size: var(--cav-font-sm);
		max-width: 100vw;
	}

	/* Masquer le header sur les pages shop/catégories uniquement */
	.post-type-archive-product .site-header,
	.tax-product_cat .site-header,
	.tax-product_brand .site-header {
		display: none;
	}

	/* Ajuster le breadcrumb */
	.post-type-archive-product .shop-breadcrumb,
	.tax-product_cat .shop-breadcrumb {
		display: none;
	}

	/* Masquer la bannière en mobile */
	.post-type-archive-product .shop-banner,
	.tax-product_cat .shop-banner {
		display: none;
	}

	/* Ajuster le container pour les barres sticky */
	.post-type-archive-product .site-main > .container,
	.tax-product_cat .site-main > .container {
		padding-top: 0;
	}
}

/* ==========================================================================
   Barre Filtres Mobile (toggle + carousel catégories) - DESKTOP ONLY
   ========================================================================== */

.shop-filters-bar {
	display: none;
}

/* Afficher uniquement en tablette (768-991px), pas en mobile */
@media (min-width: 768px) and (max-width: 991px) {
	.shop-filters-bar {
		display: flex;
		align-items: center;
		gap: var(--cav-space-sm);
		margin-top: var(--cav-space-md);
		margin-bottom: var(--cav-space-md);
	}
}

/* Empêcher la sélection de texte */
.shop-filters-bar,
.shop-filters-toggle,
.shop-categories-carousel__parent,
.shop-categories-carousel__item,
.shop-filter,
.shop-radio {
	user-select: none;
	-webkit-user-select: none;
}

/* Bouton toggle filtres */
.shop-filters-toggle {
	display: flex;
	align-items: center;
	gap: var(--cav-space-xs);
	flex-shrink: 0;
	padding: var(--cav-space-sm) var(--cav-space-md);
	font-family: inherit;
	font-size: var(--cav-font-sm);
	font-weight: 600;
	color: var(--cav-text);
	background-color: var(--cav-bg-alt);
	border: 1px solid var(--cav-border);
	border-radius: var(--cav-radius-full);
	cursor: pointer;
	transition: all var(--cav-transition-fast);
}

.shop-filters-toggle:hover,
.shop-filters-toggle[aria-expanded="true"] {
	background-color: var(--cav-primary);
	border-color: var(--cav-primary);
	color: var(--cav-text-inverse);
}

.shop-filters-toggle--active {
	border-color: var(--cav-primary);
	color: var(--cav-primary);
}

.shop-filters-toggle__count {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 var(--cav-space-xs);
	font-size: var(--cav-font-xs);
	font-weight: 700;
	color: var(--cav-text-inverse);
	background-color: var(--cav-primary);
	border-radius: var(--cav-radius-full);
}

.shop-filters-toggle[aria-expanded="true"] .shop-filters-toggle__count,
.shop-filters-toggle:hover .shop-filters-toggle__count {
	background-color: var(--cav-bg);
	color: var(--cav-primary);
}

/* Carousel catégories */
.shop-categories-carousel {
	flex: 1;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: var(--cav-space-sm);
	overflow: hidden;
}

/* Parent cliquable avec icône retour */
.shop-categories-carousel__parent {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	gap: var(--cav-space-xs);
	padding: var(--cav-space-sm) var(--cav-space-sm) var(--cav-space-sm) var(--cav-space-xs);
	font-size: var(--cav-font-sm);
	font-weight: 600;
	color: var(--cav-primary);
	text-decoration: none;
	border-right: 1px solid var(--cav-border);
	transition: color var(--cav-transition-fast);
}

.shop-categories-carousel__parent:hover {
	color: var(--cav-primary-dark);
}

.shop-categories-carousel__parent svg {
	flex-shrink: 0;
}

.shop-categories-carousel__track {
	display: flex;
	gap: var(--cav-space-sm);
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: var(--cav-space-xs) 0;
}

.shop-categories-carousel__track::-webkit-scrollbar {
	display: none;
}

.shop-categories-carousel__item {
	flex-shrink: 0;
	padding: var(--cav-space-sm) var(--cav-space-md);
	font-size: var(--cav-font-sm);
	font-weight: 500;
	color: var(--cav-text);
	white-space: nowrap;
	text-decoration: none;
	background-color: var(--cav-bg-alt);
	border: 1px solid var(--cav-border);
	border-radius: var(--cav-radius-full);
	scroll-snap-align: start;
	transition: all var(--cav-transition-fast);
}

.shop-categories-carousel__item:hover {
	border-color: var(--cav-primary);
	color: var(--cav-primary);
}

.shop-categories-carousel__item--active {
	background-color: var(--cav-primary);
	border-color: var(--cav-primary);
	color: var(--cav-text-inverse);
}

/* ==========================================================================
   Panneau Filtres + Tri Mobile (masqué par défaut)
   ========================================================================== */

.shop-filters-panel {
	display: none;
}

@media (max-width: 991px) {
	.shop-filters-panel {
		display: block;
		overflow: hidden;
		max-height: 0;
		opacity: 0;
		transition: max-height var(--cav-transition-base), opacity var(--cav-transition-base), margin var(--cav-transition-base);
	}

	.shop-filters-panel[hidden] {
		display: block;
		max-height: 0;
		opacity: 0;
		margin-bottom: 0;
	}

	.shop-filters-panel:not([hidden]) {
		max-height: 400px;
		opacity: 1;
		margin-bottom: var(--cav-space-md);
	}
}

/* Mobile : panneau filtres sticky sous les 2 barres */
@media (max-width: 767px) {
	.shop-filters-panel {
		position: sticky;
		top: 88px; /* Hauteur des 2 barres sticky */
		z-index: 99;
		background-color: var(--cav-bg);
		/* Marges négatives comme les barres */
		margin-left: calc(-1 * var(--cav-space-md));
		margin-right: calc(-1 * var(--cav-space-md));
		width: calc(100% + 2 * var(--cav-space-md));
	}

	.shop-filters-panel:not([hidden]) {
		border-bottom: 1px solid var(--cav-border);
	}

	.shop-filters-panel__form {
		display: flex;
		flex-direction: column;
		gap: var(--cav-space-md);
		padding: var(--cav-space-md);
		background-color: var(--cav-bg);
		border-radius: var(--cav-radius-lg);
	}

	.shop-filters-panel__section {
		display: flex;
		flex-direction: column;
		gap: var(--cav-space-sm);
	}

	.shop-filters-panel__title {
		margin: 0;
		font-size: var(--cav-font-xs);
		font-weight: 700;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		color: var(--cav-text-light);
	}

	.shop-filters-panel__options {
		display: flex;
		flex-wrap: wrap;
		gap: var(--cav-space-md);
	}

	.shop-filters-panel__options--orderby {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--cav-space-sm);
	}
}

@media (max-width: 320px) {
	.shop-filters-panel__options--orderby {
		grid-template-columns: repeat(1, 1fr);
	}
}

/* ==========================================================================
   Contenu Principal
   ========================================================================== */

.shop-content {
	min-width: 0;
}

/* Header (description catégorie) */
.shop-header {
	margin-bottom: var(--cav-space-lg);
	padding: var(--cav-space-md);
	background: var(--cav-bg);
	border-radius: var(--cav-radius-md);
}

.shop-header__description {
	font-size: var(--cav-font-base);
	color: var(--cav-text-light);
	line-height: 1.6;
}

.shop-header__description p:last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   Filtres Actifs (Tags)
   ========================================================================== */

.shop-active-filters {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--cav-space-sm);
	margin-bottom: var(--cav-space-md);
	padding: var(--cav-space-sm) var(--cav-space-md);
	background: var(--cav-bg);
	border-radius: var(--cav-radius-md);
}

.shop-active-filters__label {
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
}

.shop-active-filters__tag {
	display: inline-flex;
	align-items: center;
	gap: var(--cav-space-xs);
	padding: var(--cav-space-xs) var(--cav-space-sm);
	font-size: var(--cav-font-sm);
	font-weight: 500;
	color: var(--cav-primary);
	background: var(--cav-bg-alt);
	border: 1px solid var(--cav-primary);
	border-radius: var(--cav-radius-full);
	text-decoration: none;
	transition: all var(--cav-transition-fast);
}

.shop-active-filters__tag:hover {
	background: var(--cav-primary);
	color: var(--cav-text-inverse);
}

.shop-active-filters__tag svg {
	opacity: 0.7;
}

.shop-active-filters__clear {
	margin-left: auto;
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
	text-decoration: underline;
}

.shop-active-filters__clear:hover {
	color: var(--cav-error);
}

/* ==========================================================================
   Contrôles (Résultats + Tri)
   ========================================================================== */

.shop-controls {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-xs);
}

@media (min-width: 576px) {
	.shop-controls {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}

@media (min-width: 768px) {
	.shop-controls {
		margin-bottom: var(--cav-space-sm);
	}
}

.shop-controls__count {
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
}

/* ==========================================================================
   Bouton Tri sidebar (desktop)
   ========================================================================== */

.shop-sidebar__section--sort {
	border-bottom: none;
	padding-bottom: 0;
}

.shop-sidebar__ordering {
	margin: 0;
}

/* Conteneur du bouton de tri stylisé */
.shop-sort-btn {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--cav-space-xs);
	width: 100%;
	padding: var(--cav-space-sm) var(--cav-space-lg);
	background-color: #EEEEEE;
	border-radius: var(--cav-radius-full);
	cursor: pointer;
	transition: background-color var(--cav-transition-fast);
}

.shop-sort-btn:hover {
	background-color: #E5E5E5;
}

.shop-sort-btn__icon {
	flex-shrink: 0;
	color: var(--cav-text);
}

.shop-sort-btn__label {
	font-size: var(--cav-font-base);
	font-weight: 600;
	color: var(--cav-text);
}

/* Select invisible superposé sur le bouton */
.shop-sort-btn__select {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
	font-size: var(--cav-font-base);
}

/* Focus state pour le bouton quand le select a le focus */
.shop-sort-btn:focus-within {
	outline: 2px solid var(--cav-primary);
	outline-offset: 2px;
}

/* ==========================================================================
   Grille de Produits
   ========================================================================== */

.products {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--cav-space-md) var(--cav-space-sm);
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (min-width: 640px) {
	.products {
		grid-template-columns: repeat(3, 1fr);
		gap: var(--cav-space-md);
	}
}

@media (min-width: 900px) {
	.products {
		grid-template-columns: repeat(4, 1fr);
	}
}

@media (min-width: 1200px) {
	.products {
		grid-template-columns: repeat(5, 1fr);
		gap: var(--cav-space-lg);
	}
}

/* Supprime le li de WooCommerce */
.products .product {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ==========================================================================
   Scroll Infini
   ========================================================================== */

/* Sentinel (invisible) */
.infinite-scroll-sentinel {
	height: 1px;
	width: 100%;
}

/* Loader */
.infinite-scroll-loader {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--cav-space-sm);
	padding: var(--cav-space-xl) var(--cav-space-md);
}

.infinite-scroll-loader__spinner {
	width: 24px;
	height: 24px;
	border: 3px solid var(--cav-border);
	border-top-color: var(--cav-primary);
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

.infinite-scroll-loader__text {
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
}

/* Message de fin */
.infinite-scroll-end {
	text-align: center;
	padding: var(--cav-space-lg) var(--cav-space-md);
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
}

/* Animation d'apparition des produits */
.product--loading {
	opacity: 0;
	transform: translateY(20px);
}

.product--loaded {
	transform: translateY(0);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.product--loaded:not(.product-card--out-of-stock) {
	opacity: 1;
}

/* Les produits en rupture gardent leur opacité réduite même après animation */
.product--loaded.product-card--out-of-stock {
	opacity: 0.7;
}

/* ==========================================================================
   Headers de sous-catégories (mode groupé - catégories parentes)
   ========================================================================== */

.subcategory-header {
	grid-column: 1 / -1; /* Prend toute la largeur de la grille */
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--cav-space-md);
	padding: var(--cav-space-lg) 0 var(--cav-space-md);
	margin-top: var(--cav-space-xl);
	border-top: 1px solid var(--cav-border);
	list-style: none;
}

/* Premier header (pas de bordure ni marge en haut) */
.subcategory-header:first-child,
.products > .subcategory-header:first-of-type {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
}

.subcategory-header__title {
	margin: 0;
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-xl);
	font-weight: 700;
	color: var(--cav-text);
}

.subcategory-header__link {
	display: inline-flex;
	align-items: center;
	gap: var(--cav-space-xs);
	font-size: var(--cav-font-sm);
	font-weight: 500;
	color: var(--cav-primary);
	text-decoration: none;
	transition: color var(--cav-transition-fast);
	white-space: nowrap;
}

.subcategory-header__link:hover {
	color: var(--cav-primary-dark);
}

.subcategory-header__link svg {
	width: 16px;
	height: 16px;
	transition: transform var(--cav-transition-fast);
}

.subcategory-header__link:hover svg {
	transform: translateX(2px);
}

/* Responsive */
@media (max-width: 768px) {
	.subcategory-header {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--cav-space-sm);
	}

	.subcategory-header__title {
		font-size: var(--cav-font-lg);
	}
}

/* ==========================================================================
   Pagination (masquée quand scroll infini actif)
   ========================================================================== */

.shop-pagination {
	margin-top: var(--cav-space-xl);
}

.woocommerce-pagination {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--cav-space-xs);
}

.woocommerce nav.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--cav-space-xs);
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li {
	margin: 0;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 var(--cav-space-sm);
	font-size: var(--cav-font-sm);
	font-weight: 500;
	color: var(--cav-text);
	background: var(--cav-bg-alt);
	border: 1px solid var(--cav-border);
	border-radius: var(--cav-radius-sm);
	text-decoration: none;
	transition: all var(--cav-transition-fast);
}

.woocommerce-pagination ul li a:hover {
	background: var(--cav-primary);
	border-color: var(--cav-primary);
	color: var(--cav-text-inverse);
}

.woocommerce-pagination ul li span.current {
	background: var(--cav-primary);
	border-color: var(--cav-primary);
	color: var(--cav-text-inverse);
}

/* Responsive */
@media (max-width: 480px) {

	.woocommerce-pagination ul li a,
	.woocommerce-pagination ul li span {
		min-width: 40px;
		height: 40px;
		font-size: var(--cav-font-sm);
	}

	.woocommerce-pagination ul {
		gap: 4px;
	}
}

/* ==========================================================================
   Aucun Produit
   ========================================================================== */

.shop-no-products {
	text-align: center;
	padding: var(--cav-space-3xl) var(--cav-space-lg);
	background: var(--cav-bg);
	border-radius: var(--cav-radius-lg);
}

.shop-no-products__message {
	margin: 0 0 var(--cav-space-md);
	font-size: var(--cav-font-lg);
	color: var(--cav-text-light);
}

.shop-no-products__reset {
	display: inline-flex;
	padding: var(--cav-space-sm) var(--cav-space-lg);
	font-size: var(--cav-font-base);
	font-weight: 600;
	color: var(--cav-primary);
	background: var(--cav-bg-alt);
	border: 2px solid var(--cav-primary);
	border-radius: var(--cav-radius-md);
	text-decoration: none;
	transition: all var(--cav-transition-fast);
}

.shop-no-products__reset:hover {
	background: var(--cav-primary);
	color: var(--cav-text-inverse);
}

/* ==========================================================================
   WooCommerce Overrides
   ========================================================================== */

.woocommerce-result-count {
	margin: 0;
	font-size: var(--cav-font-sm);
	color: var(--cav-text-light);
}

.woocommerce-ordering {
	margin: 0;
}

.woocommerce-ordering select {
	padding: var(--cav-space-sm) var(--cav-space-xl) var(--cav-space-sm) var(--cav-space-md);
	border: 1px solid var(--cav-border);
	border-radius: var(--cav-radius-md);
	background: var(--cav-bg-alt);
	font-size: var(--cav-font-sm);
	cursor: pointer;
}

.woocommerce-no-products-found {
	text-align: center;
	padding: var(--cav-space-3xl) var(--cav-space-md);
}

.woocommerce-no-products-found .woocommerce-info {
	display: inline-flex;
	align-items: center;
	gap: var(--cav-space-sm);
	padding: var(--cav-space-md) var(--cav-space-lg);
	background: var(--cav-warning-light);
	border-radius: var(--cav-radius-lg);
	color: var(--cav-warning);
}

/* ==========================================================================
   Affichage groupé par sous-catégories (pages catégories parentes)
   ========================================================================== */

.shop-grouped {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-2xl);
}

/* Section sous-catégorie */
.subcategory-section {
	scroll-margin-top: calc(var(--cav-header-height, 80px) + var(--cav-space-3xl) + var(--cav-space-xl));
}

.subcategory-section__header {
	position: sticky;
	top: calc(var(--cav-header-height, 80px) + var(--cav-space-3xl) + var(--cav-space-xl));
	z-index: 10;
	background: white;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--cav-space-md);
	margin-bottom: var(--cav-space-lg);
	padding-bottom: var(--cav-space-sm);
	border-bottom: 2px solid var(--cav-primary);
}

.subcategory-section__header::before {
	content: "";
	position: absolute;
	bottom: 100%;
	left: 0;
	width: 100%;
	height: var(--cav-space-xl);
	background: white;
	z-index: -1;
}

.subcategory-section__title {
	margin: 0;
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-lg);
	font-weight: 700;
	color: var(--cav-text);
}

.subcategory-section__link {
	display: inline-flex;
	align-items: center;
	gap: var(--cav-space-xs);
	font-size: var(--cav-font-sm);
	font-weight: 500;
	color: var(--cav-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

.subcategory-section__link:hover {
	color: var(--cav-primary-dark);
}

.subcategory-section__link svg {
	transition: transform 0.2s ease;
}

.subcategory-section__link:hover svg {
	transform: translateX(3px);
}

.subcategory-section__products {
	margin: 0;
}

/* Loader pour les sous-catégories */
.subcategory-loader {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--cav-space-sm);
	padding: var(--cav-space-xl);
	color: var(--cav-text-muted);
}

/* Sentinel (invisible) */
.subcategory-sentinel {
	height: 1px;
}

/* Sidebar : lien actif au scroll */
.shop-categories__link--scrolled {
	background: var(--cav-primary);
	color: white;
	border-radius: var(--cav-radius-sm);
}

/* Animation d'apparition des sections chargées en AJAX */
.subcategory-section--loading {
	opacity: 0;
	transform: translateY(20px);
}

.subcategory-section--loaded {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Responsive tablette */
@media (max-width: 991px) {
	.subcategory-section__header {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--cav-space-sm);
	}

	.subcategory-section__title {
		font-size: var(--cav-font-md);
	}
}

/* Responsive mobile - ajuster pour les 2 barres sticky (88px total) */
@media (max-width: 767px) {
	.subcategory-section {
		scroll-margin-top: calc(88px + var(--cav-space-lg));
	}

	.subcategory-section__header {
		top: calc(88px + var(--cav-space-sm));
	}

	.subcategory-section__header::before {
		height: var(--cav-space-md);
	}
}

/* Container des sections (nouvelle architecture) */
.subcategory-sections {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-2xl);
	overflow-anchor: auto;
}

/* Empêche les sections individuelles d'être l'ancre de scroll */
.subcategory-section {
	overflow-anchor: none;
}

/* Seul le contenu des produits peut être l'ancre (évite les sauts de scroll) */
.subcategory-section__products {
	overflow-anchor: auto;
}

/* Section placeholder (pas encore chargée) */
.subcategory-section--empty {
	display: none;
}

.subcategory-section--placeholder .subcategory-section__products {
	position: relative;
	min-height: 200px;
}

.subcategory-section--placeholder .subcategory-section__products:empty::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, var(--cav-bg-alt) 25%, var(--cav-bg) 50%, var(--cav-bg-alt) 75%);
	background-size: 200% 100%;
	animation: shimmer 1.5s infinite;
	border-radius: var(--cav-radius-md);
	opacity: 0.5;
}

/* Section chargée - reset du placeholder */
.subcategory-section--loaded .subcategory-section__products {
	min-height: auto;
}

@keyframes shimmer {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* Loader dans la section */
.subcategory-section__loading {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--cav-space-sm);
	padding: var(--cav-space-xl);
	color: var(--cav-text-light);
	font-size: var(--cav-font-sm);
}

.subcategory-section__loading .infinite-scroll-loader__spinner {
	width: 24px;
	height: 24px;
	border: 3px solid var(--cav-border);
	border-top-color: var(--cav-primary);
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}

@keyframes spin {
	to { transform: rotate(360deg); }
}

/* Sentinel invisible */
.subcategory-section__sentinel {
	height: 1px;
	visibility: hidden;
}

/* ══════════════════════════════════════════════════════════════════════
   HAUTEUR UNIFORME - Évite les décalages au chargement des sections
   ══════════════════════════════════════════════════════════════════════ */

/* Desktop : hauteur min identique cards/skeletons pour stabiliser le scroll lors du chargement */
@media (min-width: 768px) {
	.style-product-card,
	.product-skeleton {
		min-height: 331px;
	}
}

/* ══════════════════════════════════════════════════════════════════════
   SKELETONS - Placeholders pour réserver l'espace
   Structure identique à .style-product-card pour garantir la même hauteur
   ══════════════════════════════════════════════════════════════════════ */

/* Container - identique à .style-product-card */
.product-skeleton {
	position: relative;
	display: flex;
	flex-direction: column;
	background-color: var(--cav-bg-alt);
	border-radius: var(--cav-radius-lg);
	border: 1px solid var(--cav-border);
	overflow: hidden;
	box-shadow: var(--cav-shadow-sm);
}

/* Image wrapper - identique à .product-card__image-wrapper */
.product-skeleton__image-wrapper {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
	background: linear-gradient(90deg, var(--cav-bg) 25%, var(--cav-border) 50%, var(--cav-bg) 75%);
	background-size: 200% 100%;
	animation: skeleton-shimmer 1.5s infinite;
}

/* Content wrapper - identique à .product-card__content */
.product-skeleton__content {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-xs);
	padding: var(--cav-space-sm);
}

@media (min-width: 768px) {
	.product-skeleton__content {
		padding: var(--cav-space-md);
	}
}

/* Titre - identique à .product-card__title avec line-clamp: 2 */
.product-skeleton__title {
	/* Hauteur = 2 lignes * font-size * line-height */
	/* font-sm = 0.875rem, line-height = 1.3 */
	height: calc(2 * 0.875rem * 1.3);
	width: 85%;
	background: linear-gradient(90deg, var(--cav-bg) 25%, var(--cav-border) 50%, var(--cav-bg) 75%);
	background-size: 200% 100%;
	border-radius: var(--cav-radius-sm);
	animation: skeleton-shimmer 1.5s infinite;
}

/* Header - identique à .product-card__header */
.product-skeleton__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--cav-space-sm);
	margin-bottom: var(--cav-space-xs);
}

/* Prix - identique à .product-card__price-current */
.product-skeleton__price {
	height: 1rem; /* font-base */
	width: 60px;
	background: linear-gradient(90deg, var(--cav-bg) 25%, var(--cav-border) 50%, var(--cav-bg) 75%);
	background-size: 200% 100%;
	border-radius: var(--cav-radius-sm);
	animation: skeleton-shimmer 1.5s infinite;
}

/* Bouton rond - identique au bouton d'ajout */
.product-skeleton__button {
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	background: linear-gradient(90deg, var(--cav-bg) 25%, var(--cav-border) 50%, var(--cav-bg) 75%);
	background-size: 200% 100%;
	border-radius: 50%;
	animation: skeleton-shimmer 1.5s infinite;
}

/* Meta - identique à .product-card__meta */
.product-skeleton__meta {
	display: flex;
	align-items: center;
	gap: var(--cav-space-sm);
	margin-top: auto;
}

/* Poids - identique à .product-card__weight */
.product-skeleton__weight {
	height: calc(var(--cav-font-xs) + 4px); /* font-xs + padding vertical */
	width: 50px;
	background: linear-gradient(90deg, var(--cav-bg) 25%, var(--cav-border) 50%, var(--cav-bg) 75%);
	background-size: 200% 100%;
	border-radius: var(--cav-radius-sm);
	animation: skeleton-shimmer 1.5s infinite;
}

@keyframes skeleton-shimmer {
	0% { background-position: 200% 0; }
	100% { background-position: -200% 0; }
}

/* Masquer les skeletons une fois la section chargée */
.subcategory-section--loaded .product-skeleton {
	display: none;
}

/* Lien sous-catégorie en chargement (sidebar) */
.shop-categories__link.is-loading {
	position: relative;
	pointer-events: none;
	opacity: 0.7;
}

.shop-categories__link.is-loading::after {
	content: '';
	position: absolute;
	right: var(--cav-space-sm);
	top: 50%;
	transform: translateY(-50%);
	width: 12px;
	height: 12px;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	animation: spin 0.8s linear infinite;
}

/* ==========================================================================
   Producer Header (archives product_brand)
   Affiché HORS du container, pleine largeur
   ========================================================================== */

.producer-header {
	background: var(--cav-bg);
	padding: var(--cav-space-2xl) var(--cav-space-lg);
}

.producer-header__title {
	max-width: var(--cav-container-width, 1280px);
	margin: 0 auto var(--cav-space-xl);
	padding: 0 var(--cav-space-md);
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-3xl);
	font-weight: 700;
	color: var(--cav-text);
}

.producer-header__card {
	display: grid;
	grid-template-columns: auto 1fr 1.5fr;
	gap: var(--cav-space-2xl);
	align-items: start;
	max-width: var(--cav-container-width, 1280px);
	margin: 0 auto;
	padding: 0 var(--cav-space-md);
}

/* Logo */
.producer-header__logo {
	width: 200px;
	height: 200px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--cav-bg-alt);
	border: 5px solid white;
	border-radius: 50%;
	box-shadow: var(--cav-shadow-lg);
	overflow: hidden;
}

.producer-header__logo-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.producer-header__logo-initials {
	font-family: var(--cav-font-heading);
	font-size: var(--cav-font-3xl);
	font-weight: 700;
	color: var(--cav-primary);
}

/* Info (location + badges) */
.producer-header__info {
	display: flex;
	flex-direction: column;
	gap: var(--cav-space-md);
	padding-top: var(--cav-space-sm);
}

.producer-header__location {
	display: flex;
	align-items: center;
	gap: var(--cav-space-sm);
	font-size: var(--cav-font-lg);
	color: var(--cav-text);
	padding-left: var(--cav-space-md);
	border-left: 2px solid var(--cav-border);
}

.producer-header__location .icon {
	color: var(--cav-text-light);
	flex-shrink: 0;
}

/* Badges */
.producer-header__badges {
	display: flex;
	flex-wrap: wrap;
	gap: var(--cav-space-sm);
}

.producer-header__badge {
	display: inline-block;
	padding: var(--cav-space-sm) var(--cav-space-lg);
	font-size: var(--cav-font-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	border-radius: var(--cav-radius-lg);
}

.producer-header__badge--local {
	background-color: var(--cav-secondary);
	color: var(--cav-text);
}

.producer-header__badge--bio {
	background-color: var(--cav-success);
	color: var(--cav-text-inverse);
}

/* Description */
.producer-header__description {
	padding: var(--cav-space-xl);
	background: var(--cav-bg-alt);
	border-radius: var(--cav-radius-lg);
	font-size: var(--cav-font-base);
	line-height: 1.6;
	color: var(--cav-text);
}

.producer-header__description p {
	margin: 0;
}

.producer-header__description p + p {
	margin-top: var(--cav-space-md);
}

/* ==========================================================================
   Producer Header - Responsive
   ========================================================================== */

@media (max-width: 1024px) {
	.producer-header__card {
		grid-template-columns: auto 1fr;
		grid-template-rows: auto auto;
		gap: var(--cav-space-xl);
	}

	.producer-header__logo {
		width: 160px;
		height: 160px;
	}

	.producer-header__description {
		grid-column: 1 / -1;
	}
}

@media (max-width: 768px) {
	.producer-header {
		padding: var(--cav-space-xl) var(--cav-space-md);
	}

	.producer-header__title {
		font-size: var(--cav-font-2xl);
		margin-bottom: var(--cav-space-lg);
		text-align: center;
	}

	.producer-header__card {
		grid-template-columns: 1fr;
		gap: var(--cav-space-lg);
		text-align: center;
	}

	.producer-header__logo {
		width: 140px;
		height: 140px;
		margin: 0 auto;
	}

	.producer-header__info {
		align-items: center;
		padding-top: 0;
	}

	.producer-header__location {
		border-left: none;
		padding-left: 0;
		font-size: var(--cav-font-base);
	}

	.producer-header__badges {
		justify-content: center;
	}

	.producer-header__description {
		padding: var(--cav-space-lg);
		text-align: left;
	}

	/* Page producteur : barres de navigation en fixed pour passer au-dessus du header */
	.tax-product_brand .shop-mobile-nav {
		position: fixed;
		left: 0;
		right: 0;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}

	.tax-product_brand .shop-mobile-nav--parents {
		margin-top: 0;
	}

	/* Panneau filtres en fixed sous les 2 barres */
	.tax-product_brand .shop-filters-panel {
		position: fixed;
		top: 88px;
		left: 0;
		right: 0;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		z-index: 99;
	}

	/* Compenser la hauteur des 2 barres fixed (44px + 44px) */
	.tax-product_brand .producer-header {
		padding-top: calc(88px + var(--cav-space-xl));
	}
}