#section-introduce-home {
    height: 320px;
    width: 100%;
    background-image: url('/assets/file/system/banner_introduce_home.png');
    background-repeat: no-repeat;
    background-size: 100%;
    display: flex;
    align-items: center;
}

@media (max-width:992px) {
    #section-introduce-home {
        height: 180px;
        background-size: 200% 100%;
        background-position: center;
        justify-content: center;
        text-align: center;
    }
}

#card-area-hot {
    box-shadow: 1px 1px 1px 1px var(--gray-40-color);
    transition: ease box-shadow 0.2s ;
}

#card-area-hot:hover {
    box-shadow: 3px 3px 6px 1px var(--blue-40-color);
    transition: ease box-shadow 0.4s ;
}

@media (min-width:992px) {
    #section-filter {
        position: absolute;
        top: -40px;
        width: calc(100% - 12rem);
        left: 6rem;
    }
}

.card-room:hover .card-room-body {
    background: linear-gradient(125deg, rgba(0, 0, 0, 0) 40%, var(--blue-80-color) 100%) !important;
}

.card-room:hover .card-room-name {
    color: var(--blue-color) !important;
}

.card-room-badge {
    font-size: 13px;
    padding: 2px 6px;
    background-color: #f2f2f2;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 4px;
}

.card-room-badge i {
    color: #b0b0b0;
}

.btn-add-favourite i {
    text-shadow: 0 0 4px #1d171a50;
}

.btn-add-favourite:hover i {
    text-shadow: 0 0 4px #ef227e50;
    color : #ef227e !important;
}

.btn-add-favourite-active i {
    color : #ef227e !important;
}