/* Shared core block presentation.
 *
 * These rules intentionally avoid template-specific wrappers so the same visual
 * language appears on the front end, in the post editor, and in the Style Book.
 * Layout widths and scenic pattern geometry remain in block-layout.css/editor.css.
 */

:where(.wp-block-heading) {
	text-wrap: balance;
}

:where(.wp-block-heading + p) {
	margin-block-start: 0.75rem;
}

:where(p.has-background) {
	padding: clamp(1.15rem, 2vw, 1.6rem) clamp(1.25rem, 3vw, 2rem);
}

:where(.has-background) {
	border-radius: 0;
}

:where(.wp-block-quote) {
	margin-inline: 0;
	padding: clamp(1.4rem, 3vw, 2.25rem);
	border: 0;
	border-left: 0.2rem solid var(--sc-color-accent);
	background: color-mix(in srgb, var(--sc-color-surface) 88%, var(--sc-color-background));
}

/* Un blocco che si dipinge uno sfondo chiaro deve dichiarare anche il proprio
   colore di testo. Senza, dentro una fascia colorata eredita il colore della
   fascia: una citazione dentro una sezione accent diventa bianco su bianco, e
   lo stesso vale per tabelle, dettagli, codice e schede dei commenti. Sta in
   :where() perche' resti un default: qualsiasi classe di colore lo scavalca. */
.entry__content :where(.wp-block-quote:not(.is-style-sc-plain), .wp-block-pullquote, .wp-block-details, .wp-block-code, .wp-block-preformatted, .wp-block-verse, .wp-block-file, .wp-block-table, .wp-block-calendar, .wp-block-comment-template .comment):not(.has-text-color),
.editor-styles-wrapper :where(.wp-block-quote:not(.is-style-sc-plain), .wp-block-pullquote, .wp-block-details, .wp-block-code, .wp-block-preformatted, .wp-block-verse, .wp-block-file, .wp-block-table, .wp-block-calendar, .wp-block-comment-template .comment):not(.has-text-color) {
	color: var(--sc-color-text);
}

/* Citazione essenziale: niente riquadro ne' filetto, il carattere dei titoli in
   corsivo e un corpo piu' grande. E' il registro giusto quando la citazione e'
   gia' dentro una fascia colorata, dove il riquadro chiaro spezzerebbe la
   campitura invece di staccare il testo. */
.entry__content :where(.wp-block-quote.is-style-sc-plain),
.editor-styles-wrapper :where(.wp-block-quote.is-style-sc-plain) {
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font-family: var(--sc-font-heading);
	font-size: clamp(1.15rem, 3vw, 1.5rem);
	font-style: italic;
	line-height: 1.4;
}

.entry__content :where(.wp-block-quote.is-style-sc-plain) p,
.editor-styles-wrapper :where(.wp-block-quote.is-style-sc-plain) p {
	font-size: inherit;
}

/* Elenco con filetti: al posto dei punti elenco una riga sottile sotto ogni
   voce, ricavata dal colore del testo corrente. Cosi' funziona sia su carta
   sia dentro una fascia colorata, senza doverne dichiarare due versioni. */
.entry__content :where(.wp-block-list.is-style-sc-ruled),
.editor-styles-wrapper :where(.wp-block-list.is-style-sc-ruled) {
	padding-left: 0;
	list-style: none;
}

.entry__content :where(.wp-block-list.is-style-sc-ruled) > li,
.editor-styles-wrapper :where(.wp-block-list.is-style-sc-ruled) > li {
	padding-block: 0.55rem;
	border-bottom: 1px solid currentColor;
	border-color: color-mix(in srgb, currentColor 28%, transparent);
}

:where(.wp-block-quote.has-text-align-center) {
	border-left: 0;
	border-top: 0.2rem solid var(--sc-color-accent);
}

:where(.wp-block-quote.has-text-align-right) {
	border-left: 0;
	border-right: 0.2rem solid var(--sc-color-accent);
}

:where(.wp-block-quote p) {
	font-family: var(--sc-font-heading);
	font-size: clamp(1.25rem, 2.5vw, 1.75rem);
	line-height: 1.35;
}

