/* ------------------------------------------------------------------ */
/* Sistema di messaggi/popup unico, riusabile anche fuori dal pannello */
/* console (login, recupero password, wizard, download): vedi          */
/* window.Popup in popup.js. Puo' essere incluso da solo, senza         */
/* style.css, dalle pagine standalone che hanno un proprio layout.      */
/* ------------------------------------------------------------------ */

.alert{
    padding:12px 15px;
    border-radius:6px;
    margin-bottom:18px;
    font-size:14px;
}
.alert-ok{background:#e6f4ea;color:#1e6b34;}
.alert-error{background:#fdecea;color:#a1201a;}
.alert-warn{background:#fff4e5;color:#8a5300;}
.alert a{color:inherit;font-weight:bold;}

/* ------------------------------------------------------------------ */
/* Popup unico: Info / Successo / Avviso / Errore / Conferma /         */
/* Scelta multipla (dialog modali, bloccano l'interfaccia). Gli .alert */
/* sopra restano come fallback statico se JS e' disabilitato.          */
/* ------------------------------------------------------------------ */

.popup-backdrop{
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.55);
    z-index:2000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px 16px;
    overflow-y:auto;
}

.popup-dialog{
    position:relative;
    background:#fff;
    width:100%;
    max-width:460px;
    max-height:calc(100vh - 48px);
    overflow-y:auto;
    padding:22px;
    border-radius:12px;
    box-shadow:0 20px 50px rgba(0,0,0,.35);
    display:flex;
    flex-direction:column;
    gap:14px;
}

.popup-item{
    display:flex;
    gap:12px;
    align-items:flex-start;
}

.popup-icon{
    flex:0 0 30px;
    width:30px;
    height:30px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    font-size:15px;
    color:#fff;
}

.popup-info .popup-icon{background:#2563eb;}
.popup-success .popup-icon{background:#1e8e3e;}
.popup-warning .popup-icon{background:#b45309;}
.popup-error .popup-icon{background:#c0261d;}
.popup-confirm .popup-icon{background:#4b5563;}
.popup-choice .popup-icon{background:#4f46e5;}

.popup-body{
    flex:1;
    font-size:14px;
    line-height:1.5;
    color:#1f2937;
    word-break:break-word;
}
.popup-body a{color:inherit;font-weight:bold;}

.popup-hint{
    margin-top:8px;
    padding:8px 10px;
    background:#f3f4f6;
    border-left:3px solid #9ca3af;
    border-radius:4px;
    font-size:13px;
    color:#4b5563;
}

.popup-actions{
    display:flex;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:10px;
    padding-top:6px;
    border-top:1px solid #e5e7eb;
}

.popup-btn{
    padding:9px 18px;
    border-radius:6px;
    border:1px solid transparent;
    font-size:14px;
    cursor:pointer;
    background:#374151;
    color:#fff;
}
.popup-btn-cancel{
    background:#fff;
    color:#374151;
    border-color:#d1d5db;
}
.popup-btn-confirm{background:#2563eb;}
.popup-btn-danger{background:#c0261d;}

.popup-dialog-error .popup-btn-confirm{background:#c0261d;}
.popup-dialog-warning .popup-btn-confirm{background:#b45309;}
.popup-dialog-success .popup-btn-confirm{background:#1e8e3e;}
.popup-dialog-choice .popup-btn-confirm{background:#4f46e5;}

/* ------------------------------------------------------------------ */
/* Toast/snackbar: notifica temporanea, non modale (non blocca la UI)  */
/* ------------------------------------------------------------------ */

.toast-container{
    position:fixed;
    z-index:2500;
    right:16px;
    bottom:16px;
    display:flex;
    flex-direction:column;
    gap:10px;
    max-width:340px;
    pointer-events:none;
}

.toast{
    display:flex;
    align-items:center;
    gap:10px;
    background:#1f2937;
    color:#fff;
    padding:12px 14px;
    border-radius:8px;
    box-shadow:0 10px 25px rgba(0,0,0,.3);
    pointer-events:auto;
    animation:toastIn .18s ease;
}

.toast-hide{
    opacity:0;
    transform:translateY(6px);
    transition:opacity .2s ease, transform .2s ease;
}

@keyframes toastIn{
    from{opacity:0; transform:translateY(10px);}
    to{opacity:1; transform:translateY(0);}
}

.toast-icon{
    flex:0 0 22px;
    width:22px;
    height:22px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:bold;
    font-size:12px;
    color:#fff;
}

.toast-info .toast-icon{background:#2563eb;}
.toast-success .toast-icon{background:#1e8e3e;}
.toast-warning .toast-icon{background:#b45309;}
.toast-error .toast-icon{background:#c0261d;}

.toast-body{
    flex:1;
    font-size:13.5px;
    line-height:1.4;
}

.toast-action{
    background:none;
    border:none;
    color:#93c5fd;
    font-weight:bold;
    cursor:pointer;
    font-size:13px;
    padding:0;
    white-space:nowrap;
}

.toast-close{
    background:none;
    border:none;
    color:#9ca3af;
    font-size:16px;
    line-height:1;
    cursor:pointer;
    padding:0;
}
.toast-close:hover{color:#fff;}

:root[data-theme="dark"] .popup-dialog,
:root[data-theme="dark"] .popup-choice-options{
    background:#1f2937;
    color:#e5e7eb;
}

:root[data-theme="dark"] .popup-dialog .popup-body,
:root[data-theme="dark"] .popup-choice-option{
    color:#e5e7eb;
}

:root[data-theme="dark"] .popup-dialog input,
:root[data-theme="dark"] .popup-dialog textarea,
:root[data-theme="dark"] .popup-dialog select{
    background:#273449;
    color:#e5e7eb;
    border-color:#4b5563;
}

@media (max-width:480px){

    .toast-container{
        left:10px;
        right:10px;
        bottom:10px;
        max-width:none;
    }

}

@media (max-width:480px){

    .popup-backdrop{
        align-items:flex-end;
        padding:0;
    }

    .popup-dialog{
        max-width:none;
        width:100%;
        max-height:85vh;
        border-radius:16px 16px 0 0;
    }

    .popup-actions{
        flex-direction:column-reverse;
    }

    .popup-btn{
        width:100%;
        padding:12px 18px;
    }

}