/**
 * assets/css/corso-single.css — api-core
 *
 * Stili per i 5 shortcode della scheda del singolo corso
 * (includes/features/shortcodes/course-single.php):
 *   [api_core_corso_info] [api_core_corso_programma]
 *   [api_core_corso_aggiornamenti] [api_core_corso_faq] [api_core_corso_tags]
 *
 * Caricato SOLO sui singoli dei CPT corso (cpt_courses da site-config.php),
 * mai globalmente — vedi enqueue condizionale in course-single.php.
 *
 * Namespace .api-core-corso-* — non condivide nulla con .api-corsi-listing*
 * (corsi-listing.css, pagine hub categoria) né con .api-card* (cards.php).
 *
 * Rivisto in 2.4.18 (seconda revisione tecnica su confronto produzione):
 *   - Colonne esplicite (markup, non più column-count CSS) — vedi
 *     api_core_corso_single_render_colonna() nel PHP.
 *   - Margine SOLO in basso tra sezioni (0 in alto) — isola il gap
 *     eventualmente residuo come responsabilità del Site Editor (blockGap
 *     tra blocchi), non più confuso con il margine di questo componente.
 *   - CTA con fallback colore esplicito + comportamento mobile dedicato.
 *   - Stile per il nuovo [api_core_corso_tags].
 *
 * @since 2.4.13
 */

.api-core-corso-info,
.api-core-corso-programma,
.api-core-corso-aggiornamenti,
.api-core-corso-faq,
.api-core-corso-tags {
	/* Margine SOLO in basso (spazio prima del blocco successivo, di cui
	   questo componente è responsabile). Nessun margine in alto: un
	   eventuale spazio ancora presente SOPRA una sezione viene quindi dal
	   Site Editor (blockGap del Gruppo/tema), non da questo CSS — più
	   facile da individuare e correggere lì, invece di comprimere il
	   ritmo verticale di tutte le sezioni allo stesso modo. */
	margin: 0 0 1.5rem;
}

.api-core-corso-programma__title,
.api-core-corso-aggiornamenti__title,
.api-core-corso-faq__title,
.api-core-corso-tags__title {
	margin: 0 0 0.75rem;
}

/* ── Riga titolo + CTA — affiancati, CTA in alto a destra su desktop ── */
.api-core-corso-info__heading-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1rem;
	margin-bottom: 1rem;
}

.api-core-corso-info__title {
	margin: 0;
}

/* Elenchi informativi. */
.api-core-corso-info__list {
	margin: 0;
}