:where(.wp-block-quote cite, .wp-block-pullquote cite) {
	color: var(--sc-color-muted);
	font-family: var(--sc-font-ui);
	font-size: 0.875rem;
	font-style: normal;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

:where(.wp-block-pullquote) {
	padding-block: clamp(2rem, 5vw, 4rem);
	border-block: 1px solid color-mix(in srgb, var(--sc-color-border) 72%, transparent);
	text-align: left;
}

:where(.wp-block-pullquote blockquote) {
	margin: 0;
}

:where(.wp-block-pullquote p) {
	font-family: var(--sc-font-heading);
	font-size: clamp(1.75rem, 4vw, 3.5rem);
	line-height: 1.1;
	text-wrap: balance;
}

:where(.wp-block-list) {
	padding-inline-start: 1.35em;
}

:where(.wp-block-list li) {
	padding-inline-start: 0.35em;
}

:where(.wp-block-list li + li) {
	margin-block-start: 0.45em;
}

:where(.wp-block-list li::marker) {
	color: var(--sc-color-accent);
}

:where(.wp-block-button__link, .wp-element-button, .wp-block-search__button, input[type="submit"], button[type="submit"]) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.8rem;
	margin: 0;
	padding: 0.78rem 1.45rem;
	border: 1px solid transparent;
	border-radius: var(--sc-button-radius, 999px);
	background: var(--sc-color-accent);
	color: var(--sc-color-on-accent, #fff);
	font-family: var(--sc-font-ui);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: var(--sc-button-tracking, 0.025em);
	line-height: 1.2;
	text-decoration: none;
	text-transform: var(--sc-button-case, none);
	transition: filter 160ms ease, transform 160ms ease, background-color 160ms ease, color 160ms ease;
}

:where(.wp-block-button__link, .wp-element-button, .wp-block-search__button, input[type="submit"], button[type="submit"]):hover {
	color: var(--sc-color-on-accent, #fff);
	filter: brightness(0.92);
	transform: translateY(-1px);
}

:where(.wp-block-button__link, .wp-element-button, .wp-block-search__button, input[type="submit"], button[type="submit"]):focus-visible {
	outline: 2px solid var(--sc-color-accent);
	outline-offset: 0.25rem;
}

:where(.wp-block-buttons) {
	gap: 0.75rem;
}

:where(.wp-block-button.is-style-outline .wp-block-button__link) {
	border-color: currentColor;
	background: transparent;
	color: var(--sc-color-text);
	border-color: var(--sc-button-outline-ink, currentColor);
	color: var(--sc-button-outline-ink, currentColor);
}

:where(.wp-block-button.is-style-outline .wp-block-button__link):hover {
	background: var(--sc-color-text);
	color: var(--sc-color-background);
	filter: none;
}

:where(.wp-block-separator) {
	width: min(4.75rem, 100%);
	height: 1px;
	margin-inline: auto;
	border: 0;
	background: color-mix(in srgb, var(--sc-color-accent) 62%, transparent);
	opacity: 1;
}

:where(.wp-block-separator.is-style-wide) {
	width: 100%;
	background: color-mix(in srgb, var(--sc-color-border) 80%, transparent);
}

:where(.wp-block-separator.is-style-dots) {
	height: auto;
	background: none;
	color: var(--sc-color-accent);
}

:where(.wp-block-table) {
	overflow-x: auto;
}

:where(.wp-block-table table, .wp-block-calendar table) {
	width: 100%;
	border-collapse: collapse;
}

:where(.wp-block-table th, .wp-block-table td, .wp-block-calendar th, .wp-block-calendar td) {
	padding: 0.9rem 1rem;
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 82%, transparent);
	text-align: left;
	vertical-align: top;
}

:where(.wp-block-table th, .wp-block-calendar th) {
	background: color-mix(in srgb, var(--sc-color-surface) 90%, var(--sc-color-background));
	font-family: var(--sc-font-ui);
	font-size: 0.78rem;
	letter-spacing: 0.055em;
	text-transform: uppercase;
}

:where(.wp-block-table tbody tr:hover) {
	background: color-mix(in srgb, var(--sc-color-muted) 7%, transparent);
}

:where(.wp-block-table.is-style-stripes tbody tr:nth-child(odd)) {
	background: color-mix(in srgb, var(--sc-color-muted) 8%, transparent);
}

:where(.wp-block-table figcaption, .wp-block-image figcaption, .wp-block-gallery figcaption, .wp-block-video figcaption, .wp-block-audio figcaption, .wp-block-embed figcaption) {
	margin-block-start: 0.65rem;
	color: var(--sc-color-muted);
	font-family: var(--sc-font-ui);
	font-size: 0.875rem;
	line-height: 1.45;
	text-align: left;
}

:where(.wp-block-details) {
	padding: clamp(1.15rem, 2.5vw, 1.75rem) clamp(1.25rem, 3vw, 2rem);
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 76%, transparent);
	background: color-mix(in srgb, var(--sc-color-surface) 86%, var(--sc-color-background));
}

