/*
Theme Name:           Flatsome
Theme URI:            http://flatsome.uxthemes.com
Author:               UX-Themes
Author URI:           https://uxthemes.com
Description:          Multi-Purpose Responsive WooCommerce Theme
Version:              3.20.5
Requires at least:    6.4
Requires PHP:         7.4
WC requires at least: 8.3
Text Domain:          flatsome
License:              https://themeforest.net/licenses
License URI:          https://themeforest.net/licenses
*/


/***************
All custom CSS should be added to Flatsome > Advanced > Custom CSS,
or in the style.css of a Child Theme.
***************/
/*Form*/

.content-consulting-support .wpcf7-spinner {
    position: absolute;
}
.content-consulting-support input {
    border-radius: 10px !important;
    height: 50px !important;
}
.content-consulting-support .name-form, .content-consulting-support .phone-form {
    margin-bottom: 25px;
}
.title-consulting-support p {
    font-weight: 600;
    font-size: 25px;
}
.title-heading-consulting-support p {
    color: #fff;
    margin-bottom: 1rem;
}
.col-image-100 .col-inner, .col-image-100 .img, .col-image-100 .img-inner, .col-image-100 img {
	height: 100%;
	object-fit: cover;
}
.section-price .table-scroll-custom table {
    border-left: 0;
    border-right: 1px solid #04836f;
}
.section-price .table-scroll-custom tbody td {
    border-left: 1px solid #04836f;
	border-bottom: 1px solid #04836f;
	color: #000;
}
/*Home*/
.page-service .box-text.text-center.is-small {
    bottom: -37px;
    width: 100%;
    border-radius: 0px 0px 15px 15px;
    padding: 10px 5px;
    font-size: 15px;
    font-weight: 600;
}
/*page Implant*/
.video-custom {
    border: 1px solid #000000;
    border-radius: 10px;
}
span.number-heading {
    position: absolute;
    font-size: 20rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: 0.5s;
    line-height: 1;
    font-family: system-ui;
    opacity: .1;
    color: #036f60;
}
.tab-page-implant .nav-vertical {
	width: 10%;
}
.tab-page-implant .tab a {
    justify-content: center;
}
.tab-page-implant ul li {
    border: 0 !important;
}
.tab-page-implant li.tab a {
    border: 1px solid #038470;
    color: #038470;
}
.tab-page-implant li.active a {
	color: #fff;
}
.tab-page-implant ul li.tab {
    margin-bottom: 25px;
}
.tab-page-implant .nav-vertical+.tab-panels {
	border-left: 1px solid #eee;
	margin-left: 2rem;
}
.row-procedural-steps {
    border: 1px solid #eee;
    padding: 2rem 0rem 0rem 2rem;
    box-shadow: 1px 1px 5px #00000030;
    border-radius: 20px;
}
span.number-heading.white-color{
    color: #ffffff;
	top: 9%;
}
.table-price-implant thead tr {
    background: #047968;
    color: #fff;
}
.table-price-implant thead tr th, .table-price-implant tbody td {
    padding: 10px !important;
}
.table-price-implant tbody tr:nth-child(odd) td {
	background: #0479681f;
}
.table-price-implant td {
    color: #037060;
	font-size: 15px;
	width: 15%;
}
.table-price-implant td:nth-child(2) {
    width: 30%;
}
.table-price-implant td:nth-child(4), .table-price-implant td:nth-child(5) {
    width: 14%;
}
.table-price-implant button {
    background: linear-gradient(90deg, #dfaa23 .01%, #fbf08d 51.44%, #dfaa23 100%);
    border-radius: 50px;
    color: #048571;
    padding: 0px 20px;
}
.table-price-implant button a {
    color: #048571;
}
.col-shape-1 .col-inner, .col-shape-2 .col-inner, .col-shape-3 .col-inner {
    height: 100%;
    position: relative;
    padding: 36px 36px;
}
.col-shape-1 .col-inner:before {
    content: "";
    position: absolute;
    top: 40%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    background-image: url(/wp-content/uploads/2026/08/shape-1-1.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.col-shape-2 .col-inner:before {
    content: "";
    position: absolute;
    top: 40%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    background-image: url(/wp-content/uploads/2026/08/shape-3.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.col-shape-3 .col-inner:before {
    content: "";
    position: absolute;
    top: 40%;
    left: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%);
    background-image: url(/wp-content/uploads/2026/08/shape-5.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -1;
}
.col-shape-3 .col-inner {
    padding-left: 55px;
    padding-right: 25px;
}
.row-question-main {
    padding: 0 5rem;
}
.accordion-fqa .accordion-title {
    background: #037061;
    color: #fff;
    border-radius: 10px;
}
.accordion-fqa .accordion-inner {
    border: 1px solid #037061;
    border-radius: 10px 10px 10px 10px;
}
.accordion-fqa .accordion-item {
	margin-bottom: 1rem;
}
.row-qt .col-inner {
    border: 1px solid #000;
    border-radius: 20px;
    padding: 0rem 1rem 1rem 1rem;
    height: 100%;
}
.row-qt .title-qt p {
    background: #036d5e;
    border-radius: 100px;
    padding: 8px 10px;
    text-align: center;
    color: #fff;
    margin-top: -22px;
	position: relative;
}
.row-qt .title-qt p:before {
    position: absolute;
    content: "";
    height: 6px;
    width: 6px;
    background: #fff;
    left: 15px;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100px;
}
.row-qt .title-qt p:after {
    position: absolute;
    content: "";
    height: 6px;
    width: 6px;
    background: #fff;
    right: 15px;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100px;
}
.row-qt .col {
    margin-top: 25px;
}
.col-divider-right {
    border-right: 1px solid #eee;
}
.row-info-question-2 .col-inner {
    border: 1px solid #fff;
    padding: 20px;
    border-radius: 10px;
}
.row-question-3 .col-inner {
    border: 1px solid #037c69;
    padding: 15px;
    border-radius: 10px;
    height: 100%;
}
.row-question-5 .col-inner {
    background: #048470;
    padding: 20px;
    height: 100%;
    border-radius: 10px;
}
.text-border-color h3 {
    margin-bottom: 0;
}
/*gioi thieu*/
.row-bs-about .col-inner {
    height: 100%;
}
.row-bs-about .box-text-bottom {
    height: 100%;
}
.title-facilities-about .section-title {
    background: #038470;
    border-radius: 50px;
    padding: 10px;
    color: #fff;
    font-size: 22px;
}
.title-facilities-about .section-title-main {
	width: 100%;
	position: relative;
}

.title-facilities-about .section-title b {
    background-color: rgb(255 255 255 / 0%);
    
}
.title-facilities-about .section-title-main:before {
    position: absolute;
    content: "";
    height: 10px;
    width: 9px;
    background: #fff;
    z-index: 1;
    left: 25px;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100px;
}
.title-facilities-about .section-title-main:after {
    position: absolute;
    content: "";
    height: 10px;
    width: 9px;
    background: #fff;
    z-index: 1;
    right: 25px;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 100px;
}
.section-facilities-about {
    padding-bottom: 0 !important;
}
.row-map-about:before {
    position: absolute;
    content: "";
    height: .5px;
    width: 100%;
    background: #048672;
    top: 23%;
}
.row-map-about {
    position: relative;
}
.row-content-grid .col-inner {
    background: #d29540;
    padding: 1rem;
    height: 100%;
    border-radius: 10px;
    color: #fff;
}
.row-4-value .col-inner {
    border: 1px solid #048571;
    border-radius: 10px;
    padding: 20px;
    height: 100%;
}
.text-border-white p {
    border: 1px solid #fff;
    padding: 15px;
    border-radius: 5px;
}
/*Dán Sứ Veneer*/
.row-price-margin .icon-box p {
    margin-bottom: 0;
}
.row-price-margin .icon-box:not(:last-child) {
    margin-bottom: 25px;
}
/*Doi ngu bac si*/
.row-info-data .col-inner {
    background: #048471;
    padding: 20px;
    border-radius: 10px;
    height: 100%;
    border: 1px solid #048471;
    box-shadow: 1px 1px 5px #51290047;
}
.row-info-data p {
    margin-bottom: 0;
}
.row-info-data img {
    padding: 10px;
    border-radius: 100%;
    background: #fff;
    margin-top: -55px;
    border: 1px solid #03836f;
}
.section-content-dn .divider {
    margin-bottom: 45px;
}
.row-avata-dn .box {
    background: #036d5e;
    border-radius: 15px;
	 height: 100%;
}
.row-avata-dn .col-inner {
    height: 100%;
}
.row-4-criteria .icon-box:not(:last-child) {
    margin-bottom: 2rem;
}
.col-img-philosophy {
    padding-bottom: 0;
}
.box-margin-bottom:not(:last-child) {
    margin-bottom: 2rem;
}
.box-margin-bottom p {
    margin-bottom: 8px;
}
.box-margin-bottom .icon-box-text {
    border: 1px solid #036d5e;
    margin-left: 1rem;
    padding: 5px;
    border-radius: 10px;
}
/*Nieng rang*/
.row-procedure-1 .col-inner {
    background: #cd8a32;
    padding: 1rem;
    border-radius: 10px;
    color: #fff;
    height: 100%;
	position: relative;
}
span.number-smal-color {
    position: absolute;
    background: #fff;
    color: #cd8a32;
    font-weight: 600;
    padding: 10px 15px;
    border-radius: 100%;
    top: -27px;
    font-size: 25px;
}

.sticky-type-service .col-inner {
    position: sticky;
    top: 175px;
}
.takecareof .col-inner {
    background: #048470;
    color: #fff;
    padding: 1rem;
    border-radius: 10px;
	height: 100%;
}
.shouldbeavoided .col-inner {
    border: 1px solid #048470;
	padding: 1rem;
    border-radius: 10px;
	height: 100%;
}
.row-procedure-2 .col-inner {
    background: #ddac5e;
    padding: 15px;
    border-radius: 10px;
    height: 100%;
	position: relative;
}
.row-procedure-2 .number-procedure {
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translate(-50%, -50%);
    font-size: 60px;
    color: #8e682d;
    font-weight: 600;
    opacity: .2;
}
/*Phẩu thuật hở lợi*/
.fqa-doc .accordion-inner {
    border: 1px solid #048370;
    border-radius: 10px;
}
.fqa-doc .accordion-title.active {
    background: #048370;
    color: #fff;
}
.fqa-doc .accordion-item {
    margin-top: 1rem;
}
.fqa-doc .accordion-title {
    border: 1px solid #048370;
    border-radius: 10px;
}
.col-color-bg .col-inner {
    background: #04836f;
    border-radius: 20px;
    color: #fff;
    padding: 20px;
}
/*mac dinh*/
.ul-border-grid-2 ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 10px;
}
.row-gallery-image-feedback .col {
    padding: 5px;
}
.video-custom a.button {
    background: #f00;
}
.height-100 .col-inner, .height-100 .text-height-100 {
    height: 100%;
}
.section-price .img-absolute {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    opacity: .2;
    transform: translate(-50%, -50%);
}
.padding-0 {
	padding: 0;
}
.color-main {
	background: rgb(4, 134, 114);
}
.color-gold {
    background: rgb(207 141 50);
}
.position-relative {
	position: relative;
}
.color-gold .button-form {
    background: #5e3a08 !important;
}
.img-radius-20 img, .img-radius-20 {
	border-radius: 20px;
}
.text-justify {
	text-align: justify;
}
.img-radius-10 img, .img-radius-10{
	border-radius: 10px;
}
.table-scroll-custom  thead tr td, .table-scroll-custom  thead tr th  {
	background: #04836f;
	color: #fff;
	padding: 10px !important;
}
.table-scroll-custom tbody tr:nth-child(odd) {
    background-color: #04836f21;
}
.table-scroll-custom  tbody td {
	padding: 10px !important;
}
.table-scroll-custom table {
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
}
.text-border-color {
    border: 1px solid #fff;
    padding: 15px 10px;
    border-radius: 50px;
    margin-bottom: 2rem;
}
.row-col-height-100 .col-inner {
    height: 100%;
}
.row-col-height-100 .box {
    height: 100%;
    border-radius: 15px;
}
.more-custom-add {
    position: relative; 
}

.more-custom-add.is-collapsed::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 60px; 
    background: linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 1) 90%
    );
    pointer-events: none;
}

.more-custom-toggle-btn {
    display: inline-block;
    margin-top: 8px;
    border: none;
    cursor: pointer;
    font-weight: 600;
    text-decoration: underline;
}
.more-custom-toggle-btn {
    background: #cf8d32;
    text-decoration: none;
    color: #fff;
    border-radius: 5px;
}
.text-more-color.is-collapsed::after {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgb(3 109 94) 90%) !important;
}
.button-contact-1 {
    border: 1px solid #fff !important;
}
.button-contact-1 i, .button-contact-1 span {
    color: #fff;
}
.button-contact-1:hover span, .button-contact-1:hover i {
    color: #048571;
}

