/* private/style.css
   Fase A: l'area privata NON ha piu' un layout isolato, condivide header/footer con il
   resto del sito (style_base_v2.css). Tutto qui e' quindi volutamente SCOPED sotto
   .privata-content (il contenitore della pagina private/login.php), per non fare
   trapelare margini/font/bottoni dentro l'header/menu/footer condivisi. Palette del
   brand vannirocca.it: oro come accento, Georgia come font, coerente con il resto del
   sito (non una palette a se').

   Vedi anche private/_widget_header_icona.php: l'icona utente nell'header ha il proprio
   <style> inline, separato da questo file (deve caricarsi su OGNI pagina del sito, non
   solo su private/login.php che carica questo file via $extra_stylesheets). */

.nav .accesso-nav-icona {
    display: block;
}

.privata-content {
    /* Riusa DIRETTAMENTE i token del sito (:root in css/style_base_v2.css, gia' caricato
       su ogni pagina) invece di valori propri approssimati - cosi' l'area privata resta
       sempre visivamente identica al resto del sito, anche se la palette cambia in futuro. */
    --oro: var(--color-gold, #c9a227);
    --scuro: var(--color-black, #1a1a1a);
    font-family: var(--font-text-alt, Georgia, serif), Georgia, serif;
    color: var(--color-charcoal, #2d2d2d);
    line-height: 1.6;
}

.privata-content *, .privata-content *::before, .privata-content *::after {
    box-sizing: border-box;
}

.privata-content .container {
    max-width: 560px;
    margin: 0 auto;
    padding: 20px;
}

.privata-content .container.wide {
    max-width: 780px;
}

.privata-content .auth-box {
    background: white;
    border-radius: 12px;
    padding: 40px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    border: 1px solid #e8e8e8;
}

.privata-content h2, .privata-content h3 {
    font-weight: 400;
    color: var(--scuro);
    letter-spacing: 0.04em;
    font-family: var(--font-display, Arial, sans-serif);
    margin: 0 0 15px 0;
}

.privata-content h2 {
    margin-bottom: 25px;
    text-align: center;
    text-transform: uppercase;
    font-size: 24px;
    letter-spacing: 0.08em;
}

.privata-content h3 {
    font-size: 15px;
    /* var(--oro) qui sarebbe 2.42:1 su bianco - sotto la soglia WCAG AA (4,5:1) per
       questo corpo testo. #8a6d1f e' un oro piu' profondo gia' in uso in questo stesso
       file (.info-tooltip) - stessa identita' cromatica, contrasto reale 4,9:1. */
    color: #8a6d1f;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.privata-content .subtitle {
    text-align: center;
    color: #666;
    margin-top: -15px;
    margin-bottom: 25px;
    font-size: 14px;
    font-style: italic;
}

/* Testo esplicativo in linguaggio semplice: come funziona il sistema di accesso, pensato
   per chi non ha familiarita' con i login "senza password" (spec esplicita). */
.privata-content .spiegazione {
    background: #f8f7f5;
    border: 1px solid #e8e8e8;
    border-left: 3px solid var(--oro);
    border-radius: 6px;
    padding: 16px 18px;
    margin-bottom: 25px;
    font-size: 14px;
    color: #555;
}

.privata-content .spiegazione p {
    margin: 0 0 8px 0;
}

.privata-content .spiegazione p:last-child {
    margin-bottom: 0;
}

.privata-content .form-group {
    margin-bottom: 22px;
}

.privata-content label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: var(--font-body, Arial, sans-serif);
    font-weight: 600;
}

.privata-content input[type="text"],
.privata-content input[type="email"],
.privata-content input[type="tel"],
.privata-content input[type="date"],
.privata-content select {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    font-size: 16px;
    font-family: Georgia, serif;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.privata-content input:focus,
.privata-content select:focus {
    outline: none;
    border-color: var(--oro);
    box-shadow: 0 0 0 4px rgba(184, 150, 12, 0.12);
}

.privata-content .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.privata-content button, .privata-content .btn {
    display: inline-block;
    padding: 16px 40px;
    background: var(--scuro);
    color: white;
    border: none;
    border-radius: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 14px;
    font-family: var(--font-body, Arial, sans-serif);
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    text-decoration: none;
    text-align: center;
}

.privata-content button:hover, .privata-content .btn:hover {
    background: var(--oro);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

.privata-content button.full-width {
    width: 100%;
}

.privata-content .btn-secondario {
    background: transparent;
    color: #666;
    border: 2px solid #e0e0e0;
}

.privata-content .btn-secondario:hover {
    background: #f8f7f5;
    color: #333;
    border-color: #ccc;
    box-shadow: none;
}

/* Variante oro dei pulsanti primari - sezione visite/analisi (private/admin_visite.php,
   admin_riepilogo_visite.php, admin_inviti.php): niente nero, richiesta esplicita. */
.privata-content .btn-oro {
    background: var(--oro);
}

.privata-content .btn-oro:hover {
    background: #8a6d1f;
}

.privata-content .azioni-form {
    display: flex;
    gap: 15px;
    margin-top: 30px;
}

.privata-content .azioni-form > * {
    flex: 1;
}

.privata-content .error-box {
    background: #fff5f5;
    border: 1px solid #ffdddd;
    color: #c53030;
    padding: 16px;
    margin-bottom: 25px;
    border-radius: 8px;
    font-size: 14px;
}

.privata-content .success-box {
    background: #fdf9ec;
    border: 1px solid #ecdca0;
    color: #8a6d00;
    padding: 16px;
    margin-bottom: 25px;
    border-radius: 8px;
    font-size: 14px;
}

.privata-content .links {
    margin-top: 30px;
    padding-top: 25px;
    border-top: 1px solid #e0e0e0;
    text-align: center;
    font-size: 14px;
}

.privata-content .links a {
    color: #666;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

.privata-content .links a:hover {
    color: var(--oro);
    border-bottom-color: var(--oro);
}

/* Dashboard */
/* Prima versione: sfondo nero pieno + testo in grassetto - Vanni l'ha giudicata "da
   funerale" (il nero, di per se' un colore da lusso, diventava pesante in un blocco
   pieno con testo bold). Ora la card torna bianca come le altre (coerenza con il resto
   della pagina, niente piu' blocco scuro isolato in cima), e l'eleganza viene dalla
   tipografia - nome grande in un peso LEGGERO (300, come i titoli del sito pubblico,
   mai grassetto) - e da un sottile filo d'oro in alto, non da un riquadro scuro. */
.privata-content .dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    background: #fff;
    border-radius: 12px;
    border-top: 3px solid var(--oro);
    padding: 28px 36px;
    margin-bottom: 25px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    border-left: 1px solid #e8e8e8;
    border-right: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;
}

.privata-content .dashboard-header .saluto {
    font-family: var(--font-display, Georgia, serif);
    font-weight: 300;
    font-size: 28px;
    letter-spacing: 0.01em;
    color: var(--scuro);
    margin: 0;
}

.privata-content .dashboard-header .saluto-ruolo {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 20px;
    background: rgba(201,162,39,.1);
    border: 1px solid rgba(201,162,39,.35);
    color: var(--oro);
    font-family: var(--font-body, Arial, sans-serif);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    flex-shrink: 0;
}

.privata-content .card {
    background: white;
    border-radius: 12px;
    padding: 30px;
    margin-bottom: 25px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    border: 1px solid #e8e8e8;
    /* Il sito ha una .nav sempre position:fixed (mai riservata nel flusso normale):
       senza questo, saltare a un'ancora #sezione la porta esattamente sotto la barra,
       coperta. 90px copre l'altezza massima della nav (67px non scrollata) con un margine. */
    scroll-margin-top: 90px;
}

/* Intestazione di un box con un'azione a destra (es. il "+" della collezione). */
.privata-content .card-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 15px;
}

.privata-content .card-header-row h3 {
    margin: 0;
}

/* Un cerchio nero pieno era troppo pesante per un'azione rara (segnalare un'opera non
   ancora registrata capita quasi solo al primo accesso, non e' un'azione quotidiana) -
   resta un semplice "+" (mai "+ Aggiungi": la scritta lasciava intendere che si possano
   aggiungere opere alla collezione cliccandolo, mentre il senso reale e' "segnala
   un'opera che possiedi gia'"), ma chiaro invece che nero pieno. */
.privata-content .collezione-aggiungi {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid #e0e0e0;
    color: #555;
    text-decoration: none;
    transition: border-color .2s cubic-bezier(0.16, 1, 0.3, 1), color .2s cubic-bezier(0.16, 1, 0.3, 1), background .2s cubic-bezier(0.16, 1, 0.3, 1);
}

.privata-content .collezione-aggiungi svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.privata-content .collezione-aggiungi:hover {
    border-color: var(--oro);
    color: var(--oro);
    background: #faf8f2;
}

/* Informazione di primo piano (sconto) - subito visibile appena si apre la dashboard,
   mai piu' una frase nascosta in fondo alla pagina. */
.privata-content .privilegio-banner {
    display: flex;
    align-items: center;
    gap: 16px;
    background: linear-gradient(135deg, #fdf6e3, #f9ecc8);
    border: 1px solid #e9d69a;
    border-radius: 12px;
    padding: 20px 26px;
    margin-bottom: 25px;
    color: #6b5410;
}

.privata-content .privilegio-banner svg {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    color: var(--oro);
}

.privata-content .privilegio-banner span {
    font-family: var(--font-display, Georgia, serif);
    font-size: 17px;
    letter-spacing: 0.01em;
}

/* "I miei dati": elenco pulito etichetta/valore, niente piu' chip grigi riquadrati. */
.privata-content .dati-lista {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0 32px;
    margin: 20px 0 0 0;
}

.privata-content .dati-riga {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid #eee;
}

.privata-content .dati-riga dt {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--oro);
    font-family: var(--font-body, Arial, sans-serif);
    font-weight: 600;
    white-space: nowrap;
}

.privata-content .dati-riga dd {
    margin: 0;
    font-family: var(--font-display, Georgia, serif);
    font-size: 16px;
    color: var(--scuro);
    text-align: right;
}

/* Carta-opera condivisa (novita'/collezione/preferiti/desideri): immagine, titolo,
   dimensioni + anno - un bene di lusso presentato con la stessa cura ovunque. */
.privata-content .opera-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 22px;
    margin-top: 20px;
}

/* Gerarchia dimensionale fra le sezioni (richiesta esplicita): la collezione (beni
   posseduti per davvero) e' la piu' grande, la lista desideri media, i preferiti i piu'
   piccoli - una scala visiva coerente con quanto "vicine" sono all'utente. */
.privata-content .opera-card-grid--collezione {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 26px;
}

.privata-content .opera-card-grid--desideri {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 18px;
}

.privata-content .opera-card-grid--preferiti {
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    gap: 14px;
}

.privata-content .opera-card-grid--desideri .opera-card-titolo,
.privata-content .opera-card-grid--preferiti .opera-card-titolo {
    font-size: 13px;
}

.privata-content .opera-card-grid--preferiti .opera-card-titolo {
    font-size: 12px;
}

.privata-content .opera-card-grid--preferiti .opera-card-meta {
    font-size: 10px;
}

.privata-content .opera-card-img {
    position: relative;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f4f2ee;
    box-shadow: 0 10px 24px -8px rgba(20,18,14,.35);
    transition: box-shadow .4s cubic-bezier(0.16, 1, 0.3, 1);
}

.privata-content .opera-card:hover .opera-card-img {
    box-shadow: 0 16px 34px -10px rgba(20,18,14,.45);
}

.privata-content .opera-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .4s cubic-bezier(0.16, 1, 0.3, 1);
}

.privata-content .opera-card:hover .opera-card-img img {
    transform: scale(1.05);
}

.privata-content .opera-card-img-vuota {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f4f2ee, #e9e5dc);
}

.privata-content .opera-card-titolo {
    margin-top: 10px;
    font-family: var(--font-display, Georgia, serif);
    font-size: 14.5px;
    color: var(--scuro);
    line-height: 1.3;
}

.privata-content .opera-card-meta {
    margin-top: 3px;
    font-family: var(--font-body, Arial, sans-serif);
    font-size: 11px;
    letter-spacing: 0.03em;
    color: #9a9a9a;
}

.privata-content .opera-card-certificato {
    display: inline-block;
    margin-top: 6px;
    font-family: var(--font-body, Arial, sans-serif);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--oro);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}

