/* ==========================================================
   TOAST
========================================================== */

.toast{

    position:fixed;

    right:24px;
    bottom:24px;

    width:360px;

    display:flex;
    align-items:flex-start;
    gap:16px;

    padding:18px;

    background:var(--white);

    border:1px solid var(--gray-200);

    border-radius:16px;

    box-shadow:var(--shadow-md);

    z-index:var(--z-toast);

}

.toast-icon{

    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:12px;

    flex-shrink:0;

}

.toast-success .toast-icon{

    background:#ECFDF5;

    color:#16A34A;

}

.toast-error .toast-icon{

    background:#FEF2F2;

    color:#DC2626;

}

.toast-warning .toast-icon{

    background:#FFFBEB;

    color:#D97706;

}

.toast-info .toast-icon{

    background:#EFF6FF;

    color:#2563EB;

}

.toast-content{

    flex:1;

}

.toast-content h4{

    font-size:16px;

    margin-bottom:4px;

}

.toast-content p{

    font-size:14px;

    color:var(--gray-500);

    line-height:1.6;

}

.toast-close{

    width:36px;
    height:36px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    transition:var(--transition);

}

.toast-close:hover{

    background:var(--gray-100);

}

@media(max-width:640px){

.toast{

left:20px;
right:20px;
bottom:20px;

width:auto;

}

}