/*
 * Foly Frites - UX menu direct
 * Front-end uniquement : pas de changement produits/prix/options/paiement.
 */

:root {
	--foly-ux-ink: #241f1b;
	--foly-ux-dark: #201812;
	--foly-ux-red: #c91424;
	--foly-ux-yellow: #ffba08;
	--foly-ux-orange: #ff7a1a;
	--foly-ux-cream: #fff5dc;
	--foly-ux-border: rgba(36, 31, 27, .12);
}

/* Répare l'ancienne section d'accueil "Les favoris du moment" si elle existe encore. */
section.foly-section.foly-menu {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 82px 0 !important;
	overflow: visible !important;
}

section.foly-section.foly-menu .foly-wrap {
	width: min(1120px, calc(100% - 40px)) !important;
	max-width: 1120px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

section.foly-section.foly-menu h2 {
	display: block !important;
	max-width: none !important;
	margin: 0 0 35px !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: normal !important;
}

section.foly-section.foly-menu h2::after {
	display: none !important;
	content: none !important;
}

section.foly-section.foly-menu .foly-products .products,
section.foly-section.foly-menu .woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 22px !important;
	width: 100% !important;
	margin: 25px 0 0 !important;
	padding: 0 !important;
}

section.foly-section.foly-menu .foly-products .products::before,
section.foly-section.foly-menu .foly-products .products::after,
section.foly-section.foly-menu .woocommerce ul.products::before,
section.foly-section.foly-menu .woocommerce ul.products::after {
	display: none !important;
	content: none !important;
}

section.foly-section.foly-menu .foly-products .product,
section.foly-section.foly-menu .woocommerce ul.products li.product {
	float: none !important;
	clear: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
}

/* Sélecteur moderne immédiat + classe JS de secours. */
.foly-menu:has(> .foly-menu__nav),
.foly-menu.foly-menu--catalogue {
	width: min(1320px, calc(100% - 36px)) !important;
	max-width: none !important;
	margin: 0 auto !important;
	overflow: visible !important;
	overflow-x: visible !important;
	overflow-y: visible !important;
}

.foly-menu:has(> .foly-menu__nav),
.foly-menu:has(> .foly-menu__nav) *,
.foly-menu.foly-menu--catalogue,
.foly-menu.foly-menu--catalogue * {
	box-sizing: border-box;
}

.foly-menu:has(> .foly-menu__nav) .foly-menu__nav::-webkit-scrollbar,
.foly-menu.foly-menu--catalogue .foly-menu__nav::-webkit-scrollbar {
	display: none;
}

.foly-menu:has(> .foly-menu__nav) .foly-menu__nav,
.foly-menu.foly-menu--catalogue .foly-menu__nav {
	scrollbar-width: none;
}

.foly-menu-helpbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin: 0 0 18px;
	padding: 14px 16px;
	border: 1px solid rgba(255, 186, 8, .30);
	border-radius: 22px;
	background: linear-gradient(135deg, rgba(255, 250, 240, .98), rgba(255, 239, 203, .94));
	box-shadow: 0 12px 28px rgba(57, 35, 10, .09);
}

.foly-menu-helpbar p {
	margin: 0;
	color: var(--foly-ux-ink);
	font-weight: 850;
}

.foly-menu-helpbar a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 0 14px;
	border-radius: 999px;
	color: #fff !important;
	background: linear-gradient(135deg, var(--foly-ux-red), #ef3b21 58%, var(--foly-ux-orange));
	font-weight: 950;
	text-decoration: none !important;
	white-space: nowrap;
}

