/* ==========================================================================
   Kha Dental — Chuẩn hoá trình bày nội dung & bố cục toàn site
   (File nạp sau cùng để khắc phục triệt để lỗi chính tả ngắt dòng, căn giữa, bảng và layout)
   ========================================================================== */

/* 1. Chuẩn hoá BẢNG: So sánh dịch vụ & Bảng giá chuẩn chỉnh, không bị bóp cột hay lệch chữ */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table {
	width: 100% !important;
	max-width: 100% !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	margin: 2em 0 !important;
	border: 1px solid #dfd3c3 !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	background: #ffffff !important;
	box-shadow: 0 4px 20px rgba(167, 122, 58, 0.05) !important;
	font-size: clamp(14px, 1.05vw, 15.5px) !important;
}

/* Thanh cuộn ngang bảo vệ bảng trên mobile, tránh vỡ layout khung */
.kha-table-scroll-wrapper,
.table-responsive,
.table-price,
body :where(.elementor-widget-text-editor, .entry-content, .kha-article-content, .kha-policy):has(table) {
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch !important;
	max-width: 100% !important;
}

/* Header bảng (th): Vàng đồng Kha Dental, chữ trắng sắc nét, căn giữa */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table th {
	background: #a77a3a !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	letter-spacing: .03em !important;
	text-transform: uppercase !important;
	text-align: center !important;
	padding: 14px 18px !important;
	border: none !important;
	border-bottom: 2px solid #92692e !important;
	border-right: 1px solid rgba(255, 255, 255, 0.22) !important;
	vertical-align: middle !important;
	line-height: 1.4 !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table th:last-child {
	border-right: none !important;
}

/* Thẻ td: Đường viền mềm mại, padding thoáng đãng, nền trắng */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td {
	padding: 14px 18px !important;
	border: none !important;
	border-bottom: 1px solid #eee4d5 !important;
	border-right: 1px solid #eee4d5 !important;
	line-height: 1.65 !important;
	vertical-align: middle !important;
	background: #ffffff;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td:last-child {
	border-right: none !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table tr:last-child td {
	border-bottom: none !important;
}

/* Hàng tiêu đề nhóm (vd: CHỈNH NHA colspan="4") */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table tr:is(.row-title-tb, [class*="title"]) td,
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td[colspan] {
	background: #fbf8f3 !important;
	color: #8e6527 !important;
	font-weight: 700 !important;
	text-align: center !important;
	padding: 12px 18px !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td[colspan] :is(h3, h4, h5, p) {
	color: #8e6527 !important;
	font-weight: 700 !important;
	margin: 0 !important;
	text-align: center !important;
}

/* CỘT ĐẦU TIÊN (th:first-child, td:first-child):
   Tuyệt đối không bị co ép chữ xuống 15px theo chiều dọc */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(th:first-child, td:first-child) {
	min-width: 140px !important;
}

/* Cột tiêu chí bảng so sánh (Ưu Điểm, Khuyết Điểm, Đặc điểm...):
   Rộng cố định 150px, chữ nằm ngang rành mạch, nền vàng nhạt sang trọng */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td:first-child:has(b, strong),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table.kha-table-comparison td:first-child,
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:has(th:empty) td:first-child,
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:has(th:first-child:empty) td:first-child,
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td.kha-col-criteria {
	width: 150px !important;
	min-width: 140px !important;
	max-width: 170px !important;
	text-align: center !important;
	white-space: nowrap !important;
	font-weight: 700 !important;
	color: #7b5826 !important;
	background: #faf7f2 !important;
	vertical-align: middle !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td:first-child:has(b, strong) :is(b, strong, p, span),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td.kha-col-criteria :is(b, strong, p, span) {
	white-space: nowrap !important;
	text-align: center !important;
	margin: 0 !important;
}

/* Tên dịch vụ ở cột đầu trong bảng giá thông thường: Căn trái, xuống dòng tự nhiên */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:not(.kha-table-comparison):not(:has(th:first-child:empty)) td:first-child:not(:has(b)):not(:has(strong)):not(.kha-col-criteria) {
	text-align: left !important;
	white-space: normal !important;
	min-width: 180px !important;
	vertical-align: middle !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:not(.kha-table-comparison):not(:has(th:first-child:empty)) td:first-child:not(:has(b)):not(:has(strong)):not(.kha-col-criteria) :is(p, span, div) {
	text-align: left !important;
	white-space: normal !important;
}

/* Cột số thứ tự (STT) nếu có: hẹp vừa vặn, căn giữa */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(th.kha-col-stt, td.kha-col-stt) {
	width: 55px !important;
	min-width: 48px !important;
	max-width: 65px !important;
	text-align: center !important;
	white-space: nowrap !important;
}

/* CÁC CỘT MÔ TẢ SO SÁNH / GẠCH ĐẦU DÒNG (Veneer sứ, Mão sứ...):
   BẮT BUỘC căn trái rành mạch, không căn giữa làm gạch đầu dòng so le nham nhở */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(td, th):has(br),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(td, th):has(p),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(td, th):has(ul),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(td, th):has(ol),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table.kha-table-comparison td:not(:first-child),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:has(th:first-child:empty) td:not(:first-child),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td.kha-col-description {
	text-align: left !important;
	white-space: normal !important;
	vertical-align: top !important;
	line-height: 1.7 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(td, th):has(br) :is(p, span, div, li),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(td, th):has(p) :is(p, span, div, li),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table.kha-table-comparison td:not(:first-child) :is(p, span, div, li),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:has(th:first-child:empty) td:not(:first-child) :is(p, span, div, li),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td.kha-col-description :is(p, span, div, li) {
	text-align: left !important;
	white-space: normal !important;
	margin-bottom: 6px;
}

/* Bảng so sánh có layout cân bằng để các cột so sánh rộng đều nhau 50-50 */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table.kha-table-comparison,
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:has(th:first-child:empty) {
	table-layout: fixed !important;
	min-width: 580px;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:has(th:first-child:empty) th:first-child,
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table.kha-table-comparison th:first-child {
	width: 150px !important;
}

/* Chỉ những ô giá tiền & đơn vị ngắn trong bảng giá (không chứa br, p, ul) mới căn giữa và không ngắt số */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:not(.kha-table-comparison):not(:has(th:first-child:empty)) td:not(:first-child):not(:has(br)):not(:has(p)):not(:has(ul)):not(:has(ol)):not(.kha-col-description),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td.kha-col-price-unit {
	text-align: center !important;
	white-space: nowrap !important;
	vertical-align: middle !important;
}
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table:not(.kha-table-comparison):not(:has(th:first-child:empty)) td:not(:first-child):not(:has(br)):not(:has(p)):not(:has(ul)):not(:has(ol)):not(.kha-col-description) :is(p, span, div),
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table td.kha-col-price-unit :is(p, span, div) {
	text-align: center !important;
	white-space: nowrap !important;
}

/* Danh sách trong ô bảng không bị tràn lề */
body :is(.elementor, .entry-content, .kha-article-content, .kha-policy) table :is(td, th) :is(ul, ol) {
	margin-inline: 0;
	padding-inline: 0;
	list-style-position: inside;
}

/* 2. Tiêu đề: Xuống dòng tự nhiên khi hết chỗ (wrap), TUYỆT ĐỐI KHÔNG ép cân dòng (balance) gây ngắt đôi dòng */
body :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title, .elementor-widget-heading .elementor-heading-title),
body :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title) > a,
body :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title) > span:not([class*="badge"]) {
	text-wrap: wrap !important;
	white-space: normal !important;
	overflow-wrap: break-word !important;
	word-break: normal !important;
	hyphens: manual !important;
	text-transform: none !important;
	max-width: 100% !important;
}

/* Đảm bảo khung chứa tiêu đề không bị bóp nghẹt chiều ngang */
body :is(.elementor-widget-heading, .elementor-widget-heading .elementor-widget-container, .kha-section-title) {
	max-width: 100% !important;
}

/* Chuẩn hoá tỷ lệ kích thước tiêu đề vừa vặn thanh lịch, giảm size tránh rớt chữ xuống dòng */
body :is(h1, .elementor-heading-title.elementor-size-xl, .elementor-widget-heading h1) {
	font-size: clamp(24px, 2.3vw, 34px) !important;
	line-height: 1.25 !important;
}

body :is(h2, .kha-section-title, .elementor-heading-title.elementor-size-large, .elementor-widget-heading h2) {
	font-size: clamp(21px, 1.85vw, 27px) !important;
	line-height: 1.28 !important;
}

body :is(h3, .elementor-heading-title.elementor-size-medium, .elementor-widget-heading h3) {
	font-size: clamp(17px, 1.35vw, 22px) !important;
	line-height: 1.32 !important;
}

body :is(h4, .elementor-heading-title.elementor-size-small, .elementor-widget-heading h4) {
	font-size: clamp(15.5px, 1.15vw, 19px) !important;
	line-height: 1.35 !important;
}

body :is(h5, .elementor-heading-title.elementor-size-default, .elementor-widget-heading h5) {
	font-size: clamp(13.5px, 0.95vw, 16px) !important;
	line-height: 1.4 !important;
}

body :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title) :is(a, span, strong, em) {
	font-size: inherit !important;
	line-height: inherit !important;
}

/* 3. Đoạn văn & nội dung: Chống tràn chữ, thay thế text-align: justify gây thưa chữ, nhưng BẢO TỒN căn giữa */
body :is(.elementor-widget-text-editor, .elementor-text-editor, p, li) {
	text-wrap: pretty !important;
	overflow-wrap: break-word !important;
	word-break: normal !important;
}

/* Chỉ ghi đè căn lề trái với những khối đang bị lỗi justify kéo giãn chữ xấu */
body :is(.elementor-widget-text-editor, .elementor-text-editor, p, li)[style*="justify" i],
body .elementor-align-justify :is(.elementor-text-editor, p, li) {
	text-align: start !important;
}

/* Mặc định nội dung bài viết và chính sách căn lề trái rõ ràng */
body :where(.entry-content, .kha-article-content, .kha-policy) > p:not([class*="center"]):not([style*="center"]) {
	text-align: start;
}

/* Giữ khoảng cách dòng thoáng đãng, dễ theo dõi */
body :where(.site-content, main) p {
	line-height: 1.74;
}

/* 4. CHUẨN HOÁ CĂN GIỮA TOÀN DIỆN: Sửa triệt để lỗi tiêu đề/khung ở giữa mà chữ hoặc nút bị lệch */
body :is(
	.elementor-align-center,
	.elementor-widget.elementor-align-center,
	.elementor-element.elementor-align-center,
	.kha-section-title-widget--centered,
	.kha-title-centered
) {
	width: 100% !important;
	max-width: 100% !important;
	margin-inline: auto !important;
	align-self: center !important;
	text-align: center !important;
}

body :is(
	.elementor-align-center,
	.elementor-widget.elementor-align-center,
	.elementor-element.elementor-align-center
) > .elementor-widget-container {
	margin-inline: auto !important;
	text-align: center !important;
}

/* Mọi chữ cái, đoạn văn, thẻ con bên trong các khối căn giữa phải nằm chính giữa tuyệt đối */
body :is(
	.elementor-align-center,
	.has-text-align-center,
	.text-center,
	[align="center"],
	[style*="text-align: center" i],
	[style*="text-align:center" i],
	.elementor-element-1e9f520,
	.elementor-element-ff2db3d,
	.elementor-element-66835ed,
	.boxdv-home,
	.kha-contact__head,
	.kha-search-empty,
	.site-footer .boxtimeft
) :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title, p, span, a, li, .elementor-text-editor, strong, em) {
	text-align: center !important;
}

/* Nút bấm trong các khối căn giữa */
body :is(
	.elementor-widget-button.elementor-align-center,
	.elementor-align-center .elementor-widget-button,
	.elementor-element-c6700e3,
	.site-footer .boxrightft-cusbtndangky
) .elementor-button-wrapper,
body .site-footer .boxrightft-cusbtndangky {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	text-align: center !important;
	margin-inline: auto !important;
}

/* Khối Đội ngũ bác sĩ (trang /doi-ngu-bac-si/ & các khối chứa thẻ bác sĩ .container1): Căn giữa tuyệt đối */
body .elementor-element-f976ea2 {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
}

body .elementor-element-53fd81e {
	max-width: 100% !important;
}
body .elementor-element-53fd81e .elementor-widget-container {
	max-width: 100% !important;
	padding-inline: 0 !important;
}
body .elementor-element-53fd81e,
body .elementor-element-53fd81e .elementor-widget-container,
body .elementor-element-53fd81e h2 {
	width: 100% !important;
	text-align: center !important;
	margin-inline: auto !important;
}

/* Sửa lỗi Grid 2 cột chỉ có 1 thẻ bác sĩ làm thẻ bị lệch hẳn sang trái */
body :is(
	.elementor-element-183b0b3,
	.elementor-element-f976ea2 .elementor-element-183b0b3,
	.e-con:has(> .elementor-element .container1),
	.e-con:has(> .elementor-widget .container1),
	.e-con-inner:has(> .elementor-element .container1),
	.e-con-inner:has(> .elementor-widget .container1)
) {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	align-items: center !important;
	gap: clamp(24px, 3vw, 40px) !important;
	width: 100% !important;
	max-width: 680px !important;
	margin-inline: auto !important;
	--display: flex !important;
	--e-con-grid-template-columns: 1fr !important;
	--justify-items: center !important;
	grid-template-columns: 1fr !important;
}

/* Từng thẻ bác sĩ: Căn chính giữa, không bị dạt sang bên trái */
body :is(
	.elementor-element-183b0b3 > :is(.elementor-element, .elementor-widget),
	.e-con:has(.container1) > :is(.elementor-element, .elementor-widget)
) {
	width: 100% !important;
	max-width: 320px !important;
	flex: 0 1 320px !important;
	margin-inline: auto !important;
}

body :is(
	.elementor-element-183b0b3 .container1,
	.e-con:has(.container1) .container1,
	.container1
) {
	max-width: 320px !important;
	margin-inline: auto !important;
	overflow: hidden;
	border-radius: 20px;
}

body :is(
	.elementor-element-183b0b3 .image1,
	.e-con:has(.container1) .image1
) {
	border-radius: 20px;
	margin-inline: auto;
}

/* Khối nội dung cam kết bác sĩ & form tư vấn trên trang bác sĩ */
body :is(.elementor-element-c047352, .elementor-element-3cdeaea) {
	margin-inline: auto !important;
}

/* Hình ảnh trong các khối căn giữa */
body .elementor-widget-image.elementor-align-center .elementor-image,
body .elementor-widget-image.elementor-align-center .elementor-image a {
	display: inline-block !important;
	margin-inline: auto !important;
	text-align: center !important;
}

/* 5. Nút bấm & CTA: Không bị ngắt chữ thành 2 hàng cụt lủn */
body :where(.elementor-button, .elementor-button-text, .kha-btn, .cusreadmore-ver, a.button) {
	white-space: nowrap !important;
	word-break: keep-all !important;
}

/* 6. Khối form "Đặt lịch tư vấn" */
body .e-con.e-grid:has(.boxformdatlich) {
	padding-top: 40px !important;
	padding-bottom: 40px !important;
}

@media (max-width: 767px) {
	body .e-con.e-grid:has(.boxformdatlich) {
		padding-top: 24px !important;
		padding-bottom: 24px !important;
	}
}

/* 7. Tiêu đề chữ vàng (gradient cắt theo chữ): Đệm đều 2 bên cân đối đối xứng */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
	body:not(.wp-admin) :where(.site-content, main) :is(h1, h2, h3):not(.kha-on-gold),
	body:not(.wp-admin) :where(.site-content, main) :is(h1, h2, h3):not(.kha-on-gold) > a,
	body:not(.wp-admin) :where(.site-content, main) .elementor-heading-title:not(.kha-on-gold),
	body:not(.wp-admin) .site-content .elementor .e-con.e-parent .elementor-widget.elementor-element :is(h1, h2, h3):not(.kha-on-gold),
	body.home:not(.wp-admin) .site-content .elementor.elementor-2 :is(.elementor-element-73e4dc7, .elementor-element-cd54876) h5,
	body.home:not(.wp-admin) .site-content .elementor.elementor-2 .e-con.e-parent.elementor-element-ef1eacf.kha-services-scroll .elementor-element-98c929a .kha-service-card .boxdv-home h3,
	.site-footer .boxft h3,
	.site-footer .boxmailft h3 {
		padding-top: .08em !important;
		padding-bottom: .24em !important;
		padding-inline: .06em !important;
		overflow: visible !important;
	}
}

/* ---------- EN / RU: translations are longer than the Vietnamese source ----------
   Never cut a sentence in half (line-clamp) on the homepage service cards. */
html[lang^="en"] body.home .elementor-2 .kha-services-scroll .kha-service-card .boxdv-home p,
html[lang^="ru"] body.home .elementor-2 .kha-services-scroll .kha-service-card .boxdv-home p {
	display: block;
	overflow: visible;
	-webkit-line-clamp: unset;
	line-clamp: unset;
}

/* Price tables on phones: columns share the width, cells wrap, nothing is cut or hidden (EN/RU strings are longer). */
@media (max-width: 767px) {
	body .table-price,
	body .box-priceheight {
		height: auto !important;
		max-height: none !important;
		overflow-x: visible !important;
	}
	body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table {
		table-layout: fixed !important;
		width: 100% !important;
		min-width: 0 !important;
	}
	body :is(.elementor, .entry-content, .kha-article-content, .kha-policy, .table-price) table :is(th, td) {
		min-width: 0 !important;
		height: auto !important;
		padding: 8px 5px !important;
		font-size: 12.5px !important;
		line-height: 1.4 !important;
		overflow-wrap: anywhere;
		hyphens: auto;
	}
}

/* Title lines created by the home JS (story / services / doctors) must follow the alignment of their
   own heading; the generic "centre every span" rule above must not re-align them. */
body.home.home .elementor.elementor-2 span.kha-story-scene__title-line.kha-story-scene__title-line,
body.home.home .elementor.elementor-2 span.kha-services-title-line.kha-services-title-line,
body.home.home .elementor.elementor-2 span.kha-doctors-title-line.kha-doctors-title-line {
	text-align: inherit !important;
}

/* Form "Đặt lịch tư vấn": cột tiêu đề đủ rộng để không rớt "Tư / Vấn" xuống dòng riêng. */
@media (min-width: 768px) {
	body .e-con.e-grid:has(.boxformdatlich) {
		grid-template-columns: minmax(210px, 32%) minmax(0, 1fr) !important;
		--e-con-grid-template-columns: minmax(210px, 32%) minmax(0, 1fr) !important;
	}
	body .e-con.e-grid:has(.boxformdatlich) .titledltv h2 {
		padding-inline: 0 !important;
	}
}
