/*
Theme Name: RISE
Theme URI:
Author: Sara
Author URI:
Description: Custom block theme for RISE project
Version: 1.1.6
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rise
*/

/* ==========================================================================
   1. Padding coerenti — unica fonte per content, header, footer, testata
   Modifica solo --rise-padding-x e --rise-padding-y-* per cambiare tutto il sito.
   Mobile → tablet (768px) → desktop (1200px).
   ========================================================================== */
:root {
	/* Larghezza massima content, header, footer, testata */
	--rise-content-max-width: 1400px;
	/* Orizzontale: stesso valore per tutte le sezioni */
	--rise-padding-x: 16px;
	/* Verticale: ritmo coerente (opzionale, usato da header/footer/testata/main) */
	--rise-padding-y-tight: 1rem;   /* header */
	--rise-padding-y-section: 1.5rem; /* testata, main, footer */
}

/* Mobile: corpo testo leggermente più piccolo */
@media (max-width: 767px) {
	body {
		font-size: 0.9375rem; /* 15px */
	}
}

@media (min-width: 768px) {
	:root {
		--rise-padding-x: 24px;
		--rise-padding-y-tight: 1.25rem;
		--rise-padding-y-section: 2rem;
	}
}

@media (min-width: 1200px) {
	:root {
		--rise-padding-x: 40px;
		--rise-padding-y-tight: 1.5rem;
		--rise-padding-y-section: 2.5rem;
	}
}

