/**
 * Natale Bimbi – stili del tema.
 *
 * Stile minimale: sfondo blu notte come il catalogo cartaceo, superfici
 * bianche, decorazioni natalizie bianche e azzurre (assets/img). Un solo font (Inter).
 *
 * Indice
 * 1. Variabili (colori e font: unico punto da modificare)
 * 2. Font
 * 3. Base, pulsanti e accessibilità
 * 4. Header e footer
 * 5. Home: sezione introduttiva
 * 6. Catalogo: filtri e griglia
 * 7. Scheda prodotto
 * 8. "I tuoi regali" e checkout (blocchi WooCommerce)
 * 9. Avvisi WooCommerce
 */

/* ==========================================================================
   1. Variabili
   ========================================================================== */
:root {
	/* Colori: palette Freudenberg 2026 (blu notte, azzurro, bianco) */
	--nb-blu-notte: #122f49;
	--nb-bianco: #ffffff;
	--nb-azzurro: #769cbd; /* testi secondari sul blu (4,75:1); su bianco solo decorazioni */
	--nb-azzurro-scuro: #3b6589; /* etichette e dettagli leggibili su bianco */

	--nb-sfondo: var(--nb-blu-notte); /* sfondo pagina, come il catalogo cartaceo */
	--nb-superficie: var(--nb-bianco);
	--nb-superficie-tenue: #fefbf6;
	--nb-accento-chiaro: #e8f0f6;

	/* Font (file woff2 in assets/fonts) */
	--nb-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	/* Forme, ombre e spazi */
	--nb-raggio: 16px;
	--nb-raggio-piccolo: 10px;
	--nb-ombra: 0 1px 2px rgba(18, 47, 73, 0.04), 0 4px 16px rgba(18, 47, 73, 0.06);
	--nb-ombra-hover: 0 2px 4px rgba(18, 47, 73, 0.05), 0 12px 28px rgba(18, 47, 73, 0.1);
	--nb-larghezza: 1200px;
}

/* Testi e pulsanti sulle superfici bianche (header, footer, card, riquadri) */
:root,
.site-header,
.site-footer,
.nb-passi li,
.nb-card,
.single-product div.product,
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.nb-sede,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner,
.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword,
.woocommerce-order {
	/* Anche color: il body lo passa già calcolato (bianco), non come variabile */
	color: var(--nb-testo);
	--nb-testo: var(--nb-blu-notte);
	--nb-testo-tenue: #506375;
	--nb-bordo: #ede3d3;
	--nb-accento: var(--nb-blu-notte);
	--nb-accento-scuro: #0a1d2f;
	--nb-su-accento: var(--nb-bianco); /* testo sui pulsanti */
	--nb-focus: var(--nb-azzurro-scuro);
}

/* Sul fondo blu i colori si invertono: testi bianchi e azzurri, pulsanti
   bianchi con testo blu notte. Le superfici bianche qui sopra tornano ai
   colori di :root, quindi un elemento nuovo sul blu è già leggibile. */
body {
	--nb-testo: var(--nb-bianco);
	--nb-testo-tenue: var(--nb-azzurro);
	--nb-bordo: rgba(255, 255, 255, 0.3);
	--nb-accento: var(--nb-bianco);
	--nb-accento-scuro: #dce7f0;
	--nb-su-accento: var(--nb-blu-notte);
	--nb-focus: var(--nb-bianco);
}

/* ==========================================================================
   2. Font (Inter, ospitato nel tema)
   ========================================================================== */
@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-latin-400-normal.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-latin-500-normal.woff2") format("woff2");
	font-weight: 500;
	font-display: swap;
}
@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-latin-600-normal.woff2") format("woff2");
	font-weight: 600;
	font-display: swap;
}
@font-face {
	font-family: "Inter";
	src: url("../fonts/inter-latin-700-normal.woff2") format("woff2");
	font-weight: 700 800;
	font-display: swap;
}

/* ==========================================================================
   3. Base, pulsanti e accessibilità
   ========================================================================== */
