:root{
    --main-overlay-col: linear-gradient(180deg, rgba(0, 0, 0, 0) 65.93%, rgba(0, 0, 0, 0.8) 100%);
    --vinno-border-radius: 16px;
    --main-color: #B11B2B;
    --grey: #F4F4F4;
    --lightgrey: #F4F6F8;
    /* --lightgrey-border: #00000026; */
    --lightgrey-15: #00000026;
    --lightgrey-85: #000000D9;
    --lightgrey-65: #000000A6;
    --darkgrey-15: #FFFFFF26;
    --darkgrey-45: #FFFFFF73;
    --darkgrey-85: #FFFFFFD9;
    --lighter-orange: #F7AC5D;
    --light-orange: #FFA900;
    --orange: #D0661D;
    --blue: #01417E;
    --lightyellow: #FFFEEC;
}
/* Cấu hình chung */
a{
    transition: all 0.3s ease;
}
a:hover{
    color: var(--light-orange)!important;
}

/* Display */
@media screen and (min-width: 992px) {
    .w-lg-75{
        width: 75%;
    }
    .w-lg-50{
        width: 50%;
    }
    .w-lg-25{
        width: 25%;
    }
}
.w-img-50 img{
    width: 50%;
}
.w-img-100 img{
    width: 100%;
}
.fit-cover,
.fit-img-cover img{
    object-fit: cover;
}
.fit-contain,
.fit-img-contain img{
    object-fit: contain;
}

.h-50px{
    height: 50px;
}

/* Font size */
.fs-13px{
    font-size: 13px;
}
.fs-14px{
    font-size: 14px;
}
.fs-18px{
    font-size: 18px;
}
.fs-20px{
    font-size: 20px;
}
.fs-24px{
    font-size: 24px;
}
.fs-28px{
    font-size: 28px;
}
.fs-30px{
    font-size: 30px;
}

/* Font Weight */
.fw-link-bold a{
    font-weight: bold;
}
.fw-link-light a{
    font-weight: light;
}

/* Border */
.border-solid{
    border: solid;
}
.borders-top{
    border-top: solid;
}
.borders-end{
    border-right: solid;
}
.borders-bottom{
    border-bottom: solid;
}
.borders-start{
    border-left: solid;
}
.border-radius-main,
.rounded-main,
.rounded-main-img img{
    --bs-border-opacity: 1;
    border-radius: var(--vinno-border-radius) !important;
}
.border-lightgrey{
    --bs-border-opacity: 1;
    border-color: var(--lightgrey-15) !important;
}
.border-grey{
    --bs-border-opacity: 1;
    border-color: var(--lightgrey-65) !important;
}
.border-darkgrey{
    --bs-border-opacity: 1;
    border-color: var(--darkgrey-45) !important;
}
.border-lighter-orange{
    --bs-border-opacity: 1;
    border-color: var(--lighter-orange) !important;
}
.border-orange{
    --bs-border-opacity: 1;
    border-color: var(--light-orange) !important;
}
.border-blue{
    --bs-border-opacity: 1;
    border-color: var(--blue) !important;
}
.border-main{
    --bs-border-opacity: 1;
    border-color: var(--main-color) !important;
}
.border-w-1{
    border-width: 1px;
}
.border-w-2{
    border-width: 2px;
}
.border-w-3{
    border-width: 3px;
}
.border-w-4{
    border-width: 4px;
}
.border-w-5{
    border-width: 5px;
}

@media(min-width: 992px){
    .border-radius-lg-main,
    .rounded-lg-main,
    .rounded-lg-main-img img{
        --bs-border-opacity: 1;
        border-radius: var(--vinno-border-radius) !important;
    }
}
/* Text */
.text-main,
.text-link-main a{
    color: var(--main-color);
}
.text-link-black a{
    color: black;
}
.text-link-white a{
    color: white;
}
.text-lightgrey-65{
    color: var(--lightgrey-65);
}
.text-darkgrey-85{
    color: var(--darkgrey-85);
}
.trim-1-line{
    -webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
}
.trim-2-line{
    -webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
}
.trim-3-line{
    -webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	display: -webkit-box;
	text-overflow: ellipsis;
}
.link-white a{
    color: white;
}

/* Background */
.bg-color-main{
    background-color: var(--main-color) !important;
}
.bg-color-white{
    background-color: white !important;
}
.bg-color-lightgrey{
    background-color: var(--lightgrey) !important;
}
.bg-color-orange{
    background-color: #F7AC5D !important;
}
.bg-color-grey{
    background-color: var(--grey) !important;
}
.main-overlay-col{
    background: var(--main-overlay-col) !important;
}
.bg-color-darkgrey-15{
    background: var(--darkgrey-15) !important;
}
.bg-color-lightgrey-15{
    background: var(--lightgrey-15) !important;
}
.bg-color-lightgrey-85{
    background-color: var(--lightgrey-85)!important;
}
.bg-red-linear{
    background-image: linear-gradient(196.83deg, #CC2A3B 22.17%, #871215 40.02%);
}
.bg-color-blue{
    background: var(--blue) !important;
}

.bg-color-lightyellow{
    background: var(--lightyellow);
}
/* Scroll */
.scroll-none::-webkit-scrollbar {
    display: none;            /* Ẩn scrollbar cho đẹp */
}

/* Slick */
.slick-gap-10px .slick-slide {
    padding: 0 10px; /* tạo khoảng cách trái – phải */
}
.slick-gap-10px .slick-list {
    margin: 0 -10px; 
}

/* Animation */
.transition-3{
    transition: all 0.3s ease;
}



/* Resposive max-width */
@media(max-width: 768px){
    .px-mobile-0{
        padding-right: 0!important;
        padding-left: 0!important;
        margin-right: 0!important;
        margin-left: 0!important;
    }
}

.container{
    padding-left: 20px!important;
    padding-right: 20px!important;
}

/* Z-index */
.zindex-1{
    z-index: 1;
}
.zindex-2{
    z-index: 2;
}
.zindex-3{
    z-index: 3;
}