:where(.wp-block-details summary) {
	cursor: pointer;
	font-family: var(--sc-font-ui);
	font-weight: 700;
}

:where(.wp-block-details summary:focus-visible) {
	outline: 2px solid var(--sc-color-accent);
	outline-offset: 0.35rem;
}

:where(.wp-block-details[open] summary) {
	margin-bottom: 1rem;
}

:where(.wp-block-details > :last-child) {
	margin-bottom: 0;
}

:where(.wp-block-code, .wp-block-preformatted, .wp-block-verse) {
	padding: clamp(1.15rem, 3vw, 2rem);
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 76%, transparent);
	background: color-mix(in srgb, var(--sc-color-surface) 88%, var(--sc-color-background));
	overflow-x: auto;
}

:where(.wp-block-code code, .wp-block-preformatted) {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 0.9em;
	line-height: 1.65;
}

:where(.wp-block-verse) {
	font-family: var(--sc-font-heading);
	font-size: 1.15em;
	line-height: 1.7;
}

:where(.wp-block-image, .wp-block-gallery, .wp-block-video, .wp-block-audio, .wp-block-embed) {
	margin-block: 0;
}

:where(.wp-block-image img, .wp-block-gallery img, .wp-block-video video, .wp-block-cover, .wp-block-media-text__media img, .wp-block-media-text__media video) {
	display: block;
}

:where(.wp-block-gallery) {
	gap: clamp(0.5rem, 1vw, 1rem);
}

:where(.wp-block-image img, .wp-block-gallery img, .wp-block-video video) {
	background: var(--sc-color-surface);
}

/* Image optimizer plugins (WebP delivery) wrap gallery images in <picture>,
 * which core's cropped-gallery CSS does not know about: its flex chain
 * expects figure > a > img, so the intermediate wrapper collapses the
 * img's height:100% and every tile keeps its natural ratio. Stretch the
 * wrapper so the Crop option keeps producing equal tiles. Real selectors
 * on purpose: this must outrank core's height:auto on gallery images.
 */
.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image > picture,
.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image > a > picture {
	display: flex;
	flex: 1 0 0%;
	width: 100%;
	height: 100%;
}

.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image picture img {
	flex: 1 0 0%;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

:where(.wp-block-cover) {
	overflow: hidden;
}

:where(.wp-block-cover__inner-container > :first-child) {
	margin-block-start: 0;
}

:where(.wp-block-cover__inner-container > :last-child) {
	margin-block-end: 0;
}

:where(.wp-block-media-text) {
	gap: clamp(1.5rem, 4vw, 4rem);
}

:where(.wp-block-media-text .wp-block-media-text__content) {
	padding: clamp(1rem, 3vw, 2.5rem);
}

:where(.wp-block-file) {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem 1rem;
	align-items: center;
	padding: clamp(1.1rem, 2.5vw, 1.6rem) clamp(1.25rem, 3vw, 2rem);
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 76%, transparent);
	background: color-mix(in srgb, var(--sc-color-surface) 86%, var(--sc-color-background));
}

:where(.wp-block-file__button) {
	margin: 0;
}

:where(.wp-block-search__inside-wrapper) {
	display: flex;
	gap: 0.65rem;
}

:where(input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], textarea, select, .wp-block-search__input, .wp-block-search__button-inside .wp-block-search__inside-wrapper) {
	min-height: 2.8rem;
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 86%, transparent);
	border-radius: 0;
	background: var(--sc-color-surface);
	color: var(--sc-color-text);
}

