.ObSidebar-root {
	position: fixed;
	bottom: 0;
	left: 0;
	top: 0;
	z-index: 2;

	background-color: white;

	transform: translateX(-100%);
	transition: transform 0.2s ease-out;
	will-change: transform;

	&.Ob-right {
		left: unset;
		right: 0;
		transform: translateX(100%);
	}

	overflow-y: auto;

	&.Ob-open {
		transform: translateX(0);
	}

	&.ObSidebar-shadow {
		box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);

		&.Ob-right {
			box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.15);
		}
	}
}

.ObSidebar-overlay {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	top: 0;
	z-index: 1;

	opacity: 0;
	visibility: hidden;

	transition:
		opacity 0.3s ease-out,
		visibility 0.3s ease-out;
	background-color: rgba(0, 0, 0, 0.3);

	&.Ob-open {
		opacity: 1;
		visibility: visible;
	}
}