/* ============================================================
   HALLOWEEN — habillage temporaire
   Actif seulement quand <html> porte .eco-hw (ajouté par le script
   de class-halloween.php selon la date).
   Option 1 : encadré noir / texte orange.
   Option 2 : bandeau pinceau orange / texte noir.
   ============================================================ */

html.eco-hw-opt1 {
	--eco-hw-bg:       linear-gradient(90deg, #170C07, #3A1A0A);
	--eco-hw-bg-hover: linear-gradient(90deg, #3A1A0A, #5A2A10);
	--eco-hw-ink:      #FD8926;
	--eco-hw-solid:    #2A140A; /* bordures (border-image) */
	--eco-hw-bar:      linear-gradient(90deg, #170C07, #3A1A0A);
	--eco-hw-bar-ink:  #FD8926;
}

html.eco-hw-opt2 {
	--eco-hw-bg:       linear-gradient(90deg, #F46F14, #FC9120 55%, #FCA034);
	--eco-hw-bg-hover: linear-gradient(90deg, #DC5E0B, #F07F12 55%, #F49223);
	--eco-hw-ink:      #170C07;
	--eco-hw-solid:    #F46F14;
	--eco-hw-bar:      linear-gradient(90deg, #170C07, #3A1A0A);
	--eco-hw-bar-ink:  #FD8926;
}

/* ---- Bandeau du haut ---------------------------------------------- */

html.eco-hw .bhfb-above_header_row {
	background: var(--eco-hw-bar) !important;
}

html.eco-hw .bhfb-above_header_row,
html.eco-hw .bhfb-above_header_row .eco-top-banner,
html.eco-hw .bhfb-above_header_row .eco-top-banner-msg,
html.eco-hw .bhfb-above_header_row a {
	color: var(--eco-hw-bar-ink) !important;
}

/* ---- Bouton Promo du menu ----------------------------------------- */

html.eco-hw .menu-special.menu-item a,
html.eco-hw .menu-special a {
	background: var(--eco-hw-bg) !important;
	color: var(--eco-hw-ink) !important;
	padding: 5px 9px !important;
	animation: eco-hw-glow 2.6s ease-in-out infinite;
}

html.eco-hw .menu-special.menu-item a::before {
	content: "\1F383\00a0";
}

@keyframes eco-hw-glow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(253, 137, 38, 0); }
	50%      { box-shadow: 0 0 12px 2px rgba(253, 137, 38, .55); }
}

/* ---- Badge « Le + vendu » ----------------------------------------- */

html.eco-hw .eco-store-quantity-packs .pack-card.bestseller .pack-title,
html.eco-hw .pack-gram-highlight {
	background: var(--eco-hw-bg) !important;
	color: var(--eco-hw-ink) !important;
}

html.eco-hw .eco-store-quantity-packs .pack-card.bestseller,
html.eco-hw .eco-store-quantity-packs[data-pack-type="grams"] .bestseller {
	border-image: var(--eco-hw-bg) 1 !important;
}

/* ---- Format sélectionné (vert menthe → orange clair) -------------- */

html.eco-hw .eco-store-quantity-packs .pack-card.selected,
html.eco-hw .eco-store-quantity-packs[data-pack-type="grams"] .pack-card.selected,
html.eco-hw .eco-store-quantity-packs[data-pack-type="single_gram"] .pack-card.selected {
	border-color: #F46F14 !important;
	border-image: none !important;
}

html.eco-hw .eco-store-quantity-packs[data-pack-type="grams"] .pack-card.selected,
html.eco-hw .eco-store-quantity-packs[data-pack-type="single_gram"] .pack-card.selected {
	background-color: #FFEBD6 !important;
}

html.eco-hw .eco-store-quantity-packs .pack-card.selected::before {
	background: #F46F14 !important;
	color: #170C07 !important;
}

/* ---- Boutons CTA -------------------------------------------------- */
/* Le système CTA du thème enfant lit ces variables partout. */

html.eco-hw {
	--eco-cta-bg:       var(--eco-hw-bg);
	--eco-cta-bg-hover: var(--eco-hw-bg-hover);
	--eco-cta-color:    var(--eco-hw-ink);
}

html.eco-hw :is(
	.eco-cta,
	.eco-button-primary,
	.eco-drawer-checkout,
	.woocommerce .cart .button.checkout-button,
	ul.products li.product a.button.add_to_cart_button,
	a.button.eco-grams-shop-btn
):is(:link, :visited, :hover, :focus, :active),
html.eco-hw button.single_add_to_cart_button.button.alt,
html.eco-hw .woocommerce-checkout #place_order,
html.eco-hw .eco-fs__confirm:not(:disabled) {
	color: var(--eco-hw-ink) !important;
}

/* Cartes produit (product-card.css), hors boutons grisés */
html.eco-hw .eco-card:not(.eco-card--unavailable) .eco-card__action .button:not([disabled]):not(.loading) {
	background: var(--eco-hw-bg) !important;
	color: var(--eco-hw-ink) !important;
}

html.eco-hw .eco-card:not(.eco-card--unavailable) .eco-card__action .button:not([disabled]):hover,
html.eco-hw .eco-card:not(.eco-card--unavailable) .eco-card__action .button:not([disabled]):focus-visible {
	background: var(--eco-hw-bg-hover) !important;
}

/* Barre collante : fond blanc, texte sombre (le thème utilise la couleur
   CTA comme couleur de texte, ce qui ne marche pas avec un dégradé). */
html.eco-hw .merchant-sticky-add-to-cart-wrapper button.single_add_to_cart_button.button.alt,
html.eco-hw .merchant-sticky-add-to-cart-wrapper button.single_add_to_cart_button.button.alt:hover {
	background: var(--eco-hw-bg) !important;
	color: var(--eco-hw-ink) !important;
}

/* ---- Logo : chapeau de sorcière (le fichier image ne change pas) -- */

html.eco-hw header .custom-logo-link {
	position: relative;
	display: inline-block;
}

html.eco-hw header .custom-logo-link::after {
	content: "";
	position: absolute;
	top: -46%;
	left: -3.5%;
	width: 11%;
	aspect-ratio: 40 / 34;
	min-width: 16px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 34'%3E%3Cpath fill='%23170C07' d='M10 28 20.5 3.5Q25 .5 31 5q-5 .6-6.4 4.6L30.5 28Z'/%3E%3Cpath fill='%23FD8926' d='M11.3 23.6h18l.8 3.4H10.1Z'/%3E%3Cellipse cx='20' cy='29.2' rx='19' ry='4.3' fill='%23170C07'/%3E%3C/svg%3E") no-repeat center / contain;
	transform: rotate(-16deg);
	transform-origin: 50% 90%;
	pointer-events: none;
}

/* ---- Toiles et araignée ------------------------------------------- */

.eco-hw-deco { display: none; }

html.eco-hw .eco-hw-deco {
	display: block;
	position: fixed;
	inset: 0 0 auto 0;
	height: 0;
	z-index: 99990;
	pointer-events: none;
}

html.eco-hw .eco-hw-web {
	position: fixed;
	top: 0;
	width: 150px;
	height: 150px;
	opacity: .55;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160'%3E%3Cpath fill='none' stroke='%239A8E86' stroke-width='1' d='M0 0L160.0 0.0M0 0L154.5 41.4M0 0L138.6 80.0M0 0L113.1 113.1M0 0L80.0 138.6M0 0L41.4 154.5M0 0L0.0 160.0M26.0 0.0Q22.2 2.9 25.1 6.7Q20.7 8.6 22.5 13.0Q17.7 13.6 18.4 18.4Q13.6 17.7 13.0 22.5Q8.6 20.7 6.7 25.1Q2.9 22.2 0.0 26.0M50.0 0.0Q42.6 5.6 48.3 12.9Q39.7 16.5 43.3 25.0Q34.1 26.2 35.4 35.4Q26.2 34.1 25.0 43.3Q16.5 39.7 12.9 48.3Q5.6 42.6 0.0 50.0M76.0 0.0Q64.8 8.5 73.4 19.7Q60.4 25.0 65.8 38.0Q51.9 39.8 53.7 53.7Q39.8 51.9 38.0 65.8Q25.0 60.4 19.7 73.4Q8.5 64.8 0.0 76.0M104.0 0.0Q88.7 11.7 100.5 26.9Q82.6 34.2 90.1 52.0Q71.0 54.4 73.5 73.5Q54.4 71.0 52.0 90.1Q34.2 82.6 26.9 100.5Q11.7 88.7 0.0 104.0M134.0 0.0Q114.3 15.0 129.4 34.7Q106.5 44.1 116.0 67.0Q91.4 70.2 94.8 94.8Q70.2 91.4 67.0 116.0Q44.1 106.5 34.7 129.4Q15.0 114.3 0.0 134.0'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
}

html.eco-hw .eco-hw-web--l { left: 0; }
html.eco-hw .eco-hw-web--r { right: 0; transform: scaleX(-1); }

/* Araignée suspendue à son fil, côté droit */
html.eco-hw .eco-hw-spider {
	position: fixed;
	top: 0;
	right: 46px;
	width: 1px;
	height: 120px;
	background: rgba(120, 108, 100, .6);
	transform-origin: top center;
	animation: eco-hw-drop 7s ease-in-out infinite;
}

html.eco-hw .eco-hw-spider i {
	position: absolute;
	left: -11px;
	bottom: -18px;
	width: 22px;
	height: 22px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23170C07' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11 4 7 2 9M9 13H3l-2 3M9 15l-5 3-1 4M10 16l-3 4v3M15 11l5-4 2 2M15 13h6l2 3M15 15l5 3 1 4M14 16l3 4v3'/%3E%3C/g%3E%3Ccircle cx='12' cy='9' r='2.6' fill='%23170C07'/%3E%3Cellipse cx='12' cy='14.5' rx='3.6' ry='4.4' fill='%23170C07'/%3E%3Ccircle cx='11' cy='8.6' r='.7' fill='%23FD8926'/%3E%3Ccircle cx='13' cy='8.6' r='.7' fill='%23FD8926'/%3E%3C/svg%3E") no-repeat center / contain;
	animation: eco-hw-sway 3.5s ease-in-out infinite;
	transform-origin: 50% 0;
}

@keyframes eco-hw-drop {
	0%, 100% { height: 60px; }
	45%, 60% { height: 150px; }
}

@keyframes eco-hw-sway {
	0%, 100% { transform: rotate(-6deg); }
	50%      { transform: rotate(6deg); }
}

@media (max-width: 768px) {
	html.eco-hw .eco-hw-web {
		width: 84px;
		height: 84px;
		opacity: .45;
	}
	html.eco-hw .eco-hw-spider { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	html.eco-hw .menu-special a,
	html.eco-hw .eco-hw-spider,
	html.eco-hw .eco-hw-spider i {
		animation: none !important;
	}
	html.eco-hw .eco-hw-spider { height: 110px; }
}

@media print {
	.eco-hw-deco { display: none !important; }
}
