.time-selection-target {
	display: flex;
	height: 32px;
	padding: 6px 6px 6px 8px;
	justify-content: space-between;
	align-items: center;
	gap: 4px;
	align-self: stretch;
	border-radius: 2px;
	border: 1px solid var(--bg-slate-400);
	background: var(--bg-ink-300);
	box-shadow: none;

	.button-selected-text {
		display: flex;
		align-items: center;
		gap: 6px;
	}

	.selected-value {
		color: var(--bg-vanilla-100);
		font-family: Inter;
		font-size: 12px;
		font-style: normal;
		font-weight: 400;
		line-height: 16px; /* 133.333% */
	}
}

.lightMode {
	.time-selection-target {
		border: 1px solid var(--bg-vanilla-300);
		background: var(--bg-vanilla-300);

		.selected-value {
			color: var(--bg-ink-300);
		}
	}
}
