.flash-container {
    position: fixed;
    top: 85px;
    left: 90%;
    transform: translateX(-50%);
    z-index: 999;
    width: 70%;
    max-width: 250px;
    display: none;
    /* allow clicks to pass through the container except the messages themselves */
    pointer-events: none;
}

.flash-message {
    position: relative;
    padding: 15px 40px 15px 15px;
    margin-bottom: 10px;
    border-radius: 8px;
    color: white;
    font-weight: bold;
    text-align: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    animation: fadeOut 5s forwards;
    z-index: 9999;
    /* ensure the message itself receives pointer events (for close button) */
    pointer-events: auto;
}
.flash-message.success {
    background: linear-gradient(135deg, #1b5e20, #43a047); /* verde mais vibrante */
    color: #e8f5e9;
}

.flash-message.error {
    background: linear-gradient(135deg, #b71c1c, #e53935); /* vermelho intenso */
    color: #ffebee;
}

.flash-message.warning {
    background: linear-gradient(135deg, #f57f17, #fbc02d); /* amarelo mais forte */
    color: #fffde7;
}

.flash-message.info {
    background: linear-gradient(135deg, #0d47a1, #2196f3); /* azul vibrante */
    color: #e3f2fd;
}

.flash-message.paused {
    animation-play-state: paused;
}

.close-btn {
    position: absolute;
    top: 5px;
    right: 10px;
    color: white;
    font-size: 20px;
    cursor: pointer;
}

@keyframes fadeOut {
    0%   { opacity: 1; }
    90%  { opacity: 1; }
    100% { opacity: 0; }
}


@media (max-width: 767.98px) {
    .flash-container {
        width: 90%;
        left: 50%;
        right: auto;
        bottom: 10px;
    }
    
    .flash-message {
        width: 100%;
    }
}


/* Dispositivos médios (tablets, 768px e acima) */
@media (min-width: 768px) and (max-width:991.98px) {
    .flash-container {
        width: 90%;
        left: 50%;
        right: auto;
        bottom: 10px;
    }
    
    .flash-message {
        width: 100%;
    }
    
}