.bl-section-background {
	--banaslap-module-bg: transparent;
	background: var(--banaslap-module-bg);
}

.bl-section-background--solid {
	--banaslap-module-bg: var(--banaslap-module-custom-bg, transparent);
}

.bl-section-background--graphite {
	--banaslap-module-bg: linear-gradient(135deg, #090909 0%, #181818 55%, #0b0b0b 100%);
}

.bl-section-background--purple {
	--banaslap-module-bg: linear-gradient(135deg, #09090b 0%, #24103d 50%, #0b0710 100%);
}

.bl-section-background--navy {
	--banaslap-module-bg: linear-gradient(135deg, #07090f 0%, #10264b 52%, #07090f 100%);
}

.bl-section-background--ember {
	--banaslap-module-bg: linear-gradient(135deg, #0b0908 0%, #4a1d0e 55%, #100a07 100%);
}

.bl-section-background--forest {
	--banaslap-module-bg: linear-gradient(135deg, #070b09 0%, #153427 54%, #080d0a 100%);
}

.bl-section-background--lavender {
	--banaslap-module-bg: linear-gradient(135deg, #0d0a11 0%, #352642 52%, #100b15 100%);
}

.bl-section-background--sand {
	--banaslap-module-bg: linear-gradient(135deg, #0d0b08 0%, #413522 54%, #100d09 100%);
}

.bl-section-background--ice {
	--banaslap-module-bg: linear-gradient(135deg, #080b0e 0%, #183444 52%, #080c10 100%);
}

.banaslap-appearance-light .bl-section-background--graphite,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--graphite {
	--banaslap-module-bg: linear-gradient(135deg, #f7f7f5 0%, #dfdfdc 55%, #f4f4f1 100%);
}

.banaslap-appearance-light .bl-section-background--purple,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--purple {
	--banaslap-module-bg: linear-gradient(135deg, #fbf8ff 0%, #e7daf5 52%, #f8f3fc 100%);
}

.banaslap-appearance-light .bl-section-background--navy,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--navy {
	--banaslap-module-bg: linear-gradient(135deg, #f5f8fc 0%, #d9e5f4 52%, #f4f7fb 100%);
}

.banaslap-appearance-light .bl-section-background--ember,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--ember {
	--banaslap-module-bg: linear-gradient(135deg, #fff9f4 0%, #f2dccd 55%, #fbf3ec 100%);
}

.banaslap-appearance-light .bl-section-background--forest,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--forest {
	--banaslap-module-bg: linear-gradient(135deg, #f5faf6 0%, #d8e9dc 54%, #f1f7f3 100%);
}

.banaslap-appearance-light .bl-section-background--lavender,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--lavender {
	--banaslap-module-bg: linear-gradient(135deg, #fcf9ff 0%, #eadff2 52%, #f7f2fa 100%);
}

.banaslap-appearance-light .bl-section-background--sand,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--sand {
	--banaslap-module-bg: linear-gradient(135deg, #fffdf8 0%, #eee4d3 54%, #faf6ee 100%);
}

.banaslap-appearance-light .bl-section-background--ice,
.editor-styles-wrapper.banaslap-appearance-light .bl-section-background--ice {
	--banaslap-module-bg: linear-gradient(135deg, #f7fcff 0%, #dcecf3 52%, #f2f9fc 100%);
}

.bl-section-background--has-background {
	width: 100vw !important;
	max-width: none !important;
	margin-inline: calc(50% - 50vw) !important;
}

.editor-styles-wrapper .bl-section-background--has-background {
	width: 100% !important;
	margin-inline: 0 !important;
}

.bl-section-background-control__presets {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.5rem;
}

.bl-section-background-control__preset.components-button {
	display: grid;
	height: auto;
	min-height: 4.25rem;
	align-content: end;
	justify-items: start;
	overflow: hidden;
	padding: 0.5rem;
	border: 2px solid transparent;
	border-radius: 6px;
	background: var(--banaslap-module-bg);
	color: #fff;
	text-align: left;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.75);
}

.bl-section-background-control__preset.components-button.is-selected {
	border-color: var(--wp-admin-theme-color, #3858e9);
	box-shadow: 0 0 0 1px #fff inset;
}

.bl-section-background-control__preset strong {
	font-size: 0.6875rem;
	line-height: 1.2;
}