:root {
	--color-white: #fff;
	--color-black: #000;
	--color-main: #0066b4;
	--color-red: #e50028;
	--color-blue: #24a9e1;
}

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

::-webkit-scrollbar-track {
	background: var(--color-white);
}

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

.header-vertical-menu__opener {
	font-weight: 500 !important;
}

.header-vertical-menu__title {
	font-size: 20px;
}

.header-vertical-menu__fly-out .nav-vertical-fly-out>li.menu-item>a {
	color: var(--color-black);
	font-size: 13px;
}

/* MENU DANH MỤC */
.ux-nav-vertical-menu>li {
	position: relative;
	margin: 0;
}

.ux-nav-vertical-menu>li>a {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 50px;
	padding: 12px 18px;
	background: #f5f5f5;
	color: #333;
	transition: all .3s ease;
	overflow: visible;
}

/* Hover và menu đang mở */
.ux-nav-vertical-menu>li:hover>a,
.ux-nav-vertical-menu>li.current-menu-item>a,
.ux-nav-vertical-menu>li.current-menu-parent>a {
	background: var(--color-blue);
	color: var(--color-white) !important;
}

/* Đổi màu icon */
.ux-nav-vertical-menu>li:hover>a img,
.ux-nav-vertical-menu>li.current-menu-item>a img,
.ux-nav-vertical-menu>li.current-menu-parent>a img {
	filter: brightness(0) invert(1);
}

/* Tạo đầu nhọn */
.ux-nav-vertical-menu>li:hover>a:after,
.ux-nav-vertical-menu>li.current-menu-item>a:after,
.ux-nav-vertical-menu>li.current-menu-parent>a:after {
	content: "";
	position: absolute;
	top: 0;
	right: -20px;
	width: 20px;
	height: 100%;
	background: var(--color-blue);
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	z-index: 99;
}

/* Khung submenu */
.ux-nav-vertical-menu .nav-dropdown {
	border: none;
	box-shadow: 0 2px 12px rgba(0, 0, 0, .15);
}

/* Icon mũi tên bên phải */
.ux-nav-vertical-menu>li:hover>a .icon-angle-down {
	color: var(--color-white);
}

.ux-nav-vertical-menu .icon-angle-down {
    display: none !important;
}

@media screen and (min-width: 850px) {
    .dmsp {
        flex-basis: 18% !important;
        max-width: 25%;
    }
}

@media screen and (min-width: 850px) {
    .slider_anh {
        flex-basis: 82% !important;
        max-width: 100% !important;
    }
} 