/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/


@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/


}


@media only screen and (max-width: 64em) {
    /*************** ADD TABLET CSS HERE  ***************/

	



    .country-list {
        .box-image {
            width: 100% !important;
        }



    }
	



}
.from_the_blog_excerpt  {
	font-weight: normal;
}

.category, .search  {
	
	.post-item {
		
		.col-inner {
			height: 100%;
		}
		
		.from_the_blog_excerpt  {
			cursor: pointer;
    font-size: 0;
			
						&:hover {
							&:after {
				
				            background-color: var(--fs-color-secondary);
					color: #fff;
								}
			}
		}
		
		.from_the_blog_excerpt::after {
    content: "Đọc thêm"; /* Chèn nội dung văn bản */
    
    /* Định dạng nút bấm */
    font-size: 13px; /* Đặt lại kích thước chữ để hiển thị nội dung */
    line-height: 26px; /* Căn giữa dọc văn bản trong chiều cao 30px */
    text-align: center;
    display: block; /* Quan trọng để áp dụng width/height và margin: auto */

    /* Định dạng hình dáng */
    border: 1px solid ;
height: fit-content;
            width: fit-content;
                margin: 15px auto 0 auto;
    border-radius: 100px; /* Tạo hình tròn/pill shape */
    
    /* Thiết lập màu sắc nếu cần */
    color: var(--fs-color-secondary); 
    border-color: var(--fs-color-secondary);
			            pointer-events: none;
			    padding: 4px 20px;
			
			

			
			
			
}
	
	.post-title {
/* 		display: none; */
	}
	
    .post-title::after {
        margin: 10px auto;
        max-width: 300px;
        display: none;
        font-size: 16px;
        text-transform: none;
        content: "Xem thêm";
        background: transparent;
        border: 1px solid #fff;
        color: #fff;
        padding: 6px 30px;
        border-radius: 100px;
        cursor: pointer;
        white-space: nowrap;
        pointer-events: none;
    }
		}
}



.section-title b {
    opacity: 0 !important;
}


.blog-image-border {

    img,
    .box-image {
        border-radius: 20px;
    }
}


.country-list {

    .box-text-inner {
        font-weight: bold;
    }

    .box-image {
        width: 85%;

        &.image-cover {
            width: 100%;
        }
    }
}


.location-list {

    .box-text-inner {
        display: flex;
        flex-direction: column;
    }

    .post-title {
        order: 1;
        font-weight: bold;
        font-size: 1.5em;
    }

    .cat-label {
        display: inline-flex;
        align-items: center;
        text-align: center;
        margin-left: 2px;
        font-size: 15px;
        font-weight: 500;
        line-height: 20px;
        color: #808285;
        order: 2;
        margin: 7px auto;


        &::before {
            content: url('/wp-content/uploads/2025/11/map-pin.svg');


            /* Ensure it is displayed inline and respects the font */
            display: inline-block;

            /* Add some space between the icon and your text */
            margin-right: 8px;

            /* Optional: Adjust size and color */
            color: var(--fs-color-secondary);
            font-size: 2em;
        }

    }

    .from_the_blog_excerpt {
        order: 3;

        font-size: 14px;
        font-weight: normal !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
    }

}



#post-list,
.blog-list {
    .box-text-inner {
        font-weight: bold;
    }


    .box {
        border-radius: 20px;
    }

    .col-inner {
        border-radius: 20px;
        box-shadow: 0 4px 30px 0 rgba(124, 0, 111, 0.12);

    }

    .col-inner:hover {
        box-shadow: 0 4px 30px 0 rgba(124, 0, 111, 0.3);

    }

    .box-image {
        border-radius: 20px 20px 0 0;

    }

    .image-cover {
        border-radius: 20px 20px 0 0;

    }

    .button {
        border-radius: 100px;
    }
}



.button.is-outline {
    border: 1px solid !important;
    line-height: dummy !important;
}

.box-blog-post .is-divider {
    height: 0 !important;
}

.slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button {
    margin-top: -5%;
}