.privata-content .opera-card-certificato:hover {
    border-bottom-color: var(--oro);
}

/* Ogni carta e' cliccabile per intero (immagine + titolo), apre l'opera in una nuova
   scheda - i link riprendono i colori dei figli invece del blu/sottolineato di default. */
.privata-content .opera-card-img-link {
    display: block;
    width: 100%;
    height: 100%;
}

.privata-content .opera-card-testo-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

/* Stella (desideri) / cuore (preferiti): SOTTO la foto, mai sopra - fluttua a destra
   della riga del titolo (stessa posizione del cuore "mi piace" sotto il carosello nella
   pagina pubblica dell'opera), cosi' un titolo molto lungo le si avvolge intorno invece
   di esserne coperto. Solo il segno stesso, nessun cerchio/sfondo intorno: pieno quando
   attivo, vuoto (bianco con contorno) quando spento. Un click chiede conferma e spegne
   l'icona senza far sparire la carta dalla griglia - resta li' fino al prossimo
   caricamento; ricliccandola si riaccende e riaggiunge l'opera, senza conferma. */
.privata-content .opera-card-riga-titolo {
    overflow: hidden;
}

.privata-content .opera-card-toggle-form {
    float: right;
    margin: 3px 0 8px 10px;
}

.privata-content .opera-card-toggle {
    display: block;
    width: 19px;
    height: 19px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: transform .2s cubic-bezier(0.16, 1, 0.3, 1);
}

