/**
 * Site header.
 *
 * @package lavventura
 */

@layer blocks {
	:root {
		--lv-ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
		--lv-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
	}

	.lv-site-header {
		padding-block: var(--space-s);
		background-color: var(--color-bg);
		border-bottom: var(--border-width-1) solid var(--color-border);
	}

	body.has-age-gate-open {
		overflow: hidden;
	}

	.lv-site-header__inner {
		display: flex;
		flex-wrap: wrap;
		gap: var(--space-m);
		align-items: center;
		justify-content: space-between;
		min-block-size: 3.5rem;
	}

	.lv-site-header__brand {
		display: flex;
		align-items: center;
	}

	.lv-site-header__brand .custom-logo-link {
		display: inline-flex;
		align-items: center;
		color: inherit;
		text-decoration: none;
	}

	.lv-site-header__brand .custom-logo {
		display: block;
		width: auto;
		max-width: 8.75rem;
		max-height: 3.25rem;
		object-fit: contain;
	}

	.lv-site-header__brand-link {
		display: inline-flex;
		align-items: center;
		text-decoration: none;
		color: var(--color-text);

		&:hover,
		&:focus-visible {
			color: var(--color-accent);
		}
	}

	.lv-site-header__brand .lv-display {
		font-family: var(--font-display);
		font-size: clamp(1.25rem, 1vw + 1rem, 1.625rem);
		font-weight: 500;
		line-height: 1;
		letter-spacing: -0.005em;
	}

	.lv-site-header__menu-toggle {
		display: none;
	}

	.lv-site-nav__list {
		display: flex;
		flex-wrap: wrap;
		gap: var(--space-m);
		align-items: center;
		list-style: none;
		margin: 0;
		padding: 0;
		line-height: 1;
	}

	.lv-site-nav__list > li {
		margin: 0;
	}

	.lv-site-nav__list a {
		position: relative;
		display: inline-block;
		font-family: var(--font-body);
		font-size: var(--font-size-small);
		font-weight: 500;
		line-height: 1;
		text-transform: uppercase;
		letter-spacing: var(--letter-spacing-ui);
		text-decoration: none;
		color: var(--color-text);
		vertical-align: middle;
		padding-block: var(--space-3xs);

		&:hover,
		&:focus-visible {
			color: var(--color-accent);
		}
	}

	.lv-site-nav__list .current-menu-item > a {
		color: var(--color-accent);
	}

	.lv-site-nav__list > li.lv-site-nav__item--cta > a {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-height: 2.5rem;
		padding: 0 var(--space-xs);
		background: var(--color-vino);
		color: var(--color-carta-calda);
		box-shadow: inset 0 0 0 var(--border-width-1) var(--color-vino);
	}

	.lv-site-nav__list > li.lv-site-nav__item--cta.current-menu-item > a,
	.lv-site-nav__list > li.lv-site-nav__item--cta > a:hover,
	.lv-site-nav__list > li.lv-site-nav__item--cta > a:focus-visible {
		background: var(--color-terracotta);
		color: var(--color-carta-calda);
		box-shadow: inset 0 0 0 var(--border-width-1) var(--color-terracotta);
	}

	/* Top-level <li>: relative anchor per dropdown + reset list-style.
	   NO display: flex qui — i flex sub-menu absolute children causano
	   subtle baseline shift in alcuni browser. Lascia layout default. */
	.lv-site-nav__list > li {
		position: relative;
		list-style: none;
	}

	/* Chevron indicatore "ha submenu" — border-rotate sottile, posizionato
	   absolute così non altera l'altezza del <a> (no scalino verticale). */
	.lv-site-nav__list > li.menu-item-has-children > a {
		padding-inline-end: 1em; /* spazio per il chevron */
	}

	.lv-site-nav__list > li.menu-item-has-children > a::after {
		content: "";
		position: absolute;
		inset-inline-end: 0;
		inset-block-start: 50%;
		inline-size: 0.35em;
		block-size: 0.35em;
		border-block-end: 1px solid currentColor;
		border-inline-end: 1px solid currentColor;
		transform: translateY(-70%) rotate(45deg);
		transform-origin: center;
		transition: transform 220ms ease;
		opacity: 0.7;
	}

	/* Dropdown (sub-menu) ================================================ */
	.lv-site-nav .sub-menu {
		position: absolute;
		inset-block-start: calc(100% + var(--space-2xs));
		inset-inline-start: 0;
		min-inline-size: 12rem;
		margin: 0;
		padding: var(--space-2xs);
		list-style: none;
		background: var(--color-bg);
		border: 1px solid var(--color-border);
		border-radius: var(--radius-md);
		box-shadow: 0 8px 24px -12px color-mix(in srgb, var(--color-inchiostro-terra) 35%, transparent);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-6px) scale(0.985);
		transform-origin: top center;
		transition: opacity 260ms var(--lv-ease-soft), transform 260ms var(--lv-ease-soft), visibility 0s linear 260ms;
		z-index: 50;
	}

	.lv-site-nav .sub-menu li {
		list-style: none;
		margin: 0;
	}

	.lv-site-nav .sub-menu a {
		display: block;
		padding: var(--space-2xs) var(--space-xs);
		text-transform: none;
		letter-spacing: 0;
		font-size: var(--font-size-small);
		color: var(--color-text);
		border-radius: var(--radius-sm);
		transition: background-color 150ms ease, color 150ms ease;
	}

	.lv-site-nav .sub-menu a:hover,
	.lv-site-nav .sub-menu a:focus-visible {
		background: color-mix(in srgb, var(--color-pietra) 35%, transparent);
		color: var(--color-accent);
	}

	/* Apertura su hover (mouse) + focus-within (tastiera). */
	.lv-site-nav__list > li:hover > .sub-menu,
	.lv-site-nav__list > li:focus-within > .sub-menu {
		opacity: 1;
		visibility: visible;
		transform: translateY(0) scale(1);
		transition: opacity 260ms var(--lv-ease-soft), transform 260ms var(--lv-ease-soft), visibility 0s linear 0s;
	}

	.lv-site-nav__list > li:hover > a::after,
	.lv-site-nav__list > li:focus-within > a::after {
		transform: translateY(-30%) rotate(-135deg);
		opacity: 1;
	}

	.lv-header-cart {
		position: relative;
		display: inline-flex;
		align-items: center;
		z-index: 70;
	}

	.lv-header-cart[hidden] {
		display: none;
	}

	.lv-header-cart__toggle {
		position: relative;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		inline-size: 2.5rem;
		block-size: 2.5rem;
		color: var(--color-text);
		text-decoration: none;
		border: var(--border-width-1) solid var(--color-border);
		background: color-mix(in srgb, white 42%, var(--color-bg));
	}

	.lv-header-cart__toggle:hover,
	.lv-header-cart__toggle:focus-visible {
		color: var(--color-accent);
		border-color: currentColor;
	}

	.lv-header-cart__icon,
	.lv-header-cart__icon svg {
		display: block;
		inline-size: 1.25rem;
		block-size: 1.25rem;
	}

	.lv-header-cart__count {
		position: absolute;
		inset-block-start: -0.45rem;
		inset-inline-end: -0.45rem;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-inline-size: 1.25rem;
		block-size: 1.25rem;
		padding-inline: 0.25rem;
		background: var(--color-vino);
		color: var(--color-carta-calda);
		border: var(--border-width-1) solid var(--color-bg);
		border-radius: 999px;
		font-family: var(--font-mono);
		font-size: 0.6875rem;
		line-height: 1;
	}

	.lv-header-cart__dropdown {
		position: absolute;
		inset-block-start: calc(100% + var(--space-2xs));
		inset-inline-end: 0;
		inline-size: min(22rem, calc(100vw - (var(--container-padding-inline) * 2)));
		padding: var(--space-s);
		color: var(--color-text);
		background: var(--color-bg);
		border: var(--border-width-1) solid var(--color-border);
		box-shadow: 0 24px 48px -34px rgb(45 38 32 / 55%);
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px) scale(0.98);
		transform-origin: top right;
		transition: opacity 280ms var(--lv-ease-soft), transform 280ms var(--lv-ease-soft), visibility 0s linear 280ms;
	}

	.lv-header-cart:hover .lv-header-cart__dropdown,
	.lv-header-cart:focus-within .lv-header-cart__dropdown,
	.lv-header-cart.is-open .lv-header-cart__dropdown {
		opacity: 1;
		visibility: visible;
		transform: translateY(0) scale(1);
		transition: opacity 280ms var(--lv-ease-soft), transform 280ms var(--lv-ease-soft), visibility 0s linear 0s;
	}

	.lv-header-cart__eyebrow,
	.lv-cart-modal__eyebrow {
		margin: 0 0 var(--space-xs);
		color: var(--color-accent);
		font-family: var(--font-mono);
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.12em;
		line-height: var(--line-height-ui);
		text-transform: uppercase;
	}

	.lv-header-cart__items {
		display: grid;
		gap: var(--space-xs);
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.lv-header-cart__item {
		display: grid;
		grid-template-columns: 3rem minmax(0, 1fr);
		gap: var(--space-xs);
		align-items: center;
		margin: 0;
		padding: 0;
	}

	.lv-header-cart__thumb {
		display: flex;
		align-items: center;
		justify-content: center;
		aspect-ratio: 1;
		background: color-mix(in srgb, white 58%, var(--color-bg));
		border: var(--border-width-1) solid var(--color-border);
		overflow: hidden;
	}

	.lv-header-cart__image {
		display: block;
		inline-size: 100%;
		block-size: 100%;
		object-fit: contain;
	}

	.lv-header-cart__item-body {
		min-width: 0;
	}

	.lv-header-cart__item-name {
		display: block;
		margin: 0;
		color: var(--color-text);
		font-weight: 700;
		line-height: 1.25;
		text-decoration: none;
	}

	.lv-header-cart__item-name:hover,
	.lv-header-cart__item-name:focus-visible {
		color: var(--color-accent);
	}

	.lv-header-cart__item-meta {
		display: flex;
		flex-wrap: wrap;
		gap: var(--space-3xs);
		align-items: center;
		margin: var(--space-3xs) 0 0;
		color: var(--color-inchiostro-morbido);
		font-size: var(--font-size-small);
		line-height: 1.35;
	}

	.lv-header-cart__remove {
		justify-self: start;
		margin-block-start: var(--space-3xs);
		padding: 0;
		color: var(--color-vino);
		background: transparent;
		border: 0;
		border-bottom: var(--border-width-1) solid currentColor;
		border-radius: 0;
		font: inherit;
		font-size: 0.75rem;
		font-weight: 700;
		letter-spacing: 0.04em;
		line-height: 1.35;
		text-transform: uppercase;
		cursor: pointer;
	}

	.lv-header-cart__remove:hover,
	.lv-header-cart__remove:focus-visible {
		color: var(--color-terracotta);
	}

	.lv-header-cart__remove[aria-busy="true"] {
		color: var(--color-inchiostro-morbido);
		cursor: progress;
	}

	.lv-header-cart__empty {
		margin: 0;
		color: var(--color-inchiostro-morbido);
		font-size: var(--font-size-small);
	}

	.lv-header-cart__policy,
	.lv-cart-modal__policy {
		margin: var(--space-xs) 0 0;
		padding: var(--space-xs);
		color: var(--color-accent);
		background: color-mix(in srgb, var(--color-vino) 8%, var(--color-bg));
		border: var(--border-width-1) solid color-mix(in srgb, var(--color-vino) 28%, transparent);
		font-size: var(--font-size-small);
		line-height: 1.4;
	}

	.lv-header-cart__total,
	.lv-cart-modal__total {
		display: flex;
		justify-content: space-between;
		gap: var(--space-s);
		margin-block-start: var(--space-s);
		padding-block-start: var(--space-xs);
		border-block-start: var(--border-width-1) solid var(--color-border);
		font-size: var(--font-size-small);
	}

	.lv-header-cart__total strong,
	.lv-cart-modal__total strong {
		color: var(--color-text);
	}

	.lv-header-cart__actions,
	.lv-cart-modal__actions {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-2xs);
		margin-block-start: var(--space-s);
	}

	.lv-header-cart__actions a,
	.lv-cart-modal__primary,
	.lv-cart-modal__secondary {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-block-size: 2.5rem;
		padding: 0 var(--space-xs);
		font: inherit;
		font-size: var(--font-size-small);
		font-weight: 700;
		line-height: 1;
		text-decoration: none;
		border-radius: 0;
		cursor: pointer;
	}

	.lv-header-cart__actions a:first-child,
	.lv-cart-modal__secondary {
		color: var(--color-text);
		background: transparent;
		border: var(--border-width-1) solid var(--color-border-strong);
	}

	.lv-header-cart__actions a:last-child,
	.lv-cart-modal__primary {
		color: var(--color-carta-calda);
		background: var(--color-vino);
		border: var(--border-width-1) solid var(--color-vino);
	}

	.lv-cart-modal {
		position: fixed;
		inset: 0;
		display: grid;
		place-items: center;
		padding: var(--space-m);
		background: rgb(32 28 25 / 44%);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 320ms var(--lv-ease-standard), visibility 0s linear 320ms;
		z-index: 200;
	}

	.lv-cart-modal[hidden] {
		display: none;
	}

	.lv-cart-modal.is-open {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transition: opacity 320ms var(--lv-ease-standard), visibility 0s linear 0s;
	}

	.lv-cart-modal__dialog {
		position: relative;
		inline-size: min(100%, 34rem);
		max-block-size: min(42rem, calc(100vh - (var(--space-m) * 2)));
		overflow: auto;
		padding: var(--space-m);
		background: var(--color-bg);
		border: var(--border-width-1) solid var(--color-border);
		box-shadow: 0 32px 72px -42px rgb(32 28 25 / 66%);
		opacity: 0;
		transform: translateY(16px) scale(0.97);
		transition: opacity 340ms var(--lv-ease-soft), transform 340ms var(--lv-ease-soft);
	}

	.lv-cart-modal.is-open .lv-cart-modal__dialog {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

	.lv-cart-modal__close {
		position: absolute;
		inset-block-start: var(--space-xs);
		inset-inline-end: var(--space-xs);
		display: inline-flex;
		align-items: center;
		justify-content: center;
		inline-size: 2rem;
		block-size: 2rem;
		padding: 0;
		color: var(--color-text);
		background: transparent;
		border: var(--border-width-1) solid var(--color-border);
		border-radius: 0;
		cursor: pointer;
	}

	.lv-cart-modal__body {
		padding-inline-end: var(--space-m);
	}

	.lv-cart-modal__title {
		margin: 0 0 var(--space-s);
		font-family: var(--font-display);
		font-size: 2rem;
		font-weight: 600;
		line-height: 1;
	}

	.lv-age-gate {
		position: fixed;
		inset: 0;
		display: grid;
		place-items: center;
		padding: var(--space-m);
		background:
			linear-gradient(90deg, rgb(24 18 14 / 0.72), rgb(24 18 14 / 0.58)),
			color-mix(in srgb, var(--color-vino) 32%, transparent);
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 340ms var(--lv-ease-standard), visibility 0s linear 340ms;
		z-index: 250;
	}

	.lv-age-gate[hidden] {
		display: none;
	}

	.lv-age-gate.is-open {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transition: opacity 340ms var(--lv-ease-standard), visibility 0s linear 0s;
	}

	.lv-age-gate__dialog {
		inline-size: min(100%, 32rem);
		padding: var(--space-l);
		background: var(--color-bg);
		border: var(--border-width-1) solid color-mix(in srgb, var(--color-carta-calda) 52%, transparent);
		box-shadow: 0 32px 84px -42px rgb(24 18 14 / 76%);
		opacity: 0;
		transform: translateY(18px) scale(0.965);
		transition: opacity 380ms var(--lv-ease-soft), transform 380ms var(--lv-ease-soft);
	}

	.lv-age-gate.is-open .lv-age-gate__dialog {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

	.lv-age-gate__eyebrow {
		margin: 0 0 var(--space-xs);
		color: var(--color-accent);
		font-family: var(--font-mono);
		font-size: 0.6875rem;
		font-weight: 700;
		letter-spacing: 0.12em;
		line-height: var(--line-height-ui);
		text-transform: uppercase;
	}

	.lv-age-gate__title {
		margin: 0;
		color: var(--color-text);
		font-family: var(--font-display);
		font-size: clamp(2.25rem, 6vw, 4rem);
		font-weight: 600;
		line-height: 0.95;
	}

	.lv-age-gate__copy {
		max-inline-size: 30rem;
		margin: var(--space-s) 0 0;
		color: var(--color-inchiostro-morbido);
		font-size: 1.05rem;
		line-height: 1.55;
	}

	.lv-age-gate__actions {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: var(--space-2xs);
		align-items: center;
		margin-block-start: var(--space-m);
	}

	.lv-age-gate__primary,
	.lv-age-gate__secondary {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-block-size: 2.875rem;
		padding: 0 var(--space-s);
		font: inherit;
		font-size: var(--font-size-small);
		font-weight: 700;
		line-height: 1;
		text-decoration: none;
		border-radius: 0;
		cursor: pointer;
		transition: background-color 220ms var(--lv-ease-standard), border-color 220ms var(--lv-ease-standard), color 220ms var(--lv-ease-standard);
	}

	.lv-age-gate__primary {
		color: var(--color-carta-calda);
		background: var(--color-vino);
		border: var(--border-width-1) solid var(--color-vino);
	}

	.lv-age-gate__primary:hover,
	.lv-age-gate__primary:focus-visible {
		background: var(--color-terracotta);
		border-color: var(--color-terracotta);
	}

	.lv-age-gate__secondary {
		color: var(--color-text);
		background: transparent;
		border: var(--border-width-1) solid var(--color-border-strong);
	}

	.lv-age-gate__secondary:hover,
	.lv-age-gate__secondary:focus-visible {
		color: var(--color-carta-calda);
		background: var(--color-inchiostro-terra);
		border-color: var(--color-inchiostro-terra);
	}

	.lv-age-gate__notice {
		max-inline-size: 30rem;
		margin: var(--space-s) 0 0;
		padding: var(--space-xs) var(--space-s);
		color: var(--color-vino);
		background: var(--color-pietra);
		border-inline-start: 3px solid var(--color-vino);
		font-size: var(--font-size-small);
		line-height: 1.5;
	}

	.lv-age-gate__notice[hidden] {
		display: none;
	}

	@media (prefers-reduced-motion: reduce) {
		.lv-site-nav .sub-menu,
		.lv-site-nav__list > li > a::after,
		.lv-header-cart__dropdown,
		.lv-cart-modal,
		.lv-cart-modal__dialog,
		.lv-age-gate,
		.lv-age-gate__dialog {
			transition: none;
		}
	}

	/* Mobile (< 720px): header compatto con menu espandibile. */
	@media (max-width: 720px) {
		.lv-site-header {
			padding-block: var(--space-xs);
		}

		.lv-site-header__inner {
			flex-wrap: wrap;
			gap: var(--space-s);
			align-items: center;
			min-block-size: 3.25rem;
			overflow: visible;
		}

		.lv-site-header__brand {
			order: 1;
			flex: 0 0 auto;
		}

		.lv-site-header__brand .lv-display {
			font-size: 1.35rem;
			letter-spacing: 0;
		}

		.lv-site-header__brand .custom-logo {
			max-width: 6.25rem;
			max-height: 2.75rem;
		}

		.lv-site-header__menu-toggle {
			display: inline-flex;
			order: 3;
			flex: 0 0 auto;
			flex-direction: column;
			gap: 0.25rem;
			align-items: center;
			justify-content: center;
			inline-size: 2.75rem;
			block-size: 2.75rem;
			margin-inline-start: 0;
			padding: 0;
			background: transparent;
			border: var(--border-width-1) solid var(--color-border-strong);
			border-radius: var(--radius-sm);
			color: var(--color-text);
			cursor: pointer;
		}

		.lv-site-header__menu-toggle:hover,
		.lv-site-header__menu-toggle:focus-visible {
			color: var(--color-accent);
			border-color: currentColor;
		}

		.lv-site-header__menu-toggle-line {
			display: block;
			inline-size: 1.125rem;
			block-size: 1px;
			background: currentColor;
			transform-origin: center;
			transition: transform 180ms ease, opacity 180ms ease;
		}

		.lv-site-header.is-menu-open .lv-site-header__menu-toggle-line:nth-of-type(2) {
			transform: translateY(5px) rotate(45deg);
		}

		.lv-site-header.is-menu-open .lv-site-header__menu-toggle-line:nth-of-type(3) {
			opacity: 0;
		}

		.lv-site-header.is-menu-open .lv-site-header__menu-toggle-line:nth-of-type(4) {
			transform: translateY(-5px) rotate(-45deg);
		}

		.lv-site-nav {
			order: 4;
			flex: 0 0 100%;
			inline-size: 100%;
			min-inline-size: 100%;
			overflow: visible;
		}

		.lv-header-cart {
			order: 2;
			margin-inline-start: auto;
		}

		.lv-header-cart__dropdown {
			position: fixed;
			inset-block-start: 5.25rem;
			inset-inline: var(--container-padding-inline);
			inline-size: auto;
		}

		.lv-site-header.is-menu-ready .lv-site-nav {
			max-block-size: 0;
			overflow: hidden;
			visibility: hidden;
			opacity: 0;
			pointer-events: none;
			transition: max-block-size 220ms ease, opacity 180ms ease, visibility 0s linear 220ms;
		}

		.lv-site-header.is-menu-ready.is-menu-open .lv-site-nav {
			max-block-size: 28rem;
			visibility: visible;
			opacity: 1;
			pointer-events: auto;
			transition: max-block-size 260ms ease, opacity 200ms ease, visibility 0s linear 0s;
		}

		.lv-site-nav__list {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			gap: var(--space-2xs);
			inline-size: 100%;
			padding-block-start: var(--space-xs);
			border-block-start: var(--border-width-1) solid var(--color-border);
		}

		.lv-site-nav__list > li {
			inline-size: 100%;
		}

		.lv-site-nav__list a {
			display: flex;
			align-items: center;
			justify-content: center;
			min-block-size: 2.5rem;
			padding: 0 var(--space-2xs);
			font-size: 0.75rem;
			letter-spacing: 0.08em;
			text-align: center;
			white-space: nowrap;
		}

		.lv-site-nav__list > li.lv-site-nav__item--cta {
			grid-column: 1 / -1;
		}

		.lv-site-nav__list > li.lv-site-nav__item--cta > a {
			display: flex;
			inline-size: 100%;
			min-height: 2.25rem;
		}

		.lv-site-nav .sub-menu {
			display: none;
		}

		.lv-age-gate {
			padding: var(--space-s);
		}

		.lv-age-gate__dialog {
			padding: var(--space-m);
		}

		.lv-age-gate__actions {
			grid-template-columns: 1fr;
		}

		.lv-site-nav__list > li.menu-item-has-children > a::after {
			display: none;
		}
	}

	@media (max-width: 720px) and (prefers-reduced-motion: reduce) {
		.lv-site-header.is-menu-ready .lv-site-nav,
		.lv-site-header__menu-toggle-line {
			transition: none;
		}
	}
}
