.DropdownButton {
	position: relative;
	height: 100%;
}

.Button {
	display: block;
	width: auto;
	height: 100%;
	padding: 0 0.5rem;
	background: none;
	border: none;
	outline: none;
	font-size: 0.85rem;
	cursor: pointer;
}

.Button:hover, .Button:focus-visible {
	background-color: rgba(255, 255, 255, 5%);
}

.Dropdown {
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 100%;
	left: 0;
	padding: 0.35rem;
	background-color: var(--background-color-1);
	border-bottom-left-radius: 0.5rem;
	border-bottom-right-radius: 0.5rem;
}

.Dropdown > button {
	display: flex;
	gap: 0.75rem;
	justify-content: space-between;
	width: 100%;
	padding: 0.25rem 0.5rem;
	background: none;
	border: none;
	border-radius: var(--border-radius-1);
	outline: none;
	font-size: 0.85rem;
	text-align: start;
	white-space: nowrap;
	cursor: pointer;
}

.Dropdown > button:hover, .Dropdown > button:focus-visible {
	background-color: color-mix(in srgb, var(--background-color-0) 75%, transparent);
}

.Dropdown > button > p {
	margin: 0;
}

.Shortcut {
	color: var(--foreground-color-1);
}