/**
 * assets/css/corsi-listing.css — api-core
 *
 * Stili per api_core_render_corso_listing_item() e per le sezioni
 * [api_core_corsi_attivi] / [api_core_corsi_elearning] /
 * [api_core_corsi_non_attivi] (includes/features/shortcodes/apiform.php).
 *
 * Non ha nulla a che fare con api_core_render_card() (cards.php) né con le
 * classi .api-card* — quella card (con immagine/tag/estratto/categorie) è
 * usata altrove (es. home page) e resta invariata. Namespace CSS
 * volutamente separato (.api-corsi-listing*, non .api-card*) per evitare
 * qualunque ambiguità o collisione fra i due componenti.
 *
 * Palette confermata dall'operatore:
 *   --wp--preset--color--heading:       #004080 (blu API)   → stato "attivi"
 *   --wp--preset--color--primary:       #078484 (verde API) → stato "elearning"
 *   --wp--preset--color--neutral:       #6e7787 (grigio)     → stato "non_attivi"
 *   --wp--preset--color--current-color: #000000 (nero)       → data/location/
 *                                                                prezzo non associati
 * I fallback hardcoded qui sotto usano questi valori reali, non più stime.
 *
 * @since 2.4.11
 */

.api-corsi-listing {
	list-style: none;
	margin: 1.5rem 0;
	padding: 0;
}

.api-corsi-stato + .api-corsi-stato {
	margin-top: 2rem;
}

.api-corsi-listing__item {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.4rem 1.25rem;
	padding: 0.85rem 0;
	border-bottom: 1px solid color-mix(in srgb,var(--wp--preset--color--neutral, #6e7787) 35%,transparent);
}

.api-corsi-listing__date {
	white-space: nowrap;
}

.api-corsi-listing__location {
	white-space: nowrap;
	font-weight: 700;
}

.api-corsi-listing__title {
	flex: 1 1 240px;
}

/* ============================================ *
 * Titolo — NON in bold, sottolineato sempre
 * (non solo in hover): è l'unico segnale visivo
 * di "questo è un link" ora che non è più bold.
 * Colore di default, sovrascritto per stato sotto.
 * ============================================ */
.api-corsi-listing__title a {
	color: var(--wp--preset--color--heading, #004080);
	font-weight: 400;
	text-decoration: underline;
	transition: color 0.2s ease;
}

.api-corsi-listing__cta {
	margin-left: auto;
	background: var(--wp--preset--color--heading, #004080);
	color: var(--wp--preset--color--background, #fff);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 700;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.5rem 1.25rem;
	font-size: 1rem;
	line-height: 1;
	transition: background-color 0.2s ease, color 0.2s ease;
}
/* Hover arancione delle CTA in tutti i listing. */
.api-corsi-stato .api-corsi-listing__cta:hover,
.api-corsi-stato .api-corsi-listing__cta:focus-visible {
	background: var(--wp--preset--color--accent, #e8720c);
	color: var(--wp--preset--color--background, #fff);
	opacity: 1;
}

.api-corsi-listing__cta:hover {
	opacity: 0.85;
}

/* ── Colore per stato: titolo (testo) + CTA (sfondo bottone) ────────────── */
.api-corsi-stato--attivi .api-corsi-listing__title a {
	color: var(--wp--preset--color--heading, #004080);
}
.api-corsi-stato--attivi .api-corsi-listing__cta {
	background: var(--wp--preset--color--heading, #004080);
}

.api-corsi-stato--elearning .api-corsi-listing__title a {
	color: var(--wp--preset--color--primary, #078484);
}
.api-corsi-stato--elearning .api-corsi-listing__cta {
	background: var(--wp--preset--color--primary, #078484);
}

.api-corsi-stato--non_attivi .api-corsi-listing__title a {
	color: var(--wp--preset--color--neutral, #6e7787);
}
.api-corsi-stato--non_attivi .api-corsi-listing__cta {
	background: var(--wp--preset--color--neutral, #6e7787);
}

/* Hover arancione dei titoli in tutti gli stati. */
.api-corsi-stato .api-corsi-listing__title a:hover,
.api-corsi-stato .api-corsi-listing__title a:focus-visible {
	color: var(--wp--preset--color--accent, #e8720c);
}

/* ============================================ *
 * Data e location — nero, in bold dove il testo è
 * un'informazione "di fatto" (data del corso in
 * attivi, sede/ON-LINE in attivi ed elearning). In
 * non_attivi la location ("da definire") non è
 * bold, ma in maiuscolo — è un placeholder, non
 * un dato reale, la differenza di trattamento è
 * voluta.
 * ============================================ */
.api-corsi-stato--attivi .api-corsi-listing__date {
	font-weight: 700;
	color: var(--wp--preset--color--current-color, #000000);
}

.api-corsi-stato--attivi .api-corsi-listing__location,
.api-corsi-stato--elearning .api-corsi-listing__location {
	font-weight: 700;
	color: var(--wp--preset--color--current-color, #000000);
}

.api-corsi-stato--non_attivi .api-corsi-listing__location {
	text-transform: uppercase;
	color: var(--wp--preset--color--current-color, #000000);
}

/* ============================================ *
 * Prezzi — Associati in grassetto e colore stato,
 * Non Associati sempre nero (non dipende dallo
 * stato, richiesta esplicita "ovunque")
 * ============================================ */
.api-corsi-listing__price {
	font-size: 0.88rem;
	white-space: nowrap;
}

.api-corsi-listing__price--associati {
	font-weight: 700;
	color: var(--wp--preset--color--heading, #004080);
}

.api-corsi-listing__price--non-associati {
	font-weight: 400;
	color: var(--wp--preset--color--current-color, #000000);
}

@media only screen and (max-width: 48em) {
	.api-corsi-listing__item {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.3rem;
	}

	.api-corsi-listing__cta {
		margin-left: 0;
		margin-top: 0.4rem;
	}
}