/*
Theme Name: AstroCalina
Theme URI: https://www.astrocalina.ch
Description: Tema a blocchi di AstroCalina – Società Astronomica Ticinese e Osservatorio Gionitus all'Alpe di Gorda. Colori, font e misure in theme.json; qui solo ciò che theme.json non esprime.
Author: AstroCalina
Version: 1.1.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: astrocalina
*/

/* ---------- Header ---------- */

header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0);
	z-index: 50;
	box-shadow: var(--wp--preset--shadow--lg);
}

/* Sfocatura su uno pseudo-elemento: sull'header stesso confinerebbe il menu mobile a tutto schermo dentro l'header. */
header.wp-block-template-part::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.site-header .wp-block-navigation {
	font-size: 1rem;
}

.site-header .wp-block-navigation-item__content,
.site-header .wp-block-loginout a,
.site-header .wc-block-mini-cart__button {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	padding: 0.5rem 0.75rem;
	border-radius: var(--wp--custom--radius--md);
	color: var(--wp--preset--color--white);
	text-decoration: none;
	transition: background-color 0.3s, color 0.3s;
}

.site-header .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.site-header .wp-block-navigation-item__content:focus-visible,
.site-header .wp-block-loginout a:hover,
.site-header .wc-block-mini-cart__button:hover {
	background-color: var(--wp--preset--color--gold-dark);
	color: #1e293b;
}

/* "Unisciti a noi": invito a diventare soci, in evidenza come pulsante oro. */
.site-header .menu-cta > .wp-block-navigation-item__content {
	background-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--deep-space);
	font-weight: 600;
}

.site-header .menu-cta:hover > .wp-block-navigation-item__content,
.site-header .menu-cta > .wp-block-navigation-item__content:focus-visible {
	background-color: var(--wp--preset--color--gold-dark);
	color: var(--wp--preset--color--deep-space);
}

.site-header .wp-block-navigation .wp-block-navigation__submenu-container {
	min-width: 14rem;
	padding: 0.5rem;
	border: 0;
	border-radius: var(--wp--custom--radius--lg);
	background-color: var(--wp--preset--color--modale);
	box-shadow: var(--wp--preset--shadow--xxl);
}

.site-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	width: 100%;
	white-space: nowrap;
}

/* Menu mobile: voci allineate a sinistra e più grandi da toccare; i sottomenu sono già aperti, senza riquadro. */
.site-header .wp-block-navigation__responsive-container.is-menu-open {
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	font-size: var(--wp--preset--font-size--medium);
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start;
}

.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	min-width: 0;
	padding: 0 0 0 1rem;
	background-color: transparent;
	box-shadow: none;
}

.site-header .wp-block-loginout a::before {
	content: "";
	width: 1.25rem;
	height: 1.25rem;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='black' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5.121 17.804A4 4 0 018 16h8a4 4 0 012.879 1.804M15 11a3 3 0 11-6 0 3 3 0 016 0z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='black' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5.121 17.804A4 4 0 018 16h8a4 4 0 012.879 1.804M15 11a3 3 0 11-6 0 3 3 0 016 0z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.site-header .wc-block-mini-cart__badge {
	background-color: #ef4444;
	color: var(--wp--preset--color--white);
}

/* ---------- Sezioni della home ---------- */

html {
	scroll-behavior: smooth;
	scroll-padding-top: 8rem;
}

.hero {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 100vh;
	overflow: hidden;
	text-align: center;
}

.hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
}

.hero__content {
	position: relative;
	z-index: 1;
	padding: 1.5rem;
}

.hero__content h1 {
	text-shadow: 0 2px 12px rgb(0 0 0 / 0.6);
}

.is-style-card {
	padding: 1.5rem;
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--preset--shadow--xl);
}

.is-style-check {
	padding-left: 0;
	list-style: none;
}

.is-style-check li::before {
	content: "✔";
	margin-right: 0.5rem;
	color: var(--wp--preset--color--teal);
}

.wp-block-button.is-style-teal .wp-block-button__link {
	border: 1px solid var(--wp--preset--color--teal);
	background-color: transparent;
	color: var(--wp--preset--color--white);
}

.wp-block-button.is-style-teal .wp-block-button__link:hover {
	background-color: #0d9488;
	color: var(--wp--preset--color--white);
}

.wp-block-button .wp-block-button__link,
.card-evento {
	transition: background-color 0.3s, transform 0.3s;
}