.privata-content .opera-card-toggle:hover {
    transform: scale(1.12);
}

.privata-content .opera-card-toggle svg {
    width: 100%;
    height: 100%;
    display: block;
}

.privata-content .opera-card-toggle--stella svg {
    fill: var(--oro);
    stroke: var(--oro);
}

.privata-content .opera-card-toggle--stella.spento svg {
    fill: #fff;
    stroke: var(--oro);
}

.privata-content .opera-card-toggle--cuore svg {
    fill: #c0392b;
    stroke: #c0392b;
}

.privata-content .opera-card-toggle--cuore.spento svg {
    fill: #fff;
    stroke: #1a1a1a;
}

/* Newsletter: sintesi visuale degli argomenti scelti, invece del form sempre aperto. */
.privata-content .newsletter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}

.privata-content .newsletter-chip {
    display: inline-block;
    padding: 7px 14px;
    border-radius: 20px;
    background: #faf5e6;
    border: 1px solid #ecdca0;
    color: #8a6d00;
    font-family: var(--font-body, Arial, sans-serif);
    font-size: 12.5px;
    letter-spacing: 0.02em;
}

.privata-content .badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-family: var(--font-body, Arial, sans-serif);
    font-weight: 600;
    background: #fdf9ec;
    color: var(--oro);
    border: 1px solid #ecdca0;
}