html {
	/* Con uno sfondo proprio su html, il motivo del body si ferma al footer;
	   nelle pagine corte lo spazio sotto ha il colore del footer, che così
	   arriva fino in fondo invece di lasciare una striscia blu */
	background: var(--nb-superficie);
	scroll-behavior: smooth;
}

body,
button,
input,
select,
textarea {
	font-family: var(--nb-font);
}

body {
	/* Bacche e agrifoglio sparsi e tenui (motivo ripetuto, tools/estrai-decorazioni.py) */
	background: var(--nb-sfondo) url("../img/sfondo.svg") 0 0 / 900px repeat;
	color: var(--nb-testo);
	font-size: 16px;
	line-height: 1.6;
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4,
.wc-block-components-title {
	font-family: var(--nb-font);
	font-weight: 700;
	color: var(--nb-testo);
	line-height: 1.2;
	letter-spacing: -0.02em;
}

a {
	color: var(--nb-accento);
	text-underline-offset: 0.15em;
}
a:hover {
	color: var(--nb-accento-scuro);
}

/* Focus sempre ben visibile */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--nb-focus);
	outline-offset: 2px;
}

/* Pulsanti (GeneratePress, WooCommerce classico e blocchi) */
button,
.button,
a.button,
a.button:visited,
.wp-element-button,
.wp-block-button__link,
input[type="submit"],
.woocommerce .button,
.woocommerce a.button, /* WooCommerce lo colora di grigio (es. "Vai ai tuoi regali" nell'avviso) */
.woocommerce button.button, /* es. "Accedi" in "Il mio account" */
.woocommerce button.button.alt,
.wc-block-components-button:not(.is-link) {
	background: var(--nb-accento);
	color: var(--nb-su-accento);
	border: 0;
	border-radius: var(--nb-raggio-piccolo);
	padding: 0.75em 1.4em;
	font-family: var(--nb-font);
	font-weight: 600;
	font-size: 0.95rem;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
button:hover,
.button:hover,
a.button:hover,
a.button:focus,
.wp-element-button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button.alt:hover,
.wc-block-components-button:not(.is-link):hover {
	background: var(--nb-accento-scuro);
	color: var(--nb-su-accento);
}

.nb-button-secondary,
a.button.nb-button-secondary,
.woocommerce a.button.nb-button-secondary {
	background: var(--nb-superficie);
	color: var(--nb-testo);
	box-shadow: inset 0 0 0 1px var(--nb-bordo);
}
.nb-button-secondary:hover,
a.button.nb-button-secondary:hover,
.woocommerce a.button.nb-button-secondary:hover {
	background: var(--nb-superficie-tenue);
	color: var(--nb-testo);
	box-shadow: inset 0 0 0 1px var(--nb-testo-tenue);
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
textarea,
select {
	border: 1px solid var(--nb-bordo);
	border-radius: var(--nb-raggio-piccolo);
	background: var(--nb-superficie);
	color: var(--nb-testo);
}
input:focus,
textarea:focus,
select:focus {
	border-color: var(--nb-testo-tenue);
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		transition: none !important;
		animation: none !important;
	}
}

/* Contenitori di GeneratePress trasparenti: le superfici sono le card */
.separate-containers .inside-article,
.one-container .container,
.separate-containers .site-main > *,
.inside-article {
	background: transparent;
}
.site-content {
	padding-block: 0;
}

/* ==========================================================================
   4. Header e footer
   ========================================================================== */
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	/* Bianco pieno: con la trasparenza il blu sotto la renderebbe grigia */
	background: var(--nb-superficie);
}
.inside-header {
	display: flex;
	align-items: center;
	gap: 24px;
	padding-block: 14px;
}
.site-logo img,
.custom-logo {
	/* Logo su due righe ("Sealing Technologies"): più alto perché la seconda riga resti leggibile */
	max-height: 44px;
	width: auto;
	max-width: min(100%, 300px);
	object-fit: contain;
}