:where(input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], select, .wp-block-search__input) {
	width: 100%;
	padding: 0.7rem 0.9rem;
	font-family: var(--sc-font-ui);
}

:where(textarea) {
	width: 100%;
	min-height: 10rem;
	padding: 0.9rem;
	font-family: var(--sc-font-ui);
	line-height: 1.55;
}

:where(.wp-block-search__button-inside .wp-block-search__input) {
	border: 0;
	background: transparent;
}

:where(input:focus, textarea:focus, select:focus, .wp-block-search__input:focus) {
	outline: 2px solid var(--sc-color-accent);
	outline-offset: 1px;
}

:where(label, .wp-block-post-comments-form label) {
	font-family: var(--sc-font-ui);
	font-size: 0.9rem;
	font-weight: 700;
}

:where(.comment-form) {
	display: grid;
	gap: 1rem;
}

:where(.comment-form p) {
	margin: 0;
}

:where(.comment-form-cookies-consent) {
	display: flex;
	gap: 0.65rem;
	align-items: flex-start;
}

:where(.comment-form-cookies-consent input) {
	margin-top: 0.35em;
}

:where(.wp-block-archives, .wp-block-categories, .wp-block-latest-posts, .wp-block-latest-comments, .wp-block-rss, .wp-block-page-list) {
	margin: 0;
	padding: 0;
	list-style: none;
}

:where(.wp-block-archives li, .wp-block-categories li, .wp-block-latest-posts li, .wp-block-latest-comments li, .wp-block-rss li, .wp-block-page-list li) {
	padding-block: 0.75rem;
	border-bottom: 1px solid color-mix(in srgb, var(--sc-color-border) 78%, transparent);
}

:where(.wp-block-archives li:first-child, .wp-block-categories li:first-child, .wp-block-latest-posts li:first-child, .wp-block-latest-comments li:first-child, .wp-block-rss li:first-child, .wp-block-page-list li:first-child) {
	border-top: 1px solid color-mix(in srgb, var(--sc-color-border) 78%, transparent);
}

:where(.wp-block-archives a, .wp-block-categories a, .wp-block-latest-posts a, .wp-block-latest-comments a, .wp-block-rss a, .wp-block-page-list a) {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

:where(.wp-block-latest-posts__post-date, .wp-block-latest-comments__comment-date, .wp-block-rss__item-publish-date, .wp-block-rss__item-author) {
	display: block;
	margin-top: 0.25rem;
	color: var(--sc-color-muted);
	font-family: var(--sc-font-ui);
	font-size: 0.8rem;
}

:where(.wp-block-latest-posts__featured-image) {
	margin-bottom: 0.75rem;
}

:where(.wp-block-latest-posts__featured-image img) {
	display: block;
	width: 100%;
	height: auto;
}

:where(.wp-block-tag-cloud) {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

:where(.wp-block-tag-cloud a) {
	padding: 0.38rem 0.75rem;
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 82%, transparent);
	border-radius: 999px;
	font-family: var(--sc-font-ui);
	font-size: 0.8rem !important;
	text-decoration: none;
}

:where(.wp-block-tag-cloud a:hover, .wp-block-tag-cloud a:focus-visible) {
	background: var(--sc-color-accent);
	color: var(--sc-color-on-accent);
}

:where(.wp-block-calendar) {
	font-family: var(--sc-font-ui);
}

:where(.wp-block-calendar caption) {
	margin-bottom: 1rem;
	font-family: var(--sc-font-heading);
	font-size: clamp(1.25rem, 2vw, 1.65rem);
	text-align: left;
}

:where(.wp-block-calendar table) {
	background: var(--sc-color-surface);
}

:where(.wp-block-calendar th, .wp-block-calendar td) {
	text-align: center;
	vertical-align: middle;
}

:where(.wp-block-calendar tbody a) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	min-height: 2rem;
	background: var(--sc-color-accent);
	color: var(--sc-color-on-accent);
	text-decoration: none;
}

:where(.wp-block-calendar .wp-calendar-nav) {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 0.9rem;
	font-family: var(--sc-font-ui);
	font-size: 0.875rem;
}

