/* Riêng.css */

/* Mã màu */
:root {
	--Dark-Sage-Green: #1a612b;
	--Goldenrod: #efc71e;
}

h1, h2, h3, h4, h5 {
	color: var(--Dark-Sage-Green) !important;
}

/* Đặt font mặc định cho tất cả text, nhưng loại trừ icon */
/* body, 
body *:not(i):not(.fa):not([class^="fa-"]):not([class*=" fa-"]) {
  font-family: 'Open Sans', sans-serif !important;
} */

/* Giữ nguyên font của Font Awesome */
i.fa, i.fas, i.far, i.fab,
[class^="fa-"], [class*=" fa-"] {
  font-family: 'Font Awesome 6 Free' !important;
}

/* Áp dụng cho toàn bộ trang */
body {
  scrollbar-width: thin;
  scrollbar-color: #f9a825 white; 
}

/* Áp dụng cho Chrome, Edge và Safari */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: white;
}

::-webkit-scrollbar-thumb {
  background-color: var(--Goldenrod);
  border-radius: 8px;
  border: none;
}

.off-canvas-left .mfp-content {
	background: #fffbf0 !important;
}

.off-canvas:not(.off-canvas-center) .nav-vertical li>a, .toggle i {
	color: var(--Dark-Sage-Green);
}

.transparent #logo img {
    max-height: 140px !important;
}

.nav>li>a>i+span, .nav-dark .nav>li>a, .social-icons i {
	color: var(--Dark-Sage-Green) !important;
}

.cart-icon strong {
	border: 2px solid var(--Dark-Sage-Green) !important;
	color: var(--Dark-Sage-Green) !important;
}

.cart-icon strong:after {
    border: 2px solid var(--Dark-Sage-Green) !important;
}

.transparent #logo img {
    max-height: 0 !important;
}

#masthead {
	height: 0 !important;
}

/* Ẩn logo trên desktop */
@media (max-width: 849px) {
	.transparent #logo img {
       max-height: 90px !important;
	}
	
	#masthead {
		height: 90px !important;
	}
}

.ux-menu-link__link {
	color: white !important;
	font-size: 18px;
	font-weight: bold;
}

.ux-menu-link__link:hover {
	color: var(--Goldenrod) !important;
}

.lienket .ux-menu-link__link {
	color: white !important;
	font-size: 20px;
	font-weight: bold;
}

.lienket .ux-menu-link__link:hover {
	color: var(--Goldenrod) !important;
}

.nav-sidebar.nav-vertical>li.menu-item.active {
	background: white !important;
}

.page-title {
	padding-top: 120px;
}

.my-logo-wrapper {
  text-align: center;
  margin-left: 25px;
}

.my-logo-image {
/*   width: 150px; */
  height: 200px;
}

@media (max-width: 849px) {
	.lienket .ux-menu-link__link {
		color: white !important;
		font-size: 16px;
	}
	
	.page-title {
		padding-top: 0;
	}
}