/* Con il logo caricato, il nome del sito resta solo per gli screen reader */
.site-logo + .site-branding,
.site-header .site-branding:has(+ .site-logo) {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.nb-header-tools {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-left: auto;
}

/* Ricerca (markup dal plugin) */
.nb-cerca {
	position: relative;
	display: flex;
	align-items: center;
}
.nb-cerca__campo,
input[type="search"].nb-cerca__campo {
	width: 260px;
	height: 42px;
	padding: 0 44px 0 16px;
	border-radius: 999px;
	background: var(--nb-superficie-tenue);
	font-size: 0.95rem;
}
.nb-cerca__campo::placeholder {
	color: var(--nb-testo-tenue);
}
button.nb-cerca__invia {
	position: absolute;
	right: 4px;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--nb-testo-tenue);
}
button.nb-cerca__invia:hover {
	background: var(--nb-bordo);
	color: var(--nb-testo);
}

/* "I tuoi regali" */
.nb-regali-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 42px;
	padding: 0 14px;
	border-radius: 999px;
	color: var(--nb-testo);
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: inset 0 0 0 1px var(--nb-bordo);
	transition: box-shadow 0.15s ease, background-color 0.15s ease;
}
.nb-regali-link:hover {
	color: var(--nb-testo);
	background: var(--nb-superficie-tenue);
	box-shadow: inset 0 0 0 1px var(--nb-testo-tenue);
}
.nb-regali-link__conta {
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--nb-accento);
	color: var(--nb-su-accento);
	font-size: 0.75rem;
	font-weight: 700;
	line-height: 22px;
	text-align: center;
}

@media (max-width: 768px) {
	.inside-header {
		flex-wrap: wrap;
		gap: 12px;
		padding-block: 10px;
	}
	.site-logo img,
	.custom-logo {
		max-height: 34px;
		max-width: 210px;
	}
	.nb-header-tools {
		order: 3;
		width: 100%;
	}
	.nb-cerca {
		flex: 1;
	}
	.nb-cerca__campo,
	input[type="search"].nb-cerca__campo {
		width: 100%;
	}
	/* Su telefono basta l'icona con il numero */
	.nb-regali-link__testo {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
	}
}

.site-footer,
.site-info {
	background: var(--nb-superficie);
	color: var(--nb-testo-tenue);
	font-size: 0.9rem;
}
.site-info a {
	color: var(--nb-testo-tenue);
}
.inside-site-info {
	padding-block: 24px;
}

/* ==========================================================================
   5. Home: sezione introduttiva
   ========================================================================== */
.home .inside-article {
	padding-top: 0;
}
.home .entry-content {
	margin-top: 0;
}
.home .site-main {
	margin-top: 0;
}