/* Nessun padding laterale sul body (gestito solo da contenitori interni header/footer/main) */
html body {
	--wp--style--root--padding-left: 0 !important;
	--wp--style--root--padding-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Link: mai sottolineati */
a {
	text-decoration: none;
}

/* Reset padding laterale ovunque WP lo applichi (body o wrapper con has-global-padding) */
body.has-global-padding,
.has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* ========== STESSO LAYOUT DI .wp-block-rise-page-header__inner (unica fonte) ==========
   Valori: max-width 1400px, margin auto, padding-left/right var(--rise-padding-x)
   Applicati con !important a header inner, main, footer inner così nulla li sovrascrive. */

/* Header: wrapper (figlio diretto) a tutta larghezza */
header.wp-block-template-part > * {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box;
	flex: 1 1 100%;
	min-width: 0;
}
/* Header: fasce (nipoti) — sfondo edge-to-edge, contenuto centrato ≤ 1400px.
   Stesso pattern del footer: padding laterale max() centra il contenuto
   su viewport > 1400px, garantendo padding minimo --rise-padding-x. */
header.wp-block-template-part > * > * {
	padding-left: max(var(--rise-padding-x, 16px), calc((100% - var(--rise-content-max-width, 1400px)) / 2 + var(--rise-padding-x, 16px))) !important;
	padding-right: max(var(--rise-padding-x, 16px), calc((100% - var(--rise-content-max-width, 1400px)) / 2 + var(--rise-padding-x, 16px))) !important;
	box-sizing: border-box !important;
}

/* Main e post-content = page-header__inner (stessa colonna ovunque: pagine, home, single, index, 404) */
main,
.wp-block-post-content {
	max-width: var(--rise-content-max-width, 1400px) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: var(--rise-padding-x, 16px) !important;
	padding-right: var(--rise-padding-x, 16px) !important;
	box-sizing: border-box;
}
/* Niente doppio padding: quando post-content è dentro main, solo main ha il padding */
main .wp-block-post-content,
main .is-layout-constrained,
main .has-global-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Footer: regole spostate nella sezione footer sotto (righe 178+) */


/* Content: padding verticale responsivo (non in home) */
body:not(.home) main,
body:not(.home) .wp-block-post-content {
	padding-top: calc(var(--rise-padding-y-section, 1.5rem) * 2) !important;
	padding-bottom: calc(var(--rise-padding-y-section, 1.5rem) * 2) !important;
}
body:not(.home) main .wp-block-post-content {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* Blocchi full-width nel contenuto: 100% larghezza viewport */
main .alignfull,
.wp-block-post-content .alignfull {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

/* Wide blocks (es. carousel iniziative) — più spazio per 3 card intere */
.alignwide {
	max-width: var(--rise-content-max-width, 1400px);
	width: 100%;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Header: 100vw, gradiente giallo→teal sul bordo inferiore.
   Sfondo NON forzato: ogni fascia lo imposta da editor.
   Sticky NON forzato: controllato da editor via :has(.is-position-sticky). */
header.wp-block-template-part {
	z-index: 100;
	width: 100vw;
	max-width: 100vw;
	border-bottom: 1px solid;
	border-image: linear-gradient(90deg, #F3DA0B 17%, #EBD711 26%, #D5D124 41%, #B1C742 58%, #7FB86D 78%, #40A6A2 99%, #3FA6A4 100%) 1;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	overflow: visible;
	display: flex;
	justify-content: center;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box;
}
/* Sticky controllato da editor: se un blocco interno ha position: sticky,
   lo propaga al wrapper del template part (l'unico nodo che può davvero "stickare"
   perché è figlio diretto di .wp-site-blocks). */
header.wp-block-template-part:has(.is-position-sticky) {
	position: sticky;
	top: 0;
}
/* Account for WP admin bar when logged in (solo quando sticky attivo) */
.admin-bar header.wp-block-template-part:has(.is-position-sticky) {
	top: 32px;
}
@media (max-width: 782px) {
	.admin-bar header.wp-block-template-part:has(.is-position-sticky) {
		top: 46px;
	}
}

/* Header mobile: loghi e immagini al 70% della dimensione editor.
   zoom scala sia l'elemento che il layout (a differenza di transform: scale). */
@media (max-width: 767px) {
	header.wp-block-template-part .wp-block-site-logo,
	header.wp-block-template-part figure,
	header.wp-block-template-part .wp-block-image {
		zoom: 0.65;
	}
}

/* Footer: 100vw come l'header */
footer.wp-block-template-part {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
}
/* Fasce footer (figli diretti): sfondo edge-to-edge, contenuto centrato ≤ 1400px.
   Funziona con qualsiasi blocco (group, columns, CTA…), anche aggiunto in futuro.
   Il padding laterale max() fa sì che su viewport > 1400px il contenuto sia centrato,
   su viewport ≤ 1400px il padding minimo sia --rise-padding-x. */
footer.wp-block-template-part > * {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: max(var(--rise-padding-x, 16px), calc((100% - var(--rise-content-max-width, 1400px)) / 2 + var(--rise-padding-x, 16px))) !important;
	padding-right: max(var(--rise-padding-x, 16px), calc((100% - var(--rise-content-max-width, 1400px)) / 2 + var(--rise-padding-x, 16px))) !important;
	box-sizing: border-box !important;
}
/* CTA nel footer: il wrapper interno non aggiunge ulteriore padding/max-width
   (la fascia esterna lo gestisce già con max()) */
footer.wp-block-template-part .wp-block-rise-cta__inner {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}
/* Footer: elementi con sfondo visibile — breakout a 100vw,
   contenuto centrato a ≤ 1400px (allineato al resto del sito).
   Copre la barra copyright (depth 2) e la riga loghi (depth 4). */
footer.wp-block-template-part > * .has-background {
	width: 100vw !important;
	max-width: 100vw !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-left: max(var(--rise-padding-x, 16px), calc((100vw - var(--rise-content-max-width, 1400px)) / 2 + var(--rise-padding-x, 16px))) !important;
	padding-right: max(var(--rise-padding-x, 16px), calc((100vw - var(--rise-content-max-width, 1400px)) / 2 + var(--rise-padding-x, 16px))) !important;
	box-sizing: border-box !important;
}

/* ==========================================================================
   2. Site logo — force SVG to respect the block's width setting
   ========================================================================== */
.wp-block-site-logo {
	flex-shrink: 0;
}

/* When the user sets an explicit width (no is-default-size class),
   the container gets style="width:Xpx" — img fills it exactly. */
.wp-block-site-logo:not(.is-default-size) img {
	width: 100%;
	height: auto;
}

/* Fallback when no custom width is set */
.wp-block-site-logo.is-default-size {
	max-width: 200px;
}
.wp-block-site-logo.is-default-size img {
	width: 100%;
	height: auto;
}

/* Logo nel footer: dimensione controllata dal filtro rise_site_logo_inline_width
   che aggiunge style="width:Xpx" dal valore impostato nell'editor WP.
   L'img eredita width:100% dalla regola generale .wp-block-site-logo:not(.is-default-size) img. */
footer .wp-block-site-logo {
	flex: 0 0 auto;
	min-width: 0;
}
footer .wp-block-site-logo a {
	display: block;
}
/* ==========================================================================
   3. Navigation — hover, active, submenu (livello 2)
   ========================================================================== */
.wp-block-navigation a:hover,
.wp-block-navigation a:focus {
	color: var(--wp--preset--color--rise-teal) !important;
}
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--rise-teal) !important;
}

/* Submenu (livello 2): orizzontale, stessa dimensione del menu principale (inherit), senza bordo, con ombra */
.wp-block-navigation__submenu-container,
.wp-block-navigation .wp-block-navigation__submenu-container,
.wp-block-navigation ul.wp-block-navigation__submenu-container,
.wp-block-navigation-submenu .wp-block-navigation__submenu-container,
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation__submenu-container,
li.wp-block-navigation-submenu > ul.wp-block-navigation__submenu-container {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	gap: 0 1rem;
	border: none !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	padding: 0.75rem 1rem !important;
	min-width: auto !important;
	font-size: inherit !important;
	list-style: none !important;
	margin: 0 !important;
}
.wp-block-navigation__submenu-container .wp-block-navigation-item,
.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item,
li.wp-block-navigation-submenu > ul.wp-block-navigation__submenu-container > .wp-block-navigation-item {
	display: inline-block !important;
	list-style: none !important;
	margin: 0 !important;
}
.wp-block-navigation__submenu-container .wp-block-navigation-item__content,
.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.25rem 0;
	white-space: nowrap;
	font-size: inherit !important;
	font-weight: inherit;
}

/* Submenu: freccia (chevron) visibile */
.wp-block-navigation__submenu-icon svg {
	stroke: currentColor;
}

/* Submenu mobile overlay: toggle al click, freccia visibile, voci in colonna.
   I selettori usano .is-menu-open per vincere le regole WP core che nell'overlay
   nascondono l'icona e mostrano sempre tutti i submenu espansi. */
@media (max-width: 767px) {
	/* Freccia accanto al testo: li in riga con wrap per il submenu */
	.wp-block-navigation__responsive-container.is-menu-open li.wp-block-navigation-submenu {
		flex-direction: row !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
	}

	/* Mostra la freccia (chevron) nell'overlay — WP la nasconde di default */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon {
		display: inline-flex !important;
		align-items: center;
		margin-left: 0.35em !important;
	}
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-icon svg {
		width: 12px;
		height: 12px;
	}

	/* Nascondo il submenu di default nell'overlay */
	.wp-block-navigation__responsive-container.is-menu-open .has-child .wp-block-navigation__submenu-container {
		display: none !important;
	}

	/* Aperto quando il toggle ha aria-expanded="true" */
	.wp-block-navigation__responsive-container.is-menu-open .has-child .wp-block-navigation-submenu__toggle[aria-expanded="true"] ~ .wp-block-navigation__submenu-container {
		display: flex !important;
		flex-direction: column !important;
		align-items: center !important;
		flex-basis: 100% !important;
		box-shadow: none !important;
		gap: 0.25rem !important;
		padding: 0.25rem 0 !important;
	}

	/* Voci del submenu in blocco */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
		display: block !important;
	}
}

/* ==========================================================================
   4. RISE CTA block — sempre 100% larghezza (full-bleed), senza padding laterali
   Forzato a livello tema per vincere layout constrained del post content.
   ========================================================================== */
.wp-block-rise-cta,
.wp-block-post-content .wp-block-rise-cta {
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box;
}

/* Consenti al blocco CTA di uscire dal contenitore constrained (anche se annidato) */
.wp-block-post-content .is-layout-constrained .wp-block-rise-cta,
main .wp-block-rise-cta {
	width: 100vw !important;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

/* CTA block mobile: titoli più piccoli, email che non sporge */
@media (max-width: 767px) {
	.wp-block-rise-cta__inner .wp-block-heading {
		font-size: 1.25rem !important;
		overflow-wrap: break-word;
		word-break: break-all;
	}
}

/* ==========================================================================
   5. Headings — decorative double circle before h2
   Yellow circle (left/behind) + teal circle (right/front), overlapping.
   ========================================================================== */
h2::before {
	content: '';
	display: block;
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	margin-right: 12px;
	border-radius: 50%;
	background: var(--wp--preset--color--rise-teal);
	box-shadow: 27px 0 0 0 var(--wp--preset--color--rise-yellow);
}
h2 {
	display: flex;
	align-items: center;
	gap: 24px;
	margin-top: 1.2em !important;
	margin-bottom: 0.4em !important;
}
h2:first-child {
	margin-top: 0;
}

/* Paragrafi: spazio sotto (forzato su blocchi WP) */
p,
.wp-block-paragraph {
	margin-bottom: 0.6em !important;
}
p:last-child,
.wp-block-paragraph:last-child {
	margin-bottom: 0 !important;
}

/* Info box footer: tutto il contenuto bianco */
.kt-info-boxrise__footer_200764-4f,
.kt-info-boxrise__footer_200764-4f .kt-infobox-textcontent,
.kt-info-boxrise__footer_200764-4f .kt-infobox-textcontent .kt-blocks-info-box-text,
.kt-info-boxrise__footer_200764-4f a,
.kt-info-boxrise__footer_200764-4f p,
.kt-info-boxrise__footer_200764-4f span,
.kt-info-boxrise__footer_200764-4f h1,
.kt-info-boxrise__footer_200764-4f h2,
.kt-info-boxrise__footer_200764-4f h3,
.kt-info-boxrise__footer_200764-4f h4,
.kt-info-boxrise__footer_200764-4f * {
	color: #fff !important;
}
