/*
Theme Name: IES VNTECH Equipment
Theme URI: https://iesvntech.com/
Author: Antigravity
Author URI: https://iesvntech.com/
Description: WordPress Classic Theme phục vụ website bán hàng thiết bị môi trường, thiết bị xử lý nước thải, khí thải, bơm, máy thổi khí, màng lọc, tủ điện điều khiển và vật tư công nghiệp.
Version: 1.0.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: iesvntech-equipment
Tags: ecommerce, two-columns, left-sidebar, translation-ready, custom-menu, custom-logo, post-thumbnails
*/

/* Custom resets to fix WordPress default markup issues on menu */
.main-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

.main-menu li {
	list-style: none;
}

.main-menu a {
	text-decoration: none;
}

.dropdown-menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

/* Bảo đảm menu không bao giờ bị vỡ layout kể cả khi thiếu class */
.main-menu > li {
	display: inline-block;
	position: relative;
}

.main-menu > li > a {
	display: block !important;
	padding: 1.25rem 1.5rem !important;
	color: var(--color-primary) !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	transition: color 0.24s ease !important;
}

.main-menu > li > a:hover {
	background-color: rgba(253, 161, 13, 0.1) !important;
	color: var(--color-primary-dark) !important;
}

/* Submenu dropdown */
.main-menu li ul.dropdown-menu,
.main-menu li ul.sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	width: 240px;
	background-color: #ffffff;
	box-shadow: 0 10px 30px rgba(22, 61, 70, 0.08);
	border: 1px solid rgba(22, 61, 70, 0.08);
	border-top: 2px solid var(--color-secondary) !important;
	border-radius: 0 0 6px 6px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity 0.24s ease, transform 0.24s ease, visibility 0.24s ease;
	z-index: 1000;
	list-style: none;
	margin: 0;
	padding: 8px 0;
	pointer-events: none !important;
}

.main-menu li:hover > ul.dropdown-menu,
.main-menu li:hover > ul.sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto !important;
}

.main-menu li ul.dropdown-menu a,
.main-menu li ul.sub-menu a {
	display: block !important;
	padding: 0.62rem 1.25rem !important;
	color: #163d46 !important; /* var(--color-primary) */
	font-weight: 400 !important;
	text-decoration: none !important;
	font-size: 14px !important;
	border-bottom: 1px solid rgba(22, 61, 70, 0.08) !important;
	transition: background-color var(--transition-fast), padding-left var(--transition-fast), color var(--transition-fast) !important;
	text-align: left;
}

.main-menu li ul.dropdown-menu a:hover,
.main-menu li ul.sub-menu a:hover {
	background-color: rgba(22, 61, 70, 0.05) !important;
	padding-left: 1.75rem !important;
	color: var(--color-primary) !important;
}

.main-menu li ul.dropdown-menu li:last-child > a,
.main-menu li ul.sub-menu li:last-child > a {
	border-bottom: none !important;
}

/* Hỗ trợ Menu đa cấp (Fly-out menus) sang bên phải */
.main-menu li ul.sub-menu li {
	position: relative !important;
}

.main-menu li ul.sub-menu li ul.sub-menu {
	top: -8px !important;
	left: 100% !important;
	margin-left: 1px !important;
	border-radius: 0 6px 6px 6px !important;
	transform: translateX(10px) !important;
}

.main-menu li ul.sub-menu li:hover > ul.sub-menu {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateX(0) !important;
}

/* Thêm icon mũi tên chỉ báo cho menu con có cấp nhỏ hơn */
.main-menu li ul.sub-menu li.menu-item-has-children > a::after {
	content: "\f054" !important;
	font-family: "Font Awesome 5 Free" !important;
	font-weight: 900 !important;
	float: right !important;
	font-size: 10px !important;
	margin-top: 4px !important;
	color: var(--color-text-muted) !important;
	transition: transform var(--transition-fast) !important;
}

.main-menu li ul.sub-menu li.menu-item-has-children:hover > a::after {
	color: var(--color-primary) !important;
	transform: translateX(3px) !important;
}

/* ==========================================
   MEGA MENU STYLING (DESKTOP & MOBILE)
   ========================================== */

/* Make navigation inner relative to contain the mega menu width */
.navigation-inner {
	position: relative;
}

/* Mega menu top level li must be static so that its sub-menu can stretch to navigation-inner width */
.main-menu > li.menu-item-mega {
	position: static !important;
}

/* Mega menu wrapper (the Level 1 sub-menu) */
.main-menu > li.menu-item-mega > ul.dropdown-menu,
.main-menu > li.menu-item-mega > ul.sub-menu {
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	background-color: var(--color-bg-white) !important;
	color: var(--color-text) !important;
	box-shadow: 0 15px 35px rgba(22, 61, 70, 0.12) !important;
	border: 1px solid rgba(22, 61, 70, 0.08) !important;
	border-top: 3px solid var(--color-secondary) !important;
	border-radius: 0 0 8px 8px !important;
	padding: 2rem 2.5rem !important;
	opacity: 0 !important;
	visibility: hidden !important;
	transform: translateY(15px) !important;
	transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s ease !important;
	z-index: 1000 !important;
	list-style: none !important;
	margin: 0 !important;
	
	/* Grid layout for columns */
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 2rem !important;
}

/* Show mega menu on hover */
.main-menu > li.menu-item-mega:hover > ul.dropdown-menu,
.main-menu > li.menu-item-mega:hover > ul.sub-menu {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateY(0) !important;
}

/* Level 2 items (columns) */
.main-menu > li.menu-item-mega > ul.dropdown-menu > li,
.main-menu > li.menu-item-mega > ul.sub-menu > li {
	display: block !important;
	width: 100% !important;
	position: static !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	background: transparent !important;
}

