@use '../classes' as *;

#{cls('mount popout.menu.container')} {
	min-width: 280px;
	background: var(--bg-menu);
	border: 1px solid var(--border-high);
	border-radius: var(--rounded-high);
	box-shadow: none;

	#{cls('popout.menu.scroller')} {
		padding: 0 !important;
		&::-webkit-scrollbar {
			display: none;
		}
		& > .item_c1e9c4,
		& > div:not([class], [role='group']) {
			margin: 6px;
		}
	}

	.wrapper_f563df {
		padding: 6px 6px 0 !important;
		&::after {
			content: '';
			display: block;
			height: 1px;
			width: 100%;
			grid-column: 1 / -1;
			background: var(--border-high);
			margin-top: 6px;
		}
	}
	.customItem_c1e9c4 {
		width: 100%;
	}
	.button_f563df {
		width: 100%;
		border-radius: var(--rounded);
		background: transparent;
		cursor: var(--cursor);
		padding: 4px 0;
		&:hover {
			background: var(--bg-higher);
		}
	}

	[role='group']:not(.wrapper_f563df, .container__8061a) {
		padding: 6px;
		display: flex;
		flex-direction: column;
		gap: 4px;
		& > .item_c1e9c4:last-child {
			margin-bottom: 0;
		}
		& > .hideInteraction_c1e9c4 {
			padding: 0;
		}
	}
	[role='separator'] {
		margin: 2px 6px;
		border-color: var(--border-high);
	}
	[role='slider'] {
		.grabber-2GQyvM {
			width: 14px;
			height: 14px;
			transform: translateY(0);
		}
	}

	.groupLabel-16o1xl {
		padding-top: 0;
		padding-bottom: 6px;
		min-height: auto;
	}

	.item_c1e9c4 {
		margin: 0;
		border-radius: var(--rounded);
		padding: 8px 12px;
		cursor: var(--cursor);
		gap: 8px;
		.iconContainer_c1e9c4 {
			margin: 0;
			display: flex;
			svg {
				margin: auto;
			}
		}
		.icon_c1e9c4 {
			color: currentColor;
		}
		.newBadge__4f501 {
			font-size: 10px;
			border-radius: var(--rounded);
			margin-top: -4px;
			font-weight: 500;
			padding: 0 4px;
		}

		&.hideInteraction-2jPGL_ {
			padding: 0;
		}
		&.focused_c1e9c4,
		&:active:not(.hideInteraction-2jPGL_) {
			background: var(--bg-menu-item);
			color: var(--text-primary) !important;
		}
		&.colorPremium-vwmYZQ {
			color: hsl(var(--discord-pink));
		}
		&.colorBrand-3cPPsm {
			color: var(--accent);
		}
	}
	// Reset
	.submenuContainer-3EVTeH {
		.item_c1e9c4 {
			flex-direction: row;
		}
		.layer-2aCOJ3 {
			margin-top: -6px;
		}
	}
}
