.HSlider {
        background: linear-gradient(to right,#f6f6f6,#fff);
        /* border: 1px solid #e0e0e0; */
        margin: 0 0 15px;
        /* padding: 10px 0; */
}
.HSlider .Header {/* background-color: #b10804; */margin-bottom: 5px;background: linear-gradient(to right, #b10804, #fff);}
.HSlider .Header .Text {
        color: #fff;
        display: inline-block;
        font: bold 14px/45px arial;
        padding: 0px 10px;
        text-transform: uppercase;
        /* margin-top: -7px; */
}


.HSlider .Header .Text a {


        color: #fff;
        display: inline-block;
        font: bold 17px/45px arial;
        padding: 0px 10px;
        text-transform: uppercase;
        /* margin-top: -7px; */
}

.HSlider .SliderContent {
        margin: 10px 0;
}
.HSlider .text:hover {
        color: #3b7913;
}
.HSlider .ItemPanel {
        overflow: hidden;
        width: 100% !important;
}
.HSlider .text, .HSlider .text a {
        color: #282828;
        text-align: left;
        font-size: 14px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
}
.HSlider .ItemContainer .Item:hover img {
        opacity: 0.8;
}
.HSlider .ItemContainer {
        left: 0;
        list-style: outside none none;
        margin: 0;
        overflow: hidden;
        padding: 0;
        position: relative;
        top: 0;
}
.HSlider .ItemContainer .Item:hover {
}
.HSlider .ItemContainer .Item {
        background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
        float: left;
        margin: 0 5px;
        text-align: center;
        vertical-align: top;
        width: 125px;
}
.HSlider .ItemContainer .Item img {
        height: 100px;
        opacity: 1;
        width: 100%;
}
.HSlider .ItemContainer .Item .image {
        margin-bottom: 10px;
}
.HSlider .PreButton {
        height: 30px;
        left: 0;
        opacity: 0.5;
        position: absolute;
        top: 40px;
        width: 30px;
        z-index: 2;
}
.HSlider .NextButton {
        height: 30px;
        opacity: 0.5;
        position: absolute;
        right: 0;
        top: 40px;
        width: 30px;
        z-index: 2;
}
.HSlider .NextButton:hover {
        opacity: 1;
}
.HSlider .PreButton:hover {
        opacity: 1;
}
.HSlider .ItemPanel .Item {
        width: 160px !important;
}
.HSlider ul.ItemContainer {
        width: 100% !important;
        display: flex;
        /* left: 2vw !important; */
}

/* ===== UIArticleSlider_default2 ===== */


 .HSlider {
    --columns: 5; /* n phần tử trên một hàng */

    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

/* Ghi đè width: 1700px đang được gán inline */
 .HSlider .ItemPanel,
 .HSlider .ItemContainer {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

/* Chia n cột và tự động xuống hàng */
 .HSlider .ItemContainer {
    display: grid !important;
    grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
    gap: 16px;

    padding: 0;
    margin: 0;
    overflow: visible;
    position: static;
    transform: none !important;
}

/* Ghi đè CSS cũ dùng float/width cố định */
 .HSlider .Item {
    float: none !important;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0;
    box-sizing: border-box;
}

/* Ngăn ảnh làm cột bị tràn */
 .HSlider .Item .image,
 .HSlider .Item img {
    width: 100% !important;
    max-width: 100%;
}

 .HSlider .Item img {
    display: block;
    height: auto;
    object-fit: cover;
}

/* Cho phép tiêu đề dài xuống dòng */
 .HSlider .Item .text {
    min-width: 0;
    overflow-wrap: anywhere;
}


@media (max-width: 991px) {
     .HSlider {
        --columns: 3;
    }
}

@media (max-width: 767px) {
     .HSlider {
        --columns: 2;
    }
}

@media (max-width: 480px) {
     .HSlider {
        --columns: 1;
    }
}
