/*
 * Navigazione lezioni LearnDash — FM Framework PULSE.
 *
 * Qui, a differenza dell'infobar, il markup resta quello di LearnDash: il
 * template `modules/course-steps.php` contiene la logica di prerequisiti,
 * gating dei quiz e video progression, e il pulsante di completamento è un
 * form con nonce. Riscriverlo rischierebbe di rompere il tracciamento dei
 * progressi, quindi questo è uno strato di stile, non una sostituzione.
 *
 * SULLA SPECIFICITÀ E SUGLI !important
 * LearnDash non colora i pulsanti dal foglio statico ma da un <style> inline
 * generato dalle sue impostazioni tema (handle `learndash-front-inline-css`),
 * con regole tipo:
 *
 *   .learndash-wrapper .ld-button:not([disabled]):not(.ld-button-reverse)
 *     :not(.ld-button-transparent):not(.ld--ignore-inline-css)
 *     { background-color: #333749 !important }
 *
 * Sono sei classi di specificità e per giunta !important. Per superarle senza
 * gonfiare i selettori all'infinito: la classe `fm-ld-chrome` sul body vale una
 * classe, la catena `.ld-content-actions .ld-content-action` altre due, e
 * `:not(.ld-button-transparent)` la sesta — quest'ultima anche semanticamente
 * giusta, visto che i pulsanti trasparenti sono quelli della modalità focus e
 * non vanno toccati. Gli !important restano solo su `background-color` e
 * `color`, cioè le uniche proprietà su cui LearnDash li usa: forma e tipografia
 * passano senza.
 *
 * Alternativa più pulita, se un domani si vuole ridurre questo strato: portare
 * i colori tema di LearnDash sulla palette ONLINE dalle sue impostazioni. A
 * quel punto il CSS inline dipingerebbe già i colori giusti da solo.
 *
 *   Accento ONLINE            #885FC9  --e-global-color-0ed7c7a
 *   Fondo Riquadro ONLINE+    #BDA2C5  --e-global-color-b0c5a7a
 *   Pulsanti SHOP Hover       #F8ED07  --e-global-color-163f986
 *   Testo Pulsanti SHOP Hover #2E2E2E  --e-global-color-96dc944
 */

.fm-ld-chrome .learndash-wrapper .ld-content-actions {
	--fmldch-accent: var(--e-global-color-0ed7c7a, #885fc9);
	--fmldch-soft: var(--e-global-color-b0c5a7a, #bda2c5);
	--fmldch-on-accent: var(--e-global-color-fb91e95, #fff);
	--fmldch-on-soft: var(--e-global-color-96dc944, #2e2e2e);
	--fmldch-hover-bg: var(--e-global-color-163f986, #f8ed07);
	--fmldch-hover-ink: var(--e-global-color-96dc944, #2e2e2e);

	align-items: flex-start;
	column-gap: 16px;
	row-gap: 16px;
}

/*
 * Le tre colonne partono dall'alto, non dal centro: la colonna centrale è più
 * alta perché sotto al pulsante ospita anche "Lezioni del Corso", e con
 * l'allineamento centrato il suo pulsante risultava più su degli altri due.
 * Così i tre pulsanti condividono lo stesso bordo superiore e il link resta
 * appeso sotto.
 */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action .sfwd-mark-complete {
	margin: 0;
}

/* Forma e tipografia comuni: squadrati, maiuscoli, in risalto. Niente
   !important, qui LearnDash non ne usa. */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent),
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action .sfwd-mark-complete input.learndash_mark_complete_button {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	font-family: var(--e-global-typography-text-font-family, "Montserrat"), sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.2;
	padding: 13px 22px;
	text-shadow: none;
	text-transform: uppercase;
	transition: background-color 0.18s ease, color 0.18s ease;
}

/* Precedente e successiva: azioni secondarie, quindi tinta tenue. */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent) {
	background-color: var(--fmldch-soft) !important;
	color: var(--fmldch-on-soft) !important;
}

/* Segna come completato: è l'azione principale, quindi pieno. */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action .sfwd-mark-complete input.learndash_mark_complete_button {
	background-color: var(--fmldch-accent) !important;
	color: var(--fmldch-on-accent) !important;
	cursor: pointer;
}

/* L'hover usa la coppia dedicata dei Colori globali, non tinte inventate. */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent):hover,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent):focus-visible,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action .sfwd-mark-complete input.learndash_mark_complete_button:hover,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action .sfwd-mark-complete input.learndash_mark_complete_button:focus-visible {
	background-color: var(--fmldch-hover-bg) !important;
	color: var(--fmldch-hover-ink) !important;
}

/* L'icona segue sempre il colore del testo del pulsante, anche in hover. */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button .ld-icon,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button .ld-icon::before {
	color: inherit !important;
}

.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent):hover .ld-icon,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent):hover .ld-icon::before,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent):focus-visible .ld-icon,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent):focus-visible .ld-icon::before {
	color: var(--fmldch-hover-ink) !important;
}

/*
 * "Lezioni del Corso" resta un link e non diventa un pulsante: è un'azione di
 * terzo livello, e trasformarla in bottone metterebbe tre pulsanti alla pari.
 */
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-course-step-back.ld-primary-color {
	color: var(--fmldch-accent) !important;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-decoration: underline;
	text-transform: uppercase;
	text-underline-offset: 0.25em;
}

.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-course-step-back.ld-primary-color:hover,
.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-course-step-back.ld-primary-color:focus-visible {
	color: var(--fmldch-on-soft) !important;
}

@media (max-width: 600px) {
	.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action a.ld-button:not(.ld-button-transparent),
	.fm-ld-chrome .learndash-wrapper .ld-content-actions .ld-content-action .sfwd-mark-complete input.learndash_mark_complete_button {
		font-size: 11px;
		padding: 12px 16px;
	}
}