/* ==========================================================================
   BOUTIQUE & RAYONS — refonte validée sur maquette (08/08/2026).
   Cartes modernes, carrousel de photos au survol (glissé au doigt sur mobile),
   filtres par type, 2 colonnes sur téléphone. On RESTYLE la boucle existante
   (Astra + crochets Pégase : badge, cœur) — pas de gabarit réécrit, les
   mécaniques en place (favoris, badges, réassurance) continuent telles
   quelles.
   ========================================================================== */

/* --- Barre de filtres par type (enfants du rayon courant) --- */
.pegase-filtres {
	display: flex;
	gap: .5rem;
	overflow-x: auto;
	padding: .2rem .1rem .6rem;
	margin: 0 0 1rem;
	scrollbar-width: none;
}
.pegase-filtres::-webkit-scrollbar { display: none; }
.pegase-filtres a {
	flex: none;
	border: 1.5px solid rgba(38, 34, 28, .16);
	background: #fff;
	color: #26221C;
	border-radius: 999px;
	padding: .45em 1em;
	font-weight: 700;
	font-size: .88rem;
	text-decoration: none;
	white-space: nowrap;
}
.pegase-filtres a:hover { border-color: #221B4E; }
.pegase-filtres a.on { background: #221B4E; border-color: #221B4E; color: #fff; }

/* --- La carte produit --- */
body.woocommerce ul.products li.product,
.woocommerce ul.products li.product {
	background: #fff;
	border: 1px solid rgba(38, 34, 28, .1);
	border-radius: 16px;
	overflow: hidden;
	transition: transform .18s ease, box-shadow .18s ease;
	padding-bottom: .9rem;
}
.woocommerce ul.products li.product:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px -12px rgba(34, 27, 78, .35);
}

/* Zone visuelle : le conteneur Astra devient le cadre du carrousel. */
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
	background: #EFEAE0;
}
.woocommerce ul.products li.product .astra-shop-thumbnail-wrap img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	margin: 0;
}
/* Les photos supplementaires injectees par le script, en fondu au-dessus. */
.woocommerce ul.products li.product .pegase-cycle-img {
	position: absolute;
	inset: 0;
	z-index: 2;
	opacity: 0;
	transition: opacity .35s ease;
	pointer-events: none;
}
.woocommerce ul.products li.product .pegase-cycle-img.on { opacity: 1; }
.woocommerce ul.products li.product .pegase-points {
	position: absolute;
	bottom: .5rem;
	left: 0;
	right: 0;
	display: flex;
	justify-content: center;
	gap: .3rem;
	z-index: 3;
	pointer-events: none;
}
.woocommerce ul.products li.product .pegase-points i {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .55);
	box-shadow: 0 0 3px rgba(0, 0, 0, .25);
}
.woocommerce ul.products li.product .pegase-points i.on { background: #fff; }

/* Badge et cœur par-dessus la photo. */
.woocommerce ul.products li.product .pegase-badge {
	position: absolute;
	top: .6rem;
	left: .6rem;
	z-index: 3;
}
.woocommerce ul.products li.product .pegase-fav {
	position: absolute;
	top: .5rem;
	right: .55rem;
	z-index: 3;
}

/* Texte de la carte. */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: .95rem;
	line-height: 1.3;
	font-weight: 700;
	color: #26221C;
	padding: .75rem .9rem .2rem;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
}
.woocommerce ul.products li.product .star-rating { margin: .15rem 0 0 .9rem; }
.woocommerce ul.products li.product .pegase-note {
	display: flex;
	align-items: center;
	gap: .35rem;
	padding: 0 .9rem;
	font-size: .8rem;
	color: #6C6558;
}
.woocommerce ul.products li.product .pegase-verif {
	color: #1F6B47;
	background: rgba(63, 178, 127, .13);
	border-radius: 999px;
	padding: .1em .5em;
	font-size: .7rem;
	font-weight: 700;
	white-space: nowrap;
}
.woocommerce ul.products li.product .price {
	padding: 0 .9rem;
	color: #221B4E;
	font-weight: 800;
	font-size: 1.02rem;
}

/* --- Téléphone : DEUX colonnes, cartes compactes. --- */
@media (max-width: 767px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		gap: .7rem;
	}
	.woocommerce ul.products li.product,
	.woocommerce-page ul.products li.product {
		width: 100% !important;
		margin: 0 !important;
		float: none !important;
	}
	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: .8rem;
		min-height: 2.4em;
		padding: .55rem .6rem .15rem;
	}
	.woocommerce ul.products li.product .price { font-size: .9rem; padding: 0 .6rem; }
	.woocommerce ul.products li.product .pegase-note { padding: 0 .6rem; }
}

/* ==========================================================================
   FIDÉLITÉ MAQUETTE (08/08, 2e passe) — la première passe posait la mécanique
   mais laissait la typographie Astra (texte centré, titres bleus, ancien
   badge) : visuellement « rien n'a changé » pour le gérant. Ici on aligne
   chaque carte sur la maquette validée.
   ========================================================================== */

/* Texte de carte ALIGNÉ À GAUCHE, comme la maquette. */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
	text-align: left !important;
	padding: 0 .1rem;
}

/* Titre : encre foncée (plus le bleu lien), 2 lignes maîtrisées. */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .astra-shop-summary-wrap a {
	color: #26221C;
}
.woocommerce ul.products li.product .astra-shop-summary-wrap a:hover .woocommerce-loop-product__title {
	color: #221B4E;
}

