/* ButtonComponent styles */

.som.button-component {
	padding: 0.4cm;
	border-width: var(--som-component-border-width);
	border-radius: 0.6cm;
	background-z: -0.2cm;
	border-emissive: var(--som-component-border-color);
	background-emissive: var(--som-component-background-color);
}

.som.button-component > text {
	centroid-y: -0.42cm;
	centroid-z: 0.1cm;
	material-color: rgb(0, 0, 0);
	material-emissive: var(--som-base-color);
	font-size: var(--som-font-size-base);
}

button.button-component {
	cursor: pointer;
	padding: 3px 15px;
	background-color: var(--dom-background-color);
	border-radius: var(--dom-container-border-radius);
	border: solid var(--dom-container-border-width) var(--dom-primary-color);
}

button.button-component:hover {
	border-color: var(--dom-light-secondary-color);
}

button.button-component:active {
	border-color: var(--dom-dark-secondary-color);
}

button.button-component.selected {
	background-color: var(--dom-dark-primary-color);
}

button.button-component.small {
	padding: 2px 8px;
	font-size: var(--dom-font-size-0);
	line-height: 1em;
	text-transform: uppercase;
}