.nb-hero {
	/* A tutta larghezza anche dentro il contenitore di GeneratePress */
	margin: 0 calc(50% - 50vw);
	/* Testo allineato al logo (il gruppo eredita già il padding interno del contenuto) */
	padding: clamp(48px, 7vw, 88px) max(0px, calc((100vw - var(--nb-larghezza)) / 2)) 0;
	/* Fondo della pagina (blu); sopra, le due palline appese al bordo superiore, a destra
	   (SVG estratto dal PDF del cliente con tools/estrai-decorazioni.py) */
	background: url("../img/palline.svg") no-repeat;
	background-size: var(--nb-hero-decorazioni) auto;
	/* Bordo destro allineato al contenuto (40px = margine interno di GeneratePress) */
	background-position: right calc(max(0px, (100vw - var(--nb-larghezza)) / 2) + 40px) top;
	--nb-hero-decorazioni: min(36vw, 460px);
}
@media (max-width: 1100px) {
	.nb-hero {
		/* Il testo si stringe per lasciare posto alle decorazioni */
		--nb-hero-decorazioni: 34vw;
	}
	.nb-hero > * {
		max-width: calc(100% - var(--nb-hero-decorazioni) - 24px) !important;
	}
}
@media (max-width: 768px) {
	.nb-hero {
		/* Su telefono le palline stanno sotto il testo (proporzione dell'SVG 308 × 247) */
		--nb-hero-decorazioni: min(100vw - 32px, 280px);
		padding-bottom: calc(var(--nb-hero-decorazioni) * 247 / 308 + 24px);
		background-position: center bottom 16px;
	}
	.nb-hero > * {
		max-width: none !important;
	}
}
.nb-hero > * {
	max-width: 720px;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.nb-hero .nb-hero__kicker {
	margin-bottom: 1rem;
	color: var(--nb-accento);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.nb-hero .nb-hero__title {
	margin-bottom: 0.5em;
	font-size: clamp(2rem, 4.5vw, 3.1rem);
	font-weight: 700;
	letter-spacing: -0.03em;
	text-wrap: balance;
}
.nb-hero .nb-hero__lead {
	margin-bottom: 0.5em;
	color: var(--nb-testo);
	font-size: clamp(1.1rem, 2vw, 1.3rem);
	font-weight: 500;
}
.nb-hero .nb-hero__note {
	color: var(--nb-testo-tenue);
}
.nb-hero .nb-hero__note strong {
	color: var(--nb-testo);
	font-weight: 600;
}
.nb-hero .wp-block-buttons {
	margin-top: 1.75em;
}
/* GeneratePress colora i pulsanti dei blocchi con un selettore più specifico
   (vale per tutte le pagine, es. "Sfoglia il catalogo" in "I tuoi regali" vuoto) */
.entry-content .wp-block-button .wp-block-button__link {
	background: var(--nb-accento);
	color: var(--nb-su-accento);
}
.entry-content .wp-block-button .wp-block-button__link:hover {
	background: var(--nb-accento-scuro);
}

/* Come funziona: tre passaggi */
.nb-passi {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
	counter-reset: passo;
}
.nb-passi li {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 16px 18px;
	border: 1px solid var(--nb-bordo);
	border-radius: var(--nb-raggio);
	background: var(--nb-superficie);
	color: var(--nb-testo);
	font-weight: 500;
	counter-increment: passo;
}
.nb-passi li::before {
	content: counter(passo);
	flex: none;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--nb-accento-chiaro);
	color: var(--nb-accento);
	font-size: 0.85rem;
	font-weight: 700;
}

@media (max-width: 900px) {
	.nb-passi {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   6. Catalogo: filtri e griglia
   ========================================================================== */
.nb-catalogo {
	padding-block: 48px 72px;
	scroll-margin-top: 96px;
}
.nb-catalogo__titolo {
	margin-bottom: 0.75em;
	font-size: clamp(1.5rem, 3vw, 1.9rem);
}

.nb-filtri {
	margin-bottom: 8px;
}
.nb-filtri__label {
	margin-bottom: 0.6em;
	color: var(--nb-testo-tenue);
	font-size: 0.85rem;
	font-weight: 500;
}
.nb-filtri__lista {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.nb-filtro,
button.nb-filtro {
	min-height: 40px;
	padding: 0.5em 1.1em;
	border-radius: 999px;
	/* Sul blu: solo il bordo bianco; il filtro attivo è bianco pieno */
	background: transparent;
	color: var(--nb-testo);
	box-shadow: inset 0 0 0 1px var(--nb-testo);
	font-weight: 500;
	font-size: 0.9rem;
}
.nb-filtro:hover,
button.nb-filtro:hover {
	background: rgba(255, 255, 255, 0.12);
	color: var(--nb-testo);
	box-shadow: inset 0 0 0 1px var(--nb-testo);
}
.nb-filtro[aria-pressed="true"],
button.nb-filtro[aria-pressed="true"] {
	background: var(--nb-accento);
	color: var(--nb-su-accento);
	box-shadow: none;
}

.nb-catalogo__risultati {
	margin: 12px 0 24px;
	color: var(--nb-testo-tenue);
	font-size: 0.9rem;
}

.nb-catalogo__griglia {
	transition: opacity 0.2s ease;
}
.nb-catalogo.is-loading .nb-catalogo__griglia {
	opacity: 0.5;
}

.nb-griglia {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.nb-card {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	border-radius: var(--nb-raggio);
	background: var(--nb-superficie);
	box-shadow: var(--nb-ombra);
	overflow: hidden;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.nb-card:hover,
.nb-card:focus-within {
	transform: translateY(-2px);
	box-shadow: var(--nb-ombra-hover);
}
.nb-card__media {
	aspect-ratio: 1 / 1;
	overflow: hidden;
	padding: 20px;
	background: var(--nb-superficie-tenue);
}
.nb-card__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}
.nb-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	padding: 16px 18px 18px;
}
.nb-card__eta {
	padding: 0.15em 0.7em;
	border-radius: 999px;
	background: var(--nb-accento-chiaro);
	color: var(--nb-azzurro-scuro);
	font-size: 0.75rem;
	font-weight: 600;
}
.nb-card__titolo {
	margin: 0 0 4px;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.01em;
}
.nb-card__link.button,
a.nb-card__link.button {
	width: 100%;
	margin-top: auto;
	padding: 0.65em 1em;
	background: var(--nb-superficie);
	color: var(--nb-accento);
	box-shadow: inset 0 0 0 1px var(--nb-bordo);
	text-align: center;
}
.nb-card:hover .nb-card__link.button,
.nb-card__link.button:focus-visible {
	background: var(--nb-accento);
	color: var(--nb-su-accento);
	box-shadow: none;
}
/* L'intera card è cliccabile, con un solo link per gli screen reader */
.nb-card__link::after {
	content: "";
	position: absolute;
	inset: 0;
}
.nb-catalogo__vuoto {
	padding: 48px 16px;
	border: 1px dashed var(--nb-bordo);
	border-radius: var(--nb-raggio);
	color: var(--nb-testo-tenue);
	text-align: center;
}

/* Telefono: due card per riga */
@media (max-width: 600px) {
	.nb-griglia {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}
	.nb-card__media {
		padding: 10px;
	}
	.nb-card__body {
		padding: 12px;
	}
	.nb-card__titolo {
		font-size: 0.92rem;
	}
	.nb-card__link.button,
	a.nb-card__link.button {
		padding: 0.6em 0.5em;
		font-size: 0.88rem;
	}
}

/* ==========================================================================
   7. Scheda prodotto
   ========================================================================== */
.single-product .site-main {
	margin-block: 0 72px;
}
.nb-back {
	margin: 24px 0 16px;
	font-size: 0.95rem;
	font-weight: 500;
}
.nb-back a {
	color: var(--nb-testo-tenue);
	text-decoration: none;
}
.nb-back a:hover {
	color: var(--nb-testo);
}

.single-product div.product {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 48px;
	align-items: start;
	padding: 32px;
	border-radius: var(--nb-raggio);
	background: var(--nb-superficie);
	box-shadow: var(--nb-ombra);
}
.single-product div.product .woocommerce-product-gallery,
.single-product div.product .summary {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
}
.single-product .woocommerce-product-gallery {
	padding: 24px;
	border-radius: var(--nb-raggio-piccolo);
	background: var(--nb-superficie-tenue);
}
.single-product .woocommerce-product-gallery__image img {
	/* Le foto fornite sono piccole: niente ingrandimento oltre la dimensione reale */
	width: auto !important;
	max-width: 100%;
	max-height: 420px;
	margin-inline: auto;
	object-fit: contain;
	mix-blend-mode: multiply;
}
.single-product .woocommerce-product-gallery__image a {
	display: flex;
	justify-content: center;
}
.single-product .flex-control-thumbs {
	display: flex;
	gap: 8px;
	margin-top: 16px !important;
}
.single-product .flex-control-thumbs li {
	width: 64px !important;
}
.single-product .flex-control-thumbs li img {
	border: 1px solid var(--nb-bordo);
	border-radius: 8px;
	background: var(--nb-superficie);
}
.single-product .product_title {
	margin-bottom: 0.4em;
	font-size: clamp(1.5rem, 2.6vw, 2rem);
}
.single-product .woocommerce-product-details__short-description {
	margin-bottom: 0;
	color: var(--nb-testo-tenue);
}
.single-product .woocommerce-product-details__short-description p:last-child {
	margin-bottom: 0;
}

/* Campo nome del bambino (markup dal plugin) */
.nb-child-name {
	margin: 24px 0 16px;
	padding-top: 24px;
	border-top: 1px solid var(--nb-bordo);
}
.nb-child-name__label {
	display: block;
	margin-bottom: 8px;
	font-weight: 600;
	color: var(--nb-testo);
}
.nb-child-name__required {
	margin-left: 0.2em;
	color: var(--nb-accento);
}
.nb-child-name__input,
input[type="text"].nb-child-name__input {
	width: 100%;
	height: 52px;
	padding: 0 16px;
	border-radius: var(--nb-raggio-piccolo);
	font-size: 1rem;
}
.nb-child-name__input:focus {
	border-color: var(--nb-testo);
	box-shadow: 0 0 0 3px var(--nb-accento-chiaro);
}
.nb-child-name__help {
	margin: 8px 0 0;
	color: var(--nb-testo-tenue);
	font-size: 0.85rem;
}
.single-product form.cart {
	display: block;
	margin-bottom: 0;
}
.single-product form.cart .single_add_to_cart_button {
	width: 100%;
	height: 52px;
	font-size: 1rem;
}

@media (max-width: 768px) {
	.single-product div.product {
		grid-template-columns: 1fr;
		gap: 24px;
		padding: 16px;
	}
	.single-product .woocommerce-product-gallery {
		padding: 16px;
	}
}

/* ==========================================================================
   8. "I tuoi regali" e checkout (blocchi WooCommerce)
   ========================================================================== */
.woocommerce-cart .site-main,
.woocommerce-checkout .site-main {
	margin-block: 32px 72px;
}
.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title {
	font-size: clamp(1.6rem, 3vw, 2rem);
}

/* I blocchi Carrello/Checkout usano "alignwide": li allineo al contenuto */
.wp-block-woocommerce-cart.alignwide,
.wp-block-woocommerce-checkout.alignwide {
	max-width: 100%;
	margin-inline: 0;
}
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	padding: 24px;
	border-radius: var(--nb-raggio);
	background: var(--nb-superficie);
	box-shadow: var(--nb-ombra);
}

/* Righe: nome del regalo e nome del bambino ben leggibili */
.wp-block-woocommerce-cart .wc-block-components-product-name,
.wp-block-woocommerce-checkout .wc-block-components-product-name {
	/* WooCommerce imposta la dimensione con selettori di contenitore molto specifici */
	font-size: 1.05rem !important;
	font-weight: 600 !important;
	color: var(--nb-testo);
	text-decoration: none;
}
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__description .wc-block-components-product-name {
	font-size: 0.95rem !important;
}
/* La descrizione breve non serve qui: restano regalo e bambino */
.wp-block-woocommerce-cart .wc-block-components-product-metadata__description,
.wp-block-woocommerce-checkout .wc-block-components-product-metadata__description {
	display: none;
}
.wp-block-woocommerce-cart .wc-block-components-product-details,
.wp-block-woocommerce-checkout .wc-block-components-product-details {
	margin: 0.4em 0 0;
	padding: 0;
	list-style: none;
}
.wp-block-woocommerce-cart .wc-block-components-product-details > *,
.wp-block-woocommerce-checkout .wc-block-components-product-details > * {
	display: inline-block;
	margin: 0;
	padding: 0.25em 0.7em;
	border-radius: 8px;
	background: var(--nb-superficie-tenue);
	box-shadow: inset 0 0 0 1px var(--nb-bordo);
	color: var(--nb-testo);
	font-size: 0.9rem !important;
	line-height: 1.4;
}
.wp-block-woocommerce-cart .wc-block-components-product-details__name,
.wp-block-woocommerce-checkout .wc-block-components-product-details__name {
	color: var(--nb-testo-tenue);
	font-weight: 400;
}
.wp-block-woocommerce-cart .wc-block-components-product-details__value,
.wp-block-woocommerce-checkout .wc-block-components-product-details__value {
	font-weight: 600;
}
.wp-block-woocommerce-cart .wc-block-cart-item__image img,
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image img {
	border-radius: 8px;
	background: var(--nb-superficie-tenue);
}
.wp-block-woocommerce-cart .wc-block-components-totals-shipping__via {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--nb-testo);
}
/* Segnaposto di caricamento degli importi (nascosti) */
.wp-block-woocommerce-cart .wc-block-components-totals-item .wc-block-components-skeleton__element {
	display: none;
}

/* "Scegli la sede di ritiro" (markup dal plugin) */
.nb-sede {
	margin-bottom: 24px;
	padding: 24px;
	border-radius: var(--nb-raggio);
	background: var(--nb-superficie);
	box-shadow: var(--nb-ombra);
}
.nb-sede[hidden] {
	display: none;
}
.nb-sede__titolo {
	margin-bottom: 0.25em;
	font-size: 1.15rem;
}
.nb-sede__aiuto {
	margin-bottom: 1em;
	color: var(--nb-testo-tenue);
	font-size: 0.9rem;
}
/* Sedi su due colonne, una sola sul telefono */
.nb-sede__opzioni {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}
@media (max-width: 640px) {
	.nb-sede__opzioni {
		grid-template-columns: 1fr;
	}
}
.nb-sede__opzione {
	position: relative;
}
.nb-sede__opzione input {
	position: absolute;
	top: 50%;
	left: 16px;
	width: 18px;
	height: 18px;
	margin: 0;
	transform: translateY(-50%);
	accent-color: var(--nb-accento);
}
.nb-sede__opzione label {
	display: block;
	padding: 14px 16px 14px 46px;
	border: 1px solid var(--nb-bordo);
	border-radius: var(--nb-raggio-piccolo);
	font-weight: 500;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}
.nb-sede__opzione label:hover {
	border-color: var(--nb-testo-tenue);
}
.nb-sede__opzione input:checked + label {
	border-color: var(--nb-accento);
	background: var(--nb-accento-chiaro);
}
.nb-sede__opzione input:focus-visible + label {
	outline: 2px solid var(--nb-focus);
	outline-offset: 2px;
}
.nb-sede__stato {
	min-height: 1.5em;
	margin: 0.8em 0 0;
	color: var(--nb-azzurro-scuro);
	font-size: 0.9rem;
	font-weight: 500;
}

/* Scelta della sede nel checkout (metodi di spedizione) */
.wc-block-components-radio-control__option-checked {
	background: var(--nb-accento-chiaro);
}
.wc-block-components-radio-control__label {
	font-weight: 500;
}
.wc-block-components-radio-control .wc-block-components-radio-control__input:checked {
	border-color: var(--nb-accento);
}
.wc-block-components-radio-control .wc-block-components-radio-control__input:checked::before {
	background: var(--nb-accento);
}
/* Sedi su due colonne come in "I tuoi regali": ogni sede è una scheda con
   il suo bordo, al posto della lista unica con separatori di WooCommerce */
.wc-block-checkout__shipping-option .wc-block-components-radio-control {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}
.wc-block-checkout__shipping-option .wc-block-components-radio-control::after,
.wc-block-checkout__shipping-option .wc-block-components-radio-control__option::after {
	display: none;
}
.wc-block-checkout__shipping-option .wc-block-components-radio-control__option {
	margin: 0;
	border: 1px solid var(--nb-bordo);
	border-radius: var(--nb-raggio-piccolo);
	box-shadow: none;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}
.wc-block-checkout__shipping-option .wc-block-components-radio-control__option:hover {
	border-color: var(--nb-testo-tenue);
}
.wc-block-checkout__shipping-option .wc-block-components-radio-control__option-checked {
	border-color: var(--nb-accento);
	box-shadow: none;
}
@media (max-width: 640px) {
	.wc-block-checkout__shipping-option .wc-block-components-radio-control {
		grid-template-columns: 1fr;
	}
}

/* "I tuoi dati": solo nome e cognome. Il paese è sempre Italia (unico
   paese del negozio) e la descrizione standard parla di fatturazione */
.wc-block-checkout__billing-fields .wc-block-components-checkout-step__description,
.wc-block-checkout__billing-fields .wc-block-components-address-form__country {
	display: none;
}

/* Pulsanti principali dei blocchi */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	width: 100%;
	min-height: 52px;
	font-size: 1rem;
}

/* ==========================================================================
   9. Avvisi WooCommerce
   ========================================================================== */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
	border-radius: var(--nb-raggio-piccolo);
}
.woocommerce-message {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 24px;
	border: 1px solid var(--nb-bordo);
	border-left: 4px solid var(--nb-azzurro-scuro);
	background: var(--nb-superficie);
	color: var(--nb-testo);
	font-weight: 500;
}
.woocommerce-message::before {
	color: var(--nb-azzurro-scuro);
}
.woocommerce-message .button {
	order: 2;
	float: none !important;
}
.woocommerce-error {
	border-top-color: var(--nb-accento);
}