@media (max-width: 768px) {
  .row-procedural-steps ul.nav-pills.nav-vertical {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
    width: 100% !important;
  }

  .row-procedural-steps ul.nav-pills.nav-vertical .tab {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    width: auto !important;
  }

  /* ẩn thanh scrollbar cho gọn (tuỳ chọn) */
  .row-procedural-steps ul.nav-pills.nav-vertical::-webkit-scrollbar {
    height: 0;
  }
	.tab-page-implant .nav-vertical {
		width: auto;
	}
	.row-procedural-steps {
		padding: 1rem;
	}
	.tab-page-implant ul li.tab {
		margin: 5px;
	}
	.tab-page-implant .nav-vertical+.tab-panels {
		border-left: 0px solid #eee;
		margin-left: 0;
	}
	.row-question-main {
		padding: 0;
	}
	.col-shape-1 .col-inner, .col-shape-3 .col-inner {
		background: #4c8577;
		border-radius: 20px;
	}
	.row-question-main-mobile .col-shape-2 .col-inner:before {
		display: none;
	}
	.row-question-main-mobile .col-shape-2 .col-inner {
		border: 1px solid #4c8577;
		border-radius: 20px;
	}
	.col-shape-3 .col-inner {
		padding-left: 36px;
		padding-right: 36px;
	}
	.section-price {
		padding-bottom: 0 !important;
	}
	.table-price-implant td {
		width: 15%;
	}
	.table-price-implant td:nth-child(2) {
		width: 30%;
	}
	.table-scroll, .table-scroll-custom {
	  overflow-x: auto;
	  -webkit-overflow-scrolling: touch; /* cuộn mượt trên iOS */
	  width: 100%;
	}

	.table-scroll table{
	  width: 100%;
	  min-width: 1200px;
	  border-collapse: collapse;
	}
	.table-scroll-custom table{
	  width: 100%;
	  min-width: 600px;
	  border-collapse: collapse;
	}
	.name-doctor {
		text-align: center;
		font-size: 13px;
	}
	.fieldofwork {
		font-size: 8px !important;
		text-align: center;
		border: 1px solid #246f5e;
		padding-top: 7px;
		border-radius: 100px;
	}
}