/* Box Destinatari e box delle due colonne. */
.api-core-corso-info__list--full,
.api-core-corso-info__col {
	padding: 1.1rem 1.35rem;
	border: 2px solid var(--wp--preset--color--quaternary, #d7dade);
	border-radius: 8px;
	background: var(--wp--preset--color--background, #fff);
}

.api-core-corso-info__list--full {
	margin-bottom: 1.25rem;
}

/* Colonne esplicite. */
.api-core-corso-info__columns {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 1.5rem 2.5rem;
}

.api-core-corso-info__col {
	min-width: 0;
}

/* Se esiste un solo gruppo, occupa tutta la larghezza. */
.api-core-corso-info__columns > .api-core-corso-info__col:only-child {
	grid-column: 1 / -1;
}

/* Titoli principali dei tre gruppi informativi. */
.api-core-corso-info__list--full > .api-core-corso-info__row > dt,
.api-core-corso-info__col-label,
.api-core-corso-tags__title {
	margin: 0 0 0.75rem;
	color: var(--wp--preset--color--primary, #078484);
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: uppercase;
}

.api-core-corso-info__row {
	margin-bottom: 1rem;
}

.api-core-corso-info__row:last-child {
	margin-bottom: 0;
}

.api-core-corso-info__row dt {
	margin-bottom: 0.15rem;
	color: var(--wp--preset--color--heading, #004080);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.api-core-corso-info__row dd {
	margin: 0;
}

@media only screen and (max-width: 48em) {
	/* Una sola colonna su mobile, stesso ordine del markup (Quando e dove
	   sopra, Costi e partecipazione sotto) — l'ordine è già quello giusto
	   nel DOM, qui serve solo impilare invece di affiancare. */
	.api-core-corso-info__columns {
		grid-template-columns: 1fr;
	}

	/* CTA sotto il titolo, larga quanto il contenitore. */
	.api-core-corso-info__heading-row {
		flex-direction: column;
		align-items: stretch;
	}

	.api-core-corso-info__cta {
		width: 100%;
		text-align: center;
	}
}

/* ── Disponibilità — il colore è un rinforzo, il testo "Sì"/"No" comunica ── */
/* già da solo lo stato: non ci si affida al solo colore (WCAG 1.4.1).      */
.api-core-corso-info__disponibilita {
	font-weight: 700;
}

.api-core-corso-info__disponibilita--si {
	color: var(--wp--preset--color--primary, #078484);
}

.api-core-corso-info__disponibilita--no {
	color: var(--wp--preset--color--neutral, #6e7787);
}

.api-core-corso-info__attachment {
	display: inline-block;
}

/* ── CTA iscrizione ── */
/* Colore di sfondo esplicito su richiesta (var secondary del tema). */
/* Fallback aggiunto (segnalato): senza, un tema senza quel token lascerebbe */
/* il bottone trasparente. #004080 = stesso blu già usato come fallback     */
/* altrove in questo file (--heading) — solo una rete di sicurezza, da      */
/* sostituire con l'esadecimale reale del token secondary quando noto.      */
.api-core-corso-info__cta {
	display: inline-block;
	flex: 0 0 auto;
	background: var(--wp--preset--color--secondary, #004080);
}

.api-core-corso-info__cta:focus-visible {
	outline: 3px solid currentColor;
	outline-offset: 3px;
}

/* ── Sezioni WYSIWYG (programma / aggiornamenti / faq) ── */
.api-core-corso-programma__content ul,
.api-core-corso-programma__content ol,
.api-core-corso-aggiornamenti__content ul,
.api-core-corso-aggiornamenti__content ol,
.api-core-corso-faq__content ul,
.api-core-corso-faq__content ol {
	padding-left: 1.5rem;
}

.api-core-corso-programma__content ul ul,
.api-core-corso-programma__content ol ol,
.api-core-corso-aggiornamenti__content ul ul,
.api-core-corso-faq__content ul ul {
	margin-top: 0.35rem;
}

/* ── [api_core_corso_tags] — NUOVO 2.4.18 ── */
.api-core-corso-tags {
	padding-top: 1.5rem;
	border-top: 1px solid var(--wp--preset--color--quaternary, #d7dade);
}
.api-core-corso-tags__list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.api-core-corso-tags__list li {
	margin: 0;
}

.api-core-corso-tags__list a {
	display: inline-block;
	padding: 0.25rem 0.75rem;
	border-radius: 999px;
	background: var(--wp--preset--color--quaternary, #eef0f2);
	color: var(--wp--preset--color--heading, #004080);
	text-decoration: none;
}

.api-core-corso-tags__list a:hover,
.api-core-corso-tags__list a:focus-visible {
	text-decoration: underline;
}
/* Titoli di sezione uniformati senza dipendere dai template. La classe comune
 * è aggiunta automaticamente dal renderer PHP; gli heading nel contenuto del
 * programma coprono anche Condizioni e Attestato. */
.api-core-corso-section-title,
.api-core-corso-programma__content h2,
.api-core-corso-programma__content h3,
.api-core-corso-programma__content h4,
.api-core-corso-programma__content h5,
.api-core-corso-programma__content h6 {
	font-size: clamp(1.5rem, 2.2vw, 1.75rem) !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
}
