.containermsg {
    position: fixed;
    /* Mengatur posisi kontainer menjadi fixed */
    top: 20px;
    /* Lebar maksimum kontainer */
    z-index: 9999;
    /* Menempatkan kontainer di atas elemen lainnya */
}

.message {
    margin: 0px 10px;
    /* Jarak horizontal antar pesan */
    display: flex;
    align-items: center;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    /* Bayangan lebih gelap */
    position: relative;
    opacity: 1;
    animation: fadeIn 0.5s ease-in;
}

.icon-wrapper {
    background-color: #1e1e1e;
    /* Latar belakang ikon */
    padding: 8px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.icon-wrapper i {
    font-size: 20px;
}

.message .close {
    position: absolute;
    right: 15px;
    top: 15px;
    cursor: pointer;
    color: #ffffff;
    /* Warna tombol tutup putih */
}

.message.error {
    background: linear-gradient(to bottom, #b22222, #8b0000);
    /* Gradien merah gelap */
    color: #ffffff;
}

.message.warning {
    background: linear-gradient(to bottom, #ff8c00, #ff4500);
    /* Gradien oranye gelap */
    color: #ffffff;
}

.message.success {
    background: linear-gradient(to bottom, #228b22, #006400);
    /* Gradien hijau gelap */
    color: #ffffff;
}

.message.info {
    background: linear-gradient(to bottom, #4682b4, #1e90ff);
    /* Gradien biru gelap */
    color: #ffffff;
}

.message h4 {
    margin: 0;
    font-size: 16px;
}

.message p {
    margin: 5px 0 0;
    font-size: 12px;
    color: #e0e0e0;
    /* Warna teks paragraf lebih terang */
}

/* Animasi CSS */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
        /* Bergerak dari bawah */
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-20px);
    }
}