.slick-next:before, .slick-next:before {
    content: " " !important;
    background-image: url("/images/chevron-right-solid.svg") !important;
    background-size: 16px;
    padding: 4px 8px;
    background-repeat: no-repeat;
}

.slick-prev:before, .slick-prev:before {
    content: " " !important;
    background-image: url("/images/chevron-left-solid.svg") !important;
    background-size: 16px;
    padding: 4px 8px;
    background-repeat: no-repeat;
}

.slick-next {
    bottom: 0;
    top: calc(100% + 10px);
    right: -20px !important;
}

.slick-prev {
    top: -10px;
    left: -20px !important;
}

.slick-track a {
    color: #212529;
    text-decoration: none;
}

.slick-prev:before, .slick-next:before {
    color: gray !important;
}

.slick-track .card:hover {
    border-color: #ff5722;
    background-color: #fff2ee;
}

.recommend .slick-prev:before {
    /* color: rgb(230, 125, 70) !important; */
    background-image: url("/images/chevron-left-solid-orange.svg") !important;
    opacity: 1;
}

.recommend .slick-next:before {
    background-image: url("/images/chevron-right-solid-orange.svg") !important;
    opacity: 1;
}

.card-img-wrapper {
    /* height: 180px; */
    width: 100%;
    overflow: hidden;
}

.card-img-wrapper__recommend {
    /* height: 120px; */
    width: 100%;
    overflow: hidden;
    /* z-index: -1; */
}

.card-title {
    width: 100%;
    height: 50px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.card-price {
    color: rgb(196, 42, 36);
    float: right;
    margin-bottom: 0;
}

.carousel_title__recommend {
    color: rgb(230, 125, 70);
}

.carousel_mark__recommend {
    font-size: 160px;
    width: 70px;
    color: rgb(225, 170, 150);
    z-index: 2;
}

.container-xl,
.container-lg,
.container-md,
.container-sm {
    width: 100%;
    padding-right: var(--bs-gutter-x, 0.75rem);
    padding-left: var(--bs-gutter-x, 0.75rem);
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 576px) {
    .container-sm {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
    .container-md, .container-sm {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container-lg, .container-md, .container-sm {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container-xl, .container-lg, .container-md, .container-sm {
        max-width: 1140px;
    }
}