/* Level 2 links (Column Headers) */
.main-menu > li.menu-item-mega > ul.dropdown-menu > li > a,
.main-menu > li.menu-item-mega > ul.sub-menu > li > a {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--color-primary) !important;
	text-transform: uppercase !important;
	margin-bottom: 1rem !important;
	border-bottom: 1px solid rgba(22, 61, 70, 0.1) !important;
	padding: 0 0 0.5rem 0 !important;
	display: block !important;
	text-decoration: none !important;
	transition: color 0.24s ease !important;
	text-align: left !important;
	background: transparent !important;
}

.main-menu > li.menu-item-mega > ul.dropdown-menu > li > a:hover,
.main-menu > li.menu-item-mega > ul.sub-menu > li > a:hover {
	color: var(--color-secondary) !important;
	padding-left: 0 !important;
	background: transparent !important;
}

/* Level 3 sub-menu container (inside each column) */
.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.dropdown-menu,
.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu,
.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.dropdown-menu,
.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu {
	position: static !important;
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	box-shadow: none !important;
	border: none !important;
	padding: 0 !important;
	width: 100% !important;
	margin-top: 0.5rem !important;
	background: transparent !important;
}

/* Level 3 items */
.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu > li,
.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu > li {
	display: block !important;
	margin-bottom: 0.5rem !important;
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
}

/* Level 3 links */
.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu > li > a,
.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu > li > a {
	display: block !important;
	font-size: 14px !important;
	color: var(--color-text-light) !important;
	padding: 0.25rem 0 !important;
	transition: color 0.2s ease, padding-left 0.2s ease !important;
	border-bottom: none !important;
	font-weight: 400 !important;
	background: transparent !important;
	text-decoration: none !important;
}

.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu > li > a:hover,
.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu > li > a:hover {
	color: var(--color-primary) !important;
	padding-left: 8px !important;
	background-color: transparent !important;
}

/* Hide default indicators/arrows for submenus in mega menu column headers */
.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > a::after,
.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > a::after {
	display: none !important;
}

/* Mobile overrides for Mega Menu */
@media (max-width: 992px) {
	/* Override the positioning of mega menu so it collapses inline */
	.main-menu > li.menu-item-mega > ul.dropdown-menu,
	.main-menu > li.menu-item-mega > ul.sub-menu {
		position: static !important;
		width: 100% !important;
		max-width: 100% !important;
		max-height: 0 !important;
		overflow: hidden !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		border: none !important;
		box-shadow: none !important;
		background-color: var(--color-primary-dark) !important;
		padding: 0 !important;
		margin: 0 !important;
		display: block !important; /* Stack columns vertically */
		transition: max-height 0.28s ease-out !important;
	}

	.main-menu > li.menu-item-mega:hover > ul.dropdown-menu,
	.main-menu > li.menu-item-mega:hover > ul.sub-menu {
		max-height: 2000px !important; /* Allow expansion on hover/focus */
		padding: 1rem 1.5rem !important;
	}

	/* Level 2 items (columns) on mobile */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li,
	.main-menu > li.menu-item-mega > ul.sub-menu > li {
		display: block !important;
		margin-bottom: 1.5rem !important;
	}

	/* Level 2 links (headers) on mobile */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li > a,
	.main-menu > li.menu-item-mega > ul.sub-menu > li > a {
		color: #ffffff !important;
		font-size: 14px !important;
		font-weight: 700 !important;
		border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
		padding: 0 0 0.25rem 0 !important;
		margin-bottom: 0.5rem !important;
	}

	/* Level 3 sub-menu container on mobile */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu,
	.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu {
		margin-top: 0 !important;
	}

	/* Level 3 links on mobile */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu > li > a,
	.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu > li > a {
		color: rgba(255, 255, 255, 0.74) !important;
		padding: 0.42rem 0 0.42rem 1rem !important;
	}

	.main-menu > li.menu-item-mega > ul.dropdown-menu > li > ul.sub-menu > li > a:hover,
	.main-menu > li.menu-item-mega > ul.sub-menu > li > ul.sub-menu > li > a:hover {
		color: var(--color-secondary) !important;
		padding-left: 1.5rem !important;
	}
}

/* ==========================================
   CSS OVERRIDES FOR NATIVE ELEMENTOR WIDGETS
   ========================================== */

/* 1. Elementor Slides (Hero Banner) */
.elementor-widget-slides .swiper-slide {
	position: relative !important;
	background-color: #0d262c !important; /* var(--color-primary-dark) */
}

/* Lớp phủ lưới và gradient của slide */
.elementor-widget-slides .swiper-slide::before {
	content: '' !important;
	position: absolute !important;
	inset: 0 !important;
	background:
		linear-gradient(90deg, rgba(8, 26, 31, 0.98) 0%, rgba(13, 38, 44, 0.86) 38%, rgba(13, 38, 44, 0.22) 68%, rgba(13, 38, 44, 0.04) 100%),
		repeating-linear-gradient(90deg, rgba(255, 254, 250, 0.045) 0 1px, transparent 1px 42px) !important;
	z-index: 1 !important;
	pointer-events: none !important;
}

.elementor-widget-slides .swiper-slide::after {
	content: '' !important;
	position: absolute !important;
	inset: auto 0 0 0 !important;
	height: 34% !important;
	background: linear-gradient(0deg, rgba(8, 26, 31, 0.72), transparent) !important;
	z-index: 1 !important;
	pointer-events: none !important;
}

.elementor-widget-slides .swiper-slide-inner {
	z-index: 2 !important;
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	text-align: left !important;
	max-width: 1200px !important;
	margin: 0 auto !important;
	padding: 0 15px !important;
	height: 100% !important;
	box-sizing: border-box !important;
}

