/*
 * Abello Restyling — base.
 * Elementi HTML di base e sostituzione del CSS che il tema genitore stampa dal Customizer
 * (nextawards_customize_css, rimosso in functions.php). Solo variabili di tokens.css.
 * I componenti (header, card, scheda prodotto, ...) arrivano negli step successivi.
 */

/* Testo */
html { background-color: var(--ab-color-bg); }
body {
	background-color: var(--ab-color-bg);
	color: var(--ab-color-text);
	font-family: var(--ab-font-text);
	font-size: var(--ab-text-md);
	line-height: var(--ab-leading-text);
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
}
/* il genitore fissa p/ul/li a 1.05rem e interlinea 130%: tornano a ereditare dal body */
p, ul, ol, li { font-family: inherit; font-size: inherit; line-height: inherit; }
strong, b { font-weight: var(--ab-weight-semibold); }
::selection { background-color: var(--ab-color-selection); color: var(--ab-color-text); }

/* Titoli: carattere dei titoli (Libre Caslon Display) da H1 a H3 (sempre ≥ 28 px), Hanken da H4 in giù */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--ab-font-display);
	font-weight: var(--ab-weight-medium);
	line-height: var(--ab-leading-title);
	letter-spacing: var(--ab-tracking-display);
	text-wrap: balance;
	font-synthesis-weight: none;   /* il Caslon Display ha un solo peso: niente grassetto simulato */
}
h1 { font-size: var(--ab-text-4xl); }
h2 { font-size: var(--ab-text-3xl); }
h3 { font-size: var(--ab-text-2xl); }
h4, h5, h6 {
	font-family: var(--ab-font-text);
	font-weight: var(--ab-weight-semibold);
	line-height: var(--ab-leading-snug);
	letter-spacing: normal;
}
h4 { font-size: var(--ab-text-xl); }

/* carattere dei titoli solo da 28 px in su: i titoli impostati a una dimensione piccola (preset fino a "medium")
   e i titoli dell'interfaccia del negozio usano il carattere del testo */
:is(h1, h2, h3, h4, h5, h6):is(.has-x-small-font-size, .has-small-font-size, .has-base-font-size, .has-medium-font-size),
.woocommerce-loop-product__title,
.wc-block-product-filters :is(h2, h3, h4),
.wc-block-components-title,
.wp-block-woocommerce-cart :is(h2, h3),
.wp-block-woocommerce-checkout :is(h2, h3),
.wp-block-woocommerce-empty-cart-block h2 {
	font-family: var(--ab-font-text);
	font-weight: var(--ab-weight-semibold);
	line-height: var(--ab-leading-snug);
	letter-spacing: normal;
}
h5 { font-size: var(--ab-text-md); }
h6 { font-size: var(--ab-text-ui); }

/* Link e focus */
a { color: var(--ab-color-link); text-underline-offset: var(--ab-underline-offset); text-decoration-thickness: var(--ab-border-hair); }
a:hover, a:focus { color: var(--ab-color-link-hover); }
:focus-visible { outline: var(--ab-focus-ring) solid var(--ab-color-focus); outline-offset: var(--ab-focus-offset); }
/* elementi che ricevono il focus solo da script (avvisi WooCommerce, tabindex -1): niente anello, il focus resta per i lettori di schermo */
[tabindex="-1"]:focus { outline: none; }
.header :focus-visible,
.wp-block-cover :focus-visible,
.has-link-color-hover-background-color :focus-visible,
.has-ghisa-background-color :focus-visible,
.has-verde-scuro-background-color :focus-visible { outline-color: var(--ab-color-focus-on-dark); }

/* ---- Sostituzione del CSS del Customizer del genitore ---- */

/* Pulsanti dei blocchi */
.wp-block-button__link {
	border-radius: var(--ab-radius-1);
	font-family: var(--ab-font-text);
	font-weight: var(--ab-weight-semibold);
	transition: background-color var(--ab-duration-fast) var(--ab-ease), color var(--ab-duration-fast) var(--ab-ease);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background-color: var(--ab-color-action);
	color: var(--ab-color-on-action);
}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:focus { background-color: var(--ab-color-action-hover); color: var(--ab-color-on-action); }
.is-style-outline .wp-block-button__link { color: inherit; border-width: var(--ab-border-hair); }

/* Voce "Contatti" del menu rapido (classe evi del tema) */
.evi a { background-color: var(--ab-color-action); border-radius: var(--ab-radius-1); }
.evi a:hover { background-color: var(--ab-color-action-hover); }

/* Pulsanti WooCommerce: il genitore li forza a #222 con !important */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background-color: var(--ab-color-action) !important;
	color: var(--ab-color-on-action) !important;
	border-radius: var(--ab-radius-1) !important;
	text-transform: none !important;
	font-weight: var(--ab-weight-semibold);
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover { background-color: var(--ab-color-action-hover) !important; }

/* Header scuro allo scroll sui template trasparenti (prima: #222 dal Customizer) */
@media (min-width: 1190px) {
	.page-template-menu-trasparent.scroll-down .header,
	.page-template-align-wide-fix-trasparent.scroll-down .header { background-color: var(--ab-color-nav-scrolled) !important; }
}

/* Footer (prima: colori del Customizer) */
.footer-content { background-color: var(--ab-color-bg); color: var(--ab-color-text); }
.footer-content hr { border-color: var(--ab-color-border); }

/* ---- Avvisi WooCommerce (classici: "aggiunto al carrello", informazioni, errori) ---- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ab-space-3) var(--ab-space-5);
	max-width: var(--ab-width-wide);
	margin: 0 auto var(--ab-space-6) !important;
	padding: var(--ab-space-4) var(--ab-space-5) !important;
	border: 0 !important;
	border-left: var(--ab-border-rule) solid var(--ab-color-success) !important;
	border-radius: var(--ab-radius-1);
	background: var(--ab-color-surface) !important;
	box-shadow: var(--ab-shadow-1);
	color: var(--ab-color-text) !important;
	font-size: var(--ab-text-ui);
	line-height: var(--ab-leading-snug);
	list-style: none;
}
.woocommerce-info { border-left-color: var(--ab-color-border-strong) !important; }
.woocommerce-error { border-left-color: var(--ab-color-error) !important; }
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { position: static !important; margin: 0; color: inherit !important; }
.woocommerce-message::after,
.woocommerce-info::after,
.woocommerce-error::after { display: none; }
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button,
.woocommerce-message a.button.wc-forward {
	background-color: var(--ab-color-action) !important;   /* il genitore usa #4CAF50: bianco 2,8:1, sotto AA */
	color: var(--ab-color-on-action) !important;
	order: 2;
	margin-left: auto !important;
	float: none !important;
	padding: var(--ab-space-2) var(--ab-space-4) !important;
	font-size: var(--ab-text-ui) !important;
}

/* ---- Dissolvenza d'ingresso del genitore (.wrapper.load, "fade-load"): anima anche "top" (20px → 0) e il browser
   lo conta come spostamento di layout dell'intera pagina (CLS fino a 0,25 misurato). Resta la sola opacità. ---- */
@keyframes abello-fade-load {
	from { opacity: 0; }
	to { opacity: 1; }
}
.load { animation-name: abello-fade-load; }

/* ---- Movimento ridotto: la dissolvenza d'ingresso non parte ---- */
@media (prefers-reduced-motion: reduce) {
	.load { animation: none !important; opacity: 1 !important; }
}

/* testo "Menu" dell'hamburger: nascosto dal genitore per i lettori di schermo, comunque leggibile sul fondo scuro */
.icon-hamburger strong { color: var(--ab-color-on-dark); }
