/*
 * Moteur unique — mobile-first (LOT 9.2, section 29). Réutilise
 * volontairement les couleurs/formes de planner.css (chips, boutons,
 * cartes) : même famille visuelle, un seul système, jamais un second style
 * pour un second "moteur" qui n'existe plus pour le visiteur.
 */

.vce-discovery {
	max-width: 900px;
	margin: 2rem auto;
	font-family: inherit;
}

.vce-discovery-toprow {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin-bottom: 1rem;
}

.vce-discovery-dates {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: center;
}

.vce-discovery-dateinput {
	padding: 0.5em 0.7em;
	border: 1px solid #c9c2b4;
	border-radius: 8px;
	font-size: 0.92rem;
}

.vce-discovery-daterange {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 0.5rem;
}

/* L'attribut `hidden` doit toujours l'emporter.
   La feuille du navigateur declare `[hidden] { display: none }`, mais une
   regle de CLASSE qui pose un `display` a une specificite superieure : le
   bloc reste alors VISIBLE au premier affichage, avant que le JS ne prenne
   la main. C'est exactement ce qui se produisait ici, avec deux champs de
   dates vides affiches sous les raccourcis de temporalite (LOT 12). */
.vce-discovery-daterange[hidden] {
	display: none;
}


.vce-discovery-daterange label {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	font-size: 0.8rem;
	color: #6b5a2f;
}

.vce-discovery-search {
	width: 100%;
	padding: 0.7em 0.9em;
	border: 1px solid #c9c2b4;
	border-radius: 999px;
	font-size: 1rem;
	box-sizing: border-box;
}

.vce-discovery-tabs {
	display: flex;
	gap: 0.4rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 0.25rem;
	margin-bottom: 0.75rem;
}

.vce-discovery-tab {
	flex: 0 0 auto;
	padding: 0.55em 1em;
	border: 1px solid #c9c2b4;
	border-radius: 999px;
	background: #fff;
	font-size: 0.92rem;
	cursor: pointer;
	white-space: nowrap;
}

.vce-discovery-tab span[data-count] {
	color: #8a8a8a;
	font-size: 0.85em;
}

.vce-discovery-tab.is-active {
	background: #2a4f48;
	border-color: #2a4f48;
	color: #fff;
}

.vce-discovery-tab.is-active span[data-count] {
	color: #d8e4e1;
}

.vce-discovery-launch-title {
	margin: 0 0 0.4rem;
	font-size: 0.85rem;
	color: #6b5a2f;
}

.vce-discovery-launch {
	margin-bottom: 0.5rem;
}

.vce-discovery-more-filters {
	margin-bottom: 1rem;
}

.vce-discovery-more-filters summary {
	cursor: pointer;
	font-size: 0.85rem;
	color: #2a4f48;
	padding: 0.3em 0;
	list-style: none;
}

.vce-discovery-more-filters summary::-webkit-details-marker {
	display: none;
}

.vce-discovery-more-filters summary::before {
	content: "+ ";
}

.vce-discovery-more-filters[open] summary::before {
	content: "– ";
}

.vce-discovery-more-filters .vce-discovery-quickfilters {
	margin-top: 0.6rem;
}

.vce-discovery-quickfilters {
	margin-bottom: 1rem;
}

/* LOT 10, correction UX (double navigation) : les onglets historiques
   vivent maintenant à l'intérieur de « Plus de filtres », même style que
   les autres libellés de groupe (`.vce-discovery-launch-title`) — un seul
   système visuel, jamais un second. */
.vce-discovery-more-filters .vce-discovery-filter-label {
	margin: 0.8rem 0 0.4rem;
	font-size: 0.85rem;
	color: #6b5a2f;
}

.vce-discovery-more-filters .vce-discovery-tabs {
	margin-bottom: 0.6rem;
}

.vce-discovery-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin-bottom: 1rem;
}

.vce-discovery-plan-extra {
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid #e4dfd2;
}

.vce-discovery-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 1rem;
}

.vce-discovery-result-card {
	position: relative;
}

.vce-discovery-card-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5em;
	margin-bottom: 0.4em;
}

