.msweb-sidebar-shell {
	width: var(--msweb-sidebar-shell-width, 220px);
	height: var(--msweb-sidebar-shell-height, auto);
	max-height: var(--msweb-sidebar-shell-max-height, none);
	background: var(--msweb-sidebar-shell-bg, #fff);
	border-right: 1px solid var(--msweb-sidebar-shell-border-color, #e5e7eb);
	overflow-y: auto;
	overflow-x: hidden;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	margin: var(--msweb-sidebar-shell-margin, 6px);
	border-radius: var(--msweb-sidebar-shell-radius, 12px);
	transition: width 0.2s ease, margin 0.2s ease;
}

.msweb-sidebar-shell--collapsed {
	width: var(--msweb-sidebar-shell-collapsed-width, 56px);
}

.msweb-sidebar-shell .sidebar-footer {
	flex-shrink: 0;
	padding: 8px;
	border-top: 1px solid var(--msweb-sidebar-footer-border-color, #eef2f7);
	margin-top: auto;
}

.msweb-sidebar-shell .sidebar-footer__row {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 6px;
}

.msweb-sidebar-shell .sidebar-footer__row .theme-switcher,
.msweb-sidebar-shell .sidebar-toggle-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: var(--msweb-sidebar-control-size, 38px);
	height: var(--msweb-sidebar-control-size, 38px);
	padding: 4px;
	background: transparent;
	border: 1px solid var(--msweb-sidebar-control-border-color, #e5e7eb);
	border-radius: 8px;
	cursor: pointer;
}

.msweb-sidebar-shell .sidebar-footer__row .theme-switcher:hover,
.msweb-sidebar-shell .sidebar-toggle-btn:hover {
	background: var(--msweb-sidebar-control-hover-bg, #f3f4f6);
}

.msweb-sidebar-shell .sidebar-footer__row .theme-switcher svg {
	width: 20px;
	height: 20px;
}

.msweb-sidebar-shell .sidebar-toggle-btn {
	color: var(--msweb-sidebar-toggle-color, #6b7280);
	font-size: 13px;
	font-family: inherit;
}

.msweb-sidebar-shell .sidebar-toggle-btn:hover {
	color: var(--msweb-sidebar-toggle-hover-color, #374151);
}

.msweb-sidebar-shell .sidebar-toggle-btn i {
	transition: transform 0.2s;
}

.msweb-sidebar-shell--collapsed .app-title,
.msweb-sidebar-shell--collapsed .sidebar-user__info,
.msweb-sidebar-shell--collapsed .sidebar-user__plan {
	display: none;
}

.msweb-sidebar-shell--collapsed .sidebar-user {
	justify-content: center;
	padding: 10px 8px;
}

.msweb-sidebar-shell--collapsed .sidebar-brand {
	justify-content: center;
	gap: 0;
	margin: 8px 4px;
	padding: 0;
}

.msweb-sidebar-shell--collapsed .sidebar-brand__link {
	flex: 0 0 auto;
	justify-content: center;
	width: 40px;
	height: 40px;
	gap: 0;
}

.msweb-sidebar-shell--collapsed .sidebar-brand__controls {
	display: none;
}

.msweb-sidebar-shell--collapsed .sidebar-brand__logo {
	width: 40px;
	height: 40px;
	object-fit: contain;
	cursor: pointer;
	opacity: 0.8;
}

.msweb-sidebar-shell--collapsed .sidebar-brand__logo:hover {
	opacity: 1;
}

.msweb-sidebar-shell--collapsed .sidebar-footer {
	padding: 8px 4px;
}

.msweb-sidebar-shell--collapsed .sidebar-footer__row {
	flex-direction: column;
	align-items: center;
	gap: 4px;
}

.msweb-sidebar-shell--collapsed .sidebar-footer__row .theme-switcher {
	width: var(--msweb-sidebar-control-size, 38px);
	height: var(--msweb-sidebar-control-size, 38px);
}

.msweb-sidebar-shell--collapsed .sidebar-toggle-btn i {
	transform: rotate(180deg);
}

.msweb-sidebar-nav {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.msweb-sidebar-shell > .msweb-sidebar-nav {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overflow-x: hidden;
}

.msweb-sidebar-nav .nav-section {
	padding: 12px 16px 4px;
	font-size: 11px;
	font-weight: 600;
	color: var(--msweb-sidebar-nav-section-color, #9ca3af);
	text-transform: uppercase;
	letter-spacing: .6px;
}

.msweb-sidebar-nav .nav-link,
.msweb-sidebar-nav-flyout .nav-link {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	gap: 10px;
	padding: 9px 16px;
	color: var(--msweb-sidebar-nav-link-color, #374151);
	cursor: pointer;
	border-left: 3px solid transparent;
	font-size: 14px;
	user-select: none;
	white-space: nowrap;
	overflow: hidden;
	text-decoration: none;
}

.msweb-sidebar-nav .nav-link__icon,
.msweb-sidebar-nav-flyout .nav-link__icon {
	flex-shrink: 0;
	width: 16px;
	text-align: center;
	font-size: 13px;
	color: var(--msweb-sidebar-nav-icon-color, #9ca3af);
}

.msweb-sidebar-nav .nav-link__text,
.msweb-sidebar-nav-flyout .nav-link__text {
	overflow: hidden;
	text-overflow: ellipsis;
}

.msweb-sidebar-nav .nav-link:hover,
.msweb-sidebar-nav-flyout .nav-link:hover {
	background: var(--msweb-sidebar-nav-link-hover-bg, #f9fafb);
}

.msweb-sidebar-nav .nav-link:hover .nav-link__icon,
.msweb-sidebar-nav-flyout .nav-link:hover .nav-link__icon {
	color: var(--msweb-sidebar-nav-icon-hover-color, #6b7280);
}

.msweb-sidebar-nav .nav-link.active,
.msweb-sidebar-nav-flyout .nav-link.active {
	background: var(--msweb-sidebar-nav-link-active-bg, #eff6ff);
	color: var(--msweb-sidebar-nav-link-active-color, #2563eb);
	border-left-color: var(--msweb-sidebar-nav-link-active-border, #2563eb);
	font-weight: 500;
}

.msweb-sidebar-nav .nav-link.active .nav-link__icon,
.msweb-sidebar-nav-flyout .nav-link.active .nav-link__icon {
	color: var(--msweb-sidebar-nav-icon-active-color, #2563eb);
}

.msweb-sidebar-nav .nav-link--parent-active {
	background: var(--msweb-sidebar-nav-parent-active-bg, #f5f8ff);
	color: var(--msweb-sidebar-nav-parent-active-color, #374151);
}

.msweb-sidebar-nav .nav-link--parent-active .nav-link__icon {
	color: var(--msweb-sidebar-nav-icon-active-color, #2563eb);
}

.msweb-sidebar-nav .nav-sub {
	display: none;
	flex-direction: column;
}

.msweb-sidebar-nav .nav-sub--visible {
	display: flex;
}

.msweb-sidebar-nav .nav-link--sub {
	padding-left: 32px;
	font-size: 13px;
	border-left: 3px solid transparent;
}

.msweb-sidebar-nav .nav-link--sub .nav-link__icon {
	font-size: 11px;
}

.msweb-sidebar-nav .nav-item-group {
	position: relative;
}

.msweb-sidebar-nav--collapsed .nav-section,
.msweb-sidebar-nav--collapsed .nav-sub {
	display: none;
}

.msweb-sidebar-nav--collapsed .nav-link {
	padding: 10px;
	justify-content: center;
	gap: 0;
}

.msweb-sidebar-nav--collapsed .nav-link__text {
	display: none;
}

.msweb-sidebar-nav--collapsed .nav-link__icon {
	width: auto;
	font-size: 15px;
}

.msweb-sidebar-nav-flyout {
	position: fixed;
	z-index: 500;
	min-width: 180px;
	background: var(--msweb-sidebar-nav-flyout-bg, var(--bg-card, #fff));
	border: 1px solid var(--msweb-sidebar-nav-flyout-border, var(--border, #e2e8f0));
	border-radius: 8px;
	box-shadow: var(--msweb-sidebar-nav-flyout-shadow, 0 4px 16px rgba(0, 0, 0, .12));
	padding: 4px;
	display: flex;
	flex-direction: column;
}

.msweb-sidebar-nav .nav-badge,
.msweb-sidebar-nav-flyout .nav-badge {
	background: var(--msweb-sidebar-nav-badge-bg, #ef4444);
	color: var(--msweb-sidebar-nav-badge-color, #fff);
	border-radius: 999px;
	padding: 1px 6px;
	font-size: 11px;
	font-weight: 700;
	min-width: 18px;
	text-align: center;
	margin-left: auto;
	line-height: 1.6;
	flex-shrink: 0;
}

[data-theme="dark"] .msweb-sidebar-nav {
	--msweb-sidebar-nav-section-color: #64748b;
	--msweb-sidebar-nav-link-color: #cbd5e1;
	--msweb-sidebar-nav-icon-color: #4b6280;
	--msweb-sidebar-nav-link-hover-bg: #111f34;
	--msweb-sidebar-nav-icon-hover-color: #94a3b8;
	--msweb-sidebar-nav-link-active-bg: #172a46;
	--msweb-sidebar-nav-link-active-color: #93c5fd;
	--msweb-sidebar-nav-link-active-border: #60a5fa;
	--msweb-sidebar-nav-icon-active-color: #60a5fa;
	--msweb-sidebar-nav-parent-active-bg: #0f1d30;
	--msweb-sidebar-nav-parent-active-color: #cbd5e1;
}

[data-theme="dark"] .msweb-sidebar-shell {
	--msweb-sidebar-shell-bg: #0f172a;
	--msweb-sidebar-shell-border-color: #243244;
	--msweb-sidebar-footer-border-color: #1e3045;
	--msweb-sidebar-control-border-color: #2d3f55;
	--msweb-sidebar-control-hover-bg: #111f34;
	--msweb-sidebar-toggle-color: #64748b;
	--msweb-sidebar-toggle-hover-color: #94a3b8;
}

[data-theme="dark"] .msweb-sidebar-nav-flyout {
	--msweb-sidebar-nav-link-color: #cbd5e1;
	--msweb-sidebar-nav-icon-color: #4b6280;
	--msweb-sidebar-nav-link-hover-bg: #111f34;
	--msweb-sidebar-nav-icon-hover-color: #94a3b8;
	--msweb-sidebar-nav-link-active-bg: #172a46;
	--msweb-sidebar-nav-link-active-color: #93c5fd;
	--msweb-sidebar-nav-link-active-border: #60a5fa;
	--msweb-sidebar-nav-icon-active-color: #60a5fa;
	--msweb-sidebar-nav-flyout-bg: #0f1f35;
	--msweb-sidebar-nav-flyout-border: #1e3a5f;
	--msweb-sidebar-nav-flyout-shadow: 0 4px 16px rgba(0, 0, 0, .4);
}