.wp-block-button .wp-block-button__link:hover,
.card-evento:hover {
	transform: scale(1.05);
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.wp-block-button .wp-block-button__link:hover,
	.card-evento:hover {
		transform: none;
	}
}

/* Prossimi eventi (shortcode Events Manager, stile "pixelbones") */
.eventi-home .em.em-view-container {
	width: 100%;
	max-width: none;
	margin: 0;
}

.eventi-home .em.em-events-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
	gap: 2rem;
}

.card-evento {
	padding: 1.5rem;
	border-radius: var(--wp--custom--radius--lg);
	background-color: var(--wp--preset--color--deep-space);
	box-shadow: var(--wp--preset--shadow--xl);
}

/* Events Manager usa !important sui titoli: per riportarli allo stile del sito serve anche qui. */
.em.pixelbones .card-evento h3 {
	margin: 0 0 0.5rem !important;
	font-family: var(--wp--preset--font-family--montserrat) !important;
	font-size: var(--wp--preset--font-size--large) !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	letter-spacing: normal !important;
}

.em.pixelbones .card-evento h3 a {
	color: var(--wp--preset--color--white) !important;
	text-decoration: none !important;
}

.em.pixelbones .card-evento h3 a:hover {
	color: var(--wp--preset--color--gold) !important;
}

.em.pixelbones .card-evento p {
	margin: 0 !important;
}

.card-evento p {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted);
}

.card-evento p + p {
	color: var(--wp--preset--color--subtle);
}

/* Ultime notizie */
.notizia .wp-block-post-featured-image {
	flex: 0 0 33%;
}

@media (max-width: 639px) {
	.notizia .wp-block-post-featured-image {
		display: none;
	}
}

.wp-block-read-more {
	color: var(--wp--preset--color--teal);
	font-weight: 600;
	text-decoration: none;
}

.wp-block-read-more:hover {
	text-decoration: underline;
}

/* ---------- Sidebar notizie ---------- */

.sidebar-news h2 {
	margin-bottom: 1rem;
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wp--preset--color--gold);
}

.sidebar-news .wp-block-latest-posts a {
	color: var(--wp--preset--color--white);
	font-weight: 600;
	text-decoration: none;
}

.sidebar-news .wp-block-latest-posts li + li {
	margin-top: 0.5rem;
}

.sidebar-news .wp-block-categories,
.sidebar-news .wp-block-archives {
	padding-left: 1.25rem;
	color: var(--wp--preset--color--muted);
}

.sidebar-news .wp-block-categories a,
.sidebar-news .wp-block-archives a {
	text-decoration: none;
}

.sidebar-news .wp-block-search__inside-wrapper {
	flex-direction: column;
	gap: 0.5rem;
	border: 0;
	padding: 0;
}

.sidebar-news .wp-block-search__button {
	width: 100%;
	margin: 0;
}

/* ---------- Form ---------- */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
select,
textarea {
	padding: 0.5rem;
	border: 1px solid #4b5563;
	border-radius: var(--wp--custom--radius--sm);
	background-color: var(--wp--preset--color--grafite);
	color: var(--wp--preset--color--white);
	font: inherit;
}

select option {
	background-color: var(--wp--preset--color--grafite);
	color: var(--wp--preset--color--white);
}

input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 1px;
}

/* WPForms (markup moderno): colori tramite le sue variabili. */
.wpforms-container.wpforms-render-modern {
	--wpforms-label-color: var(--wp--preset--color--white);
	--wpforms-label-sublabel-color: var(--wp--preset--color--muted);
	--wpforms-label-error-color: #f87171;
	--wpforms-field-background-color: var(--wp--preset--color--grafite);
	--wpforms-field-border-color: #4b5563;
	--wpforms-field-text-color: var(--wp--preset--color--white);
	--wpforms-button-background-color: var(--wp--preset--color--gold);
	--wpforms-button-text-color: var(--wp--preset--color--deep-space);
	--wpforms-button-border-radius: 6px;
}

.wpforms-confirmation-container-full,
div[class*="wpforms-confirmation"] {
	padding: 15px;
	border-radius: 5px;
	background-color: #28a745;
	color: var(--wp--preset--color--white);
}

/* Theme My Login */
.tml {
	max-width: 360px;
	margin: 3rem auto;
}

.tml .tml-button {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 0;
	border-radius: var(--wp--custom--radius--md);
	background-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--deep-space);
	font-weight: 600;
	cursor: pointer;
}

.tml .tml-button:hover {
	background-color: var(--wp--preset--color--gold-dark);
}

