input:not([type="radio"], [type="checkbox"]), select, textarea {
	font: var(--font-l-regular);
	color: var(--color-text-1);
	background: var(--color-background-2-default);
	padding: 9px 16px;
	width: 100%;
	appearance: none;
	border: 1px solid transparent;
	caret-color: var(--color-caret);
	border-radius: 9999px;
}

textarea {
	border-radius: 12px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	appearance: none;
}

input[type="number"] {
	appearance: textfield;
	font-variant-numeric: tabular-nums;
}

input:focus,
textarea:focus {
	outline: none;
	border: 1px solid var(--color-stroke-2);
}

.form-container {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.toggle-bar {
	display: flex;
	background-color: var(--color-background-2-default);
	color: var(--color-text-1);
	padding: 4px;
	border-radius: 9999px;
	max-width: 426px;
	width: 100%;
}

.toggle-bar-item {
	flex: 1;
	padding: 8px 16px;
	font: var(--font-label-l);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	height: 36px;
	overflow: hidden;
	border-radius: 9999px;
}

.toggle-bar-item:focus-visible {
	outline-offset: -2px;
}

.toggle-bar-item-selected {
	background-color: var(--color-background-1-default);
}
