/* Invito registrazione (CTA). Scoped sotto .aa-reg-cta. Card chiara, adattiva allo
   spazio del contenitore (sidebar stretta -> 1 colonna; aa-hero largo -> piu colonne).
   Struttura a 2 fasce: ruoli sopra, titolo + consenso (flag obbligatoria) sotto. */
.aa-reg-cta {
    box-sizing: border-box;
    width: 100%;
    /* In sidebar (province) riempie la colonna stretta; sulla scheda studio
       (posizione a tutta larghezza) resta contenuta e centrata. */
    max-width: 680px;
    margin: 0 auto;
    /* Altezza minima riservata: il layout a 2 fasce resta stabile dal primo
       paint ed evita lo spostamento dell'hero sottostante (CLS). */
    min-height: 116px;
    padding: 11px 13px;
    background: #ffffff;
    border: 1px solid #e6e8ec;
    border-top: 3px solid #fbc02d;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
    font-family: Arial, Helvetica, sans-serif;
    text-align: left;
    color: #0d2146;
}

.aa-reg-cta *,
.aa-reg-cta *::before,
.aa-reg-cta *::after {
    box-sizing: border-box;
}

/* Stato "appuntato" in alto durante lo scroll (gestito via JS, solo desktop). */
.aa-reg-cta--pinned {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.24);
}

/* Fascia 1: ruoli. flex-wrap + base per colonna = colonne in base allo spazio. */
.aa-reg-cta__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: stretch;
}

.aa-reg-cta__item {
    flex: 1 1 200px;
    min-width: 0;
    display: flex;
}

.aa-reg-cta__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 7px;
    width: 100%;
    padding: 6px 8px;
    border: 1px solid #e6e8ec;
    border-radius: 9px;
    background: #f8f9fb;
    text-decoration: none;
    color: #0d2146;
    transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
}

.aa-reg-cta__row:hover,
.aa-reg-cta__row:focus-visible {
    background: #fffaf0;
    border-color: #fbc02d;
    text-decoration: none;
    color: #0d2146;
    transform: translateY(-1px);
}

.aa-reg-cta__row--off {
    opacity: 0.5;
    cursor: not-allowed;
}

.aa-reg-cta__row--off:hover {
    transform: none;
    background: #f8f9fb;
    border-color: #e6e8ec;
}

.aa-reg-cta__text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.aa-reg-cta__label {
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.15;
    color: #0d2146;
}

.aa-reg-cta__hint {
    font-size: 0.63rem;
    font-weight: 400;
    line-height: 1.2;
    color: #6c757d;
}

.aa-reg-cta__gicon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 7px;
    border: 1px solid #dadce0;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

/* Fascia 2: titolo + flag consenso + link "tutte le opzioni" (1 riga se c'e spazio). */
.aa-reg-cta__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #eef0f3;
}

.aa-reg-cta__title {
    margin: 0;
    flex: 1 1 190px;
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.25;
    color: #0d2146;
}

.aa-reg-cta__consent {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    flex: 1 1 210px;
    font-size: 0.7rem;
    line-height: 1.3;
    color: #5b6573;
    cursor: pointer;
}

.aa-reg-cta__consent-cb {
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    margin: 1px 0 0;
    accent-color: #fbc02d;
}

.aa-reg-cta__consent a {
    color: #6c757d;
    text-decoration: underline;
}

.aa-reg-cta__more {
    flex: 0 0 auto;
    font-size: 0.74rem;
    font-weight: 700;
    text-decoration: none;
    color: #0d2146;
    white-space: nowrap;
}

.aa-reg-cta__more:hover,
.aa-reg-cta__more:focus-visible {
    text-decoration: underline;
    color: #0d2146;
}

/* Consenso mancante: evidenzia la checkbox quando l'utente clicca un ruolo senza spunta. */
.aa-reg-cta--needconsent .aa-reg-cta__consent {
    color: #c0392b;
}

.aa-reg-cta--needconsent .aa-reg-cta__consent-cb {
    outline: 2px solid #c0392b;
    outline-offset: 1px;
}