.tml .tml-links {
	padding-left: 0;
	list-style: none;
}

.tml input[type="text"],
.tml input[type="password"],
.tml input[type="email"] {
	width: 100%;
}

/* ---------- Events Manager ---------- */

/* Lo stile "pixelbones" di Events Manager è pensato per sfondi chiari: si reimpostano le sue variabili colore. */
.em.pixelbones {
	--background-color: transparent;
	--text-color-normal: var(--wp--preset--color--light);
	--text-color-softer: var(--wp--preset--color--muted);
	--text-color-richer: var(--wp--preset--color--white);
	--header-color: var(--wp--preset--color--white);
	--meta-color: var(--wp--preset--color--muted);
	--default-color: var(--wp--preset--color--muted);
	--nav-color: var(--wp--preset--color--muted);
	--date-color: var(--wp--preset--color--muted);
	--main-border-color: var(--wp--preset--color--slate);
	--border-color: var(--wp--preset--color--slate);
	--main-bg: transparent;
	--main-h3-color: var(--wp--preset--color--white);
	--background-color-inputs: var(--wp--preset--color--grafite);
}

/* Events Manager forza i menu a tendina in bianco con !important. */
.em.pixelbones .input select:not([multiple]),
.em.pixelbones select:not([multiple]) {
	background-color: var(--wp--preset--color--grafite) !important;
	color: var(--wp--preset--color--white) !important;
	filter: invert(0);
}

.em.pixelbones.em-modal-popup,
.em.pixelbones .em-modal-popup {
	--background-color: var(--wp--preset--color--deep-space);
}

/* Le icone di Events Manager sono grigio scuro: in negativo diventano chiare. */
.em.pixelbones [class*="em-icon"] {
	filter: invert(1) brightness(0.9);
}

/* Calendario: colori del tema precedente (giorni #1C2541 con bordo slate) tramite le variabili di Events Manager. */
body .em.em-calendar {
	--calendar-background: #1c2541;
	--header-background: #1c2541;
	--header-color: var(--wp--preset--color--white);
	--header-border: 1px solid var(--wp--preset--color--slate);
	--nav-color: var(--wp--preset--color--muted);
	--nav-border: 1px solid var(--wp--preset--color--slate);
	--date-box-border: 1px solid var(--wp--preset--color--slate);
	--date-color: var(--wp--preset--color--white);
	--date-background: var(--wp--preset--color--deep-space);
	--date-border-color: var(--wp--preset--color--slate);
	--date-today-color: var(--wp--preset--color--deep-space);
	--date-today-background: var(--wp--preset--color--gold);
	--event-background-color: #80b538;
	--event-border-color: #80b538;
	border-radius: 6px;
}

.em.em-calendar .em-cal-body .em-cal-day .em-cal-day-date a,
.em.em-calendar .em-cal-body .em-cal-day .em-cal-day-date span {
	border-radius: 6px;
}

