/* -------------------------------
  Settings
------------------------------- */
.setting-item {
	&.sbs-heading {
		padding-top: 0.75em;
		background: linear-gradient(-90deg, rgb(from var(--text-accent) r g b/ 10%) 30%, transparent);
	}
	&.sbs-grid-radius > .setting-item-control {
		display: grid;
		grid-template-columns: auto auto auto;
		grid-template-rows: auto auto;
		gap: 2px;

		& > *:nth-child(1) {
			grid-column: 1;
			grid-row: 1 / 3;
		}
		& > *:nth-child(2) {
			grid-column: 2;
			grid-row: 1;
			border-radius: var(--input-radius) 0 0 0;
		}
		& > *:nth-child(3) {
			grid-column: 3;
			grid-row: 1;
			border-radius: 0 var(--input-radius) 0 0;
		}
		& > *:nth-child(5) {
			grid-column: 2;
			grid-row: 2;
			border-radius: 0 0 0 var(--input-radius);
		}
		& > *:nth-child(4) {
			grid-column: 3;
			grid-row: 2;
			border-radius: 0 0 var(--input-radius) 0;
		}
		& > input {
			max-width: 81.33px;
			text-align: center;
		}
		& > div.extra-setting-button {
			margin-right: 6px;
		}
	}

	&.sbs-grid-xy > .setting-item-control {
		display: grid;
		grid-template-columns: auto auto auto;
		grid-template-rows: auto;

		& > *:nth-child(1) {
			grid-column: 1;
			grid-row: 1;
		}
		& > *:nth-child(2) {
			grid-column: 2;
			grid-row: 1;
		}
		& > *:nth-child(3) {
			grid-column: 3;
			grid-row: 1;
		}
		& > input {
			max-width: 78.2px;
			text-align: center;
		}
	}

	&.sbs-spacer {
		padding-bottom: calc(var(--size-4-1) * 10);
		&:last-of-type {
			padding-bottom: revert;
		}
	}
}
