:root {
	--primary-color: #0f172a; /* Xanh d?m */
	--secondary-color: #E8893E; /* Cam vàng */
	--light-bg: #f8f9fa;
}

body {
	font-family: 'Roboto', sans-serif;
	color: #333;
}

/* Override Bootstrap Colors */
.text-primary-custom { color: var(--primary-color) !important; }
.text-secondary-custom { color: var(--secondary-color) !important; }
.bg-primary-custom { background-color: var(--primary-color) !important; }
.bg-secondary-custom { background-color: var(--secondary-color) !important; }

.btn-secondary-custom {
	background-color: var(--secondary-color);
	border-color: var(--secondary-color);
	color: white;
	font-weight: bold;
	padding: 10px 25px;
	border-radius: 50px;
	transition: all 0.3s;
}
.btn-secondary-custom:hover {
	background-color: #d97706;
	color: white;
	transform: translateY(-2px);
	box-shadow: 0 5px 15px rgba(245, 158, 11, 0.4);
}

.btn-outline-light-custom {
	border: 2px solid white;
	color: white;
	font-weight: bold;
	padding: 10px 25px;
	border-radius: 50px;
}
.btn-outline-light-custom:hover {
	background-color: white;
	color: var(--primary-color);
}

/* Navbar tweaks */
.navbar {
	box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}
.nav-link {
	font-weight: 500;
	color: #fff !important;
	transition: color 0.3s;
}
.nav-link:hover, .nav-link.active {
	color: var(--secondary-color) !important;
}
.dropdown-menu {
	border-top: 4px solid var(--secondary-color);
	border-radius: 0 0 8px 8px;
	box-shadow: 0 10px 30px rgba(0,0,0,0.1);
	border-bottom: none;
	border-left: none;
	border-right: none;
}
.dropdown-item:hover {
	background-color: #f3f4f6;
	color: var(--secondary-color);
}

/* Hero Section with Video */
.hero-section {
	position: relative;
	height: 600px;
	overflow: hidden;
	display: flex;
	align-items: center;
	color: white;
	background-position: center center !important;
	background-size: cover !important;
}
.hero-video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -1;
	transform: translateX(-50%) translateY(-50%);
	object-fit: cover;
}
.hero-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(15, 23, 42, 0.6); /* Dark blue overlay */
	z-index: 0;
}
.product-page .hero-overlay{background: rgba(19, 18, 56, 0.6);}
.hero-content {
	position: relative;
	z-index: 1;
}

/* Products Zoom Effect */
.product-card {
	border: none;
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 0 5px 15px rgba(0,0,0,0.05);
	transition: transform 0.3s;
}
.product-card:hover {
	transform: translateY(-5px);
}
.product-img-wrapper {
	height: 300px;
	overflow: hidden;
	position: relative;
}
.product-img-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}
.product-card:hover .product-img-wrapper img {
	transform: scale(1.1);
}
.product-badge {
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: var(--primary-color);
	color: white;
	padding: 8px 20px;
	font-weight: bold;
	font-size: 0.9rem;
	text-transform: uppercase;
}

/* Services Section Customization */
.service-highlight {
	background-color: white;
	border-radius: 15px;
	box-shadow: 0 15px 40px rgba(0,0,0,0.08);
	overflow: hidden;
}
.service-icon-box {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	margin-right: 15px;
}
.bg-icon-blue { background-color: #e0f2fe; color: var(--primary-color); }
.bg-icon-orange { background-color: #ffedd5; color: var(--secondary-color); }

/* News Cards */
.news-card {
	border: none;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 4px 6px rgba(0,0,0,0.05);
	transition: all 0.3s;
}
.news-card:hover {
	box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}
.news-img {
	object-fit: cover;
}

/* Footer */
footer a {
	color: #d1d5db;
	text-decoration: none;
	transition: color 0.2s;
}
footer a:hover {
	color: var(--secondary-color);
}
@media (min-width: 992px) {
	.navbar .dropdown:hover > .dropdown-menu {
		display: block;
		margin-top: 0;
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}
	.navbar .dropdown-menu {
		display: block;
		opacity: 0;
		visibility: hidden;
		transform: translateY(10px);
		transition: all 0.25s ease;
	}
}
@media (max-width: 991px) {
	.navbar-nav{width: 320px;float: right;background: #0F172A;padding: 0;}
	.navbar-nav > li{display: block;width: 100%;border-top: #16223E solid 1px;border-bottom: #0A0F1C solid 1px;text-align: left;}
	.navbar-nav > li > a{color:#fff !important;}
	.navbar-nav > li .dropdown-toggle:after{float: right;margin-top: 10px;}
	.navbar-nav .nav-item.bao-gia{margin: 0 !important;padding: 15px !important;}
}