/*
Theme Name:   Flatsome Child
Theme URI:    https://thietbiytetranthinh.com/
Description:  Flatsome Child Theme for Thiết Bị Y Tế Trần Thịnh (Teal & Slate Modern Medical Styling, Custom WooCommerce layouts).
Author:       Antigravity
Author URI:   https://thietbiytetranthinh.com/
Template:     flatsome
Version:      1.0.2
Text Domain:  flatsome-child
*/

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

/* --- 1. CORE DESIGN SYSTEM & TYPOGRAPHY (Be Vietnam Pro) --- */
body {
	font-family: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	font-size: 15px;
	line-height: 1.65;
	color: #334155;
	background-color: #f8fafc;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .nav > li > a {
	font-family: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	font-weight: 700;
	color: #0f172a;
	letter-spacing: -0.015em;
}

h1 { font-size: 2.2rem; }
h2 { font-size: 1.8rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.15rem; }

/* Tông màu Teal/Cyan chủ đạo */
a {
	color: #0d9488;
	transition: color 0.2s ease;
}
a:hover {
	color: #0f766e;
}

/* --- 2. PREMIUM PRODUCT GRID CARDS (3 Cột) --- */
.products .product-small.box {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 16px !important;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
	transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	margin-bottom: 20px;
}

.products .product-small.box:hover {
	transform: translateY(-6px);
	box-shadow: 0 16px 32px rgba(13, 148, 136, 0.08); /* Đổ bóng có ánh xanh Teal */
	border-color: #99f6e4; /* Viền sáng xanh Teal */
}

/* Bo góc cho hình ảnh sản phẩm */
.products .product-small.box .box-image {
	border-top-left-radius: 16px;
	border-top-right-radius: 16px;
	overflow: hidden;
}

.products .product-small.box .box-image img {
	transition: transform 0.5s ease;
}

.products .product-small.box:hover .box-image img {
	transform: scale(1.05); /* Thu phóng nhẹ hình ảnh khi hover */
}

/* Bố cục nội dung thẻ sản phẩm */
.products .product-small.box .box-text {
	padding: 20px !important;
	text-align: left !important;
}

/* Tên sản phẩm */
.products .product-small.box .title-wrapper p.name.product-title a {
	font-size: 16px;
	font-weight: 600;
	color: #1e293b;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	height: 44px;
	margin-bottom: 10px;
}

.products .product-small.box .title-wrapper p.name.product-title a:hover {
	color: #0d9488;
}

/* --- 3. CUSTOM TECHNICAL METADATA BADGES (Hãng/Xuất xứ/Model) --- */
.tt-product-meta {
	background-color: #f1f5f9;
	border-radius: 8px;
	padding: 10px 12px;
	margin: 8px 0 12px 0;
	font-size: 12px;
	color: #64748b;
	border: 1px solid #e2e8f0;
}

.tt-meta-item {
	display: flex;
	justify-content: space-between;
	margin-bottom: 4px;
}

.tt-meta-item:last-child {
	margin-bottom: 0;
}

.tt-meta-label {
	font-weight: 500;
	color: #475569;
}

.tt-meta-val {
	font-weight: 600;
	color: #0f172a;
}

/* Giá sản phẩm */
.products .product-small.box .price-wrapper .price {
	font-size: 16px;
	font-weight: 700;
	color: #0d9488;
}

/* --- 4. BUTTONS & CTA UPGRADES --- */
.products .product-small.box .add-to-cart-button a,
.button.primary,
.button.checkout,
.button.alt {
	background-color: #0d9488 !important;
	color: #ffffff !important;
	border-radius: 8px !important;
	text-transform: none !important;
	font-weight: 600 !important;
	padding: 10px 20px !important;
	transition: all 0.2s ease !important;
	border: none !important;
}

.products .product-small.box .add-to-cart-button a:hover,
.button.primary:hover,
.button.checkout:hover,
.button.alt:hover {
	background-color: #0f766e !important;
	box-shadow: 0 4px 12px rgba(13, 148, 136, 0.25) !important;
}

/* --- 5. MODERN SEARCH BAR --- */
.header-search-form input[type="search"] {
	border-radius: 30px !important;
	border: 1.5px solid #cbd5e1 !important;
	padding-left: 20px !important;
	transition: all 0.2s ease;
}

.header-search-form input[type="search"]:focus {
	border-color: #0d9488 !important;
	box-shadow: 0 0 0 4px rgba(13, 148, 136, 0.12) !important;
}

.header-search-form button[type="submit"] {
	background-color: #0d9488 !important;
	border-top-right-radius: 30px !important;
	border-bottom-right-radius: 30px !important;
	padding: 0 20px !important;
}

