[data-behaviour*='side'] {

	.ct-panel-inner {
		position: absolute;
		inset-block: 0;
		height: 100%;
		width: var(--side-panel-width, 500px);
		box-shadow: var(--theme-box-shadow);
		transition: transform $transition-duration ease-in-out;
	}

	&.active .ct-panel-inner {
		transform: translate3d(0, 0, 0);
	}
}

[data-behaviour*='right-side'] .ct-panel-inner {
	align-self: flex-end;
	transform: translate3d(var(--theme-panel-reveal-right, 20%), 0, 0);
}

[data-behaviour*='left-side'] .ct-panel-inner {
	align-self: flex-start;
	transform: translate3d(var(--theme-panel-reveal-left, -20%), 0, 0);
}