.slider-nav-circle .flickity-prev-next-button:hover svg {
    fill: #fff !important;
    background-color: #686868b3;
    border-color: transparent;
}

.slider-nav-circle .flickity-prev-next-button .arrow,
.slider-nav-circle .flickity-prev-next-button svg {
    border-radius: 35%;
}

.flickity-page-dots {
    margin: -15px;
}


.flickity-page-dots .dot.is-selected {
    background-color: var(--fs-color-secondary);
}

.flickity-prev-next-button {
    width: 60px;
}

.flickity-prev-next-button.prev {
    left: 0;
    transform: translateX(20%);
}

.flickity-prev-next-button.next {
    right: 0;
    transform: translateX(-20%);
}

.is-small,
.is-small.button {
    font-size: 0.9em;
    text-transform: inherit;
    padding: 4px 20px;
}

.section-voucher {
    .section-bg {
        img {
            object-fit: none;
            -o-object-position: 50% 50%;
            object-position: -90% 100%;
        }
    }
}

#top-bar {
    display: none;
}

.trai_nghiem {
    border-radius: 30px 30px 0 0;
    margin-top: -100px;
    background: #fff;
}


.search-block {
	



    .col-inner {
        border-radius: 20px;
        box-shadow: 0 4px 30px 0 rgba(124, 0, 111, 0.12);
        z-index: 99;

    }

}

table {
    border-collapse: collapse;

    td {
        border: 1px solid #ccc;
        padding: 15px !important;
    }
}

.post-title.is-large a {
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.box_text_exc {
    font-size: 15px;
}

.header-button {
    .button {
        padding: 4px 20px;
    }
}

.header-inner {
    .logo {
/*         padding-bottom: 15px; */
    }
}

.trai-nghiem-list {

    .box-text {
        padding-left: 10px;
        padding-right: 10px;

    }

    .col-inner:hover {

        .box-text {
            height: 100%;
        }

        .post-title {
            transform: translateY(200%);
        }

        .post-title::after {
            display: unset;
        }
    }

    .box-overlay.dark .box-text,
    .box-shade.dark .box-text {
        text-shadow: 2px 2px 3px rgba(0, 0, 0, .5);
    }

    .post-title {
        display: flex;
        flex-direction: column;
    }

    .post-title::after {
        margin: 10px auto;
        max-width: 300px;
        display: none;
        font-size: 16px;
        text-transform: none;
        content: "Xem thêm";
        background: transparent;
        border: 1px solid #fff;
        color: #fff;
        padding: 6px 30px;
        border-radius: 100px;
        cursor: pointer;
        white-space: nowrap;
        pointer-events: auto;
        /* cho phép click */
    }

}

.win-button {
    padding: 4px 30px;
}

#footer {
    span {
        font-size: 15px;
    }

    .ux-menu-link__link {
        padding-bottom: 0;
        padding-top: 0;
    }


    .section-title-normal {
        border-bottom: 1px solid rgba(35, 31, 32, 0.24)
    }

    .section-title-normal span {
        border-bottom: 1px solid #F05B24;
        margin-bottom: -1px;
    }


}


.absolute-footer {
    display: none;
}

.win-title {
    .section-title span {
        text-transform: none;
    }

    .section-title-normal span {
        border-bottom: none;
    }
}





.page-template {
    .page-header-excerpt {
        display: none;

    }
}