/* Ảnh thiết bị bên phải của Slide */
.elementor-widget-slides .swiper-slide-inner::after {
	content: '' !important;
	position: absolute !important;
	right: 15px !important;
	top: 50% !important;
	width: min(42vw, 520px) !important;
	height: 76% !important;
	transform: translateY(-50%) !important;
	background:
		linear-gradient(180deg, rgba(255, 254, 250, 0.04), rgba(13, 38, 44, 0.08)),
		url('assets/images/placeholder.jpg') center / cover no-repeat !important;
	border: 1px solid rgba(255, 254, 250, 0.16) !important;
	border-radius: 8px !important;
	box-shadow: 0 28px 70px rgba(0, 0, 0, 0.28) !important;
	z-index: 1 !important;
	pointer-events: none !important;
}

.elementor-widget-slides .elementor-slide-content {
	max-width: min(690px, 52%) !important;
	margin: 0 !important;
	padding: 80px 0 !important;
	z-index: 3 !important;
	position: relative !important;
}

.elementor-widget-slides .elementor-slide-heading {
	color: #ffffff !important;
	font-size: 2.8rem !important; /* var(--fs-5xl) */
	font-weight: 800 !important;
	line-height: 1.04 !important;
	margin-bottom: 20px !important;
	text-transform: none !important;
}

.elementor-widget-slides .elementor-slide-description {
	color: rgba(255, 255, 255, 0.82) !important;
	font-size: 1.15rem !important; /* var(--fs-lg) */
	margin-bottom: 30px !important;
	line-height: 1.6 !important;
}

.elementor-widget-slides .elementor-slide-button {
	background-color: #c9852f !important; /* var(--color-secondary) */
	color: #163d46 !important; /* var(--color-primary-dark) */
	font-weight: 700 !important;
	padding: 0.84rem 2.2rem !important;
	border-radius: 4px !important;
	font-size: 14px !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	transition: background-color 0.24s ease !important;
	display: inline-block !important;
}

.elementor-widget-slides .elementor-slide-button:hover {
	background-color: #e0ac62 !important;
}

/* Dots và Mũi tên Slider */
.elementor-widget-slides .swiper-pagination-bullet {
	width: 36px !important;
	height: 4px !important;
	border-radius: 999px !important;
	background-color: rgba(255, 255, 255, 0.3) !important;
	opacity: 1 !important;
	transition: background-color 0.24s ease !important;
}

.elementor-widget-slides .swiper-pagination-bullet-active {
	background-color: #c9852f !important;
}

/* 2. Elementor WC Products Grid */
.elementor-widget-woocommerce-products ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
	gap: 20px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.elementor-widget-woocommerce-products ul.products li.product {
	background-color: #fafbfb !important;
	border: 1px solid rgba(22, 61, 70, 0.08) !important;
	border-radius: 6px !important;
	padding: 20px !important;
	transition: transform 0.24s ease, box-shadow 0.24s ease !important;
	display: flex !important;
	flex-direction: column !important;
	width: auto !important;
	margin: 0 !important;
	float: none !important;
}

.elementor-widget-woocommerce-products ul.products li.product:hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 10px 30px rgba(22, 61, 70, 0.08) !important;
}

.elementor-widget-woocommerce-products ul.products li.product img {
	width: 100% !important;
	height: 180px !important;
	object-fit: cover !important;
	border-radius: 4px !important;
	margin-bottom: 15px !important;
}

