/* ============================================================
   TOAST NOTIFICATION - ManjalKunkumam
   ============================================================ */

.toast-container{
    position:fixed;
    top:24px;
    right:24px;
    z-index:99999;
    display:flex;
    flex-direction:column;
    gap:12px;
    pointer-events:none;
}

.toast{
    min-width:320px;
    max-width:420px;
    padding:14px 20px;
    border-radius:var(--radius);
    display:flex;
    align-items:center;
    gap:12px;
    font-family:var(--font-primary);
    font-size:var(--font-size-sm);
    font-weight:500;
    color:var(--white);
    box-shadow:0 8px 30px rgba(0,0,0,0.18);
    transform:translateX(120%);
    transition:transform .4s cubic-bezier(.68,-.55,.27,1.55), opacity .3s;
    pointer-events:auto;
    cursor:pointer;
    line-height:1.5;
}

.toast.show{
    transform:translateX(0);
}

.toast.hide{
    opacity:0;
    transform:translateX(40px);
}

.toast-icon{
    font-size:1.2rem;
    min-width:24px;
    text-align:center;
}

.toast-body{
    flex:1;
}

.toast-body strong{
    display:block;
    font-size:var(--font-size-base);
    font-weight:700;
    margin-bottom:2px;
}

.toast-close{
    background:none;
    border:none;
    color:rgba(255,255,255,0.7);
    font-size:1.1rem;
    cursor:pointer;
    padding:0 0 0 8px;
    transition:color .2s;
}

.toast-close:hover{
    color:var(--white);
}

/* ---------- Success ---------- */
.toast-success{
    background:linear-gradient(135deg, #27ae60 0%, #1e8449 100%);
}

/* ---------- Error ---------- */
.toast-error{
    background:linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
}

/* ---------- Warning ---------- */
.toast-warning{
    background:linear-gradient(135deg, #f39c12 0%, #d68910 100%);
}

/* ---------- Info ---------- */
.toast-info{
    background:linear-gradient(135deg, #2980b9 0%, #1a5276 100%);
}

/* ---------- Responsive ---------- */
@media(max-width:576px){
    .toast-container{
        top:12px;
        right:12px;
        left:12px;
    }
    .toast{
        min-width:auto;
        max-width:100%;
    }
}