.privata-content .vuoto {
    color: #999;
    font-style: italic;
    font-size: 14px;
    padding: 15px 0;
}

/* Fase C: pannelli admin che lavorano su elenchi (utenti, candidature) - a differenza
   del resto dell'area privata, qui il comfort visivo su desktop conta piu' della resa
   mobile: si usa tutta la larghezza disponibile invece dei 560/780px del container
   normale. Non responsive per scelta esplicita (operazione da fare con attenzione, su
   schermo grande). */
.privata-content .container.full {
    max-width: 1600px;
    padding: 20px 32px;
}

.privata-content .filtro-rapido {
    display: flex;
    gap: 10px;
    margin: 20px 0;
    max-width: 420px;
}

.privata-content .filtro-rapido input[type="text"] {
    flex: 1;
}

/* Pannelli per pagine di analisi/dati larghe (private/admin_visite.php,
   admin_riepilogo_visite.php) - .auth-box e' pensato per un form stretto e centrato
   (padding 40px, ombra pesante): dentro un contenitore full-width con filtri e tabelle
   produceva esattamente lo squilibrio segnalato (spazi vuoti enormi, campi/tasti
   sproporzionati). Stessa identita' visiva (bianco, bordo sottile) ma proporzionata. */
.privata-content .pannello-dati {
    background: white;
    border-radius: 12px;
    padding: 26px 30px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    border: 1px solid #e8e8e8;
}

.privata-content .pannello-dati h2 {
    text-align: left;
    font-size: 20px;
    letter-spacing: 0.04em;
    margin-bottom: 6px;
}

/* Barra filtri compatta: una riga che si adatta al contenuto (min-width per campo, non
   50% di un contenitore da 1600px) - uno strumento di analisi, non un form di iscrizione. */
.privata-content .filtro-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 14px 18px;
    margin: 18px 0;
    padding: 16px 18px;
    background: #faf8f2;
    border-radius: 8px;
}

