.ss-main {
	height: min-content;
	margin: auto 0;
	border-radius: 5px;
	padding: 8px;

	&.invalid {
		border-color: red !important;
	}

	&.ss-disabled {
		background: #e7e7e7;
	}
}

.ss-main:focus {
	box-shadow: none;
}

.ss-main .ss-values {
	height: 100%;
}

.ss-content {
	box-shadow:
		0 2px 4px 0 #11111110,
		2px 2px 4px 0 #11111110,
		-2px 2px 4px 0 #11111110;
}

.ss-content .ss-option {
	font: var(--text-font);
}

.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected {
	background: var(--uc-blue);
	color: white;
}

.ss-content .ss-list .ss-option:hover {
	background: var(--yellowgrid);
	color: black;
}

.ss-content .ss-list .ss-option.ss-disabled {
	background: #ddd;
}

.ss-main .ss-values .ss-single {
	height: min-content;
	font: var(--small-text-font);
	color: black;
}

.ss-main .ss-arrow {
	max-height: 12px;
	margin: auto 0 auto auto;
}