.drawer {
	display: flex;
	flex-flow: column nowrap;
	height: 100%;
	position: relative;
	transition: transform 0.3s;
	width: 100%;
	z-index: 15;
}[dir] .drawer {
	background: var(--color-main-000);
	border: 1px solid var(--color-main-020);
}[dir=ltr] .drawer {
	margin-left: auto;
	transform: translateX(100%);
}[dir=rtl] .drawer {
	margin-right: auto;
	transform: translateX(-100%);
}

.drawer:focus {
	outline-style: none;
}

[dir] .drawer.ReactModal__Content--after-open {
	transform: translateX(0%);
}

[dir=ltr] .drawer.ReactModal__Content--before-close {
	transform: translateX(100%);
}

[dir=rtl] .drawer.ReactModal__Content--before-close {
	transform: translateX(-100%);
}

.drawer__container {
	display: flex;
	flex-flow: column nowrap;
	height: 100%;
	-ms-overflow-style: none;
	overflow-y: scroll;
	scrollbar-width: none;
	width: 100%;
}

.drawer__container::-webkit-scrollbar {
	height: 0;
	width: 0;
}

.drawer__header {
	display: flex;
	flex-flow: column nowrap;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 15;
}

[dir] .drawer__header {
	background-color: var(--color-main-000);
	padding: var(--spacing-05) var(--spacing-06);
}

.drawer__header .header__close-button {
	align-self: flex-start;
	height: 24px;
	outline: none;
	width: 24px;
}

[dir] .drawer__header .header__close-button {
	background: none;
	border: none;
	cursor: pointer;
	margin-bottom: var(--spacing-05);
}

.drawer__header .header__close-icon {
	height: auto;
	width: 100%;
}

.drawer__header .header__title {
	font-size: var(--font-size-heading-m);
	line-height: var(--line-height-heading-m);
	letter-spacing: var(--letter-spacing-heading-m);
	text-transform: uppercase;
	font-stretch: var(--font-stretch-condensed);
	font-weight: var(--font-weight-condensed);
}

[dir] .header__subtitle {
	margin-top: var(--spacing-03);
}

[dir] .drawer__body {
	padding: 0 var(--spacing-06) var(--spacing-06) var(--spacing-06);
}

.drawer__footer {
	bottom: 0;
	position: -webkit-sticky;
	position: sticky;
	width: 100%;
}

[dir] .drawer__footer {
	background-color: var(--color-main-000);
	margin-top: auto;
	padding: 0 var(--spacing-06) var(--spacing-08) var(--spacing-06);
}

.drawer__fotter-divider {
	outline: 1px solid var(--color-main);
}

[dir] .drawer__fotter-divider {
	margin-bottom: var(--spacing-05);
}

.drawer__footer-buttons-wrapper {
	display: flex;
	flex-flow: column nowrap;
	gap: var(--spacing-03);
}

.drawer__overlay {
	bottom: 0;
	position: fixed;
	top: 0;
	z-index: 10;
}

[dir] .drawer__overlay {
	background-color: rgba(255, 255, 255, 0.4);
}

[dir=ltr] .drawer__overlay {
	left: 0;
	right: 0;
}

[dir=rtl] .drawer__overlay {
	right: 0;
	left: 0;
}

.drawer__overlay--disabled {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
}

[dir] .drawer__overlay--disabled {
	background-color: transparent;
}

[dir=ltr] .drawer__overlay--disabled {
	margin-left: auto;
}

[dir=rtl] .drawer__overlay--disabled {
	margin-right: auto;
}

@media screen and (min-width: 768px) {
	.drawer--size-s {
		width: 340px;
	}

	.drawer--size-m {
		width: 408px;
	}

	.drawer--size-l {
		width: 488px;
	}

	.drawer__header .header__close-button {
		align-self: flex-end;
	}
}

@media screen and (min-width: 1024px) {
	.drawer--size-s {
		width: 320px;
	}

	.drawer--size-m {
		width: 416px;
	}

	.drawer--size-l {
		width: 560px;
	}
}

@media screen and (min-width: 1600px) {
	.drawer--size-s {
		width: 400px;
	}

	.drawer--size-m {
		width: 592px;
	}

	.drawer--size-l {
		width: 760px;
	}
}

@media screen and (min-width: 1920px) {
	.drawer--size-s {
		width: 480px;
	}

	.drawer--size-m {
		width: 712px;
	}

	.drawer--size-l {
		width: 920px;
	}
}

@media screen and (min-width: 2160px) {
	.drawer__header .header__close-button {
		height: 32px;
		width: 32px;
	}
}