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

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

:root {
    --base-color: #000000;
}

.text-primary{
    color: var(--primary-color);
}
.text-secondary{
    color: var(--fs-color-secondary);
}
.text-success{
    color: var(--fs-color-success);
}
.text-alert{
    color: var(--fs-color-alert);
}
.text-link{
    color: var(--fs-experimental-link-color);
}
.color-link:hover{
    color: var(--fs-experimental-link-color-hover);
}
.bg-primary{
    background-color: var(--primary-color);
}
.bg-secondary{
    background-color: var(--fs-color-secondary);
}
.bg-success{
    background-color: var(--fs-color-success);
}
.bg-alert{
    background-color: var(--fs-color-alert);
}
.bg-link{
    background-color: var(--fs-experimental-link-color);
}
.text-base{
    color: var(--base-color);
}
.bg-base{
    background-color: var(--base-color);
}
.nav-column>li>a,
.nav-dropdown>li>a,
.nav-vertical-fly-out>li>a,
.nav>li>a,
.header-button-1 a{
	font-size: 1rem;
/* 	letter-spacing: -0.35px; */
    color: var(--primary-color);
}
.nav-column>li:hover>a,
.nav-dropdown>li:hover>a,
.nav-vertical-fly-out>li:hover>a,
.nav>li:hover>a {
    color: var(--fs-color-secondary);
}	
/* Inherit trực tiếp từ body */
.text-inherit ,
.text-inherit p{
  color: currentColor !important;
}
#logo img{
	padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.footer-wrapper .social-icons .icon{
	margin-bottom: 1em!important;
}
.footer-logo{
	 display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/

.font-11px-small{
	font-size: 11px !important;
}
	
}
.text-white{
	color:#fff;
}
.image-167{
	.img-inner{
		height: 2px;
    	display: flex;

	}
}
.font-weight-900{
	font-weight: 900;
}
.section-title{
	h2{
/* 		font-family: 'Roboto'; */
		font-style: normal;
		font-weight: 900;
		font-size: 38px;
		line-height: 1;
		margin-bottom: 0;
	}
	h3{
/* 		font-family: 'Roboto'; */
		font-style: normal;
		font-weight: 900;
		font-size: 24px;
		line-height: 1;
		margin-bottom: 0;
	}
}
.blog-post-1{
	.image-cover{
		border-radius: 15px;
		overflow: hidden;
	}
	.cat-label{
		/* Chủ đề 1: */
		font-style: normal;
		font-weight: 400;
		font-size: 15px;
		line-height: 150%;
		/* identical to box height, or 26px */

		/* Red */
		color: #F72D21;
		text-transform: none !important;
	}
	.post-title,
		.post-title a{
		/* Làm thế nào rút ngắn quá trình phục hồi sau phẫu thuật thẩm mỹ */

		font-style: normal;
		font-weight: 800;
		font-size: 22px ;
		line-height: 28px;
		min-height: 44px;
		/* blue - nhạt */
		color: #0381E4;

		display: -webkit-box;
	  -webkit-line-clamp: 2;     /* Giới hạn 2 dòng */
	  -webkit-box-orient: vertical;
	  overflow: hidden;
	  text-overflow: ellipsis;
	}
	.is-divider{
		display: none !important;
	}
	.from_the_blog_excerpt{
		/* Lorem Ipsum is */

		font-style: normal;
		font-weight: 400;
		font-size: 15px;
		line-height: 150%;
		/* or 26px */
		text-align: justify;

		/* Text */
		color: #142F4D;
		
		display: -webkit-box;
	  -webkit-line-clamp: 4;     /* Giới hạn 2 dòng */
	  -webkit-box-orient: vertical;
	  overflow: hidden;
	  text-overflow: ellipsis;


	}
}
.blog-post-2{
	.image-cover{
		border-radius: 15px;
		overflow: hidden;
	}
	.cat-label{
		/* Chủ đề 1: */
		font-style: normal;
		font-weight: 400;
		font-size: 16px;
		line-height: 162.19%;
		/* identical to box height, or 26px */

		/* Red */
		color: #F72D21;
		text-transform: none !important;
	}
	.post-title,
		.post-title a{
		/* Làm thế nào rút ngắn quá trình phục hồi sau phẫu thuật thẩm mỹ */

		font-style: normal;
		font-weight: 800;
		font-size: 28px;
		line-height: 33px;
		min-height: 66px;
		/* blue - nhạt */
		color: #0381E4;

		display: -webkit-box;
	  -webkit-line-clamp: 2;     /* Giới hạn 2 dòng */
	  -webkit-box-orient: vertical;
	  overflow: hidden;
	  text-overflow: ellipsis;
	}
	.is-divider{
		display: none !important;
	}
	.from_the_blog_excerpt{
		/* Lorem Ipsum is */

		font-style: normal;
		font-weight: 400;
		font-size: 16px;
		line-height: 162.19%;
		/* or 26px */
		text-align: justify;

		/* Text */
		color: #142F4D;
		
		display: -webkit-box;
	  -webkit-line-clamp: 2;     /* Giới hạn 2 dòng */
	  -webkit-box-orient: vertical;
	  overflow: hidden;
	  text-overflow: ellipsis;


	}
}
.flickity-prev-next-button.previous{
/* 	background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 62.11%); */
	width: calc(32x);
	height: 100%;
	top: 0;
	left:0;
	opacity: 1;
	display: block;
	
	.flickity-button-icon{
		padding: 28%;
		left: 72%;
/* 		border-color: var(--primary-color)!important; */
/* 		fill: var(--primary-color)!important; */
	}
}
.flickity-prev-next-button.next{
/* 	background: linear-gradient(270deg, #FFFFFF 40.62%, rgba(255, 255, 255, 0) 99.13%); */
	width: calc(32x);
	height: 100%;
	top: 0;
	right:0;
	opacity: 1;
	display: block;
	border-color: var(--primary-color) !important;
	.flickity-button-icon{
		padding: 28%;
		left: 28% ;
/* 		border-color: var(--primary-color)!important; */
/* 		fill: var(--primary-color)!important; */
	}
}
.none-rating{
	.star-rating{
		display: none !important;
	}
}
.testimonial-meta{
	color: rgb(0, 0, 0);
}
.absolute-footer .container{
		
		#menu-footer-menu{
			border-bottom: none !important;
			padding-bottom: 0 !important;
		}
	}

