:root {
	--ripro-header-bg: rgba(255, 255, 255, .86);
	--ripro-header-text: #4b5563;
	--ripro-header-hover: #365fc6;
	--ripro-header-active: #365fc6;
	--ripro-header-active-bg: rgba(59, 111, 245, .09);
	--ripro-header-border: rgba(38, 51, 77, .09);
	--ripro-header-sub-bg: rgba(255, 255, 255, .98);
}

.site-header {
	padding: 0 18px;
	background: var(--ripro-header-bg);
	border-bottom: 1px solid var(--ripro-header-border);
	box-shadow: 0 4px 18px rgba(27, 39, 65, .06);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}
.site-header .container { width: min(100%, 1320px); }
.site-header .navbar { height: 64px; gap: 16px; }
.site-header .logo-wrapper { flex: 0 0 auto; }
.site-header .logo.regular { max-width: 180px; max-height: 36px; }
.site-header .logo.text { color: var(--ripro-header-text); font-size: 1.25rem; letter-spacing: .02em; }
.site-header .sep { display: none; }
.site-header .main-menu { flex: 1 1 auto; min-width: 0; }
.site-header .main-menu > div { width: 100%; }
.site-header .nav-list { display: flex; align-items: center; gap: 4px; overflow: visible; }
.site-header .nav-list > .menu-item { display: block; }
.site-header .nav-list > .menu-item > a {
	display: flex;
	align-items: center;
	min-height: 40px;
	margin: 0;
	padding: 8px 13px;
	border-radius: 9px;
	color: var(--ripro-header-text);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.35;
	transition: color .2s ease, background-color .2s ease, transform .2s ease;
}
.site-header .nav-list > .menu-item > a:hover,
.site-header .nav-list > .menu-item > a:focus-visible {
	color: var(--ripro-header-hover);
	background: rgba(59, 111, 245, .065);
	outline: none;
}
.site-header .nav-list > .menu-item.current-menu-item > a,
.site-header .nav-list > .menu-item.current-menu-parent > a,
.site-header .nav-list > .menu-item.current-menu-ancestor > a {
	color: var(--ripro-header-active);
	background: var(--ripro-header-active-bg);
	font-weight: 600;
}
.site-header .nav-list > .menu-item.menu-item-has-children > a:after { margin-left: 7px; font-size: .7em; }
.site-header .nav-list .sub-menu {
	top: calc(100% + 8px);
	min-width: 190px;
	padding: 8px;
	border: 1px solid var(--ripro-header-border);
	border-radius: 12px;
	background: var(--ripro-header-sub-bg);
	box-shadow: 0 14px 34px rgba(27, 39, 65, .12);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}
.site-header .nav-list .sub-menu:before { top: -6px; }
.site-header .nav-list .sub-menu .menu-item > a {
	display: block;
	margin: 0;
	padding: 9px 11px;
	border-radius: 8px;
	color: var(--ripro-header-text);
	font-size: .875rem;
	line-height: 1.45;
}
.site-header .nav-list .sub-menu .menu-item > a:hover,
.site-header .nav-list .sub-menu .menu-item > a:focus-visible { background: rgba(59, 111, 245, .08); color: var(--ripro-header-hover); outline: none; }
.site-header .actions { flex: 0 0 auto; gap: 5px; }
.site-header .navbar .actions > * + * { margin-left: 0; }
.site-header .navbar .actions .action-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 9px;
	color: var(--ripro-header-text);
	font-size: 1rem;
	line-height: 1;
}
.site-header .navbar .actions .action-btn:hover { color: var(--ripro-header-hover); background: rgba(59, 111, 245, .065); opacity: 1; }
.site-header .navbar .actions .action-btn.login-btn {
	width: auto;
	height: 36px;
	padding: 0 14px;
	border: 0;
	border-radius: 9px;
	background: linear-gradient(135deg, #4b7cf7, #365fc6);
	box-shadow: 0 4px 12px rgba(59, 111, 245, .2);
	color: #fff;
}
.site-header .navbar .actions .action-btn.login-btn:hover { color: #fff; background: linear-gradient(135deg, #5b88fa, #365fc6); transform: translateY(-1px); }
.site-header .navbar .action-hover-menu .avatar-warp { min-height: 36px; padding: 3px 8px 3px 3px; border: 1px solid transparent; border-radius: 9px; color: var(--ripro-header-text); }
.site-header .navbar .action-hover-menu .avatar-warp:hover { border-color: var(--ripro-header-border); background: rgba(59, 111, 245, .065); color: var(--ripro-header-hover); }
.site-header .navbar .action-hover-menu .avatar-img { width: 30px; height: 30px; }
.site-header .navbar .action-hover-menu .display-name { font-size: 1rem; }
.site-header .navbar .action-hover-menu .avatar-warp .badge { font-size: .8rem; }
.site-header .navbar-search { top: 0; height: 64px; }
.header-gap { height: 64px; }

[data-bs-theme=dark] {
	--ripro-header-bg: rgba(27, 31, 40, .88);
	--ripro-header-text: #c5ccd6;
	--ripro-header-hover: #9ab6ff;
	--ripro-header-active: #9ab6ff;
	--ripro-header-active-bg: rgba(116, 148, 230, .15);
	--ripro-header-border: rgba(255, 255, 255, .1);
	--ripro-header-sub-bg: rgba(32, 36, 45, .98);
}

@media (max-width: 991.98px) {
	.site-header { padding: 0 12px; }
	.site-header .container { width: 100%; }
	.site-header .navbar { height: 58px; gap: 10px; }
	.site-header .logo.regular { max-width: 145px; max-height: 34px; }
	.site-header .logo.text { font-size: 1.1rem; }
	.site-header .actions { margin-left: auto; }
	.site-header .navbar .actions .action-btn { width: 34px; height: 34px; }
	.site-header .navbar .actions .action-btn.login-btn { height: 34px; padding: 0 11px; }
	.site-header .burger {
		align-items: center;
		justify-content: center;
		width: 36px;
		height: 36px;
		padding: 0;
		border: 1px solid var(--ripro-header-border);
		border-radius: 9px;
		background: transparent;
		color: var(--ripro-header-text);
		cursor: pointer;
	}
	.site-header .burger:hover { border-color: rgba(59, 111, 245, .35); background: rgba(59, 111, 245, .065); color: var(--ripro-header-hover); }
	.site-header .navbar-search { height: 58px; }
	.header-gap { height: 58px; }
}