/* --- 6. HIDE FALLBACK FOOTER WIDGETS --- */
/* Ẩn các widget mặc định Archives, Categories, Meta, Pages nếu sidebar rỗng */
#footer .widget_archive,
#footer .widget_categories,
#footer .widget_meta,
#footer .widget_pages,
#footer .widget_recent_comments,
#footer .widget_recent_entries {
	display: none !important;
}

/* --- 7. HIDE SEARCH ON HEADER MENU BAR --- */
/* Ẩn icon tìm kiếm và ô tìm kiếm trên thanh menu chính của header */
.header-nav .header-search,
.header-nav .search-item,
.header-nav .header-search-item,
.header-nav li.search-item,
.header-nav li.header-search-item {
	display: none !important;
}

/* ==========================================================
   PREMIUM MEDICAL STYLING UTILITIES
   ========================================================== */

/* 1. Custom Shadow Medical */
.shadow-medical {
	box-shadow: 0 10px 30px rgba(13, 148, 136, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

/* 2. Technical Specification Tables */
.woocommerce-product-details__short-description table,
.woocommerce-Tabs-panel--description table,
.shop_attributes {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 20px 0 !important;
	border-radius: 12px !important;
	overflow: hidden !important;
	border: 1px solid #e2e8f0 !important;
	box-shadow: 0 4px 6px -1px rgba(0,0,0,0.02) !important;
}

.woocommerce-product-details__short-description table th,
.woocommerce-product-details__short-description table td,
.woocommerce-Tabs-panel--description table th,
.woocommerce-Tabs-panel--description table td,
.shop_attributes th,
.shop_attributes td {
	padding: 12px 16px !important;
	font-size: 14px !important;
	border-bottom: 1px solid #f1f5f9 !important;
	text-align: left !important;
}

.woocommerce-product-details__short-description table th,
.woocommerce-Tabs-panel--description table th,
.shop_attributes th {
	background-color: #f8fafc !important;
	font-weight: 600 !important;
	color: #475569 !important;
	width: 30% !important;
}

.woocommerce-product-details__short-description table tr:last-child td,
.woocommerce-Tabs-panel--description table tr:last-child td,
.shop_attributes tr:last-child td {
	border-bottom: none !important;
}

.woocommerce-product-details__short-description table tr:nth-child(even),
.woocommerce-Tabs-panel--description table tr:nth-child(even) {
	background-color: #f8fafc !important;
}

/* 3. WooCommerce Alert Notices */
.woocommerce-message, 
.woocommerce-info, 
.woocommerce-error {
	background-color: #ffffff !important;
	border-left-width: 4px !important;
	border-radius: 10px !important;
	padding: 18px 24px !important;
	box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.03), 0 8px 10px -6px rgba(0, 0, 0, 0.03) !important;
	font-size: 14.5px !important;
	font-weight: 500 !important;
	color: #334155 !important;
	margin-bottom: 25px !important;
	border-top: none !important;
	border-right: none !important;
	border-bottom: none !important;
}

.woocommerce-message {
	border-left-color: #0d9488 !important; /* Medical Teal */
}
.woocommerce-message::before {
	color: #0d9488 !important;
}

.woocommerce-info { 
	border-left-color: #0284c7 !important; /* Info Blue */
}
.woocommerce-info::before {
	color: #0284c7 !important;
}

.woocommerce-error {
	border-left-color: #ef4444 !important; /* Error Red */
}
.woocommerce-error::before {
	color: #ef4444 !important;
}

/* 4. Single Product Visual Highlights */
.product-summary .price {
	font-size: 26px !important;
	color: #0d9488 !important;
	font-weight: 800 !important;
}

.product-summary .cart button.single_add_to_cart_button {
	height: 48px !important;
	font-size: 16px !important;
	border-radius: 10px !important;
}

/* --- 8. FLOATING COOKIE CONSENT BANNER --- */
.flatsome-cookies {
	position: fixed !important;
	bottom: 24px !important;
	left: 24px !important;
	right: auto !important;
	width: calc(100% - 48px) !important;
	max-width: 360px !important;
	background-color: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 16px !important;
	box-shadow: 0 20px 25px -5px rgba(13, 148, 136, 0.08), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
	padding: 20px !important;
	z-index: 99999 !important;
	height: auto !important;
	transition: all 0.3s ease-in-out !important;
}

.flatsome-cookies__inner {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	padding: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

.flatsome-cookies__text {
	font-size: 13.5px !important;
	line-height: 1.5 !important;
	color: #475569 !important;
	margin-bottom: 16px !important;
	text-align: left !important;
	width: 100% !important;
	padding: 0 !important;
}

.flatsome-cookies__text::before {
	content: "🍪" !important;
	font-size: 20px !important;
	display: block !important;
	margin-bottom: 8px !important;
}

.flatsome-cookies__buttons {
	display: flex !important;
	gap: 10px !important;
	width: 100% !important;
	justify-content: flex-end !important;
}

.flatsome-cookies__buttons a.flatsome-cookies__more-btn,
.flatsome-cookies__buttons button.flatsome-cookies__accept-btn {
	flex: 1 !important;
	margin: 0 !important;
	height: 38px !important;
	line-height: 38px !important;
	padding: 0 12px !important;
	font-size: 12.5px !important;
	text-transform: none !important;
	border-radius: 8px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 600 !important;
	border: none !important;
	box-shadow: none !important;
}

.flatsome-cookies__buttons button.flatsome-cookies__accept-btn {
	background-color: #0d9488 !important; /* Medical Teal */
	color: #ffffff !important;
	transition: all 0.2s ease !important;
}

.flatsome-cookies__buttons button.flatsome-cookies__accept-btn:hover {
	background-color: #0f766e !important;
	box-shadow: 0 4px 12px rgba(13, 148, 136, 0.2) !important;
}

.flatsome-cookies__buttons a.flatsome-cookies__more-btn {
	background-color: #f1f5f9 !important;
	color: #475569 !important;
	transition: all 0.2s ease !important;
}

.flatsome-cookies__buttons a.flatsome-cookies__more-btn:hover {
	background-color: #e2e8f0 !important;
	color: #1e293b !important;
}

@media (max-width: 480px) {
	.flatsome-cookies {
		bottom: 16px !important;
		left: 16px !important;
		width: calc(100% - 32px) !important;
		max-width: 100% !important;
	}
}

/* ==========================================================
   PREMIUM ACCOUNT LOGIN & REGISTRATION CARD LAYOUT
   ========================================================== */
.woocommerce-account .col2-set.row {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 30px !important;
	justify-content: center !important;
	margin-top: 30px !important;
	margin-bottom: 50px !important;
}

.woocommerce-account .col2-set.row .large-6.col {
	flex: 1 1 45% !important;
	max-width: 480px !important;
	background: #ffffff !important;
	border: 1px solid #e2e8f0 !important;
	border-radius: 16px !important;
	padding: 35px 30px !important;
	box-shadow: 0 10px 30px rgba(13, 148, 136, 0.03), 0 1px 3px rgba(0, 0, 0, 0.02) !important;
	box-sizing: border-box !important;
}

/* Clear Flatsome side border divider */
.woocommerce-account .row-divided > .col:first-child {
	border-right: none !important;
}

.woocommerce-account h2,
.woocommerce-account h3 {
	font-size: 20px !important;
	font-weight: 700 !important;
	color: #0f172a !important;
	margin-bottom: 25px !important;
	border-bottom: 2px solid #f1f5f9 !important;
	padding-bottom: 12px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
}

.woocommerce-account form.login .form-row input[type="text"],
.woocommerce-account form.login .form-row input[type="password"],
.woocommerce-account form.register .form-row input[type="text"],
.woocommerce-account form.register .form-row input[type="email"],
.woocommerce-account form.register .form-row input[type="tel"],
.woocommerce-account form.register .form-row input[type="password"] {
	padding: 10px 14px !important;
	border: 1px solid #cbd5e1 !important;
	border-radius: 8px !important;
	font-size: 14px !important;
	width: 100% !important;
	box-sizing: border-box !important;
	height: 48px !important;
	box-shadow: none !important;
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
	color: #1e293b !important;
	background-color: #ffffff !important;
}

.woocommerce-account form.login .form-row input:focus,
.woocommerce-account form.register .form-row input:focus {
	border-color: #0d9488 !important;
	outline: none !important;
	box-shadow: 0 0 0 4px rgba(13, 148, 136, 0.1) !important;
}

.woocommerce-account form.login .form-row label,
.woocommerce-account form.register .form-row label {
	font-weight: 600 !important;
	color: #475569 !important;
	font-size: 13.5px !important;
	margin-bottom: 6px !important;
	display: block !important;
}

.woocommerce-account form.login .form-row,
.woocommerce-account form.register .form-row {
	margin-bottom: 18px !important;
}

.ttcvn-reg-fields-row {
	display: flex !important;
	gap: 16px !important;
	width: 100% !important;
}
.ttcvn-reg-fields-row p {
	flex: 1 !important;
	margin-bottom: 0 !important;
}

.woocommerce-account form.login button.button,
.woocommerce-account form.register button.button {
	width: 100% !important;
	height: 48px !important;
	background-color: #0d9488 !important;
	color: #ffffff !important;
	border-radius: 8px !important;
	text-transform: none !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	transition: all 0.2s ease !important;
	border: none !important;
	box-shadow: 0 4px 12px rgba(13, 148, 136, 0.15) !important;
	margin-top: 10px !important;
}

.woocommerce-account form.login button.button:hover,
.woocommerce-account form.register button.button:hover {
	background-color: #0f766e !important;
	box-shadow: 0 6px 16px rgba(13, 148, 136, 0.25) !important;
}

.woocommerce-account form.login .woocommerce-form-login__rememberme {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
}
.woocommerce-account form.login .woocommerce-form-login__rememberme input {
	margin: 0 !important;
}

@media (max-width: 767px) {
	.woocommerce-account .col2-set.row {
		flex-direction: column !important;
		align-items: center !important;
	}
	.woocommerce-account .col2-set.row .large-6.col {
		flex: 1 1 100% !important;
		width: 100% !important;
		max-width: 100% !important;
	}
}

/* ==========================================================
   PREMIUM SINGLE PRODUCT PAGE ACTIONS & LAYOUT
   ========================================================== */
.product-summary form.cart {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 12px !important;
	margin-top: 20px !important;
	margin-bottom: 25px !important;
}

/* Quantity Box */
.product-summary form.cart .quantity {
	margin: 0 !important;
	height: 48px !important;
	display: inline-flex !important;
	align-items: center !important;
}

.product-summary form.cart .quantity input.qty {
	height: 48px !important;
	border: 1px solid #cbd5e1 !important;
	border-left: none !important;
	border-right: none !important;
	font-weight: 600 !important;
	color: #0f172a !important;
	width: 50px !important;
}

.product-summary form.cart .quantity .minus,
.product-summary form.cart .quantity .plus {
	height: 48px !important;
	background: #f1f5f9 !important;
	border: 1px solid #cbd5e1 !important;
	color: #475569 !important;
	font-size: 16px !important;
	width: 35px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer !important;
	transition: all 0.2s ease !important;
}

.product-summary form.cart .quantity .minus:hover,
.product-summary form.cart .quantity .plus:hover {
	background: #e2e8f0 !important;
	color: #0f172a !important;
}

/* Add to Cart Button */
.product-summary form.cart .single_add_to_cart_button {
	flex: 1 1 auto !important;
	height: 48px !important;
	background: transparent !important;
	border: 2px solid #0d9488 !important;
	color: #0d9488 !important;
	font-weight: 700 !important;
	font-size: 15px !important;
	border-radius: 8px !important;
	text-transform: none !important;
	margin: 0 !important;
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.product-summary form.cart .single_add_to_cart_button:hover {
	background: #0d9488 !important;
	color: #ffffff !important;
	box-shadow: 0 4px 12px rgba(13, 148, 136, 0.15) !important;
}

/* Buy Now Button */
.product-summary form.cart .ux-buy-now-button {
	flex: 1 1 100% !important;
	width: 100% !important;
	height: 52px !important;
	background: #0d9488 !important;
	color: #ffffff !important;
	border: none !important;
	font-weight: 700 !important;
	font-size: 16px !important;
	border-radius: 8px !important;
	text-transform: none !important;
	margin: 0 !important;
	margin-left: 0 !important; /* Override Flatsome ml-half */
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
	box-shadow: 0 4px 12px rgba(13, 148, 136, 0.2) !important;
}

.product-summary form.cart .ux-buy-now-button:hover {
	background: #0f766e !important;
	box-shadow: 0 6px 16px rgba(13, 148, 136, 0.3) !important;
	transform: translateY(-1px) !important;
}

/* Adjust general product page details layout */
.product-summary .product-title {
	font-size: 26px !important;
	font-weight: 700 !important;
	color: #0f172a !important;
	line-height: 1.3 !important;
	margin-bottom: 12px !important;
}

.product-summary .price {
	font-size: 24px !important;
	font-weight: 800 !important;
	color: #0d9488 !important;
	margin-bottom: 20px !important;
}

.product-summary .price ins {
	text-decoration: none !important;
}

.product-summary .price del {
	font-size: 16px !important;
	color: #94a3b8 !important;
	margin-right: 8px !important;
}

.product-summary .product-short-description {
	color: #475569 !important;
	font-size: 14.5px !important;
	line-height: 1.6 !important;
	margin-bottom: 20px !important;
}

.product-summary .product_meta {
	border-top: 1px solid #e2e8f0 !important;
	padding-top: 15px !important;
	margin-top: 25px !important;
	font-size: 13px !important;
	color: #64748b !important;
}

.product-summary .product_meta span {
	display: block !important;
	margin-bottom: 6px !important;
}

.product-summary .product_meta a {
	color: #0d9488 !important;
	font-weight: 600 !important;
}

.product-summary .product_meta a:hover {
	color: #0f766e !important;
}


/* --- 9. PRODUCT PAGE LAYOUT FIX --- */
.product-info.summary {
	min-width: 0 !important;
}