/* ==========================================================================
   Filtres des listes de produits (Filter Everything Pro)
   Chargé seulement quand l'extension charge sa propre feuille (functions.php).

   Tout passe par le balisage de l'extension, rien n'est réécrit : ses
   réglages (quels filtres, dans quel ordre, repliables ou non) restent dans
   son admin. Ses propres règles sont préfixées `body .wpc-filters-main-wrap`
   (dont celles de ses réglages de couleur, le beige du bouton « Afficher ») :
   on reprend ce préfixe, plus une classe, pour passer devant sans !important.
   ========================================================================== */

/* --- Sections --- */

body .wpc-filters-main-wrap .wpc-filters-section {
	margin: 0;
	padding: 18px 0;
	border-bottom: 1px solid var(--cristime-line);
}

body .wpc-filters-main-wrap .wpc-filters-section:first-child {
	padding-top: 0;
}

/* Titres : un seul style, qu'ils soient repliables ou non. Les repliables
   (Forme, Taille du cadran…) sortaient en casse normale, les autres en
   capitales. */
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-header {
	margin: 0 0 12px;
}

body .wpc-filters-main-wrap .wpc-filters-section.wpc-filter-collapsible:not(.wpc-opened) .wpc-filter-header {
	margin-bottom: 0;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title,
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title button,
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title button:hover,
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title button:focus,
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title button:active {
	margin: 0;
	padding: 0;
	font-family: var(--global-body-font-family);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .1em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--cristime-ink);
	background: none;
	border: 0;
	box-shadow: none;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	cursor: pointer;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-title button:focus-visible {
	outline: 2px solid var(--cristime-accent-dark);
	outline-offset: 2px;
}

/* --- Cases à cocher --- */

body .wpc-filters-main-wrap .wpc-filters-section .wpc-filters-ul-list {
	margin: 0;
	padding: 0;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item {
	margin: 0;
	padding: 0;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-term-item-content-wrapper {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 32px;
}

@media (max-width: 1024px) {
	body .wpc-filters-main-wrap .wpc-filters-section .wpc-term-item-content-wrapper {
		min-height: 40px;
	}
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item input[type="checkbox"] {
	-webkit-appearance: none;
	appearance: none;
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	margin: 0;
	background: #fff center / 12px 12px no-repeat;
	border: 1px solid var(--cristime-border);
	border-radius: 4px;
	cursor: pointer;
	transition: border-color .15s, background-color .15s;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item input[type="checkbox"]:hover {
	border-color: var(--cristime-accent-dark);
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item input[type="checkbox"]:checked {
	background-color: var(--cristime-ink);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
	border-color: var(--cristime-ink);
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--cristime-accent-dark);
	outline-offset: 2px;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item label {
	margin: 0;
	padding: 0;
	font-size: 15px;
	line-height: 1.35;
	cursor: pointer;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item a.wpc-filter-link {
	color: var(--cristime-ink);
	text-decoration: none;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item a.wpc-filter-link:hover,
body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item input[type="checkbox"]:checked + label a.wpc-filter-link {
	color: var(--cristime-ink);
	font-weight: 600;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-checkbox-item a.wpc-filter-link:hover {
	font-weight: inherit;
	color: var(--cristime-accent-dark);
}

/* --- Marques : le nom plutôt que le logo ---
   Les logos, réduits à 50 px, étaient illisibles pour la moitié des marques
   (Balmain, Certus, Emporio Armani…). L'extension rend déjà le nom à côté. */
body .wpc-filters-main-wrap .wpc-filters-section.wpc-filter-product_brand .wpc-term-image-wrapper {
	display: none;
}

body .wpc-filters-main-wrap .wpc-filters-section.wpc-filter-product_brand .wpc-term-name {
	display: inline;
	margin: 0;
}

body .wpc-filters-main-wrap .wpc-filters-section.wpc-filter-product_brand .wpc-filters-ul-list {
	max-height: 290px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: var(--cristime-border) transparent;
}

/* Recherche dans les marques */
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filter-search-wrapper {
	position: relative;
	margin: 0 0 10px;
}

body .wpc-filters-main-wrap .wpc-filters-section input.wpc-filter-search-field {
	width: 100%;
	height: 40px;
	margin: 0;
	padding: 0 36px;
	font-size: 14px;
	color: var(--cristime-ink);
	background: #fff;
	border: 1px solid var(--cristime-border);
	border-radius: 6px;
	box-shadow: none;
}

body .wpc-filters-main-wrap .wpc-filters-section input.wpc-filter-search-field:focus {
	outline: none;
	border-color: var(--cristime-accent-dark);
	box-shadow: 0 0 0 3px rgba(202, 180, 155, .3);
}

/* Croix d'effacement : un <button>, donc la recette Kadence (trois états). */
body .wpc-filters-main-wrap .wpc-filters-section button.wpc-search-clear,
body .wpc-filters-main-wrap .wpc-filters-section button.wpc-search-clear:hover,
body .wpc-filters-main-wrap .wpc-filters-section button.wpc-search-clear:focus,
body .wpc-filters-main-wrap .wpc-filters-section button.wpc-search-clear:active {
	padding: 0 10px;
	color: var(--cristime-muted);
	background: none;
	border: 0;
	box-shadow: none;
}

/* --- Avis : étoiles à la couleur des fiches --- */
body .wpc-filters-main-wrap .wpc-filters-section .flrt-star-rating-checkbox svg {
	width: 16px;
	height: 16px;
}

/* --- Prix --- */

body .wpc-filters-main-wrap .wpc-filters-section .wpc-filters-range-wrapper {
	display: flex;
	gap: 10px;
	margin: 0 0 14px;
}

body .wpc-filters-main-wrap .wpc-filters-section .wpc-filters-range-column {
	flex: 1 1 0;
	width: auto;
	margin: 0;
}

body .wpc-filters-main-wrap .wpc-filters-section input.wpc-filters-range-min,
body .wpc-filters-main-wrap .wpc-filters-section input.wpc-filters-range-max {
	width: 100%;
	height: 40px;
	margin: 0;
	padding: 0 12px;
	font-size: 14px;
	color: var(--cristime-ink);
	background: #fff;
	border: 1px solid var(--cristime-border);
	border-radius: 6px;
	box-shadow: none;
}

body .wpc-filters-main-wrap .wpc-filters-section input.wpc-filters-range-min:focus,
body .wpc-filters-main-wrap .wpc-filters-section input.wpc-filters-range-max:focus {
	outline: none;
	border-color: var(--cristime-accent-dark);
}

/* Curseur (jQuery UI) : rail fin, plage à l'encre, poignées blanches. */
body .wpc-filters-main-wrap .wpc-filters-section .wpc-filters-range-slider-wrapper {
	margin: 0 9px;
}

body .wpc-filters-main-wrap .wpc-filters-section .ui-slider.ui-slider-horizontal {
	height: 2px;
	background: var(--cristime-border);
	border: 0;
	border-radius: 2px;
}

body .wpc-filters-main-wrap .wpc-filters-section .ui-slider .ui-slider-range {
	background: var(--cristime-ink);
}

body .wpc-filters-main-wrap .wpc-filters-section .ui-slider .ui-slider-handle,
body .wpc-filters-main-wrap .wpc-filters-section .ui-slider .ui-slider-handle:hover,
body .wpc-filters-main-wrap .wpc-filters-section .ui-slider .ui-slider-handle:focus {
	top: -8px;
	width: 18px;
	height: 18px;
	margin-left: -9px;
	background: #fff;
	border: 1.5px solid var(--cristime-ink);
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
	outline: none;
	cursor: grab;
}

/* --- Filtres actifs (pastilles au-dessus des produits) --- */

body .wpc-custom-selected-terms .wpc-filter-chips-list,
body .wpc-inner-widget-chips-wrapper .wpc-filter-chips-list {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

body .wpc-filter-chips-list li.wpc-filter-chip {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

body .wpc-filter-chips-list li.wpc-filter-chip a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 34px;
	padding: 6px 12px 6px 14px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	color: var(--cristime-ink);
	text-decoration: none;
	background: var(--cristime-alt);
	border: 1px solid var(--cristime-alt);
	border-radius: 999px;
	transition: border-color .15s;
}

body .wpc-filter-chips-list li.wpc-filter-chip a:hover {
	border-color: var(--cristime-accent);
}

body .wpc-filter-chips-list .wpc-chip-remove-icon {
	margin: 0;
	font-size: 16px;
	line-height: 1;
	color: var(--cristime-muted);
}

/* « Réinitialiser » : lien discret, en fin de rangée. */
body .wpc-filter-chips-list li.wpc-chip-reset-all {
	order: 99;
}

body .wpc-filter-chips-list li.wpc-chip-reset-all a {
	background: none;
	border-color: transparent;
	text-decoration: underline;
	text-decoration-color: var(--cristime-accent);
	text-underline-offset: 3px;
}

/* Sans filtre actif, la liste des filtres choisis est vide mais garde ses
   20 px de marge basse, au dessus du compteur et du tri. */
body .wpc-custom-selected-terms .wpc-filter-chips-list.wpc-empty-chips-container {
	margin: 0;
}

body .wpc-filter-chips-list li.wpc-chip-reset-all .wpc-chip-remove-icon {
	display: none;
}

/* --- Mobile : bouton « Filtres » et panneau --- */

/* `div.` en plus : l'extension imprime sa feuille en ligne (#filter-everything-
   inline-css) APRÈS la nôtre, avec exactement ce sélecteur. Elle gagnait donc
   sur display, padding, bordure, graisse : le bouton restait en inline-block,
   « Filtres » collé en haut de ses 44 px au lieu d'être centré. */
body div.wpc-filters-open-button-container a.wpc-filters-open-widget {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1.2;
	box-sizing: border-box;
	min-height: 44px;
	padding: 0 18px;
	font-size: 14px;
	font-weight: 600;
	color: var(--cristime-ink);
	text-decoration: none;
	background: #fff;
	border: 1px solid var(--cristime-ink);
	border-radius: 4px;
}

body .wpc-filters-open-button-container .wpc-icon-html-wrapper span {
	background: var(--cristime-ink);
}

/* En-tête du panneau */
body .wpc-filters-main-wrap .wpc-filters-widget-content .wpc-widget-close-container {
	border-bottom: 1px solid var(--cristime-line);
}

body .wpc-filters-main-wrap .wpc-filters-widget-content .wpc-widget-popup-title {
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--cristime-ink);
}

/* Pied du panneau : « Afficher (494) » en bouton principal, « Annuler » en
   secondaire. Le beige d'origine se lisait mal en blanc dessus. */
body .wpc-filters-main-wrap .wpc-filters-widget-controls-container {
	border-top: 1px solid var(--cristime-line);
	box-shadow: 0 -8px 20px -12px rgba(0, 0, 0, .15);
}

/* Deux boutons de même largeur, séparés de 12 px, texte centré dans les deux
   sens : l'extension les rendait en `display: block` avec une hauteur minimale,
   le texte restait collé en haut. */
body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-wrapper {
	display: flex;
	gap: 12px;
}

body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item {
	flex: 1 1 0;
	width: auto;
	margin: 0;
	padding: 0;
}

body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item a.wpc-filters-apply-button,
body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item a.wpc-filters-apply-button:hover,
body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item a.wpc-filters-apply-button:focus {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .35em; /* en flex, l'espace avant « (494) » disparaissait */
	width: 100%;
	min-height: 48px;
	padding: 0 12px;
	line-height: 1.2;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #fff;
	background: var(--cristime-ink);
	border: 1px solid var(--cristime-ink);
	border-radius: 4px;
	box-shadow: none;
	opacity: 1;
}

body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item a.wpc-filters-close-button,
body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item a.wpc-filters-close-button:hover,
body .wpc-filters-main-wrap .wpc-filters-widget-controls-container .wpc-filters-widget-controls-item a.wpc-filters-close-button:focus {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 48px;
	padding: 0 12px;
	line-height: 1.2;
	font-size: 14px;
	font-weight: 600;
	color: var(--cristime-ink);
	background: #fff;
	border: 1px solid var(--cristime-border);
	border-radius: 4px;
	box-shadow: none;
}
