/* Stili per il sistema di notifiche */

/* Contenitore Notifica */
.notifica-container
{
    position: fixed;
    z-index: 9999;
    max-width: 400px;
    min-width: 320px;
}

/* Posizionamenti */
.notifica-top-left {top: 20px; left: 20px;}
.notifica-top-center {top: 20px; left: 50%; transform: translateX(-50%);}
.notifica-top-right {top: 20px; right: 20px;}
.notifica-middle-left {top: 50%; left: 20px; transform: translateY(-50%);}
.notifica-middle-center {top: 50%; left: 50%; transform: translate(-50%, -50%);}
.notifica-middle-right {top: 50%; right: 20px; transform: translateY(-50%);}
.notifica-bottom-left {bottom: 20px; left: 20px; }
.notifica-bottom-center {bottom: 20px; left: 50%; transform: translateX(-50%);}
.notifica-bottom-right {bottom: 20px; right: 20px;}

/* Stile Base del Contenuto (.alert) con Neumorphism Corretto */
.notifica-alert
{
    padding: 20px 30px;
    border-radius: 16px;
    position: relative;
    margin-bottom: 0;
    background-color: #ffffff;
    color: #444;
    box-shadow: 
        2px 2px 8px rgba(174, 174, 192, 0.4),
        -2px -2px 8px rgba(255, 255, 255, 1);
    border: none;
    transition: all 0.3s ease-in-out;
}

/* Tipi di Notifica: Colori di Evidenziazione */
.notifica-alert.alert-success
{
    color: #1b5e20;
    background: linear-gradient(to bottom, #1b5e20a0 0%, #1b5e2000 100%);
}
.notifica-alert.alert-danger
{
    color: #b71c1c;
    background: linear-gradient(to bottom, #b71c1ca0 0%, #b71c1c00 100%);
}
.notifica-alert.alert-info
{
    color: #0d47a1;
    background: linear-gradient(to bottom, #0d47a1a0 0%, #0d47a100 100%);
}
.notifica-alert.alert-warning
{
    color: #f0ad4e;
    background: linear-gradient(to bottom, #f0ad4ea0 0%, #f0ad4e00 100%);
}

/* Intestazione e Icona */
.notifica-header
{
    margin-top: 0;
    margin-bottom: 8px;
    font-size: 1.25em;
    font-weight: 800;
    display: flex;
    align-items: center;
    text-shadow: none;
}

.notifica-icon
{
    margin-right: 12px;
    font-size: 1.4em;
    line-height: 1;
    text-shadow: 
        1px 1px 3px rgba(174, 174, 192, 0.3),
        -1px -1px 3px rgba(255, 255, 255, 1);
}

/* Messaggio */
.notifica-message
{
    display: block;
}

/* Pulsante di Chiusura */
.notifica-close
{
    position: absolute;
    top: 10px;
    right: 10px;
    color: #999 !important;
    opacity: 1 !important;
    font-size: 1.3em;
    width: 18px;
    height: 18px;
    line-height: 14px;
    border-radius: 50%;
    text-align: center;
    padding: 0;
    background: #ffffff;
    box-shadow: 
        2px 2px 4px rgba(174, 174, 192, 0.4),
        -2px -2px 4px rgba(255, 255, 255, 1);
    transition: all 0.2s ease-in-out;
    border: none;
    cursor: pointer;
}

.notifica-close:hover
{
    box-shadow: 
        inset 1px 1px 3px rgba(174, 174, 192, 0.8),
        inset -3px -3px 6px rgba(255, 255, 255, 1);
    color: #666 !important;
    opacity: 1 !important;
}

/* Animazioni di Entrata/Uscita */
@keyframes notificaSlideIn
{
    from
    {
        transform: translateX(450px);
        opacity: 0;
    }
    to
    {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes notificaSlideOut
{
    from
    {
        transform: translateX(0);
        opacity: 1;
    }
    to
    {
        transform: translateX(450px);
        opacity: 0;
    }
}

.notifica-slide-in {animation: notificaSlideIn 0.5s ease-out forwards;}
.notifica-slide-out {animation: notificaSlideOut 0.5s ease-in forwards;}