/* Accesso e "Ordine ricevuto": il contenuto sta in un pannello bianco come le card */
.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword,
.woocommerce-order {
	margin-bottom: 72px;
	padding: 24px;
	border: 0 !important; /* bordo grigio di WooCommerce sui moduli */
	border-radius: var(--nb-raggio);
	background: var(--nb-superficie);
	box-shadow: var(--nb-ombra);
}

/* "Ordine ricevuto": senza la colonna degli importi la tabella dei regali
   diventa un elenco, con il nome del bambino come in "I tuoi regali"
   (con .woocommerce davanti per superare gli stili delle tabelle di WooCommerce) */
.woocommerce .woocommerce-order .woocommerce-table--order-details,
.woocommerce .woocommerce-order .woocommerce-table--order-details :is(tbody, tfoot, tr, th, td) {
	display: block;
	border: 0;
	padding: 0;
	background: none;
}
.woocommerce .woocommerce-order .woocommerce-table--order-details thead,
.woocommerce .woocommerce-order .woocommerce-table--order-details .product-quantity {
	display: none; /* intestazione "Prodotto" e "× 1": un regalo per bambino */
}
.woocommerce .woocommerce-order .woocommerce-table--order-details tbody tr {
	padding: 14px 0;
	border-bottom: 1px solid var(--nb-bordo);
}
.woocommerce .woocommerce-order .woocommerce-table--order-details tbody a {
	color: var(--nb-testo);
	font-weight: 600;
	text-decoration: none;
}
.woocommerce .woocommerce-order .wc-item-meta {
	margin: 0.4em 0 0;
	padding: 0;
	list-style: none;
}
.woocommerce .woocommerce-order .wc-item-meta li {
	display: inline-block;
	margin: 0;
	padding: 0.25em 0.7em;
	border-radius: 8px;
	background: var(--nb-superficie-tenue);
	box-shadow: inset 0 0 0 1px var(--nb-bordo);
	font-size: 0.9rem;
	line-height: 1.4;
}
.woocommerce .woocommerce-order .wc-item-meta-label {
	color: var(--nb-testo-tenue);
	font-weight: 400;
}
.woocommerce .woocommerce-order .wc-item-meta p {
	display: inline;
	margin: 0;
	font-weight: 600;
}
.woocommerce .woocommerce-order .woocommerce-table--order-details tfoot tr {
	display: flex;
	flex-wrap: wrap;
	gap: 0 8px;
	padding-top: 14px;
}
.woocommerce .woocommerce-order .woocommerce-table--order-details tfoot th {
	color: var(--nb-testo-tenue);
	font-weight: 400;
}
.woocommerce .woocommerce-order .woocommerce-table--order-details tfoot td {
	font-weight: 600;
}

/* "I tuoi regali" vuoto */
.wp-block-woocommerce-empty-cart-block {
	padding: 32px 16px;
	text-align: center;
}
.wp-block-woocommerce-empty-cart-block .wp-block-buttons {
	justify-content: center;
}

/* Pagine di testo (es. Informativa sulla privacy): righe leggibili, titoli sobri.
   Selettore su body: anche l'<article> di ogni pagina ha la classe "page". */
body.page:not(.home):not(.woocommerce-page) .entry-content {
	max-width: 760px;
}
body.page:not(.home) .entry-content > .wp-block-heading {
	margin: 1.8em 0 0.5em;
	font-size: 1.25rem;
}