/* =========================
   FORM MESSAGE PRO
========================= */

.form-message{
    font-size:14px;
    margin-bottom:15px;
    padding:12px 14px 12px 42px;
    border-radius:10px;
    display:none;
    font-weight:500;
    position:relative;
    animation:fadeSlide 0.25s ease;
    border-left:5px solid transparent;
}

/* SHOW */
.form-message.show{
    display:block;
}

/* ICON */
.form-message::before{
    position:absolute;
    left:14px;
    top:50%;
    transform:translateY(-50%);
    font-size:16px;
}

/* ERROR */
.form-message.error{
    background:#fdecea;
    color:#b3261e;
    border-left-color:#d93025;
}

.form-message.error::before{
    content:"⛔";
}

/* SUCCESS */
.form-message.success{
    background:#e6f4ea;
    color:#137333;
    border-left-color:#34a853;
}

.form-message.success::before{
    content:"✔";
}

/* WARNING */
.form-message.warning{
    background:#fff4e5;
    color:#b06000;
    border-left-color:#fbbc04;
}

.form-message.warning::before{
    content:"⚠";
}

/* INFO */
.form-message.info{
    background:#e8f0fe;
    color:#174ea6;
    border-left-color:#4285f4;
}

.form-message.info::before{
    content:"ℹ";
}

/* ANIMATION */
@keyframes fadeSlide{
    from{
        opacity:0;
        transform:translateY(-5px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

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

.toast{
    position:fixed;
    top:20px;
    right:20px;
    min-width:260px;
    max-width:360px;
    padding:14px 18px;
    border-radius:12px;
    font-size:14px;
    font-weight:500;
    color:white;
    box-shadow:0 15px 40px rgba(0,0,0,0.25);
    opacity:0;
    transform:translateY(-15px);
    transition:all 0.25s ease;
    z-index:99999;
    display:flex;
    align-items:center;
    gap:10px;
    
    display:none;
}

/* SHOW */
.toast.show{
display:inline-flex;    /* 🔥 CHỈ HIỆN KHI CẦN */
    align-items:center;
    gap:10px;
    
    opacity:1;
    transform:translateY(0);


}

/* TYPES */
.toast.success{
    background:linear-gradient(135deg,#16a34a,#15803d);
}

.toast.error{
    background:linear-gradient(135deg,#dc2626,#b91c1c);
}

.toast.warning{
    background:linear-gradient(135deg,#f59e0b,#d97706);
}

.toast.info{
    background:linear-gradient(135deg,#2563eb,#1e40af);
}

/* ICON */
.toast-icon{
    font-size:16px;
}

/* MOBILE */
@media(max-width:768px){
    .toast{
        right:10px;
        left:10px;
        max-width:none;
    }
}