.em-calendar .em-cal-event {
	background-color: var(--event-background-color);
	border-color: var(--event-border-color);
	color: var(--event-color, #fff);
}

body .em-modal-popup {
	min-height: 400px;
	max-height: 80vh;
	overflow-y: auto;
}

.em-booking-form section,
.em-booking-form .em-booking-section,
.em-booking-form h3.em-booking-section-title {
	background-color: transparent;
	color: inherit;
}

/* Box relatori nella dashboard (plugin astrocalina-core) */
.dashboard-relatori-links {
	max-width: 600px;
	margin: 2em auto;
	padding: 1.5em 1em;
	border-left: 5px solid var(--wp--preset--color--gold);
}

.dashboard-relatori-links h3 {
	margin-top: 0;
	font-size: 1.8em;
}

.dashboard-relatori-links li + li {
	margin-top: 1.5em;
}

/* ---------- WooCommerce ---------- */

.wc-block-components-product-name,
.wp-block-woocommerce-product-price,
.wc-block-components-product-price {
	color: var(--wp--preset--color--white);
}

.wp-block-woocommerce-product-price .woocommerce-Price-amount,
.wc-block-components-product-price .woocommerce-Price-amount {
	color: var(--wp--preset--color--gold);
}

.wc-block-components-button:not(.is-link),
.single_add_to_cart_button {
	border-radius: var(--wp--custom--radius--md);
	background-color: var(--wp--preset--color--gold);
	color: var(--wp--preset--color--deep-space);
	font-weight: 600;
}

.wc-block-components-button:not(.is-link):hover,
.single_add_to_cart_button:hover {
	background-color: var(--wp--preset--color--gold-dark);
	color: var(--wp--preset--color--deep-space);
}

.astrocalina-date-corso-output ul {
	padding-left: 1.25rem;
}

/* ---------- Immagini ---------- */

figure.wp-block-image figcaption {
	text-align: center;
}

.site-header {
	padding-inline: var(--wp--style--root--padding-left);
}

footer .wp-block-list {
	list-style: none;
}

footer a,
.site-header a {
	text-decoration: none;
}

footer a:hover {
	color: var(--wp--preset--color--gold);
}

.wp-block-column.is-style-card a:not(.wp-element-button) {
	color: var(--wp--preset--color--gold);
}

/* ---------- Testo delle pagine ---------- */

/* Nei contenuti i titoli restano sotto il titolo della pagina (24px). */
.wp-block-post-content h2 {
	margin-top: 2rem;
	font-size: var(--wp--preset--font-size--large);
}

.wp-block-post-content h3 {
	font-size: var(--wp--preset--font-size--medium);
}

.wp-block-post-content .wp-block-table {
	overflow-x: auto;
	font-size: var(--wp--preset--font-size--small);
}

/* Su schermi stretti la tabella scorre in orizzontale invece di spezzare le parole. */
.wp-block-post-content .wp-block-table table {
	min-width: 36rem;
}

.wp-block-post-content .wp-block-table th,
.wp-block-post-content .wp-block-table td {
	min-width: 6rem;
	padding: 0.5rem;
	border-color: var(--wp--preset--color--slate);
	vertical-align: top;
}

/* Testo solo per gli screen reader (es. h1 del blog). */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* ---------- Avviso in finestra (parts/avviso.html + assets/avviso.js) ---------- */

/* Nascosto solo nella pagina: avviso.js lo sposta nella finestra, fuori da .wp-site-blocks. Nell'Editor (body.editor-styles-wrapper) resta visibile. */
body:not(.editor-styles-wrapper) .wp-site-blocks .avviso {
	display: none;
}

.avviso-finestra {
	width: min(32rem, calc(100% - 2rem));
	padding: 2rem 1.5rem 1.5rem;
	border: 0;
	border-radius: 16px;
	background-color: var(--wp--preset--color--modale);
	color: var(--wp--preset--color--white);
	box-shadow: var(--wp--preset--shadow--xxl);
}

.avviso-finestra::backdrop {
	background-color: rgb(0 0 0 / 0.6);
}

.avviso-finestra h2 {
	margin-top: 0;
}

.avviso-chiudi {
	position: absolute;
	top: 0.5rem;
	right: 0.75rem;
	padding: 0.25rem 0.5rem;
	border: 0;
	background: none;
	color: var(--wp--preset--color--muted);
	font-size: 1.75rem;
	line-height: 1;
	cursor: pointer;
}

.avviso-chiudi:hover,
.avviso-chiudi:focus-visible {
	color: var(--wp--preset--color--gold);
}

/* ---------- Linea del tempo (gruppi .linea-del-tempo > .tappa) ---------- */

.linea-del-tempo {
	margin-left: 0.5rem;
	padding-left: 2rem;
	border-left: 2px solid var(--wp--preset--color--slate);
}

.linea-del-tempo .tappa {
	position: relative;
}

.linea-del-tempo .tappa + .tappa {
	margin-top: 1.75rem;
}

.linea-del-tempo .tappa::before {
	content: "";
	position: absolute;
	top: 0.35rem;
	left: calc(-2rem - 8px);
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background-color: var(--wp--preset--color--gold);
	box-shadow: 0 0 0 4px var(--wp--preset--color--deep-space);
}

.linea-del-tempo .tappa.prevista::before {
	border: 2px solid var(--wp--preset--color--gold);
	background-color: var(--wp--preset--color--deep-space);
}

.wp-block-post-content .linea-del-tempo h3 {
	margin: 0 0 0.25rem;
	color: var(--wp--preset--color--gold);
	font-size: var(--wp--preset--font-size--large);
}

.linea-del-tempo p {
	margin: 0;
}

/* Galleria foto: credito "Foto di …" sotto ogni miniatura (NextGEN, vista "caption"), dentro la cornice bianca. */
.wp-block-post-content .ngg-gallery-thumbnail span {
	display: block;
	padding: 0.25rem 0;
	color: #374151;
	font-size: var(--wp--preset--font-size--small);
	text-align: center;
}