/* =========================================================================
 * Header (Flatsome Header Builder) — style theo tông Evergreen.
 * Nền tối trong suốt, sticky chuyển đậm, chữ kem, hover vàng.
 * Dùng biến từ evergreen.css (:root --tan, --cream, --brown-900...).
 * ========================================================================= */

/* Thanh header trong suốt khi ở đầu trang */
#header .header-main {
	min-height: 70px;
}

#header .header-wrapper, #header.transparent .header-main {
	background: rgba(36, 36, 36, 0.8) !important;
	transition: all .4s ease;
	border-bottom-right-radius: 8px;
	border-bottom-left-radius: 8px;
	position: fixed;
}

/* Khi sticky/cuộn xuống: nền nâu đậm + blur */
#header .header-wrapper.stuck{
	background: rgba(17, 11, 9, 0.96) !important;
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
	border-bottom: 1px solid rgba(201, 172, 140, 0.18);
}

/* Logo */
#header .header-main .logo img {
	max-height: 48px;
	width: auto;
}

/* Menu chính: chữ kem, hover vàng, gạch chân vàng */
#header .header-nav .nav > li > a {
	color: var(--cream);
	opacity: 0.85;
	font-family: var(--sans);
	font-size: 14px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	transition: color .3s ease, opacity .3s ease;
}

#header .header-nav .nav > li > a:hover,
#header .header-nav .nav > li.active > a,
#header .header-nav .nav > li.current-menu-item > a {
	color: var(--tan);
	opacity: 1;
}

/* Gạch chân vàng dưới mục menu khi hover */
#header .header-nav .nav > li > a::before {
	background-color: var(--tan) !important;
}

/* Dropdown submenu: nền tối, chữ kem */
#header .nav-dropdown {
	border: none;
	background: rgba(36, 36, 36, 0.8);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
	padding: 0;
	min-width: 180px;
	top: 40px;
}

#header .stuck .nav-dropdown {
	background: rgba(17, 11, 9, 0.96);
}

#header .nav-dropdown li{
    border: 0;
}

.has-dropdown .icon-angle-down{
    font-size: 14px;
    margin-left: 5px;
    opacity: 1;
    top: 2px;
}

#header .nav-dropdown li > a {
	color: var(--cream);
	opacity: 0.85;
	font-family: var(--sans);
	font-size: 14px;
	margin: 0;
	border: 0;
	opacity: .82;
	padding: 9px 24px;
	transition: all .25s ease;
}

#header .nav-dropdown li > a:hover {
	color: var(--tan);
	opacity: 1;
	background: rgba(201, 172, 140, 0.08);
	padding-left: 28px;
}

/* Mũi tên dropdown */
#header .nav-dropdown-default .nav-dropdown::before,
#header .nav-dropdown-default .nav-dropdown::after {
	border-bottom-color: rgba(17, 11, 9, 0.96);
}

/* Icon/nav mobile (hamburger) màu kem */
#header .nav .icon-menu,
#header .mobile-nav-icons a {
	color: #fff;
}

/* Vì header trong suốt phủ lên nội dung, các trang con (không có hero full) cần chừa chỗ.
   Trang chủ hero cao 100vh nên không cần. */