@media (min-width: 980px) {
	.foly-menu:has(> .foly-menu__nav),
	.foly-menu.foly-menu--catalogue {
		position: relative !important;
		display: grid !important;
		grid-template-columns: 250px minmax(0, 1fr) !important;
		column-gap: 30px !important;
		align-items: start !important;
		padding: 28px 18px 72px !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__intro,
	.foly-menu:has(> .foly-menu__nav) .foly-menu-helpbar,
	.foly-menu.foly-menu--catalogue .foly-menu__intro,
	.foly-menu.foly-menu--catalogue .foly-menu-helpbar {
		grid-column: 1 / -1 !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav,
	.foly-menu.foly-menu--catalogue .foly-menu__nav {
		grid-column: 1 !important;
		grid-row: auto / span 80 !important;
		position: sticky !important;
		top: 18px !important;
		z-index: 30 !important;
		display: flex !important;
		flex-direction: column !important;
		gap: 8px !important;
		width: 100% !important;
		height: fit-content !important;
		max-height: calc(100vh - 36px) !important;
		margin: 0 !important;
		padding: 18px !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		border: 1px solid rgba(255, 255, 255, .10) !important;
		border-radius: 28px !important;
		background:
			radial-gradient(circle at 90% 0%, rgba(255, 186, 8, .32), transparent 7rem),
			linear-gradient(155deg, #2b2119 0%, #17120f 100%) !important;
		box-shadow: 0 22px 48px rgba(45, 27, 8, .18) !important;
		backdrop-filter: none !important;
		overscroll-behavior: contain;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav::before,
	.foly-menu.foly-menu--catalogue .foly-menu__nav::before {
		content: "Menu";
		display: block;
		margin: 0 0 8px;
		padding: 0 2px 12px;
		border-bottom: 1px solid rgba(255, 255, 255, .12);
		color: var(--foly-ux-yellow);
		font-size: 28px;
		line-height: 1;
		font-weight: 950;
		letter-spacing: -.04em;
		text-transform: uppercase;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		min-height: 44px !important;
		width: 100% !important;
		padding: 10px 13px !important;
		border: 1px solid rgba(255, 255, 255, .10) !important;
		border-radius: 15px !important;
		color: #fff !important;
		background: rgba(255, 255, 255, .075) !important;
		box-shadow: none !important;
		font-weight: 900 !important;
		text-decoration: none !important;
		white-space: normal !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a::after,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a::after {
		content: "›";
		margin-left: 10px;
		color: var(--foly-ux-yellow);
		font-size: 20px;
		font-weight: 950;
		line-height: 1;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a:hover,
	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a:focus,
	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a.is-active,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a:hover,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a:focus,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a.is-active {
		color: var(--foly-ux-ink) !important;
		border-color: transparent !important;
		background: linear-gradient(135deg, var(--foly-ux-yellow), #ffd76a) !important;
		box-shadow: 0 12px 22px rgba(255, 186, 8, .20) !important;
		transform: translateX(3px);
		outline: none !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a:hover::after,
	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a:focus::after,
	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a.is-active::after,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a:hover::after,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a:focus::after,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a.is-active::after {
		color: var(--foly-ux-red);
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav.foly-menu-sticky-fixed,
	.foly-menu.foly-menu--catalogue .foly-menu__nav.foly-menu-sticky-fixed {
		position: fixed !important;
		top: 18px !important;
		z-index: 80 !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav.foly-menu-sticky-bottom,
	.foly-menu.foly-menu--catalogue .foly-menu__nav.foly-menu-sticky-bottom {
		position: absolute !important;
		z-index: 20 !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__section,
	.foly-menu.foly-menu--catalogue .foly-menu__section {
		grid-column: 2 !important;
		min-width: 0 !important;
		scroll-margin-top: 28px !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__section:first-of-type,
	.foly-menu.foly-menu--catalogue .foly-menu__section:first-of-type {
		padding-top: 0 !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__grid,
	.foly-menu.foly-menu--catalogue .foly-menu__grid {
		min-width: 0 !important;
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (min-width: 1280px) {
	.foly-menu:has(> .foly-menu__nav) .foly-menu__grid,
	.foly-menu.foly-menu--catalogue .foly-menu__grid {
		grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 979px) {
	section.foly-section.foly-menu {
		padding: 58px 0 !important;
	}

	section.foly-section.foly-menu .foly-products .products,
	section.foly-section.foly-menu .woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 12px !important;
	}

	.foly-menu:has(> .foly-menu__nav),
	.foly-menu.foly-menu--catalogue {
		width: 100% !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
		overflow-x: hidden !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav,
	.foly-menu.foly-menu--catalogue .foly-menu__nav {
		position: sticky !important;
		top: 0 !important;
		z-index: 30 !important;
		display: flex !important;
		flex-wrap: nowrap !important;
		gap: 9px !important;
		margin: 0 -12px 20px !important;
		padding: 10px 12px 12px !important;
		overflow-x: auto !important;
		overflow-y: hidden !important;
		border: 0 !important;
		border-radius: 0 0 18px 18px !important;
		background:
			linear-gradient(180deg, rgba(255, 248, 231, .98), rgba(255, 238, 195, .94)) !important;
		box-shadow: 0 10px 24px rgba(57, 35, 10, .10) !important;
		backdrop-filter: none !important;
		-webkit-overflow-scrolling: touch;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a {
		display: inline-flex !important;
		flex: 0 0 auto !important;
		align-items: center !important;
		justify-content: center !important;
		min-height: 39px !important;
		padding: 8px 14px !important;
		border: 1px solid var(--foly-ux-border) !important;
		border-radius: 999px !important;
		color: var(--foly-ux-ink) !important;
		background:
			linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(255, 244, 219, .94)) !important;
		box-shadow: 0 7px 18px rgba(57, 35, 10, .08) !important;
		font-size: 14px !important;
		font-weight: 900 !important;
		text-decoration: none !important;
		white-space: nowrap !important;
	}

	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a:hover,
	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a:focus,
	.foly-menu:has(> .foly-menu__nav) .foly-menu__nav a.is-active,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a:hover,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a:focus,
	.foly-menu.foly-menu--catalogue .foly-menu__nav a.is-active {
		color: #fff !important;
		border-color: transparent !important;
		background: linear-gradient(135deg, var(--foly-ux-red), #ef3b21 58%, var(--foly-ux-orange)) !important;
		outline: none !important;
	}

	.foly-menu-helpbar {
		align-items: flex-start;
		flex-direction: column;
	}
}

@media (max-width: 480px) {
	section.foly-section.foly-menu .foly-wrap {
		width: min(100% - 28px, 1120px) !important;
	}

	section.foly-section.foly-menu .foly-products .products,
	section.foly-section.foly-menu .woocommerce ul.products {
		grid-template-columns: 1fr !important;
	}
}

.foly-help-page {
	width: min(1100px, calc(100% - 34px));
	margin: 0 auto;
	padding: 34px 0 70px;
	color: var(--foly-ux-ink);
}

.foly-help-hero {
	overflow: hidden;
	position: relative;
	padding: clamp(28px, 5vw, 54px);
	border-radius: 34px;
	color: #fff;
	background:
		radial-gradient(circle at 86% 14%, rgba(255, 186, 8, .72), transparent 16rem),
		radial-gradient(circle at 8% 100%, rgba(201, 20, 36, .42), transparent 18rem),
		linear-gradient(135deg, #201712 0%, #412516 55%, #1b1410 100%);
	box-shadow: 0 24px 58px rgba(56, 31, 9, .20);
}

.foly-help-hero::after {
	content: "🍟";
	position: absolute;
	right: clamp(-28px, 3vw, 18px);
	bottom: -48px;
	font-size: clamp(120px, 18vw, 230px);
	line-height: 1;
	opacity: .14;
	transform: rotate(-10deg);
}

.foly-help-kicker {
	margin: 0 0 12px;
	color: var(--foly-ux-yellow);
	font-size: 13px;
	font-weight: 950;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.foly-help-hero h1 {
	max-width: 720px;
	margin: 0;
	color: #fff;
	font-size: clamp(42px, 6vw, 76px);
	line-height: .92;
	font-weight: 950;
	letter-spacing: -.065em;
}

.foly-help-hero p {
	max-width: 650px;
	margin: 18px 0 0;
	color: rgba(255, 255, 255, .88);
	font-size: clamp(16px, 1.5vw, 19px);
	line-height: 1.55;
	font-weight: 650;
}

.foly-help-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 11px;
	margin-top: 24px;
}

.foly-help-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 20px;
	border-radius: 999px;
	color: #fff !important;
	background: linear-gradient(135deg, var(--foly-ux-red), #ef3b21 58%, var(--foly-ux-orange));
	box-shadow: 0 14px 28px rgba(201, 20, 36, .28);
	font-weight: 950;
	text-decoration: none !important;
}

.foly-help-btn--ghost {
	background: rgba(255, 255, 255, .12);
	border: 1px solid rgba(255, 255, 255, .20);
	box-shadow: none;
}

.foly-help-steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin-top: 22px;
}

.foly-help-steps article {
	padding: 22px;
	border: 1px solid rgba(36, 31, 27, .09);
	border-radius: 24px;
	background: rgba(255, 250, 240, .92);
	box-shadow: 0 16px 34px rgba(57, 35, 10, .10);
}

.foly-help-steps b {
	color: var(--foly-ux-red);
	font-size: 30px;
	font-weight: 950;
}

.foly-help-steps h2 {
	margin: 14px 0 8px;
	font-size: 21px;
	line-height: 1.08;
}

.foly-help-steps p {
	margin: 0;
	line-height: 1.55;
}

@media (max-width: 900px) {
	.foly-help-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.foly-help-actions {
		display: grid;
	}

	.foly-help-btn {
		width: 100%;
	}

	.foly-help-steps {
		grid-template-columns: 1fr;
	}
}


/* 1.0.3 : retour explicite au catalogue, sans navigation arrière du navigateur. */
.foly-menu-return {
    clear: both;
    width: 100%;
    margin: 0 0 20px;
}
.foly-menu-return .foly-menu-return__button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    max-width: 100%;
    padding: 12px 22px !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    text-align: center;
}
.foly-menu-return__button:focus-visible {
    outline: 3px solid #241f1b;
    outline-offset: 4px;
}

/* Réserve les retours à la ligne aux espaces dans le récapitulatif. */
body.woocommerce-cart .cart_totals table.shop_table {
    width: 100% !important;
    table-layout: auto !important;
}
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td {
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
}
body.woocommerce-cart .cart_totals .woocommerce-Price-amount {
    white-space: nowrap !important;
    display: inline-block;
}
body.woocommerce-cart .cart_totals .includes_tax {
    display: block;
    margin-top: 6px;
    font-size: 12px !important;
    line-height: 1.65;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}
body.woocommerce-cart .cart_totals .includes_tax .woocommerce-Price-amount {
    font-size: inherit !important;
    line-height: inherit;
}
body.woocommerce-cart .woocommerce-cart-form .coupon button {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
}
@media (min-width: 769px) {
    body.woocommerce-cart .cart_totals table.shop_table th { width: 42%; }
    body.woocommerce-cart .cart_totals table.shop_table td { width: 58%; }
}
