/* Đổi màu thanh Header sang màu đỏ trang trọng */
.mud-appbar {
    background: linear-gradient(90deg, #a01d21 0%, #d32f2f 100%) !important;
}

.mud-appbar {
    position: relative;
    overflow: hidden; /* Để cành đào không bị tràn ra ngoài */
}

    .mud-appbar::after {
        content: "";
        position: absolute;
        left: 50px;
        top: -24px;
        width: 250px;
        height: 69px;
        background: url(canh-dao-ngang.png) no-repeat;
        background-size: contain;
        z-index: 1;
        pointer-events: none;
        transform: scaleX(-1);
    }

/* Thêm họa tiết mây chìm hoặc hoa đào nhỏ cho sidebar */
#nav-drawer .mud-drawer-content {
    background-image: url('sidebar-bg.jpg') !important;
    background-size: 1000px; /* Điều chỉnh kích thước hoa to/nhỏ */
    background-repeat: repeat;
    background-color: rgba(255, 245, 245, 0.95) !important; /* Lớp phủ trắng hồng nhẹ để chữ dễ đọc */
    background-blend-mode: overlay;
}


.state-card {
    border-top: 2px solid #d32f2f !important; /* Viền đỏ phía trên */
    position: relative;
    overflow: hidden;
}
.state-card-01::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: url('https://img.icons8.com/?size=48&id=36887&format=png&color=000000') no-repeat;
    background-size: contain;
}
.state-card-02::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: url('https://img.icons8.com/?size=48&id=15595&format=png&color=000000') no-repeat;
    background-size: contain;
}
.state-card-03::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: url('https://img.icons8.com/?size=48&id=13009&format=png&color=000000') no-repeat;
    background-size: contain;
}
.state-card-04::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: url('https://img.icons8.com/?size=48&id=23042&format=png&color=000000') no-repeat;
    background-size: contain;
}

.state-card:hover::after {
    transform: scale(1.2) rotate(10deg);
    transition: all 0.3s ease;
}