:where(.wp-block-social-links) {
	gap: 0.65rem;
}

:where(.wp-block-social-links:not(.is-style-logos-only) .wp-social-link) {
	background: var(--sc-color-accent);
	color: var(--sc-color-on-accent, #fff);
}

:where(.wp-block-social-links.is-style-logos-only .wp-social-link) {
	color: var(--sc-color-accent);
}

:where(.wp-block-query .wp-block-post-template) {
	gap: clamp(1rem, 2.2vw, 1.75rem);
}

:where(.wp-block-query .wp-block-post) {
	min-width: 0;
}

:where(.wp-block-query .wp-block-post > .wp-block-group, .wp-block-query .wp-block-post:not(:has(> .wp-block-group))) {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: clamp(1.15rem, 2.4vw, 1.75rem);
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 74%, transparent);
	background: color-mix(in srgb, var(--sc-color-surface) 92%, var(--sc-color-background));
}

:where(.wp-block-query .wp-block-post-featured-image) {
	margin: calc(clamp(1.15rem, 2.4vw, 1.75rem) * -1) calc(clamp(1.15rem, 2.4vw, 1.75rem) * -1) 1.1rem;
}

:where(.wp-block-query .wp-block-post-featured-image img) {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	height: auto;
	object-fit: cover;
}

:where(.wp-block-post-title) {
	text-wrap: balance;
}

:where(.wp-block-query .wp-block-post-title) {
	margin-block-end: 0.45rem;
}

:where(.wp-block-post-date, .wp-block-post-author, .wp-block-post-terms, .wp-block-post-excerpt__more-text) {
	font-family: var(--sc-font-ui);
	font-size: 0.875rem;
}

:where(.wp-block-post-date, .wp-block-post-author) {
	color: var(--sc-color-muted);
}

:where(.wp-block-post-excerpt) {
	margin-block-start: 0.85rem;
}

:where(.wp-block-post-excerpt__more-text) {
	margin-block-start: auto;
	padding-top: 0.75rem;
}

:where(.wp-block-post-excerpt__more-link) {
	font-family: var(--sc-font-ui);
	font-weight: 700;
}

:where(.wp-block-pagination) {
	gap: 0.5rem;
	font-family: var(--sc-font-ui);
}

:where(.wp-block-pagination a, .wp-block-pagination .page-numbers) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	min-height: 2.5rem;
	padding-inline: 0.75rem;
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 80%, transparent);
	text-decoration: none;
}

:where(.wp-block-pagination .current) {
	background: var(--sc-color-accent);
	color: var(--sc-color-on-accent);
}

:where(.wp-block-post-comments-form, .wp-block-comments, .wp-block-comment-template) {
	font-family: var(--sc-font-body);
}

:where(.wp-block-comment-template) {
	display: grid;
	gap: 1rem;
	padding: 0;
	list-style: none;
}

:where(.wp-block-comment-template .comment) {
	padding: 1rem 1.25rem;
	border: 1px solid color-mix(in srgb, var(--sc-color-border) 76%, transparent);
	background: color-mix(in srgb, var(--sc-color-surface) 88%, var(--sc-color-background));
}

:where(.wp-block-accordion) {
	display: grid;
	gap: 0;
	border-top: 1px solid color-mix(in srgb, var(--sc-color-border) 78%, transparent);
}

:where(.wp-block-accordion-item) {
	border-bottom: 1px solid color-mix(in srgb, var(--sc-color-border) 78%, transparent);
}

:where(.wp-block-accordion-heading) {
	margin: 0;
	font-family: var(--sc-font-heading);
	font-size: clamp(1.25rem, 2vw, 1.6rem);
}

:where(.wp-block-accordion-heading__toggle) {
	padding-block: 1rem;
}

:where(.wp-block-accordion-panel) {
	padding-bottom: 1.25rem;
}

@media (max-width: 600px) {
	:where(.wp-block-search__inside-wrapper) {
		align-items: stretch;
		flex-direction: column;
	}

	:where(.wp-block-search__button) {
		width: 100%;
	}

	:where(.wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content) {
		padding-inline: 0;
	}
}