.small-order-1{
	order: 1;
}
.small-order-2{
	order: 2;
}

.bsa-fixed-btns {
    position: fixed;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 15px; /* khoảng cách giữa các nút */
    z-index: 99999;
}

.bsa-fixed-btn {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-color);
    color: #fff;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    transition: transform .15s ease, box-shadow .15s ease;
    -webkit-tap-highlight-color: transparent;
    pointer-events: auto;
}

.bsa-fixed-btn i {
    font-size: 22px;
    line-height: 1;
}

.bsa-fixed-btn:hover,
.bsa-fixed-btn:focus { 
    transform: scale(1.06); 
    box-shadow: 0 10px 26px rgba(0,0,0,.32); 
    color: #fff !important;
}

/* màu riêng từng nút */
.btn-dangky { background: var(--fs-color-primary); }   /* cam */
.btn-zalo   { background: #0088ff; }   /* xanh zalo */
.btn-hotline{ background: var(--fs-color-primary); }   /* hồng hotline */

/* Fallback tooltip */
.bsa-fixed-btn[data-tippy-content]:not([data-bsa-has-tippy]):hover::after,
.bsa-fixed-btn[data-tippy-content]:not([data-bsa-has-tippy]):focus::after {
    content: attr(data-tippy-content);
    position: absolute;
    right: 70px;
    top: 50%;
    transform: translateY(-50%);
    white-space: nowrap;
    font-size: 13px;
    padding: 6px 10px;
    border-radius: 4px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.18);
    background: rgba(0,0,0,0.85);
    color: #fff;
    pointer-events: none;
}


.copyright-footer{
	color:white;
}
.footer-primary{
	margin-left: auto!important;
}
.footer-wrapper .ux-menu-link__text{
	word-break: break-word;
}
    @media (max-width:420px) {
        .bsa-fixed-btn { right: 12px; width: 54px; height: 54px; }
    }
/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	.image-167{
		.img-inner{
			height: 7px !important;
			display: flex;

		}
	}
	.section-title{
		h2{

			font-size: 78px;
			line-height: 1;
		}
		h3{
			font-size: 49px;
			line-height: 1;
		}
	}
	.blog-post-1{
		.image-cover{
			border-radius: 15px;
			overflow: hidden;
		}
		.cat-label{
			font-size: 16px;
			line-height: 162.19%;
		}
		.post-title,
		.post-title a{
			font-size: 28px;
			line-height: 33px;
			min-height: 66px;
			-webkit-line-clamp: 2;
		}
		.is-divider{
			display: none !important;
		}
		.from_the_blog_excerpt{
			font-size: 16px;
			line-height: 162.19%;
			
			-webkit-line-clamp: 8; 


		}
	}
	.blog-post-2{
		.image-cover{
			border-radius: 15px;
			overflow: hidden;
		}
		.cat-label{
			font-size: 16px;
			line-height: 162.19%;
		}
		.post-title,
		.post-title a{
			font-size: 28px;
			line-height: 33px;
			min-height: 99px;
		  -webkit-line-clamp: 3;     /* Giới hạn 2 dòng */
		  
		}
		.is-divider{
			display: none !important;
		}
		.from_the_blog_excerpt{
			font-size: 16px;
			line-height: 162.19%;
		  -webkit-line-clamp: 2;     /* Giới hạn 2 dòng */
		  


		}
	}
	
	.flickity-prev-next-button.previous{
/* 		background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 62.11%); */
		width: calc(48px);
		height: 100%;
		top: 0;
		left:0;
		opacity: 1;
		display: block;
		.flickity-button-icon{
			padding: 28%;
			left: 72%;
		}
	}
	.flickity-prev-next-button.next{
/* 		background: linear-gradient(270deg, #FFFFFF 40.62%, rgba(255, 255, 255, 0) 99.13%); */
		width: calc(48px);
		height: 100%;
		top: 0;
		right:0;
		opacity: 1;
		display: block;
		.flickity-button-icon{
			padding: 28%;
			left: 28% ;
		}
	}
	.absolute-footer .container{
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		gap: 2rem;
		#menu-footer-menu{
			border-bottom: none !important;
			padding-bottom: 0 !important;
		}
	}
	.small-order-1{
		order: unset;
	}
	.small-order-2{
		order: unset;
	}
	.footer-logo{
		display: flex
;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
	}
	
}