.vce-discovery-badge {
	display: inline-block;
	margin-bottom: 0.4em;
	padding: 0.15em 0.6em;
	border-radius: 999px;
	background: #efe8d8;
	color: #6b5a2f;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* LOT 10D, section 20/22 : aucune convention € n'existait déjà ailleurs
   dans le plugin ni dans css-additionnel.css (audit fait avant d'écrire ce
   bloc) — nouvelle représentation minimale, volontairement distincte du
   badge de contexte (bordure plutôt que fond plein) pour ne jamais laisser
   croire que le prix est une info éditoriale au même titre que ❤️/✨. */
.vce-discovery-price {
	display: inline-block;
	flex-shrink: 0;
	padding: 0.1em 0.5em;
	border: 1px solid #b8a06a;
	border-radius: 999px;
	color: #6b5a2f;
	font-size: 0.75rem;
	font-weight: 600;
	white-space: nowrap;
}

@media (min-width: 640px) {
	.vce-discovery-toprow {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.vce-discovery-search {
		max-width: 260px;
	}
}

@media (min-width: 780px) {
	.vce-discovery-grid {
		grid-template-columns: 1fr 1fr;
	}
}

/* LOT 10D, section 2/3/46 : desktop large = 3 colonnes fixes. Avec
   IDEAS_BATCH_SIZE = 6 (Vce_Discovery_Shortcode), un lot complet remplit
   EXACTEMENT 2 rangées pleines (jamais 3+1 ni de trou) — décision
   propriétaire explicite motivant le passage de 4 à 6. */
@media (min-width: 1024px) {
	.vce-discovery-grid {
		grid-template-columns: 1fr 1fr 1fr;
	}
}

/* PALIER 12 — QUALIFICATION ÉDITORIALE VILLA CHRISTAL.
 *
 * AUCUN nouveau composant : c'est la pastille `.vce-discovery-badge`
 * ci-dessus, avec ses dimensions, son rayon et sa famille de couleurs. Deux
 * seuls écarts, et chacun a une raison mesurée plutôt qu'esthétique :
 *
 *   `text-transform: none` — « Coup de cœur Villa Christal » fait 29
 *   caractères. En capitales à 0.75rem il dépasse la largeur d'une carte à
 *   360 px et la pastille se casse sur deux lignes, avec un rayon 999px qui
 *   n'a plus de sens. En casse normale il tient sur une ligne.
 *
 *   une teinte par état — le sens ne repose JAMAIS sur la couleur seule
 *   (les mots sont dans la pastille, lus tels quels par un lecteur
 *   d'écran) ; la couleur ne fait que hiérarchiser d'un coup d'œil. Les
 *   trois teintes restent dans la famille sable/terre déjà employée, et
 *   chacune dépasse 4,5:1 sur son fond.
 */
.vce-discovery-badge-favourite,
.vce-discovery-badge-favourite-double,
.vce-discovery-badge-tested {
	text-transform: none;
	letter-spacing: 0;
	font-weight: 600;
	max-width: 100%;
}

.vce-discovery-badge-favourite {
	background: #f4e3e3;
	color: #8a3a3a; /* 6,17:1 sur #f4e3e3 — mesuré, pas estimé */
}

.vce-discovery-badge-favourite-double {
	background: #f0d6d6;
	color: #7a2e2e; /* 6,77:1 sur #f0d6d6 — mesuré */
}

.vce-discovery-badge-tested {
	background: #e4ebe0;
	color: #46603c; /* 5,76:1 sur #e4ebe0 — mesuré */
}


/* LOT UX badges : uniquement les cartes du moteur Discovery.
 * Palette historique conservée ; aucune règle du planner autonome modifiée. */
.vce-discovery-result-card { min-width: 0; }
.vce-discovery-result-card .vce-discovery-card-top {
 flex-wrap: wrap;
 justify-content: flex-start;
 gap: 0.4rem;
 margin: 0.5rem 0;
}
.vce-discovery-result-card .vce-discovery-badge,
.vce-discovery-result-card .vce-discovery-price,
.vce-discovery-result-card .vce-discovery-practical {
 box-sizing: border-box;
 max-width: 100%;
 min-width: 0;
 margin: 0;
 white-space: normal;
 overflow-wrap: anywhere;
 line-height: 1.5;
 text-transform: none;
 letter-spacing: normal;
}
.vce-discovery-result-card .vce-discovery-badge-reason {
 background: #e4ebe0;
 color: #46603c;
}
.vce-discovery-result-card .vce-discovery-practical {
 display: inline-block;
 padding: 0.15em 0.6em;
 border-radius: 999px;
 background: #f0ece1;
 color: #5a5242;
 font-size: 0.8rem;
}

.vce-discovery-result-card > .vce-planner-card-link {
 display: flex;
 align-items: center;
 width: fit-content;
 min-height: 44px;
}
