/* Black Week 2026 (inc/black-friday-2026.php), chargé seulement pendant l'opération.
   Composants de la charte : rouge « récolter », brun, crème, mot surligné, pastilles. */

/* 1. Badges des cartes et des fiches */
body.sr-charte .sr-badge.is-bf { font-size: 15px; font-weight: 800; letter-spacing: -0.01em; padding-inline: 10px; min-height: 28px; }
body.sr-charte .srp3-achat__galerie .sr-badge.is-bf, body.sr-charte .srp3-achat .sr-badges .sr-badge.is-bf { font-size: 20px !important; min-height: 36px; padding: 4px 14px; }

/* 2. Pastille de remise (tuiles de l'accueil, photo du premier écran, fenêtre d'entrée) */
.srbw-remise { position: absolute; top: 12px; left: 12px; display: inline-flex; align-items: center; padding: 6px 12px; border-radius: var(--sc-r-sm, 6px); background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea); font: 800 clamp(22px, 2.6vw, 32px)/1 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.03em; }

/* 3. Comptes à rebours : en texte et en cases */
.srbw-compte { font-variant-numeric: tabular-nums; white-space: nowrap; }
.srbw-compte--fort { color: var(--sc-red, #b21c2d); font-weight: 800; }
.srbw-timer { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; font-variant-numeric: tabular-nums; }
.srbw-timer__case { display: inline-flex; align-items: baseline; justify-content: center; gap: 3px; min-width: 64px; padding: 10px 12px; border-radius: var(--sc-r-sm, 6px); background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea); }
.srbw-timer__case b { font: 800 clamp(26px, 4vw, 36px)/1 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.03em; }
.srbw-timer__case i { font-style: normal; font-weight: 700; font-size: 14px; opacity: .85; }
.srbw-timer--clair { margin-top: var(--sc-space-5, 20px); }
.srh3 .sr-bande .srbw-timer--hero { margin: 18px 0 26px; }
@media (max-width: 420px) { .srbw-timer__case { flex: 1; min-width: 0; padding: 8px 6px; } }

/* 4. Accueil : premier écran (photo visible aussi sur mobile) */
.srbw-hero-photo .sr-bande__cadre { position: relative; }
.srbw-hero-photo .srbw-remise { top: 16px; left: 16px; padding: 8px 14px; font-size: clamp(26px, 2.6vw, 36px); }
@media (max-width: 1020px) {
	.srh3 .srh3-bande__photo.srbw-hero-photo { display: block; order: -1; margin: 0 0 22px; }
	.srh3 .srbw-hero-photo .sr-bande__cadre--haute { aspect-ratio: 2 / 1; }
	.srh3 .srbw-hero-photo img { width: 100%; height: 100%; object-fit: cover; }
	.srbw-hero-photo .srbw-remise { top: 12px; left: 12px; font-size: 26px; }
}

/* 5. Accueil : section #black-week */
.srbw { background: var(--sc-cream, #fdf6ea); }
.srbw-tete .srh3-h2 { text-wrap: balance; }
.srbw-univers { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.srbw-univers li:last-child { grid-column: auto; }
.srbw-univers .srh3-univers__photo, .srbw-univers li:last-child .srh3-univers__photo { aspect-ratio: 4 / 3; }
.srbw .srbw-sous-titre, .srbw h3.srbw-sous-titre { margin: clamp(32px, 5vw, 56px) 0 var(--sc-space-5, 20px); font: 700 var(--sc-fs-sous-section, clamp(28px, 3vw, 40px))/1.05 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.035em; color: var(--sc-ink, #2a1a12); }
@media (max-width: 1020px) {
	.srbw-univers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.srbw-univers .srh3-univers__photo, .srbw-univers li:last-child .srh3-univers__photo { aspect-ratio: 1; }
	.srbw .srh3-univers p { display: none; }
}

/* 6. Fenêtre d'entrée : rouge Sanrival, photo en tête (mobile) ou à gauche (ordinateur) */
.srbw-pop { --srbw-pad: clamp(24px, 5vw, 44px); width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; margin: auto; padding: var(--srbw-pad); border: 0; border-radius: var(--sc-r-lg, 16px); color: var(--sc-cream, #fdf6ea); box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.srbw-pop, .srbw-pop.sr-bande { background: var(--sc-red, #b21c2d); }
.srbw-pop::backdrop { background: rgba(42, 26, 18, .65); }
.srbw-pop[open] { animation: srbw-in .25s ease-out; }
@keyframes srbw-in { from { opacity: 0; transform: translateY(12px); } }
.srbw-pop__photo { position: relative; margin: calc(-1 * var(--srbw-pad)) calc(-1 * var(--srbw-pad)) 22px; aspect-ratio: 16 / 7; overflow: hidden; }
.srbw-pop__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.srbw-pop__photo .srbw-remise { top: auto; bottom: 14px; left: var(--srbw-pad); background: var(--sc-ink, #2a1a12); font-size: clamp(24px, 4vw, 32px); }
.srbw-pop__fermer { position: absolute; top: 12px; right: 12px; z-index: 2; display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: rgba(42, 26, 18, .55); color: var(--sc-cream, #fdf6ea); cursor: pointer; }
.srbw-pop__fermer:hover { background: rgba(42, 26, 18, .8); }
.srbw-pop .sr-sur { display: block; margin: 0 48px 0 0; font-size: 14px; }
.srbw-pop .sr-sur, .srbw-pop__fin, .srbw-pop__txt { color: rgba(253, 246, 234, .9); }
.srbw-pop .srbw-compte { color: var(--sc-cream, #fdf6ea); font-weight: 700; }
.srbw-pop__titre { margin: 14px 0 18px; font: 800 clamp(38px, 7vw, 56px)/.98 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.04em; text-wrap: balance; }
.srbw-pop .sr-mot { background: var(--sc-cream, #fdf6ea); color: var(--sc-red, #b21c2d); }
.srbw-pop__fin { margin: 0 0 8px; font-size: 14px; }
.srbw-timer--pop { margin-bottom: 20px; }
.srbw-pop .srbw-timer__case { background: var(--sc-ink, #2a1a12); }
.srbw-pop__remises { display: grid; gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; font-size: 16px; }
.srbw-pop__remises b { display: inline-block; min-width: 4.2em; color: var(--sc-cream, #fdf6ea); font: 800 18px/1 var(--sc-display, "Bricolage Grotesque", sans-serif); }
.srbw-pop__txt { margin: 0 0 22px; font-size: 15px; line-height: 1.5; }
.srbw-pop__code { margin: -10px 0 22px; padding: 10px 14px; border: 1px dashed rgba(253, 246, 234, .45); border-radius: var(--sc-r-sm, 6px); font-size: 15px; line-height: 1.4; }
.srbw-pop__nom-code { letter-spacing: .04em; }
.srbw-pop__btns { display: flex; flex-wrap: wrap; gap: 10px; }
.srbw-pop .sr-bande__btn--rouge { background: var(--sc-cream, #fdf6ea) !important; color: var(--sc-red, #b21c2d) !important; border-color: var(--sc-cream, #fdf6ea) !important; }
.srbw-pop .sr-bande__btn--rouge:hover { background: var(--sc-ink, #2a1a12) !important; color: var(--sc-cream, #fdf6ea) !important; border-color: var(--sc-ink, #2a1a12) !important; }
.srbw-pop :focus-visible { outline: 2px solid var(--sc-cream, #fdf6ea); outline-offset: 3px; }
@media (max-width: 480px) {
	.srbw-pop__photo { aspect-ratio: 2 / 1; margin-bottom: 16px; }
	.srbw-pop__titre { margin: 10px 0 12px; font-size: 34px; }
	.srbw-pop__remises { gap: 4px; font-size: 15px; }
	.srbw-pop__txt { margin-bottom: 14px; font-size: 14px; }
	.srbw-pop__code { margin: -4px 0 16px; font-size: 14px; }
	.srbw-timer--pop { margin-bottom: 14px; }
}
@media (min-width: 820px) {
	.srbw-pop { --srbw-pad: 40px; width: min(940px, calc(100vw - 48px)); }
	.srbw-pop[open] { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 40px; align-content: center; }
	.srbw-pop[open] > * { grid-column: 2; }
	.srbw-pop[open] > .srbw-pop__photo { grid-column: 1; grid-row: 1 / span 12; align-self: stretch; aspect-ratio: auto; min-height: 100%; margin: calc(-1 * var(--srbw-pad)) 0 calc(-1 * var(--srbw-pad)) calc(-1 * var(--srbw-pad)); }
	.srbw-pop[open] > .srbw-pop__fermer { grid-column: auto; }
	.srbw-pop__photo .srbw-remise { left: 20px; bottom: 20px; font-size: 34px; }
	.srbw-pop__titre { margin: 10px 0 14px; font-size: 44px; }
	.srbw-pop__remises { gap: 4px; margin-bottom: 12px; }
	.srbw-pop__txt { margin-bottom: 14px; font-size: 14px; }
	.srbw-pop__code { margin: 0 0 18px; font-size: 14px; }
	.srbw-timer--pop { margin-bottom: 16px; }
	.srbw-pop .srbw-timer__case { min-width: 58px; padding: 8px 10px; }
	.srbw-pop .srbw-timer__case b { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) { .srbw-pop[open] { animation: none; } }

/* 7. Fiche produit : nouveau prix rouge, ancien prix petit et barré, pastille et économie */
body .srp3 .srp3-prix .price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
body .srp3 .srp3-prix .price ins { order: 1; text-decoration: none; background: none; }
body .srp3 .srp3-prix .price ins .amount, body .srp3 .srp3-prix .price ins bdi { color: var(--sc-red, #b21c2d); }
body .srp3 .srp3-prix .price del, body .srp3 .srp3-prix .price del .amount, body .srp3 .srp3-prix .price del bdi { order: 2; font: 600 22px/1 var(--s3-texte, "Figtree", sans-serif); letter-spacing: 0; color: var(--sc-ink-mute, #6b4a38); text-decoration: line-through; text-decoration-thickness: 2px; opacity: 1; }
body .srp3 .srp3-prix .srbw-prix-pastille { order: 3; align-self: center; display: inline-flex; align-items: center; padding: 6px 12px; border-radius: var(--sc-r-sm, 6px); background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea); font: 800 20px/1 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.02em; }
body .srp3 .srp3-prix .srbw-economie { order: 4; flex-basis: 100%; font: 600 15px/1.4 var(--s3-texte, "Figtree", sans-serif); letter-spacing: 0; color: var(--sc-red, #b21c2d); }

/* 8. Menu principal : lien « black week », même gabarit que les autres entrées, sans point ni flèche */
html body.sr-charte .sr-primary-menu .srbw-nav a { gap: 8px; }
html body.sr-charte .sr-primary-menu .srbw-nav a, html body.sr-charte .sr-primary-menu .srbw-nav a > span:first-child { color: var(--sc-red, #b21c2d) !important; }
html body.sr-charte .sr-primary-menu .srbw-nav a:hover, html body.sr-charte .sr-primary-menu .srbw-nav a:hover > span:first-child { color: var(--sc-ink, #2a1a12) !important; }
html body.sr-charte .sr-primary-menu .srbw-nav .sr-mega-trigger::after, html body.sr-charte .sr-primary-menu .srbw-nav a > span::before { display: none !important; content: none !important; }
html body.sr-charte .sr-primary-menu .srbw-nav .srbw-nav__remise { display: inline-block; padding: 2px 6px 3px; border-radius: 4px; background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea) !important; font: 800 15px/1.1 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.02em; }
html body.sr-charte .sr-primary-menu .srbw-nav a:hover .srbw-nav__remise { background: var(--sc-ink, #2a1a12); }

/* 9. Menu déroulant : remise de l'univers sur la photo et encadré sous le bouton */
body.sr-charte .srbw-mega-remise { position: absolute; top: 12px; right: 12px; display: inline-flex; align-items: center; padding: 6px 12px; border-radius: var(--sc-r-sm, 6px); background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea); font: 800 26px/1 var(--sc-display, "Bricolage Grotesque", sans-serif); font-style: normal; letter-spacing: -0.03em; }
.srbw-mega { display: grid; gap: 4px; margin-top: var(--sc-space-4, 16px); padding: 14px 18px; border-radius: var(--sc-r-md, 12px); background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea) !important; text-decoration: none; }
.srbw-mega:hover { background: var(--sc-ink, #2a1a12); }
.srbw-mega__sur { font-size: 13px; opacity: .9; }
.srbw-mega__sur .srbw-compte { font-weight: 700; }
.srbw-mega__titre { font: 700 18px/1.15 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.02em; }
.srbw-mega__titre b { font-size: 22px; font-weight: 800; }

/* 10. Barre fine qui suit le défilement */
.srbw-collant { position: fixed; top: 0; left: 0; right: 0; z-index: 900; padding: env(safe-area-inset-top, 0px) 16px 0; background: var(--sc-red, #b21c2d); color: var(--sc-cream, #fdf6ea); box-shadow: 0 4px 14px rgba(42, 26, 18, .2); transform: translateY(-110%); transition: transform .25s ease-out; }
.srbw-collant.is-visible { transform: none; }
body.admin-bar .srbw-collant { top: var(--wp-admin--admin-bar--height, 32px); }
.srbw-collant__in { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 48px; max-width: 1200px; margin: 0 auto; font-size: 15px; }
.srbw-collant__txt { font-weight: 600; }
.srbw-collant__txt b { font: 800 17px/1 var(--sc-display, "Bricolage Grotesque", sans-serif); letter-spacing: -0.02em; }
.srbw-collant .srbw-compte { font-weight: 700; opacity: .9; }
.srbw-collant__btn { display: inline-flex; align-items: center; min-height: 34px; padding: 0 14px; border-radius: 999px; background: var(--sc-cream, #fdf6ea); color: var(--sc-red, #b21c2d) !important; font-size: 14px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.srbw-collant__btn:hover { background: var(--sc-ink, #2a1a12); color: var(--sc-cream, #fdf6ea) !important; }
.srbw-collant :focus-visible { outline: 2px solid var(--sc-cream, #fdf6ea); outline-offset: 2px; }
body.srbw-bande-fixe .srce-filter-open { top: 56px !important; }
@media (max-width: 700px) {
	.srbw-collant .srbw-compte, .srbw-collant__long { display: none; }
	.srbw-collant__in { justify-content: space-between; gap: 10px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { .srbw-collant { transition: none; } }

/* Mobile : le texte masqué « prix initial » des prix barrés sortait des carrousels à défilement horizontal (comparer, compléments) et élargissait la page. Le carrousel devient le bloc de référence pour le contenir. */
.srp3-cmp, .sr-complements__list { position: relative; }