/* Étoiles dorées, note discrète, tout sur la gauche. */
.woocommerce ul.products li.product .star-rating,
.woocommerce ul.products li.product .star-rating span::before { color: #E3B341; }
.woocommerce ul.products li.product .astra-woo-product-category,
.woocommerce ul.products li.product .ast-woo-product-category { display: none; }

/* Prix : bloc gauche, indigo, gras — et la mention « Personnalisable »
   de la maquette juste dessous. */
.woocommerce ul.products li.product .price {
	display: block;
	text-align: left;
	color: #221B4E !important;
	font-weight: 800;
}
.woocommerce ul.products li.product .price::after {
	content: "✏️ Personnalisable";
	display: block;
	font-size: .72rem;
	font-weight: 400;
	color: #6C6558;
	margin-top: .2rem;
}

/* Badges : la palette de la maquette. */
.woocommerce ul.products li.product .pegase-badge {
	background: rgba(255, 255, 255, .94);
	color: #221B4E;
	border: 0;
	border-radius: 999px;
	font-size: .68rem;
	font-weight: 800;
	padding: .35em .75em;
	box-shadow: 0 2px 8px rgba(34, 27, 78, .18);
}
.woocommerce ul.products li.product .pegase-badge--nouveaute { background: #E1556E; color: #fff; }
.woocommerce ul.products li.product .pegase-badge--bestseller { background: #E3B341; color: #221B4E; }
.woocommerce ul.products li.product .pegase-badge--promo { background: #C62828; color: #fff; }

/* Cœur favoris : pastille blanche ronde, cœur corail quand actif. */
.woocommerce ul.products li.product .pegase-fav {
	background: rgba(255, 255, 255, .94);
	border: 0;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(34, 27, 78, .18);
	display: grid;
	place-items: center;
}

/* La pastille avis vérifiés vient se coller à la ligne des étoiles. */
.woocommerce ul.products li.product .pegase-note { margin-top: .15rem; }

/* Boutons « Ajouter au panier » de la boucle : discrets, pleine largeur. */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
	margin: .5rem .9rem 0;
	border-radius: 999px;
	background: #F1EDE4;
	color: #221B4E;
	font-weight: 700;
}
.woocommerce ul.products li.product .button:hover { background: #221B4E; color: #fff; }

@media (max-width: 767px) {
	.woocommerce ul.products li.product .price::after { font-size: .62rem; }
}

/* Le thème colore les titres en bleu lien (#150D7B) avec plus de poids :
   on tranche à l'!important, la maquette veut l'encre. */
.woocommerce ul.products li.product .astra-shop-summary-wrap .woocommerce-loop-product__title,
.woocommerce ul.products li.product a .woocommerce-loop-product__title {
	color: #26221C !important;
}

/* ==========================================================================
   3e passe (08/08) — les cartes n'utilisent PAS les classes Woo standard mais
   des blocs maison (.pegase-price, .pegase-rating, .pegase-swatches) : les
   règles « .price / .star-rating » visaient dans le vide. On cible le réel.
   ========================================================================== */

/* Ordre et alignement des blocs de la carte, comme la maquette. */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: .15rem;
	padding: 0 .9rem;
}
.woocommerce ul.products li.product .ast-loop-product__link { order: 0; }
.woocommerce ul.products li.product .pegase-swatches { order: 1; }
.woocommerce ul.products li.product .pegase-rating { order: 2; }
.woocommerce ul.products li.product .pegase-note { order: 3; margin: 0; }
.woocommerce ul.products li.product .pegase-price { order: 4; }

/* Le prix : indigo, gras, à gauche — et la mention de la maquette dessous. */
.woocommerce ul.products li.product .pegase-price {
	color: #221B4E !important;
	font-weight: 800;
	font-size: 1.05rem;
	text-align: left;
	margin-top: .25rem;
}
.woocommerce ul.products li.product .pegase-price .woocommerce-Price-amount { color: inherit; }
.woocommerce ul.products li.product .pegase-price::after {
	content: "✏️ Personnalisable";
	display: block;
	font-size: .72rem;
	font-weight: 400;
	color: #6C6558;
	margin-top: .15rem;
}

/* Le bloc de description brute (« Prix unitaire… », roue chromatique) fait
   doublon avec le prix et charge la carte : il reste sur la fiche produit,
   pas sur les cartes. */
.woocommerce ul.products li.product .ast-woo-shop-product-description { display: none; }

.woocommerce ul.products li.product .pegase-rating { text-align: left; }
/* Le titre ne garde pas de hauteur réservée inutile sous 2 lignes. */
.woocommerce ul.products li.product .woocommerce-loop-product__title { padding-left: 0; padding-right: 0; }

@media (max-width: 767px) {
	.woocommerce ul.products li.product .astra-shop-summary-wrap { padding: 0 .6rem; }
	.woocommerce ul.products li.product .pegase-price { font-size: .92rem; }
}

/* « selon vos options » à côté du prix mini (produits à variantes). */
.pegase-des-opts {
	font-size: .72rem;
	font-weight: 400;
	color: #6C6558;
	white-space: nowrap;
}
/* Sur les cartes, il passe sous le prix pour ne pas l'écraser. */
.woocommerce ul.products li.product .pegase-des-opts { display: block; margin-top: .05rem; }
/* Le prix ayant déjà sa mention d'options, le « Personnalisable » générique
   ne s'affiche que sur les produits SANS variantes (pas de .pegase-des-opts). */
.woocommerce ul.products li.product .pegase-price:has(.pegase-des-opts)::after { content: none; }