/* ai-paywall — la frase e il link che compaiono quando una quota AI finisce (passo 5 del piano
   pagamenti, 21 set 2026).
   Conventions: docs/css-conventions.md — prefisso .mnv-paywall-, token locali con fallback
   (palette v2: deep ocean / greek blue / white sand / sunny gold), mobile-first, no !important.

   Deliberatamente sobrio. Questo blocco compare in un momento in cui l'utente voleva fare una
   cosa e non ci è riuscito: un riquadro colorato e squillante lì dentro sembra un cartellone
   pubblicitario piazzato sopra un errore. Un filo d'oro a sinistra e un link basta e avanza. */

.mnv-paywall {
    --mnvp-ink: var(--menevo-ink, #0C1520);          /* deep ocean */
    --mnvp-blue: var(--menevo-structure, #243B5E);   /* greek blue */
    --mnvp-gold: var(--menevo-accent, #EFD06A);      /* sunny gold */
    --mnvp-muted: var(--menevo-muted, #94A9CB);      /* cold sugar */
    display: block;
    margin-top: 0.5rem;
    padding-left: 0.625rem;
    border-left: 2px solid var(--mnvp-gold);
    font-family: inherit;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--mnvp-ink);
}

.mnv-paywall-text { color: var(--mnvp-muted); }

.mnv-paywall-link {
    color: var(--mnvp-blue);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
    /* L'area cliccabile arriva ai 44 px consigliati senza allargare la riga di testo: il
       riempimento verticale è negativo in margine, così la frase non si stacca dal messaggio. */
    display: inline-block;
    padding: 0.3125rem 0;
    margin: -0.3125rem 0;
}

.mnv-paywall-link:hover,
.mnv-paywall-link:focus-visible { color: var(--mnvp-ink); }

.mnv-paywall-link:focus-visible {
    outline: 2px solid var(--mnvp-gold);
    outline-offset: 2px;
    border-radius: 2px;
}

@media (prefers-reduced-motion: no-preference) {
    .mnv-paywall-link { transition: color 0.15s ease; }
}