/* ==========================================================================
   Il «Call to action» (componente `bs5-common-cta-box`, A-29 riga 19): la
   variante «Predefinito» e la larghezza a tutta pagina. Gloria, 21-10-2026:
   «si, va bene la veste come per l'hero».

   Senza una veste del tema, «Predefinito» non è «Chiara» (Gloria, lo stesso
   giorno: «ma fare una piccola differneza fra le due?», poi «si, va bene»): lo
   sfondo è il primario del sito schiarito al 10% su bianco e il titolo è nel
   primario, così segue i colori scelti per ogni sito. ⚠️ Con un primario chiaro
   il titolo può non arrivare al contrasto WCAG: l'aiuto del pannello lo dice.

   ⛔ Lo stile di base sta qui, nel plugin, come quello della fascia hero
   (`acme_hero.css`): deve valere sia su BsItalia sia su Canvas. Senza variabili
   la variante «Predefinito» prende il primario del sito; un tema o un figlio la veste con
   le variabili `--acme-cta-*` (lympha: `LymphaTech/webroot/css/lympha-brand.css`).
   I colori scritti a mano nel componente arrivano nello `style` in linea e
   vincono su tutto.

   Va caricato in DUE posti: sul sito (`ItemsPluginEvent::getCss()`) e nel
   canvas (lo aggiunge il componente, `cta_box.js`).
   ========================================================================== */

.bs5-common-cta--theme {
    background: var(--acme-cta-theme-bg, color-mix(in srgb, var(--bs-primary, #0066cc) 10%, #fff));
    color: var(--acme-cta-theme-color, inherit);
}

/* Il titolo e il suo link: il colore della veste, se il tema ne dà una; altrimenti il primario del sito. */
.bs5-common-cta--theme .bs5-common-cta__title,
.bs5-common-cta--theme .bs5-common-cta__title-link {
    color: var(--acme-cta-theme-title-color, var(--bs-primary, #0066cc));
}

/* A tutta pagina: lo sfondo occupa tutto lo spazio in cui è posato, il contenuto
   sta nel `container` del sito. Il `p-4` del riquadro normale qui toglierebbe il
   contenuto dall'allineamento con la pagina, quindi resta solo lo spazio verticale. */
.bs5-common-cta--full {
    padding-inline: 0 !important;
    border-radius: 0;
}
