/* Base flash popup style */
.flash-popup {
    position: fixed;
    top: 40px;
    left: 56%;
    transform: translateX(-50%);
    padding: 15px 25px;
    border-radius: 8px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    text-align: center;
    min-width: 250px;
    max-width: 80%;
    animation: fadeOut 4s forwards;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Success flash (green) */
.flash-popup.success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb;
}

/* Error flash (red) */
.flash-popup.error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb;
}

/* Optional: Add an icon (using pseudo-element) */
.flash-popup.success::before {
    content: "✓";
    font-weight: bold;
}

.flash-popup.error::before {
    content: "✗";
    font-weight: bold;
}

/* Fade-out animation */
@keyframes fadeOut {
    0%   { opacity: 1; }
    70%  { opacity: 1; }
    100% { opacity: 0; visibility: hidden; }
}