.cau-chuyen {
    background: radial-gradient(50% 50% at 50% 50%, #DECFE6 0%, #FCF2FF 100%);
}

.cot-loi {}

.cot-loi-right {
    width: 150px !important;
    position: absolute;
    right: 0;
    bottom: 0;
}


.cot-loi-left {
    width: 150px !important;
    position: absolute;
    left: 0;
    bottom: 0;
}

.image-bounce {
    position: absolute;
    top: -75px;
    right: -30px;
    animation: bounceSlow 2.5s ease-in-out infinite alternate-reverse;
    z-index: 10;
    width: 80px !important;
    height: 150px;
}

@keyframes bounceSlow {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }

    50% {
        -webkit-transform: translateY(15px);
        transform: translateY(15px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.banner-grad {
    border-radius: 20px;
}



.banner-grad-blue {
    background: linear-gradient(-180deg, rgba(51, 112, 204, 0) 0%, rgba(29, 86, 172, 0.8) 62.49%, #0F4799 100%);
}

.banner-grad-purple {
    background: linear-gradient(-180deg, rgba(162, 36, 230, 0) 0%, rgba(132, 36, 230, 0.7) 54.17%, #6524E6 100%);
}

.banner-grad-orange {
    background: linear-gradient(-180deg, rgba(231, 145, 40, 0) 0%, rgba(231, 132, 40, 0.692929) 51.55%, rgba(231, 132, 40, 0.7) 51.56%, #E77828 100%);
}

.banner-grad-red {
    background: linear-gradient(-180deg, rgba(230, 38, 46, 0) 0%, rgba(204, 27, 34, 0.7) 54.17%, #CC141C 100%);
}

.banner-grad-green {
background: linear-gradient(-180deg, rgba(52, 170, 17, 0) 0%, rgba(43, 128, 18, 0.6) 48.96%, #1F590D 100%);
}

.banner-grad-cyan {
    background: linear-gradient(-180deg, rgba(36, 214, 230, 0) 0%, rgba(35, 215, 216, 0.6) 49.48%, #0F998E 100%);
}

.banner-grad-black {
	    background: linear-gradient(-180deg, rgba(35, 31, 32, 0) 0%, #231F20 100%);
}

.banner-outer {
    border-radius: 20px;

    .banner,
    .banner-inner,
    .banner-bg {
        border-radius: 20px;
        // Áp dụng transition 1s cho các thuộc tính chung
        transition: all 1s ease;
    }

    .banner-btn {
        visibility: hidden;
        opacity: 0;
        // Áp dụng transition 1s cho opacity và visibility
        transition: opacity 1s ease, visibility 1s ease;
    }

    .text-box-content {
        // Áp dụng transition 1s cho các thuộc tính thay đổi khi hover (position, transform)
        transition: all 1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    .banner-grad {
        // Áp dụng transition 1s cho thuộc tính height
        transition: height 1s ease-out;
    }

    .banner-grad-black {
        // Áp dụng transition 1s cho thuộc tính background
        transition: background 1s ease;
    }

    &:hover {
        .text-box-content {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 100%;
        }

        .banner-grad {
            height: 100%;
        }

        .banner-grad-black {
            background: rgba(99, 45, 142, 0.7) !important;
        }

        .banner-btn {
            visibility: visible;
            opacity: 1;
        }
    }
}

.about-diem-den {

    .banner,
    .banner-bg {
        border-radius: 20px;
    }

    .banner-desc,
    .banner-btn {
        display: none;
    }

    .banner:hover {

        .banner-desc,
        .banner-btn {
            display: inline-block;
        }

        .banner-grad {
            min-height: 100%;
        }

        .banner-grad-1 {
/*             background: #0f4799de; */
        }
		
			.text-box {
		    overflow-y: auto;
    max-height: 100%;
	}
    }
	

}

.trai-nghiem-win {
	    background: linear-gradient(100.84deg, #99268F 2.77%, #60276E 52.92%, #99268F 102.04%);
}

.cam-nhan-col {
    transition: all 0.3s;
	
	
	.cam-nhan-avatar img {
		border-radius: 50px;
		border: 2px solid #DC502C;
		aspect-ratio: 1 /1;
	}
	
	.col-inner {
    border-top: 5px solid transparent;
		
		border-radius: 20px;
	}
	
	&:hover {
		    transform: rotate(-5deg);
		
		.col-inner {
    border-top: 5px solid #B866CC;
			
		}
	}
}

.cot-loi-col {
	
	flex-basis: 20%;
        max-width: 20%;
	
	
	img, .banner, .banner-bg {
		border-radius: 20px;
	}
}

.thuong-hieu-right {
		    width: 200px !important;
    position: absolute;
    right: 0;
    top: 0;
}

.thuong-hieu-logo {
	    width: 200px !important;
    position: absolute;
    left: -100px;
    top: -100px;
}

.about-title {
	.section-title-normal span, .section-title-main {
		background: linear-gradient(91.43deg, #622D8F -11.94%, #F15921 104.42%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    border-bottom: none;
	}
	
	.section-title-normal {
    border-bottom: none;
}
	
	a {
		    position: absolute;
    right: 0;
		            color: var(--fs-color-secondary);

	}
}

.thuong-hieu-gallery {
	img, .box-image {
		    border-radius: 20px;
	}
	.gallery-col:nth-child(1) {
		z-index: 5;
		transform: rotate(-5.65deg);
    position: absolute;
    top: 0px;
    left: 3%;
	}
	
		.gallery-col:nth-child(2) {
		z-index: 4;
			
    transform: rotate(-12.85deg);
    position: absolute;
    top: 120px;
    left: 20%;
	}
	
		.gallery-col:nth-child(3) {
		z-index: 3;
			
    position: absolute;
    top: 0px;
    right: 14%;
    transform: rotate(-0.62deg);
	}
	
		.gallery-col:nth-child(4) {
		z-index: 2;
			
    position: absolute;
    top: 150px;
    right: -10px;
    transform: rotate(-7.89deg);
	}
	
		.gallery-col:nth-child(5) {
		z-index: 1;
			
    position: absolute;
    top: 70px;
    right: -25%;
    transform: rotate(10deg);
	}
}

.thu-vien-anh {
	img, .box-image {
		    border-radius: 20px;
	}
}

.cc-cat-post-dropdowns {
	display: flex;
}

#cc_cat_select, #cc_post_select {
	    height: 50px;
    border-radius: 10px;
    margin-bottom: 0;
}

.single-post {
	.page-title {
		    height: 600px;
		.flex-col.flex-center.text-center {
			display: none;
		}
		
.title-overlay {
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0.4),
        rgba(0,0,0,0)
    ) !important;
}
	}
	.entry-content {
		padding: 0;
	}
	
	.article-inner.has-shadow {
    background-color: transparent !important;
		box-shadow: none !important;
}
	
	.post-sidebar {
		border-left: none !important;
		    padding-top: 0 !important;
		.col.small-12.large-12 {
			    background: #fff;
			    border: 1px solid #EBEBEB;
    border-radius: 6px;
			margin-bottom: 15px;
			
		}
		
		.section-title-main {
			    margin-top: 15px;
    text-transform: none;
		}
		
		.section-title-container {
    margin-bottom: 0 !important;
}
	}
	
	img {
		border-radius: 6px;
	}
	
	input {
		    border-radius: 6px 0 0 6px;
	}
	
	button {
		border-radius: 0 6px 6px 0;
	}
	
	.blog-share {
		text-align: left !important;
		
		.is-divider {
			opacity: 0;
			
		}
	}
	
	.entry-date {
		margin-bottom: 1rem;
	}
}

.button i, button i {
    top: 0;
}

.trai-nghiem-background  {
	position: absolute;
/* 	top: -50%; */
	
}

.uu-dai-background {
	position: absolute;
	
}

.diem-nhan-background  {
	position: absolute;
}

.kham-pha-background  {
	position: absolute;
}

.home.page-template #content {
	    background-color: #fff;
}

.fab-group {
	    position: fixed;
    bottom: 0;
        left: 15px;
	    z-index: 999;
	display: flex;
    flex-direction: column;
}

.fab-btn {
	margin-right: 0;
	    width: 50px;
    height: 50px;
    border-radius: 100px;
	
	i {
  position: absolute;
  top: 50%; right: 50%;
  transform: translate(50%,-50%);
		margin-left: 0 !important;
		    margin-right: 0 !important;
        font-size: 1.2rem;
	}
	
	span {
		display: none;
	}
}

.fab-btn-2 {
	background-color: #25d366;
}