.privata-content .filtro-toolbar .campo {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.privata-content .filtro-toolbar label {
    margin-bottom: 0;
    font-size: 10.5px;
}

.privata-content .filtro-toolbar input,
.privata-content .filtro-toolbar select {
    width: auto;
    min-width: 130px;
    padding: 8px 10px;
    font-size: 13px;
    border-radius: 6px;
    border-width: 1.5px;
}

.privata-content .filtro-toolbar .campo-checkbox {
    flex-direction: row;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    color: #555;
    padding-bottom: 8px;
}

.privata-content .filtro-toolbar .campo-checkbox input {
    width: 15px;
    min-width: 0;
    padding: 0;
}

.privata-content .filtro-toolbar .campo-azioni {
    display: flex;
    gap: 10px;
    padding-bottom: 1px;
}

/* Tasti da strumento (pagine di analisi), non da invito-all'azione marketing - stessa
   identita' (oro, angoli arrotondati) ma alla taglia giusta per una barra filtri. */
.privata-content .btn-compatto {
    padding: 9px 20px;
    font-size: 12px;
    letter-spacing: 0.05em;
    border-radius: 6px;
}

.privata-content .btn-compatto:hover {
    transform: none;
    box-shadow: none;
}

.privata-content table.elenco {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-size: 14px;
}

.privata-content table.elenco th {
    text-align: left;
    font-family: var(--font-body, Arial, sans-serif);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #999;
    font-weight: 600;
    padding: 10px 12px;
    border-bottom: 2px solid #e8e8e8;
    white-space: nowrap;
}

.privata-content table.elenco td {
    padding: 10px 12px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

.privata-content table.elenco tbody tr:nth-child(even) td {
    background: #f8f7f5;
}

.privata-content table.elenco tr:hover td {
    background: #faf8f2;
}

.privata-content table.elenco input[type="number"] {
    width: 90px;
    padding: 6px 8px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
}

.privata-content table.elenco .riga-form {
    display: flex;
    gap: 8px;
    align-items: center;
}

.privata-content table.elenco .riga-form button {
    padding: 6px 14px;
    font-size: 12px;
}

.privata-content .paginazione {
    display: flex;
    gap: 6px;
    align-items: center;
    margin-top: 24px;
    font-family: var(--font-body, Arial, sans-serif);
    font-size: 13px;
    flex-wrap: wrap;
}

.privata-content .paginazione a, .privata-content .paginazione span {
    padding: 6px 12px;
    border-radius: 6px;
    border: 1px solid #e8e8e8;
    color: #555;
    text-decoration: none;
}

.privata-content .paginazione a:hover {
    border-color: var(--oro);
    color: var(--oro);
}

.privata-content .paginazione .attuale {
    background: var(--oro);
    color: #fff;
    border-color: var(--oro);
    font-weight: 600;
}

/* Icona informativa accanto al prezzo riservato (Fase C): tooltip nativo via title +
   fallback accessibile, niente libreria JS. */
.privata-content .info-tooltip, .info-tooltip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #e9e2cc;
    color: #8a6d1f;
    font-family: Georgia, serif;
    font-size: 11px;
    font-style: italic;
    font-weight: bold;
    cursor: help;
    margin-left: 6px;
    vertical-align: middle;
}

/* Modale di conferma condivisa (rimozione da preferiti/desideri, disiscrizione
   newsletter): mai un confirm() nativo del browser su un sito luxury - rompe
   completamente la coerenza visiva. Stessa lingua grafica delle altre card:
   bianco, angoli arrotondati, Georgia per il testo, oro come unico accento. */
.privata-content .conferma-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(20,18,14,.55);
    z-index: 3000;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.privata-content .conferma-overlay.aperto {
    display: flex;
}

.privata-content .conferma-modal {
    background: #fff;
    border-radius: 14px;
    padding: 32px 30px 26px;
    max-width: 380px;
    width: 100%;
    box-shadow: 0 20px 60px rgba(0,0,0,.3);
    text-align: center;
}

.privata-content .conferma-testo {
    font-family: Georgia, serif;
    font-size: 16px;
    line-height: 1.5;
    color: #2d2d2d;
    margin: 0 0 24px 0;
}

.privata-content .conferma-azioni {
    display: flex;
    gap: 12px;
}

.privata-content .conferma-azioni > * {
    flex: 1;
}

@media (max-width: 768px) {
    .privata-content .container {
        margin: 0 auto;
        padding: 15px;
    }

    .privata-content .auth-box, .privata-content .card, .privata-content .dashboard-header {
        padding: 22px;
    }

    .privata-content .form-row, .privata-content .azioni-form {
        grid-template-columns: 1fr;
        flex-direction: column;
    }

    .privata-content .azioni-form {
        display: none;
    }

    .privata-content .dati-lista {
        grid-template-columns: 1fr;
    }

    .privata-content .opera-card-grid {
        grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
        gap: 16px;
    }

    .privata-content .privilegio-banner {
        padding: 16px 18px;
    }

    .privata-content .privilegio-banner span {
        font-size: 15px;
    }
}