/* Do not Import this css, use <link>. See WEB-3297 */

.sb-page {
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

/* This class resets the variables, so can be used to ensure no values are inherited from parents  */
.sb-device-split-block-variables {
	--sb-margin-left: initial;
	--sb-margin-right: initial;
	--sb-margin-top: initial;
	--sb-margin-bottom: initial;
	--sb-padding-left: initial;
	--sb-padding-right: initial;
	--sb-padding-top: initial;
	--sb-padding-bottom: initial;

	--sb-mobile-margin-left: initial;
	--sb-mobile-margin-right: initial;
	--sb-mobile-margin-top: initial;
	--sb-mobile-margin-bottom: initial;
	--sb-mobile-padding-left: initial;
	--sb-mobile-padding-right: initial;
	--sb-mobile-padding-top: initial;
	--sb-mobile-padding-bottom: initial;

	--sb-tablet-margin-left: initial;
	--sb-tablet-margin-right: initial;
	--sb-tablet-margin-top: initial;
	--sb-tablet-margin-bottom: initial;
	--sb-tablet-padding-left: initial;
	--sb-tablet-padding-right: initial;
	--sb-tablet-padding-top: initial;
	--sb-tablet-padding-bottom: initial;

	--sb-desktop-margin-left: initial;
	--sb-desktop-margin-right: initial;
	--sb-desktop-margin-top: initial;
	--sb-desktop-margin-bottom: initial;
	--sb-desktop-padding-left: initial;
	--sb-desktop-padding-right: initial;
	--sb-desktop-padding-top: initial;
	--sb-desktop-padding-bottom: initial;
}

.sb-device-split-block-styles {
	margin-left: var(--sb-margin-left);
	margin-right: var(--sb-margin-right);
	margin-top: var(--sb-margin-top);
	margin-bottom: var(--sb-margin-bottom);
	padding-left: var(--sb-padding-left);
	padding-right: var(--sb-padding-right);
	padding-top: var(--sb-padding-top);
	padding-bottom: var(--sb-padding-bottom);
}

@media (max-width: 699px) {
	.sb-device-split-block-styles {
		margin-left: var(--sb-mobile-margin-left, var(--sb-margin-left));
		margin-right: var(--sb-mobile-margin-right, var(--sb-margin-right));
		margin-top: var(--sb-mobile-margin-top, var(--sb-margin-top));
		margin-bottom: var(--sb-mobile-margin-bottom, var(--sb-margin-bottom));
		padding-left: var(--sb-mobile-padding-left, var(--sb-padding-left));
		padding-right: var(--sb-mobile-padding-right, var(--sb-padding-right));
		padding-top: var(--sb-mobile-padding-top, var(--sb-padding-top));
		padding-bottom: var(--sb-mobile-padding-bottom, var(--sb-padding-bottom));
	}
}

@media (min-width: 700px) and (max-width: 1023px) {
	.sb-device-split-block-styles {
		margin-left: var(--sb-tablet-margin-left, var(--sb-margin-left));
		margin-right: var(--sb-tablet-margin-right, var(--sb-margin-right));
		margin-top: var(--sb-tablet-margin-top, var(--sb-margin-top));
		margin-bottom: var(--sb-tablet-margin-bottom, var(--sb-margin-bottom));
		padding-left: var(--sb-tablet-padding-left, var(--sb-padding-left));
		padding-right: var(--sb-tablet-padding-right, var(--sb-padding-right));
		padding-top: var(--sb-tablet-padding-top, var(--sb-padding-top));
		padding-bottom: var(--sb-tablet-padding-bottom, var(--sb-padding-bottom));
	}
}

@media (min-width: 1024px) {
	.sb-device-split-block-styles {
		margin-left: var(--sb-desktop-margin-left, var(--sb-margin-left));
		margin-right: var(--sb-desktop-margin-right, var(--sb-margin-right));
		margin-top: var(--sb-desktop-margin-top, var(--sb-margin-top));
		margin-bottom: var(--sb-desktop-margin-bottom, var(--sb-margin-bottom));
		padding-left: var(--sb-desktop-padding-left, var(--sb-padding-left));
		padding-right: var(--sb-desktop-padding-right, var(--sb-padding-right));
		padding-top: var(--sb-desktop-padding-top, var(--sb-padding-top));
		padding-bottom: var(--sb-desktop-padding-bottom, var(--sb-padding-bottom));
	}
}

.sb-link {
	cursor: pointer;
}

.sb-bridge-active a:not(.sb-link) {
	pointer-events: none;
}