.elementor-widget-woocommerce-products ul.products li.product .woocommerce-loop-product__title {
	font-size: 15px !important;
	color: #163d46 !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	margin-bottom: 10px !important;
	min-height: 42px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.elementor-widget-woocommerce-products ul.products li.product .price {
	font-size: 16px !important;
	color: #c9852f !important;
	font-weight: 700 !important;
	margin-bottom: 15px !important;
}

.elementor-widget-woocommerce-products ul.products li.product .button.add_to_cart_button {
	background-color: #c9852f !important;
	color: #163d46 !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	font-size: 12px !important;
	border-radius: 4px !important;
	padding: 10px 15px !important;
	text-align: center !important;
	display: block !important;
	margin-top: auto !important;
	transition: background-color 0.24s ease !important;
}

.elementor-widget-woocommerce-products ul.products li.product .button.add_to_cart_button:hover {
	background-color: #e0ac62 !important;
}

/* 3. Elementor Posts Grid (Tin tức, Giải pháp, Dự án) */
.elementor-widget-posts .elementor-posts-container {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
	gap: 25px !important;
}

/* Sửa lỗi hiển thị cột lưới bị tràn khung ở Sidebar và Widgets */
.blog-sidebar .elementor-widget-posts .elementor-posts-container,
.shop-sidebar .elementor-widget-posts .elementor-posts-container,
.product-sidebar .elementor-widget-posts .elementor-posts-container,
.blog-widget .elementor-widget-posts .elementor-posts-container {
	grid-template-columns: 1fr !important;
}

/* Reset chiều rộng và lề của Elementor Container khi nằm trong widget sidebar */
.blog-widget .elementor,
.blog-widget .elementor-element,
.blog-widget .e-con,
.blog-widget .e-con-inner {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}

/* Đồng bộ style Elementor Posts Widget trong Sidebar giống hệt web thuần */
.blog-sidebar .elementor-widget-posts .elementor-post,
.shop-sidebar .elementor-widget-posts .elementor-post,
.product-sidebar .elementor-widget-posts .elementor-post,
.blog-widget .elementor-widget-posts .elementor-post {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start !important;
	gap: var(--space-sm) !important;
	background-color: transparent !important;
	border: none !important;
	border-bottom: 1px solid rgba(22, 61, 70, 0.1) !important;
	border-radius: 0 !important;
	padding: 0 0 var(--space-sm) 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
	transition: none !important;
	transform: none !important;
}

.blog-sidebar .elementor-widget-posts .elementor-post:hover,
.shop-sidebar .elementor-widget-posts .elementor-post:hover,
.product-sidebar .elementor-widget-posts .elementor-post:hover,
.blog-widget .elementor-widget-posts .elementor-post:hover {
	transform: none !important;
	box-shadow: none !important;
}

.blog-sidebar .elementor-widget-posts .elementor-post:last-child,
.shop-sidebar .elementor-widget-posts .elementor-post:last-child,
.product-sidebar .elementor-widget-posts .elementor-post:last-child,
.blog-widget .elementor-widget-posts .elementor-post:last-child {
	border-bottom: none !important;
	padding-bottom: 0 !important;
}

/* Ảnh thumbnail ở Sidebar */
.blog-sidebar .elementor-widget-posts .elementor-post__thumbnail,
.blog-sidebar .elementor-widget-posts .elementor-post__thumbnail__link,
.shop-sidebar .elementor-widget-posts .elementor-post__thumbnail,
.shop-sidebar .elementor-widget-posts .elementor-post__thumbnail__link,
.product-sidebar .elementor-widget-posts .elementor-post__thumbnail,
.product-sidebar .elementor-widget-posts .elementor-post__thumbnail__link,
.blog-widget .elementor-widget-posts .elementor-post__thumbnail,
.blog-widget .elementor-widget-posts .elementor-post__thumbnail__link {
	width: 60px !important;
	height: 60px !important;
	border-radius: var(--radius-md) !important;
	overflow: hidden !important;
	flex-shrink: 0 !important;
	display: block !important;
	margin: 0 !important;
	float: none !important;
}

.blog-sidebar .elementor-widget-posts .elementor-post__thumbnail img,
.blog-sidebar .elementor-widget-posts .elementor-post__thumbnail__link img,
.shop-sidebar .elementor-widget-posts .elementor-post__thumbnail img,
.shop-sidebar .elementor-widget-posts .elementor-post__thumbnail__link img,
.product-sidebar .elementor-widget-posts .elementor-post__thumbnail img,
.product-sidebar .elementor-widget-posts .elementor-post__thumbnail__link img,
.blog-widget .elementor-widget-posts .elementor-post__thumbnail img,
.blog-widget .elementor-widget-posts .elementor-post__thumbnail__link img {
	width: 60px !important;
	height: 60px !important;
	object-fit: cover !important;
}

/* Phần chữ của bài viết ở Sidebar */
.blog-sidebar .elementor-widget-posts .elementor-post__text,
.shop-sidebar .elementor-widget-posts .elementor-post__text,
.product-sidebar .elementor-widget-posts .elementor-post__text,
.blog-widget .elementor-widget-posts .elementor-post__text {
	padding: 0 !important;
	margin: 0 !important;
	flex: 1 !important;
	display: flex !important;
	flex-direction: column !important;
}

/* Tiêu đề bài viết ở Sidebar */
.blog-sidebar .elementor-widget-posts .elementor-post__title,
.shop-sidebar .elementor-widget-posts .elementor-post__title,
.product-sidebar .elementor-widget-posts .elementor-post__title,
.blog-widget .elementor-widget-posts .elementor-post__title {
	font-size: var(--fs-sm) !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	margin-bottom: var(--space-xxs) !important;
}

.blog-sidebar .elementor-widget-posts .elementor-post__title a,
.shop-sidebar .elementor-widget-posts .elementor-post__title a,
.product-sidebar .elementor-widget-posts .elementor-post__title a,
.blog-widget .elementor-widget-posts .elementor-post__title a {
	color: var(--color-primary) !important;
}

.blog-sidebar .elementor-widget-posts .elementor-post__title a:hover,
.shop-sidebar .elementor-widget-posts .elementor-post__title a:hover,
.product-sidebar .elementor-widget-posts .elementor-post__title a:hover,
.blog-widget .elementor-widget-posts .elementor-post__title a:hover {
	color: var(--color-secondary) !important;
}

/* Meta ngày tháng ở Sidebar */
.blog-sidebar .elementor-widget-posts .elementor-post__meta-data,
.shop-sidebar .elementor-widget-posts .elementor-post__meta-data,
.product-sidebar .elementor-widget-posts .elementor-post__meta-data,
.blog-widget .elementor-widget-posts .elementor-post__meta-data {
	font-size: 10px !important;
	color: var(--color-text-muted) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.blog-sidebar .elementor-widget-posts .elementor-post-date,
.shop-sidebar .elementor-widget-posts .elementor-post-date,
.product-sidebar .elementor-widget-posts .elementor-post-date,
.blog-widget .elementor-widget-posts .elementor-post-date {
	font-size: 10px !important;
	color: var(--color-text-muted) !important;
}

/* Đồng bộ các block / widget mặc định của WordPress trong Sidebar */
/* 1. Gutenberg Latest Posts block */
.blog-widget .wp-block-latest-posts {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: var(--space-md) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.blog-widget .wp-block-latest-posts li {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start !important;
	gap: var(--space-sm) !important;
	border-bottom: 1px solid rgba(22, 61, 70, 0.1) !important;
	padding: 0 0 var(--space-sm) 0 !important;
	margin: 0 !important;
}

.blog-widget .wp-block-latest-posts li:last-child {
	border-bottom: none !important;
	padding-bottom: 0 !important;
}

.blog-widget .wp-block-latest-posts__featured-image {
	width: 60px !important;
	height: 60px !important;
	border-radius: var(--radius-md) !important;
	overflow: hidden !important;
	margin: 0 !important;
	flex-shrink: 0 !important;
}

.blog-widget .wp-block-latest-posts__featured-image img,
.blog-widget .wp-block-latest-posts__featured-image a {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	margin: 0 !important;
	display: block !important;
}

.blog-widget .wp-block-latest-posts__post-title {
	font-size: var(--fs-sm) !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	color: var(--color-primary) !important;
	display: block !important;
	margin-bottom: var(--space-xxs) !important;
}

.blog-widget .wp-block-latest-posts__post-title:hover {
	color: var(--color-secondary) !important;
}

.blog-widget .wp-block-latest-posts__post-date {
	display: block !important;
	font-size: 10px !important;
	color: var(--color-text-muted) !important;
	margin: 0 !important;
}

/* 2. WordPress Recent Entries widget */
.blog-widget.widget_recent_entries ul {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: var(--space-md) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.blog-widget.widget_recent_entries li {
	display: flex !important;
	flex-direction: column !important;
	gap: var(--space-xxs) !important;
	border-bottom: 1px solid rgba(22, 61, 70, 0.1) !important;
	padding: 0 0 var(--space-sm) 0 !important;
	margin: 0 !important;
}

.blog-widget.widget_recent_entries li:last-child {
	border-bottom: none !important;
	padding-bottom: 0 !important;
}

.blog-widget.widget_recent_entries li a {
	font-size: var(--fs-sm) !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	color: var(--color-primary) !important;
}

.blog-widget.widget_recent_entries li a:hover {
	color: var(--color-secondary) !important;
}

.blog-widget.widget_recent_entries .post-date {
	font-size: 10px !important;
	color: var(--color-text-muted) !important;
}

/* 3. WordPress Categories widget */
.blog-widget.widget_categories ul {
	display: grid !important;
	gap: var(--space-sm) !important;
	margin: 0 !important;
	padding: 0 !important;
}

.blog-widget.widget_categories li {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	font-size: var(--fs-sm) !important;
	color: var(--color-text-light) !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.blog-widget.widget_categories li a {
	color: var(--color-text-light) !important;
	transition: color var(--transition-fast) !important;
}

.blog-widget.widget_categories li a:hover {
	color: var(--color-primary) !important;
}

.elementor-widget-posts .elementor-post {
	background-color: #ffffff !important;
	border: 1px solid rgba(22, 61, 70, 0.08) !important;
	border-radius: 6px !important;
	overflow: hidden !important;
	transition: transform 0.24s ease, box-shadow 0.24s ease !important;
	display: flex !important;
	flex-direction: column !important;
	padding: 0 !important;
	margin: 0 !important;
}

.elementor-widget-posts .elementor-post:hover {
	transform: translateY(-4px) !important;
	box-shadow: 0 10px 30px rgba(22, 61, 70, 0.08) !important;
}

.elementor-widget-posts .elementor-post__thumbnail__link {
	display: block !important;
	height: 200px !important;
	overflow: hidden !important;
}

.elementor-widget-posts .elementor-post__thumbnail img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform 0.34s ease !important;
}

.elementor-widget-posts .elementor-post:hover .elementor-post__thumbnail img {
	transform: scale(1.06) !important;
}

.elementor-widget-posts .elementor-post__text {
	padding: 20px !important;
	display: flex !important;
	flex-direction: column !important;
	flex: 1 !important;
}

.elementor-widget-posts .elementor-post__title {
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	margin-bottom: 12px !important;
}

.elementor-widget-posts .elementor-post__title a {
	color: #163d46 !important;
	text-decoration: none !important;
}

.elementor-widget-posts .elementor-post__title a:hover {
	color: #c9852f !important;
}

.elementor-widget-posts .elementor-post__excerpt {
	font-size: 13.5px !important;
	color: #555555 !important;
	line-height: 1.6 !important;
	margin-bottom: 15px !important;
}

.elementor-widget-posts .elementor-post__read-more {
	font-size: 13px !important;
	font-weight: 700 !important;
	color: #c9852f !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	margin-top: auto !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 5px !important;
}

.elementor-widget-slides .elementor-slide-button:hover,
.elementor-widget-posts .elementor-post__read-more:hover {
	color: #163d46 !important;
}

/* Custom styling for WooCommerce default quantity input inside our B2B quantity selector */
.quantity-selector .quantity {
	display: block !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

.quantity-selector .quantity .screen-reader-text {
	display: none !important;
}

.quantity-selector .qty {
	width: 50px !important;
	height: 100% !important;
	border: none !important;
	text-align: center !important;
	font-size: 16px !important;
	font-weight: bold !important;
	color: #163d46 !important;
	background: #ffffff !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	-moz-appearance: textfield !important;
}

.quantity-selector .qty::-webkit-outer-spin-button,
.quantity-selector .qty::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
	margin: 0 !important;
}

/* Đồng bộ thiết kế Menu và Mega-menu giống hệt web thuần */
/* 1. Viền vàng dưới thanh Navigation Bar */
.navigation-bar {
	border-bottom: 3px solid var(--color-secondary) !important;
}

/* 2. Style Active Link và Hover Link trên Menu chính */
.main-menu > .menu-item.active > a,
.main-menu > .menu-item.current-menu-item > a,
.main-menu > .menu-item.current-menu-ancestor > a,
.main-menu > .menu-item > a[aria-current="page"] {
	background: linear-gradient(180deg, rgba(253, 161, 13, 0.14), rgba(253, 161, 13, 0.08)) !important;
	color: var(--color-primary-dark) !important;
	box-shadow: inset 0 -3px 0 var(--color-secondary) !important;
}

/* 3. WordPress compatibility overrides cho Mega Menu (.menu-item-mega) */
.main-menu .menu-item-mega {
	position: static !important;
}

/* Định hình hộp Mega Menu rộng bằng container trang */
.main-menu .menu-item-mega > ul.sub-menu,
.main-menu .menu-item-mega > ul.dropdown-menu {
	position: absolute !important;
	top: 100% !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	max-width: 1240px !important; /* var(--container-max-width) */
	margin: 0 auto !important;
	background-color: #fffefa !important; /* var(--color-bg-white) */
	color: #16221f !important; /* var(--color-text) */
	box-shadow: 0 24px 60px rgba(13, 38, 44, 0.16), 0 8px 20px rgba(13, 38, 44, 0.08) !important; /* var(--shadow-lg) */
	border-top: 2px solid #FDA10D !important; /* var(--color-secondary) */
	border-bottom: 1px solid rgba(22, 61, 70, 0.1) !important;
	padding: 2rem !important; /* var(--space-xl) */
	display: grid !important;
	grid-template-columns: repeat(4, 1fr) !important;
	gap: 1.5rem !important; /* var(--space-lg) */
	opacity: 0 !important;
	visibility: hidden !important;
	transform: translateY(10px) !important;
	transition: opacity 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0.2s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
	border-radius: 0 0 6px 6px !important;
	z-index: 9999 !important;
	height: auto !important;
	pointer-events: none !important;
}

/* Hiển thị Mega Menu khi hover */
.main-menu .menu-item-mega:hover > ul.sub-menu,
.main-menu .menu-item-mega:hover > ul.dropdown-menu {
	opacity: 1 !important;
	visibility: visible !important;
	transform: translateY(0) !important;
	pointer-events: auto !important;
}

/* Định dạng từng cột dọc trong Mega Menu */
.main-menu .menu-item-mega > ul.sub-menu > li,
.main-menu .menu-item-mega > ul.dropdown-menu > li {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
	float: none !important;
	background: transparent !important;
}

/* Tiêu đề của cột (Menu cấp 1) */
.main-menu .menu-item-mega > ul.sub-menu > li > a,
.main-menu .menu-item-mega > ul.dropdown-menu > li > a {
	display: block !important;
	font-size: 14px !important; /* var(--fs-sm) */
	font-weight: 800 !important;
	color: #163d46 !important; /* var(--color-primary) */
	text-transform: none !important;
	margin-bottom: 1rem !important; /* var(--space-md) */
	border-bottom: 1px solid rgba(22, 61, 70, 0.1) !important;
	padding: 0 0 0.5rem 0 !important; /* var(--space-xs) */
	background: transparent !important;
	transition: color 0.2s ease !important;
}

.main-menu .menu-item-mega > ul.sub-menu > li > a:hover,
.main-menu .menu-item-mega > ul.dropdown-menu > li > a:hover {
	color: #c9852f !important; /* var(--color-secondary) */
}

/* Danh sách link con trong cột (Menu cấp 2) */
.main-menu .menu-item-mega > ul.sub-menu > li > ul.sub-menu,
.main-menu .menu-item-mega > ul.dropdown-menu > li > ul.dropdown-menu {
	position: static !important;
	display: block !important;
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	box-shadow: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	background: transparent !important;
}

.main-menu .menu-item-mega > ul.sub-menu > li > ul.sub-menu > li,
.main-menu .menu-item-mega > ul.dropdown-menu > li > ul.dropdown-menu > li {
	display: block !important;
	margin-bottom: 0.5rem !important; /* var(--space-xs) */
	padding: 0 !important;
	width: 100% !important;
}

.main-menu .menu-item-mega > ul.sub-menu > li > ul.sub-menu a,
.main-menu .menu-item-mega > ul.dropdown-menu > li > ul.dropdown-menu a {
	display: inline-block !important;
	font-size: 14px !important; /* var(--fs-sm) */
	color: #586763 !important; /* var(--color-text-light) */
	padding: 0 !important;
	margin: 0 !important;
	transition: color 0.2s ease, padding-left 0.2s ease !important;
	background: transparent !important;
	text-align: left !important;
	font-weight: 400 !important;
}

.main-menu .menu-item-mega > ul.sub-menu > li > ul.sub-menu a:hover,
.main-menu .menu-item-mega > ul.dropdown-menu > li > ul.dropdown-menu a:hover {
	color: #163d46 !important; /* var(--color-primary) */
	padding-left: 0.5rem !important; /* var(--space-xs) */
	background: transparent !important;
}

/* Hide Show Current Template plugin footer list in optimized homepage */
#included-files-fie-on-wp-footer {
	display: none !important;
}

/* Force correct font-family with proper fallbacks to override Elementor local font bugs */
body, h1, h2, h3, h4, h5, h6,
.post-title, .post-lead, .post-body,
.blog-widget-title, .widget-post-title, .widget-post-date,
.filter-link, .comments-eyebrow, .comments-toggle-btn,
.comment-author, .comment-date, .comment-text,
.reply-title, .comment-reply-title {
	font-family: 'Roboto', Arial, "Helvetica Neue", sans-serif !important;
}

/* Adjust sticky header position when WordPress admin bar is present */
.logged-in .header-sticky {
	top: 32px !important;
}
@media screen and (max-width: 782px) {
	.logged-in .header-sticky {
		top: 46px !important;
	}
}
@media screen and (max-width: 600px) {
	.logged-in .header-sticky {
		top: 0 !important;
	}
}

/* Reset sticky header position in Customizer Preview (where admin bar is not inside iframe) */
.is-customize-preview.logged-in .header-sticky,
.is-customize-preview .header-sticky {
	top: 0 !important;
}

/* Fix topbar nav menu list style (remove bullet points to match static HTML) */
.top-bar-nav {
	list-style: none !important;
	padding-left: 0 !important;
	margin: 0 !important;
	display: flex !important;
	gap: var(--space-md) !important;
}
.top-bar-nav li {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: inline-flex !important;
}
.top-bar-nav a {
	font-size: 12px !important;
	text-decoration: none !important;
	font-weight: 700 !important;
}

/* Sticky actions (cart/account) inside navigation bar */
.navigation-bar .sticky-actions {
	display: none !important;
}

.header-sticky .sticky-actions {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	margin-left: 20px !important;
}

/* Ensure nice alignment and mobile responsiveness for sticky actions */
@media screen and (max-width: 991px) {
	.header-sticky .sticky-actions {
		gap: 8px !important;
		margin-left: auto !important;
	}

	/* Reset sub-menu structure on mobile for WP layout */
	.main-menu li ul.sub-menu,
	.main-menu li ul.dropdown-menu {
		display: none !important;
		position: static !important;
		width: 100% !important;
		max-height: none !important;
		opacity: 1 !important;
		visibility: visible !important;
		background-color: #f4f7f1 !important;
		padding: var(--space-xs) 0 var(--space-xs) var(--space-md) !important;
		border: 0 !important;
		box-shadow: none !important;
		transform: none !important;
		pointer-events: auto !important;
	}
	
	/* Show sub-menus when parent is open (.is-open) */
	.main-menu .menu-item-has-children.is-open > ul.sub-menu,
	.main-menu .menu-item-has-children.is-open > ul.dropdown-menu {
		display: block !important;
	}

	/* Style menu item lists on mobile */
	.main-menu li {
		width: 100% !important;
		display: block !important;
	}

	.main-menu li a {
		padding: var(--space-sm) var(--space-lg) !important;
		display: block !important;
		border-bottom: 1px solid rgba(22, 61, 70, 0.08) !important;
		font-size: var(--fs-base) !important;
		font-weight: 500 !important;
		color: var(--color-primary) !important;
	}

	/* Sub-menu nested links styling */
	.main-menu ul.sub-menu li a {
		padding: var(--space-xs) var(--space-lg) !important;
		font-size: 0.94rem !important;
		font-weight: 400 !important;
		color: var(--color-text-light) !important;
		border-bottom: 0 !important;
		transition: color var(--transition-fast), background-color var(--transition-fast), padding-left var(--transition-fast);
	}

	.main-menu ul.sub-menu li a:hover,
	.main-menu ul.sub-menu li a:active,
	.main-menu ul.sub-menu li a:focus {
		background-color: rgba(253, 161, 13, 0.08) !important;
		color: var(--color-primary) !important;
		padding-left: calc(var(--space-lg) + 10px) !important;
		outline: none !important;
	}

	/* Solutions sub-menu nested links styling */
	.main-menu .solution-menu-group ul.sub-menu li a,
	.main-menu .solution-menu-group ul.solution-submenu-list li a,
	.solution-submenu-list a,
	.solution-menu-group ul a {
		font-size: var(--fs-base) !important;
		font-weight: 500 !important;
		color: var(--color-primary) !important;
	}

	/* Mega menu specific styling for mobile - Light Theme */
	.main-menu > li.menu-item-mega > ul.dropdown-menu,
	.main-menu > li.menu-item-mega > ul.sub-menu {
		position: static !important;
		width: 100% !important;
		max-width: 100% !important;
		max-height: none !important;
		overflow: visible !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		border: none !important;
		box-shadow: none !important;
		background-color: #f4f7f1 !important; /* Light background */
		padding: 1rem 1.5rem !important;
		margin: 0 !important;
		display: none !important; /* Managed by .is-open */
		transition: none !important;
	}
	.main-menu > li.menu-item-mega.is-open > ul.dropdown-menu,
	.main-menu > li.menu-item-mega.is-open > ul.sub-menu {
		display: block !important;
	}

	/* Level 2 Column Headers on Mobile */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li > a,
	.main-menu > li.menu-item-mega > ul.sub-menu > li > a {
		font-weight: 700 !important;
		color: var(--color-primary) !important; /* Dark teal */
		padding: var(--space-sm) 0 !important;
		margin-bottom: 0.5rem !important;
		border-bottom: 1px solid rgba(22, 61, 70, 0.08) !important; /* Subtle dark border */
		font-size: 14px !important;
		pointer-events: none !important; /* Make headers plain text */
	}

	/* Level 3 Columns (nested lists) */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu {
		display: grid !important; /* Grid layout for 2 columns */
		grid-template-columns: repeat(2, 1fr) !important;
		gap: 4px 12px !important;
		background-color: transparent !important;
		padding: 0 0 1rem 0 !important;
	}

	/* Level 3 links on Mobile */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li {
		width: auto !important;
		display: block !important;
	}
	/* Level 3 links on Mobile (Cửa hàng, Giải pháp & all submenus) */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a,
	.main-menu ul.sub-menu li ul.sub-menu li a,
	.main-menu .solution-menu-group ul.sub-menu li a,
	.main-menu .solution-menu-group ul.solution-submenu-list li a,
	.solution-submenu-list a,
	.solution-menu-group ul a,
	.mega-menu-list a {
		color: var(--color-primary) !important;
		padding-top: 0.52rem !important;
		padding-bottom: 0.52rem !important;
		padding-right: var(--space-md) !important;
		padding-left: calc(var(--space-md) + var(--space-sm) + 5px) !important;
		font-size: var(--fs-base) !important;
		border-bottom: 0 !important;
		font-weight: 500 !important;
		display: block !important;
		transition: color var(--transition-fast), background-color var(--transition-fast), padding-left var(--transition-fast);
	}

	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a:hover,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a:hover,
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a:active,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a:active,
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a:focus,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a:focus,
	.main-menu ul.sub-menu li ul.sub-menu li a:hover,
	.main-menu ul.sub-menu li ul.sub-menu li a:active,
	.main-menu ul.sub-menu li ul.sub-menu li a:focus,
	.main-menu .solution-menu-group ul.sub-menu li a:hover,
	.main-menu .solution-menu-group ul.sub-menu li a:active,
	.main-menu .solution-menu-group ul.sub-menu li a:focus,
	.solution-submenu-list a:hover,
	.solution-submenu-list a:active,
	.solution-submenu-list a:focus,
	.solution-menu-group ul a:hover,
	.solution-menu-group ul a:active,
	.solution-menu-group ul a:focus,
	.mega-menu-list a:hover,
	.mega-menu-list a:active,
	.mega-menu-list a:focus {
		background-color: rgba(253, 161, 13, 0.08) !important;
		color: var(--color-primary) !important;
		padding-left: calc(var(--space-md) + var(--space-sm) + var(--space-xs) + 10px) !important;
		outline: none !important;
	}

	/* Rotate dropdown icons on mobile when open */
	.main-menu .menu-item-has-children > a {
		display: flex !important;
		justify-content: space-between !important;
		align-items: center !important;
	}
	.main-menu .menu-item-has-children > a i {
		transition: transform var(--transition-fast) ease !important;
	}
	.main-menu .menu-item-has-children.is-open > a i {
		transform: rotate(180deg) !important;
	}

	/* Force top bar menu items to align horizontally on mobile */
	.top-bar-nav,
	.top-bar-nav ul,
	.top-bar-inner div > ul {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		gap: 0.34rem 0.9rem !important;
		padding: 0.34rem 0 0 0 !important;
		margin: 0 !important;
		list-style: none !important;
		width: 100% !important;
		border-top: 1px solid rgba(22, 61, 70, 0.08) !important;
	}

	.top-bar-nav li,
	.top-bar-inner div > ul li {
		display: inline-flex !important;
		margin: 0 !important;
		padding: 0 !important;
		width: auto !important;
	}

	.top-bar-nav li a,
	.top-bar-inner div > ul li a,
	.top-bar-nav a {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 0.08rem 0 !important;
		color: rgba(22, 61, 70, 0.82) !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		line-height: 1.1 !important;
		border-bottom: 0 !important;
		text-transform: none !important;
	}
}

/* Ensure footer sidebar widget wrappers stretch to full width and act as transparent container wrappers */
.footer-grid .footer-widget,
.footer-grid .widget_block {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	display: contents !important;
}

/* Fix WooCommerce Pagination to match static HTML */
.woocommerce-pagination {
	display: flex !important;
	justify-content: center !important;
	margin-top: var(--space-2xl) !important;
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
}

.woocommerce-pagination ul.page-numbers {
	display: flex !important;
	gap: 8px !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
}

.woocommerce-pagination ul.page-numbers li {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	display: inline-flex !important;
}

.woocommerce-pagination ul.page-numbers li a,
.woocommerce-pagination ul.page-numbers li span {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 40px !important;
	height: 40px !important;
	padding: 0 10px !important;
	border: 1px solid rgba(22, 61, 70, 0.12) !important;
	border-radius: var(--radius-md) !important;
	font-size: var(--fs-sm) !important;
	font-weight: 500 !important;
	background-color: var(--color-bg-white) !important;
	color: var(--color-text) !important;
	transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast) !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

.woocommerce-pagination ul.page-numbers li a:hover,
.woocommerce-pagination ul.page-numbers li span.current {
	background-color: var(--color-primary) !important;
	color: #ffffff !important;
	border-color: var(--color-primary) !important;
	transform: translateY(-1px) !important;
}

.woocommerce-pagination ul.page-numbers li span.dots {
	border: none !important;
	background: none !important;
	color: var(--color-text-muted) !important;
	min-width: auto !important;
	height: 40px !important;
	padding: 0 4px !important;
	transform: none !important;
}

/* Sidebar category filter hierarchical styling */
.filter-list .children-list {
	margin-left: 15px !important;
	margin-top: 6px !important;
	margin-bottom: 8px !important;
	padding: 0 !important;
	list-style: none !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 4px !important;
}

.filter-list .children-list li {
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
	display: block !important;
}

.filter-list .children-list .filter-link {
	font-weight: 400 !important;
	font-size: 0.88rem !important;
	opacity: 0.85 !important;
	padding: 2px 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	border-bottom: 0 !important;
}

@media (max-width: 992px) {
	/* Level 3 links on Mobile (Cửa hàng, Giải pháp & all submenus) */
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a,
	.main-menu ul.sub-menu li ul.sub-menu li a,
	.mega-menu-list a {
		color: var(--color-primary) !important;
		padding-top: 0.52rem !important;
		padding-bottom: 0.52rem !important;
		padding-right: var(--space-md) !important;
		padding-left: calc(var(--space-md) + var(--space-sm) + 5px) !important;
		font-size: var(--fs-base) !important;
		border-bottom: 0 !important;
		font-weight: 500 !important;
		display: block !important;
		transition: color var(--transition-fast), background-color var(--transition-fast), padding-left var(--transition-fast);
	}

	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a:hover,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a:hover,
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a:active,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a:active,
	.main-menu > li.menu-item-mega > ul.dropdown-menu > li.menu-item-has-children > ul.sub-menu li a:focus,
	.main-menu > li.menu-item-mega > ul.sub-menu > li.menu-item-has-children > ul.sub-menu li a:focus,
	.main-menu ul.sub-menu li ul.sub-menu li a:hover,
	.main-menu ul.sub-menu li ul.sub-menu li a:active,
	.main-menu ul.sub-menu li ul.sub-menu li a:focus,
	.mega-menu-list a:hover,
	.mega-menu-list a:active,
	.mega-menu-list a:focus {
		background-color: rgba(253, 161, 13, 0.08) !important;
		color: var(--color-primary) !important;
		padding-left: calc(var(--space-md) + var(--space-sm) + var(--space-xs) + 10px) !important;
		outline: none !important;
	}
}