/* Cosmoshop : promotions, badges, Coup de cœur, FAQ (lot 2, 04/10/2026). Couleurs du design actif uniquement. */

/* Badges communs : cartes, accueil, fiche */
.cosmo-badge { display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px; border-radius: 999px; font-size: 0.75rem; font-weight: 700; line-height: 1; white-space: nowrap; }
.cosmo-badge--promo { background: #c2410c; color: #fff; border: 0; }
.cosmo-badge--date { background: #fff; color: #b26a00; border: 1px solid #b26a00; }
.cosmo-badge--date-courte { background: #b26a00; color: #fff; border: 0; }
.cosmo-badge--zero { background: #fff; color: #287d26; border: 1px solid #287d26; }
.cosmo-fiche-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.product-card .product-image { position: relative; }
.product-card .cosmo-carte__badges { position: absolute; top: 10px; left: 10px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; z-index: 1; }

/* Fin de promotion et compte à rebours */
.cosmo-promo-fin { margin: 6px 0 0; font-size: 0.8125rem; line-height: 1.4; color: #65707a; }
.cosmo-promo-fin__date { font-weight: 600; color: #152638; }
.cosmo-promo-fin__compte:not(:empty) { display: inline-block; margin-left: 6px; padding: 2px 8px; border-radius: 999px; background: #fdeee3; color: #c2410c; font-weight: 700; font-variant-numeric: tabular-nums; }
.cosmo-rail__item:has(> .cosmo-promo-fin--carte) { flex-direction: column; }
.cosmo-rail__item > .cosmo-promo-fin--carte { flex: 0 0 auto; }
.cosmo-promo-fin--carte { margin: 8px 2px 0; font-size: 0.75rem; }
.cosmo-promo-fin--carte .cosmo-promo-fin__date { font-weight: 500; color: #65707a; }
.cosmo-promo-fin--carte .cosmo-promo-fin__compte { display: none !important; }
.cosmo-promo-semaine { padding-top: 8px; padding-bottom: 32px; margin-bottom: 8px; border-bottom: 1px solid #dce3e4; }
.cosmo-promo-semaine .cosmo-section__tete { align-items: flex-end; }

/* Titre des sous-sections d'univers */
.cosmo-promo-titre__univers { color: #087d89; }
.cosmo-promo-univers { margin-bottom: 8px; }

/* Lien vers les promotions d'un univers (page rayon) et raccourci dans la colonne des filtres */
.cosmo-promo-lien { margin: 0 0 16px; }
.cosmo-promo-lien a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 14px 6px 8px; border: 1px solid #dce3e4; border-radius: 8px; background: #fff; color: #152638; font-weight: 600; text-decoration: none; transition: border-color 0.2s; }
.cosmo-promo-lien a:hover, .cosmo-promo-lien a:focus-visible { border-color: #c2410c; }
.cosmo-promo-lien .cosmo-ico { width: 18px; height: 18px; color: #087d89; }
.cosmo-promo-lien__nombre { color: #65707a; font-weight: 400; }
.cosmo-promo-lien__pastille { display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px; border-radius: 999px; background: #c2410c; color: #fff; font-size: 0.75rem; font-weight: 700; }
.cosmo-promo-filtre { margin: 0 0 16px; }
.cosmo-promo-filtre a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: #087d89; font-weight: 600; text-decoration: none; }
.cosmo-promo-filtre a:hover { color: #06616b; text-decoration: underline; }
.cosmo-promo-communaute { padding-top: 8px; padding-bottom: 24px; }

/* Accueil : étagères Promotions de la semaine et Coup de cœur (dans le style des sections de l'accueil) */
.home-promo-shelf { display: flex; gap: 18px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding-bottom: 6px; scrollbar-width: thin; contain: paint; }
.home-promo-shelf > .product-card { flex: 0 0 calc((100% - 72px) / 5); scroll-snap-align: start; display: flex !important; }
.home-promo-head-fin { margin: 10px 0 0; }
.home-weekly { margin-top: 28px; }
.home-weekly-title { margin: 0 0 4px; font-size: 22px; font-weight: 650; line-height: 1.15; color: #152638; }
.home-favorites .home-heading h2 em { font-style: italic; }
@media (max-width: 1000px) { .home-promo-shelf > .product-card { flex-basis: calc((100% - 36px) / 3); } }
@media (max-width: 600px) {
	.home-promo-shelf { gap: 11px; }
	.home-promo-shelf > .product-card { flex-basis: calc((100% - 11px) / 2.08); }
	.home-weekly-title { font-size: 19px; }
}

/* FAQ interactive */
.cosmo-faq__outils { margin: 0 0 28px; padding: 16px; border: 1px solid #dce3e4; border-radius: 8px; background: #f7f8f6; }
.cosmo-faq__outils[hidden] { display: none; }
.cosmo-faq__label { display: block; margin: 0 0 8px; font-weight: 650; color: #152638; }
.cosmo-faq__champ { width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid #dce3e4; border-radius: 8px; background: #fff; color: #152638; font: inherit; font-size: 1rem; }
.cosmo-faq__champ:focus-visible { outline: 2px solid #087d89; outline-offset: 2px; border-color: #087d89; }
.cosmo-faq__etat { margin: 8px 0 0; font-size: 0.875rem; color: #65707a; }
.cosmo-faq__etat:empty { display: none; }
.cosmo-faq__item { border-bottom: 1px solid #dce3e4; }
.cosmo-faq h2 + .cosmo-faq__item { border-top: 1px solid #dce3e4; }
.cosmo-faq__question { position: relative; display: block; padding: 16px 40px 16px 0; cursor: pointer; list-style: none; font-weight: 650; line-height: 1.4; color: #152638; }
.cosmo-faq__question::-webkit-details-marker { display: none; }
.cosmo-faq__question::after { content: ""; position: absolute; right: 8px; top: 50%; width: 9px; height: 9px; margin-top: -7px; border-right: 2px solid #087d89; border-bottom: 2px solid #087d89; transform: rotate(45deg); transition: transform 0.2s; }
.cosmo-faq__item[open] > .cosmo-faq__question::after { transform: rotate(-135deg); margin-top: -2px; }
.cosmo-faq__question:hover { color: #087d89; }
.cosmo-faq__question:focus-visible { outline: 2px solid #087d89; outline-offset: 2px; border-radius: 4px; }
.cosmo-faq__reponse { padding: 0 0 16px; }
.cosmo-faq__reponse p { margin: 0; line-height: 1.6; max-width: 70ch; }
.cosmo-faq mark { background: #fdeee3; color: inherit; padding: 0 1px; border-radius: 2px; }
.cosmo-faq [data-cosmo-masque] { display: none; }
@media (prefers-reduced-motion: reduce) { .cosmo-faq__question::after { transition: none; } }