/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

ul,
ol {
    padding: 0;

    list-style: none;
}

body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
li {
    margin: 0;
}

a {
    text-decoration: none;

    color: inherit;
}

a:visited {
        color: inherit;
    }

.ant-pagination div,
    .ant-pagination span,
    .ant-pagination ul,
    .ant-pagination li {
        box-sizing: border-box;
    }

.ant-fade-enter,
.ant-fade-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-fade-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-fade-enter.ant-fade-enter-active,
.ant-fade-appear.ant-fade-appear-active {
    animation-name: antFadeIn;
    animation-play-state: running;
}

.ant-fade-leave.ant-fade-leave-active {
    pointer-events: none;

    animation-name: antFadeOut;
    animation-play-state: running;
}

.ant-fade-enter,
.ant-fade-appear {
    opacity: 0;

    animation-timing-function: linear;
}

.ant-fade-leave {
    animation-timing-function: linear;
}

@keyframes antFadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes antFadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.ant-move-up-enter,
.ant-move-up-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-up-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-up-enter.ant-move-up-enter-active,
.ant-move-up-appear.ant-move-up-appear-active {
    animation-name: antMoveUpIn;
    animation-play-state: running;
}

.ant-move-up-leave.ant-move-up-leave-active {
    pointer-events: none;

    animation-name: antMoveUpOut;
    animation-play-state: running;
}

.ant-move-up-enter,
.ant-move-up-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-move-up-leave {
    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
}

.ant-move-down-enter,
.ant-move-down-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-down-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-down-enter.ant-move-down-enter-active,
.ant-move-down-appear.ant-move-down-appear-active {
    animation-name: antMoveDownIn;
    animation-play-state: running;
}

.ant-move-down-leave.ant-move-down-leave-active {
    pointer-events: none;

    animation-name: antMoveDownOut;
    animation-play-state: running;
}

.ant-move-down-enter,
.ant-move-down-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-move-down-leave {
    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
}

.ant-move-left-enter,
.ant-move-left-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-left-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-left-enter.ant-move-left-enter-active,
.ant-move-left-appear.ant-move-left-appear-active {
    animation-name: antMoveLeftIn;
    animation-play-state: running;
}

.ant-move-left-leave.ant-move-left-leave-active {
    pointer-events: none;

    animation-name: antMoveLeftOut;
    animation-play-state: running;
}

.ant-move-left-enter,
.ant-move-left-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-move-left-leave {
    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
}

.ant-move-right-enter,
.ant-move-right-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-right-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-move-right-enter.ant-move-right-enter-active,
.ant-move-right-appear.ant-move-right-appear-active {
    animation-name: antMoveRightIn;
    animation-play-state: running;
}

.ant-move-right-leave.ant-move-right-leave-active {
    pointer-events: none;

    animation-name: antMoveRightOut;
    animation-play-state: running;
}

.ant-move-right-enter,
.ant-move-right-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-move-right-leave {
    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
}

@keyframes antMoveDownIn {
    0% {
        opacity: 0;

        transform: translateY(100%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 1;

        transform: translateY(0%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveDownOut {
    0% {
        opacity: 1;

        transform: translateY(0%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 0;

        transform: translateY(100%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveLeftIn {
    0% {
        opacity: 0;

        transform: translateX(-100%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 1;

        transform: translateX(0%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveLeftOut {
    0% {
        opacity: 1;

        transform: translateX(0%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 0;

        transform: translateX(-100%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveRightIn {
    0% {
        opacity: 0;

        transform: translateX(100%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 1;

        transform: translateX(0%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveRightOut {
    0% {
        opacity: 1;

        transform: translateX(0%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 0;

        transform: translateX(100%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveUpIn {
    0% {
        opacity: 0;

        transform: translateY(-100%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 1;

        transform: translateY(0%);
        transform-origin: 0 0;
    }
}

@keyframes antMoveUpOut {
    0% {
        opacity: 1;

        transform: translateY(0%);
        transform-origin: 0 0;
    }

    100% {
        opacity: 0;

        transform: translateY(-100%);
        transform-origin: 0 0;
    }
}

@keyframes loadingCircle {
    100% {
        transform: rotate(360deg);
    }
}

[ant-click-animating='true'],
[ant-click-animating-without-extra-node='true'] {
    position: relative;
}

html {
    --antd-wave-shadow-color: #1890ff;
    --scroll-bar: 0;
}

[ant-click-animating-without-extra-node='true']::after,
.ant-click-animating-node {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    display: block;

    content: '';
    pointer-events: none;

    opacity: 0.2;
    border-radius: inherit;
    box-shadow: 0 0 0 0 #1890ff;
    box-shadow: 0 0 0 0 var(--antd-wave-shadow-color);

    animation: fadeEffect 2s cubic-bezier(0.08, 0.82, 0.17, 1), waveEffect 0.4s cubic-bezier(0.08, 0.82, 0.17, 1);
    animation-fill-mode: forwards;
}

@keyframes waveEffect {
    100% {
        box-shadow: 0 0 0 #1890ff;
        box-shadow: 0 0 0 6px var(--antd-wave-shadow-color);
    }
}

@keyframes fadeEffect {
    100% {
        opacity: 0;
    }
}

.ant-slide-up-enter,
.ant-slide-up-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-up-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-up-enter.ant-slide-up-enter-active,
.ant-slide-up-appear.ant-slide-up-appear-active {
    animation-name: antSlideUpIn;
    animation-play-state: running;
}

.ant-slide-up-enter.ant-slide-up-enter-active.ant-select-dropdown-placement-topLeft, .ant-slide-up-appear.ant-slide-up-appear-active.ant-select-dropdown-placement-topLeft {
        animation-name: antSlideDownIn;
    }

.ant-slide-up-leave.ant-slide-up-leave-active {
    pointer-events: none;

    animation-name: antSlideUpOut;
    animation-play-state: running;
}

.ant-slide-up-leave.ant-slide-up-leave-active.ant-select-dropdown-placement-topLeft {
        animation-name: antSlideDownOut;
    }

.ant-slide-up-enter,
.ant-slide-up-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}

.ant-slide-up-leave {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}

.ant-slide-down-enter,
.ant-slide-down-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-down-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-down-enter.ant-slide-down-enter-active,
.ant-slide-down-appear.ant-slide-down-appear-active {
    animation-name: antSlideDownIn;
    animation-play-state: running;
}

.ant-slide-down-leave.ant-slide-down-leave-active {
    pointer-events: none;

    animation-name: antSlideDownOut;
    animation-play-state: running;
}

.ant-slide-down-enter,
.ant-slide-down-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}

.ant-slide-down-leave {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}

.ant-slide-left-enter,
.ant-slide-left-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-left-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-left-enter.ant-slide-left-enter-active,
.ant-slide-left-appear.ant-slide-left-appear-active {
    animation-name: antSlideLeftIn;
    animation-play-state: running;
}

.ant-slide-left-leave.ant-slide-left-leave-active {
    pointer-events: none;

    animation-name: antSlideLeftOut;
    animation-play-state: running;
}

.ant-slide-left-enter,
.ant-slide-left-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}

.ant-slide-left-leave {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}

.ant-slide-right-enter,
.ant-slide-right-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-right-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-slide-right-enter.ant-slide-right-enter-active,
.ant-slide-right-appear.ant-slide-right-appear-active {
    animation-name: antSlideRightIn;
    animation-play-state: running;
}

.ant-slide-right-leave.ant-slide-right-leave-active {
    pointer-events: none;

    animation-name: antSlideRightOut;
    animation-play-state: running;
}

.ant-slide-right-enter,
.ant-slide-right-appear {
    opacity: 0;

    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
}

.ant-slide-right-leave {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
}

@keyframes antSlideUpIn {
    0% {
        opacity: 0;

        transform: scaleY(0.8);
        transform-origin: 0% 0%;
    }

    100% {
        opacity: 1;

        transform: scaleY(1);
        transform-origin: 0% 0%;
    }
}

@keyframes antSlideUpOut {
    0% {
        opacity: 1;

        transform: scaleY(1);
        transform-origin: 0% 0%;
    }

    100% {
        opacity: 0;

        transform: scaleY(0.8);
        transform-origin: 0% 0%;
    }
}

@keyframes antSlideDownIn {
    0% {
        opacity: 0;

        transform: scaleY(0.8);
        transform-origin: 100% 100%;
    }

    100% {
        opacity: 1;

        transform: scaleY(1);
        transform-origin: 100% 100%;
    }
}

@keyframes antSlideDownOut {
    0% {
        opacity: 1;

        transform: scaleY(1);
        transform-origin: 100% 100%;
    }

    100% {
        opacity: 0;

        transform: scaleY(0.8);
        transform-origin: 100% 100%;
    }
}

@keyframes antSlideLeftIn {
    0% {
        opacity: 0;

        transform: scaleX(0.8);
        transform-origin: 0% 0%;
    }

    100% {
        opacity: 1;

        transform: scaleX(1);
        transform-origin: 0% 0%;
    }
}

@keyframes antSlideLeftOut {
    0% {
        opacity: 1;

        transform: scaleX(1);
        transform-origin: 0% 0%;
    }

    100% {
        opacity: 0;

        transform: scaleX(0.8);
        transform-origin: 0% 0%;
    }
}

@keyframes antSlideRightIn {
    0% {
        opacity: 0;

        transform: scaleX(0.8);
        transform-origin: 100% 0%;
    }

    100% {
        opacity: 1;

        transform: scaleX(1);
        transform-origin: 100% 0%;
    }
}

@keyframes antSlideRightOut {
    0% {
        opacity: 1;

        transform: scaleX(1);
        transform-origin: 100% 0%;
    }

    100% {
        opacity: 0;

        transform: scaleX(0.8);
        transform-origin: 100% 0%;
    }
}

.ant-zoom-enter,
.ant-zoom-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-enter.ant-zoom-enter-active,
.ant-zoom-appear.ant-zoom-appear-active {
    animation-name: antZoomIn;
    animation-play-state: running;
}

.ant-zoom-leave.ant-zoom-leave-active {
    pointer-events: none;

    animation-name: antZoomOut;
    animation-play-state: running;
}

.ant-zoom-enter,
.ant-zoom-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-enter-prepare,
.ant-zoom-appear-prepare {
    transform: none;
}

.ant-zoom-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

.ant-zoom-big-enter,
.ant-zoom-big-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-big-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-big-enter.ant-zoom-big-enter-active,
.ant-zoom-big-appear.ant-zoom-big-appear-active {
    animation-name: antZoomBigIn;
    animation-play-state: running;
}

.ant-zoom-big-leave.ant-zoom-big-leave-active {
    pointer-events: none;

    animation-name: antZoomBigOut;
    animation-play-state: running;
}

.ant-zoom-big-enter,
.ant-zoom-big-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-big-enter-prepare,
.ant-zoom-big-appear-prepare {
    transform: none;
}

.ant-zoom-big-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

.ant-zoom-big-fast-enter,
.ant-zoom-big-fast-appear {
    animation-duration: 0.1s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-big-fast-leave {
    animation-duration: 0.1s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-big-fast-enter.ant-zoom-big-fast-enter-active,
.ant-zoom-big-fast-appear.ant-zoom-big-fast-appear-active {
    animation-name: antZoomBigIn;
    animation-play-state: running;
}

.ant-zoom-big-fast-leave.ant-zoom-big-fast-leave-active {
    pointer-events: none;

    animation-name: antZoomBigOut;
    animation-play-state: running;
}

.ant-zoom-big-fast-enter,
.ant-zoom-big-fast-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-big-fast-enter-prepare,
.ant-zoom-big-fast-appear-prepare {
    transform: none;
}

.ant-zoom-big-fast-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

.ant-zoom-up-enter,
.ant-zoom-up-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-up-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-up-enter.ant-zoom-up-enter-active,
.ant-zoom-up-appear.ant-zoom-up-appear-active {
    animation-name: antZoomUpIn;
    animation-play-state: running;
}

.ant-zoom-up-leave.ant-zoom-up-leave-active {
    pointer-events: none;

    animation-name: antZoomUpOut;
    animation-play-state: running;
}

.ant-zoom-up-enter,
.ant-zoom-up-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-up-enter-prepare,
.ant-zoom-up-appear-prepare {
    transform: none;
}

.ant-zoom-up-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

.ant-zoom-down-enter,
.ant-zoom-down-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-down-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-down-enter.ant-zoom-down-enter-active,
.ant-zoom-down-appear.ant-zoom-down-appear-active {
    animation-name: antZoomDownIn;
    animation-play-state: running;
}

.ant-zoom-down-leave.ant-zoom-down-leave-active {
    pointer-events: none;

    animation-name: antZoomDownOut;
    animation-play-state: running;
}

.ant-zoom-down-enter,
.ant-zoom-down-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-down-enter-prepare,
.ant-zoom-down-appear-prepare {
    transform: none;
}

.ant-zoom-down-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

.ant-zoom-left-enter,
.ant-zoom-left-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-left-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-left-enter.ant-zoom-left-enter-active,
.ant-zoom-left-appear.ant-zoom-left-appear-active {
    animation-name: antZoomLeftIn;
    animation-play-state: running;
}

.ant-zoom-left-leave.ant-zoom-left-leave-active {
    pointer-events: none;

    animation-name: antZoomLeftOut;
    animation-play-state: running;
}

.ant-zoom-left-enter,
.ant-zoom-left-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-left-enter-prepare,
.ant-zoom-left-appear-prepare {
    transform: none;
}

.ant-zoom-left-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

.ant-zoom-right-enter,
.ant-zoom-right-appear {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-right-leave {
    animation-duration: 0.2s;
    animation-fill-mode: both;

    animation-play-state: paused;
}

.ant-zoom-right-enter.ant-zoom-right-enter-active,
.ant-zoom-right-appear.ant-zoom-right-appear-active {
    animation-name: antZoomRightIn;
    animation-play-state: running;
}

.ant-zoom-right-leave.ant-zoom-right-leave-active {
    pointer-events: none;

    animation-name: antZoomRightOut;
    animation-play-state: running;
}

.ant-zoom-right-enter,
.ant-zoom-right-appear {
    opacity: 0;

    transform: scale(0);
    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
}

.ant-zoom-right-enter-prepare,
.ant-zoom-right-appear-prepare {
    transform: none;
}

.ant-zoom-right-leave {
    animation-timing-function: cubic-bezier(0.78, 0.14, 0.15, 0.86);
}

@keyframes antZoomIn {
    0% {
        opacity: 0;

        transform: scale(0.2);
    }

    100% {
        opacity: 1;

        transform: scale(1);
    }
}

@keyframes antZoomOut {
    0% {
        transform: scale(1);
    }

    100% {
        opacity: 0;

        transform: scale(0.2);
    }
}

@keyframes antZoomBigIn {
    0% {
        opacity: 0;

        transform: scale(0.8);
    }

    100% {
        opacity: 1;

        transform: scale(1);
    }
}

@keyframes antZoomBigOut {
    0% {
        transform: scale(1);
    }

    100% {
        opacity: 0;

        transform: scale(0.8);
    }
}

@keyframes antZoomUpIn {
    0% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 50% 0%;
    }

    100% {
        transform: scale(1);
        transform-origin: 50% 0%;
    }
}

@keyframes antZoomUpOut {
    0% {
        transform: scale(1);
        transform-origin: 50% 0%;
    }

    100% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 50% 0%;
    }
}

@keyframes antZoomLeftIn {
    0% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 0% 50%;
    }

    100% {
        transform: scale(1);
        transform-origin: 0% 50%;
    }
}

@keyframes antZoomLeftOut {
    0% {
        transform: scale(1);
        transform-origin: 0% 50%;
    }

    100% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 0% 50%;
    }
}

@keyframes antZoomRightIn {
    0% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 100% 50%;
    }

    100% {
        transform: scale(1);
        transform-origin: 100% 50%;
    }
}

@keyframes antZoomRightOut {
    0% {
        transform: scale(1);
        transform-origin: 100% 50%;
    }

    100% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 100% 50%;
    }
}

@keyframes antZoomDownIn {
    0% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 50% 100%;
    }

    100% {
        transform: scale(1);
        transform-origin: 50% 100%;
    }
}

@keyframes antZoomDownOut {
    0% {
        transform: scale(1);
        transform-origin: 50% 100%;
    }

    100% {
        opacity: 0;

        transform: scale(0.8);
        transform-origin: 50% 100%;
    }
}

.ant-motion-collapse-legacy {
    overflow: hidden;
}

.ant-motion-collapse-legacy-active {
    transition: height 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

.ant-motion-collapse {
    overflow: hidden;

    transition: height 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

.ant-motion-collapse-legacy {
    overflow: hidden;
}

.ant-motion-collapse-legacy-active {
    transition: height 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

.ant-motion-collapse {
    overflow: hidden;

    transition: height 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), opacity 0.2s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */

/* stylelint-disable no-duplicate-selectors */

/* stylelint-disable */

/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */

.ant-tooltip {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  color: rgba(0, 0, 0, 0.85);
  font-size: 14px;
  font-variant: tabular-nums;
  line-height: 1.5715;
  list-style: none;
  font-feature-settings: 'tnum';
  position: absolute;
  z-index: 1070;
  display: block;
  max-width: 250px;
  visibility: visible;
}

.ant-tooltip-hidden {
  display: none;
}

.ant-tooltip-placement-top,
.ant-tooltip-placement-topLeft,
.ant-tooltip-placement-topRight {
  padding-bottom: 8px;
}

.ant-tooltip-placement-right,
.ant-tooltip-placement-rightTop,
.ant-tooltip-placement-rightBottom {
  padding-left: 8px;
}

.ant-tooltip-placement-bottom,
.ant-tooltip-placement-bottomLeft,
.ant-tooltip-placement-bottomRight {
  padding-top: 8px;
}

.ant-tooltip-placement-left,
.ant-tooltip-placement-leftTop,
.ant-tooltip-placement-leftBottom {
  padding-right: 8px;
}

.ant-tooltip-inner {
  min-width: 30px;
  min-height: 32px;
  padding: 6px 8px;
  color: #fff;
  text-align: left;
  text-decoration: none;
  word-wrap: break-word;
  background-color: rgba(0, 0, 0, 0.75);
  border-radius: 2px;
  box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
}

.ant-tooltip-arrow {
  position: absolute;
  display: block;
  width: 13.07106781px;
  height: 13.07106781px;
  overflow: hidden;
  background: transparent;
  pointer-events: none;
}

.ant-tooltip-arrow-content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  width: 5px;
  height: 5px;
  margin: auto;
  background-color: rgba(0, 0, 0, 0.75);
  content: '';
  pointer-events: auto;
}

.ant-tooltip-placement-top .ant-tooltip-arrow,
.ant-tooltip-placement-topLeft .ant-tooltip-arrow,
.ant-tooltip-placement-topRight .ant-tooltip-arrow {
  bottom: -5.07106781px;
}

.ant-tooltip-placement-top .ant-tooltip-arrow-content,
.ant-tooltip-placement-topLeft .ant-tooltip-arrow-content,
.ant-tooltip-placement-topRight .ant-tooltip-arrow-content {
  box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.07);
  transform: translateY(-6.53553391px) rotate(45deg);
}

.ant-tooltip-placement-top .ant-tooltip-arrow {
  left: 50%;
  transform: translateX(-50%);
}

.ant-tooltip-placement-topLeft .ant-tooltip-arrow {
  left: 13px;
}

.ant-tooltip-placement-topRight .ant-tooltip-arrow {
  right: 13px;
}

.ant-tooltip-placement-right .ant-tooltip-arrow,
.ant-tooltip-placement-rightTop .ant-tooltip-arrow,
.ant-tooltip-placement-rightBottom .ant-tooltip-arrow {
  left: -5.07106781px;
}

.ant-tooltip-placement-right .ant-tooltip-arrow-content,
.ant-tooltip-placement-rightTop .ant-tooltip-arrow-content,
.ant-tooltip-placement-rightBottom .ant-tooltip-arrow-content {
  box-shadow: -3px 3px 7px rgba(0, 0, 0, 0.07);
  transform: translateX(6.53553391px) rotate(45deg);
}

.ant-tooltip-placement-right .ant-tooltip-arrow {
  top: 50%;
  transform: translateY(-50%);
}

.ant-tooltip-placement-rightTop .ant-tooltip-arrow {
  top: 5px;
}

.ant-tooltip-placement-rightBottom .ant-tooltip-arrow {
  bottom: 5px;
}

.ant-tooltip-placement-left .ant-tooltip-arrow,
.ant-tooltip-placement-leftTop .ant-tooltip-arrow,
.ant-tooltip-placement-leftBottom .ant-tooltip-arrow {
  right: -5.07106781px;
}

.ant-tooltip-placement-left .ant-tooltip-arrow-content,
.ant-tooltip-placement-leftTop .ant-tooltip-arrow-content,
.ant-tooltip-placement-leftBottom .ant-tooltip-arrow-content {
  box-shadow: 3px -3px 7px rgba(0, 0, 0, 0.07);
  transform: translateX(-6.53553391px) rotate(45deg);
}

.ant-tooltip-placement-left .ant-tooltip-arrow {
  top: 50%;
  transform: translateY(-50%);
}

.ant-tooltip-placement-leftTop .ant-tooltip-arrow {
  top: 5px;
}

.ant-tooltip-placement-leftBottom .ant-tooltip-arrow {
  bottom: 5px;
}

.ant-tooltip-placement-bottom .ant-tooltip-arrow,
.ant-tooltip-placement-bottomLeft .ant-tooltip-arrow,
.ant-tooltip-placement-bottomRight .ant-tooltip-arrow {
  top: -5.07106781px;
}

.ant-tooltip-placement-bottom .ant-tooltip-arrow-content,
.ant-tooltip-placement-bottomLeft .ant-tooltip-arrow-content,
.ant-tooltip-placement-bottomRight .ant-tooltip-arrow-content {
  box-shadow: -3px -3px 7px rgba(0, 0, 0, 0.07);
  transform: translateY(6.53553391px) rotate(45deg);
}

.ant-tooltip-placement-bottom .ant-tooltip-arrow {
  left: 50%;
  transform: translateX(-50%);
}

.ant-tooltip-placement-bottomLeft .ant-tooltip-arrow {
  left: 13px;
}

.ant-tooltip-placement-bottomRight .ant-tooltip-arrow {
  right: 13px;
}

.ant-tooltip-pink .ant-tooltip-inner {
  background-color: #eb2f96;
}

.ant-tooltip-pink .ant-tooltip-arrow-content {
  background-color: #eb2f96;
}

.ant-tooltip-magenta .ant-tooltip-inner {
  background-color: #eb2f96;
}

.ant-tooltip-magenta .ant-tooltip-arrow-content {
  background-color: #eb2f96;
}

.ant-tooltip-red .ant-tooltip-inner {
  background-color: #f5222d;
}

.ant-tooltip-red .ant-tooltip-arrow-content {
  background-color: #f5222d;
}

.ant-tooltip-volcano .ant-tooltip-inner {
  background-color: #fa541c;
}

.ant-tooltip-volcano .ant-tooltip-arrow-content {
  background-color: #fa541c;
}

.ant-tooltip-orange .ant-tooltip-inner {
  background-color: #fa8c16;
}

.ant-tooltip-orange .ant-tooltip-arrow-content {
  background-color: #fa8c16;
}

.ant-tooltip-yellow .ant-tooltip-inner {
  background-color: #fadb14;
}

.ant-tooltip-yellow .ant-tooltip-arrow-content {
  background-color: #fadb14;
}

.ant-tooltip-gold .ant-tooltip-inner {
  background-color: #faad14;
}

.ant-tooltip-gold .ant-tooltip-arrow-content {
  background-color: #faad14;
}

.ant-tooltip-cyan .ant-tooltip-inner {
  background-color: #13c2c2;
}

.ant-tooltip-cyan .ant-tooltip-arrow-content {
  background-color: #13c2c2;
}

.ant-tooltip-lime .ant-tooltip-inner {
  background-color: #a0d911;
}

.ant-tooltip-lime .ant-tooltip-arrow-content {
  background-color: #a0d911;
}

.ant-tooltip-green .ant-tooltip-inner {
  background-color: #52c41a;
}

.ant-tooltip-green .ant-tooltip-arrow-content {
  background-color: #52c41a;
}

.ant-tooltip-blue .ant-tooltip-inner {
  background-color: #1890ff;
}

.ant-tooltip-blue .ant-tooltip-arrow-content {
  background-color: #1890ff;
}

.ant-tooltip-geekblue .ant-tooltip-inner {
  background-color: #2f54eb;
}

.ant-tooltip-geekblue .ant-tooltip-arrow-content {
  background-color: #2f54eb;
}

.ant-tooltip-purple .ant-tooltip-inner {
  background-color: #722ed1;
}

.ant-tooltip-purple .ant-tooltip-arrow-content {
  background-color: #722ed1;
}

.ant-tooltip-rtl {
  direction: rtl;
}

.ant-tooltip-rtl .ant-tooltip-inner {
  text-align: right;
}

/**
 * Переменная нужна, чтобы разделять путь к шрифтам в сторибуке
 * и при использовании в рамках сервисов
 */

@font-face {
  font-family: "Yango Headline";
  font-style: normal;
  font-weight: 900;
  src: url(../8e7a072f647647bcfe7a.woff2) format("woff2"), url(../f46f737d7a06391b2e44.woff) format("woff");
}

@font-face {
  font-display: swap;
  font-family: "YS Text";
  font-style: normal;
  font-weight: normal;
  src: url(../5b3a85021efcfe0b8efa.woff2) format("woff2"), url(../29a7e54602c62f67c34b.woff) format("woff");
}

@font-face {
  font-display: swap;
  font-family: "YS Text";
  font-style: normal;
  font-weight: 500;
  src: url(../d8b3de31960a7cbf7040.woff2) format("woff2"), url(../fdd34e1972597648c641.woff) format("woff");
}

@font-face {
  font-display: swap;
  font-family: "YS Text";
  font-style: normal;
  font-weight: bold;
  src: url(../29036cce06c2c28eca48.woff2) format("woff2"), url(../388620c120a79eefe181.woff) format("woff");
}

:root {
  --lavka-ui-kit-typography-font-family-service-title: var(--font-yango-headline, "Yango Headline"), "Helvetica Neue",
      arial, sans-serif;
  --lavka-ui-kit-typography-font-size-service-title: 30px;
  --lavka-ui-kit-typography-letter-spacing-service-title: 0.3px;
  --lavka-ui-kit-typography-line-height-service-title: var(--lavka-ui-kit-typography-font-size-service-title);
  --lavka-ui-kit-typography-font-family: var(--font-ys-text, "YS Text"), "Helvetica Neue", arial, sans-serif;
  --lavka-ui-kit-typography-font-size-body1: 20px;
  --lavka-ui-kit-typography-font-size-body2: 16px;
  --lavka-ui-kit-typography-font-size-header: 48px;
  --lavka-ui-kit-typography-font-size-title1: 40px;
  --lavka-ui-kit-typography-font-size-title2: 32px;
  --lavka-ui-kit-typography-font-size-title3: 28px;
  --lavka-ui-kit-typography-font-size-title4: 24px;
  --lavka-ui-kit-typography-font-size-caption1: 13px;
  --lavka-ui-kit-typography-font-size-caption2: 11px;
  --lavka-ui-kit-typography-font-size-caption3: 9px;
  --lavka-ui-kit-typography-letter-spacing-body1-light: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-header-light: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title1-light: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title2-light: -0.025em;
  --lavka-ui-kit-typography-letter-spacing-title3-light: -0.015em;
  --lavka-ui-kit-typography-letter-spacing-title4-light: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-caption2-light: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-body1-regular: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-header-regular: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title1-regular: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title2-regular: -0.025em;
  --lavka-ui-kit-typography-letter-spacing-title3-regular: -0.015em;
  --lavka-ui-kit-typography-letter-spacing-title4-regular: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-caption2-regular: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-body1-medium: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-body2-medium: -0.005em;
  --lavka-ui-kit-typography-letter-spacing-header-medium: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title1-medium: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title2-medium: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title3-medium: -0.015em;
  --lavka-ui-kit-typography-letter-spacing-title4-medium: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-caption2-medium: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-body1-bold: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-body2-bold: -0.005em;
  --lavka-ui-kit-typography-letter-spacing-header-bold: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title1-bold: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title2-bold: -0.02em;
  --lavka-ui-kit-typography-letter-spacing-title3-bold: -0.015em;
  --lavka-ui-kit-typography-letter-spacing-title4-bold: -0.01em;
  --lavka-ui-kit-typography-letter-spacing-caption2-bold: -0.01em;
  --lavka-ui-kit-typography-line-height-body1-normal: 23px;
  --lavka-ui-kit-typography-line-height-body2-normal: 19px;
  --lavka-ui-kit-typography-line-height-header-normal: 46px;
  --lavka-ui-kit-typography-line-height-title1-normal: 42px;
  --lavka-ui-kit-typography-line-height-title2-normal: 35px;
  --lavka-ui-kit-typography-line-height-title3-normal: 31px;
  --lavka-ui-kit-typography-line-height-title4-normal: 27px;
  --lavka-ui-kit-typography-line-height-caption1-normal: 15px;
  --lavka-ui-kit-typography-line-height-caption2-normal: 13px;
  --lavka-ui-kit-typography-line-height-body1-tight: 20px;
  --lavka-ui-kit-typography-line-height-body2-tight: 17px;
  --lavka-ui-kit-typography-line-height-header-tight: 40px;
  --lavka-ui-kit-typography-line-height-title1-tight: 34px;
  --lavka-ui-kit-typography-line-height-title2-tight: 28px;
  --lavka-ui-kit-typography-line-height-title3-tight: 24px;
  --lavka-ui-kit-typography-line-height-title4-tight: 21px;
  --lavka-ui-kit-typography-line-height-caption1-tight: 14px;
  --lavka-ui-kit-typography-line-height-caption2-tight: 12px;
  --lavka-ui-kit-typography-line-height-caption3-tight: 10px;
  --lavka-ui-kit-typography-line-height-body1-loose: 26px;
  --lavka-ui-kit-typography-line-height-body2-loose: 21px;
  --lavka-ui-kit-typography-line-height-header-loose: 46px;
  --lavka-ui-kit-typography-line-height-title1-loose: 42px;
  --lavka-ui-kit-typography-line-height-title2-loose: 35px;
  --lavka-ui-kit-typography-line-height-title3-loose: 31px;
  --lavka-ui-kit-typography-line-height-title4-loose: 27px;
  --lavka-ui-kit-typography-line-height-caption1-loose: 17px;
  --lavka-ui-kit-typography-line-height-caption2-loose: 15px;
}

@keyframes lavka-ui-kit-fade-to-top {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes lavka-ui-kit-fade-to-bottom {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes lavka-ui-kit-fade-to-right {
  from {
    opacity: 0;
    transform: translateX(10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes lavka-ui-kit-fade-to-left {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes lavka-ui-kit-fade-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

:root {
  --lavka-ui-kit-border-radius-xxl: 100px;
  --lavka-ui-kit-border-radius-l: 20px;
  --lavka-ui-kit-border-radius-m: 16px;
  --lavka-ui-kit-border-radius-s: 12px;
  --lavka-ui-kit-border-radius-xs: 8px;
  --lavka-ui-kit-border-radius-xxs: 6px;
  --lavka-ui-kit-border-radius-min: 2px;
  --lavka-ui-kit-border-xxxs: 4px;
}

:root {
  --lavka-ui-kit-box-shadow-small: 0 4px 16px rgb(0 0 0 / 8%), 0 0 16px 2px rgb(0 0 0 / 6%);
  --lavka-ui-kit-box-shadow-blue: 0 0 4px rgb(24 144 255 / 50%);
  --lavka-ui-kit-box-shadow-bottom-day-close: 0 2px 5px rgb(0 0 0 / 10%);
  --lavka-ui-kit-box-shadow-bottom-day-normal: 0 8px 20px rgb(0 0 0 / 12%);
}

:root {
  --lavka-ui-kit-color-cold-gray-100: #f2f4f5;
  --lavka-ui-kit-color-cold-gray-125: #edf0f1;
  --lavka-ui-kit-color-cold-gray-225: #cdd0d2;
  --lavka-ui-kit-color-cold-gray-350: #84878a;
  --lavka-ui-kit-color-cold-gray-450: #57595c;
  --lavka-ui-kit-color-cold-gray-500: #3f4042;
  --lavka-ui-kit-color-cold-gray-550: #2e2e30;
  --lavka-ui-kit-color-cold-gray-600: #1f2021;
  --lavka-ui-kit-color-dust-red-300: #f5222d;
  --lavka-ui-kit-color-blue-50: #e3efff;
  --lavka-ui-kit-color-blue-300: #3889fa;
  --lavka-ui-kit-color-blue-350: #1966d9;
}

:root {
  --lavka-ui-kit-color-absolute-white: #fff;
  --lavka-ui-kit-color-absolute-white-a50: #ffffff80;
  --lavka-ui-kit-color-absolute-black: #000;
  --lavka-ui-kit-color-absolute-black-a50: #00000080;
  --lavka-ui-kit-color-absolute-black-a70: #000000b3;
  --lavka-ui-kit-color-gray-50: #f7f7f6;
  --lavka-ui-kit-color-gray-100: #f2f2f1;
  --lavka-ui-kit-color-gray-125: #ebebea;
  --lavka-ui-kit-color-gray-150: #eaeae7;
  --lavka-ui-kit-color-gray-150-a50: #eaeae780;
  --lavka-ui-kit-color-gray-175: #e3e3e0;
  --lavka-ui-kit-color-gray-175-a50: #e3e3e080;
  --lavka-ui-kit-color-gray-200: #dddcd9;
  --lavka-ui-kit-color-gray-200-a60: #dddcd999;
  --lavka-ui-kit-color-gray-225: #d6d5d2;
  --lavka-ui-kit-color-gray-225-a75: #d6d5d2bf;
  --lavka-ui-kit-color-gray-250: #c8c7c4;
  --lavka-ui-kit-color-gray-300: #a2a09e;
  --lavka-ui-kit-color-gray-350: #858585;
  --lavka-ui-kit-color-gray-400: #707170;
  --lavka-ui-kit-color-gray-400-a40: #70717066;
  --lavka-ui-kit-color-gray-450: #575858;
  --lavka-ui-kit-color-gray-450-a50: #57585880;
  --lavka-ui-kit-color-gray-500: #3d3f3f;
  --lavka-ui-kit-color-gray-500-a50: #3d3f3f80;
  --lavka-ui-kit-color-gray-550: #2b2d2e;
  --lavka-ui-kit-color-gray-575: #222426;
  --lavka-ui-kit-color-gray-600: #1c1d20;
  --lavka-ui-kit-color-gray-600-a50: rgb(28 29 32 / 50%);
  --lavka-ui-kit-color-gray-650: #17181a;
  --lavka-ui-kit-color-yellow-high: #fffccc;
  --lavka-ui-kit-color-yellow-light: #fff454;
  --lavka-ui-kit-color-yellow-normal: #ffef17;
  --lavka-ui-kit-color-yellow-deep: #f2de00;
  --lavka-ui-kit-color-yellow-dark: #ebd700;
  --lavka-ui-kit-color-orange-high: #fec;
  --lavka-ui-kit-color-orange-light: #ffc766;
  --lavka-ui-kit-color-orange-normal: #ffa60d;
  --lavka-ui-kit-color-orange-normal-a15: #ffa60d26;
  --lavka-ui-kit-color-orange-normal-a20: #ffa60d33;
  --lavka-ui-kit-color-orange-deep: #e57a00;
  --lavka-ui-kit-color-orange-dark: #cc5f00;
  --lavka-ui-kit-color-red-high: #ffeae5;
  --lavka-ui-kit-color-red-light: #ffa9a6;
  --lavka-ui-kit-color-red-normal: #ff3d2b;
  --lavka-ui-kit-color-red-normal-a10: #ff3d2b1a;
  --lavka-ui-kit-color-red-normal-a15: #ff3d2b26;
  --lavka-ui-kit-color-red-normal-a20: #ff3d2b33;
  --lavka-ui-kit-color-red-normal-a25: #ff3d2b40;
  --lavka-ui-kit-color-red-normal-a30: #ff3d2b4d;
  --lavka-ui-kit-color-red-normal-a50: #ff3d2b80;
  --lavka-ui-kit-color-red-deep: #f22e1f;
  --lavka-ui-kit-color-red-dark: #d90b04;
  --lavka-ui-kit-color-green-high: #e4f7d2;
  --lavka-ui-kit-color-green-light: #7ce573;
  --lavka-ui-kit-color-green-light-a15: #7ce57326;
  --lavka-ui-kit-color-green-light-a30: #7ce57333;
  --lavka-ui-kit-color-green-normal: #00c24a;
  --lavka-ui-kit-color-green-deep: #00a637;
  --lavka-ui-kit-color-green-dark: #008c31;
  --lavka-ui-kit-color-green-normal-a25: #00c24a40;
  --lavka-ui-kit-color-blue-high: #d9ecff;
  --lavka-ui-kit-color-blue-light: #66a5ff;
  --lavka-ui-kit-color-blue-normal: #265cff;
  --lavka-ui-kit-color-blue-normal-a15: #265cff26;
  --lavka-ui-kit-color-blue-deep: #1739e5;
  --lavka-ui-kit-color-blue-dark: #1142a6;
  --lavka-ui-kit-color-magenta-high: #ffe5f0;
  --lavka-ui-kit-color-magenta-light: #faacd1;
  --lavka-ui-kit-color-magenta-normal: #f748a3;
  --lavka-ui-kit-color-magenta-deep: #d9368d;
  --lavka-ui-kit-color-magenta-dark: #bf006c;
  --lavka-ui-kit-color-purple-high: #f0e5ff;
  --lavka-ui-kit-color-purple-light: #bca6ff;
  --lavka-ui-kit-color-purple-normal: #844af7;
  --lavka-ui-kit-color-purple-normal-a15: #844af726;
  --lavka-ui-kit-color-purple-deep: #50c;
  --lavka-ui-kit-color-purple-dark: #3700a6;
  --lavka-ui-kit-color-purple-350: #b181fb;
}

:root {
  --lavka-ui-kit-gap-10: 1px;
  --lavka-ui-kit-gap-20: 2px;
  --lavka-ui-kit-gap-40: 4px;
  --lavka-ui-kit-gap-60: 6px;
  --lavka-ui-kit-gap-80: 8px;
  --lavka-ui-kit-gap-100: 10px;
  --lavka-ui-kit-gap-120: 12px;
  --lavka-ui-kit-gap-160: 16px;
  --lavka-ui-kit-gap-240: 24px;
  --lavka-ui-kit-gap-320: 32px;
  --lavka-ui-kit-gap-400: 40px;
  --lavka-ui-kit-gap-480: 48px;
  --lavka-ui-kit-gap-560: 56px;
  --lavka-ui-kit-gap-640: 64px;
  --lavka-ui-kit-gap-720: 72px;
  --lavka-ui-kit-gap-800: 80px;
  --lavka-ui-kit-gap-1000: 100px;
  --lavka-ui-kit-gap-1200: 120px;
  --lavka-ui-kit-gap-2500: 250px;
  --lavka-ui-kit-gap-3360: 336px;
  --lavka-ui-kit-gap-5000: 500px;
  /* Нестандартные отступы */
  --lavka-ui-kit-gap-30: 3px;
  --lavka-ui-kit-gap-50: 5px;
  --lavka-ui-kit-gap-75: 7.5px;
  --lavka-ui-kit-gap-90: 9px;
  --lavka-ui-kit-gap-115: 11.5px;
  --lavka-ui-kit-gap-130: 13px;
  --lavka-ui-kit-gap-140: 14px;
  --lavka-ui-kit-gap-155: 15.5px;
  --lavka-ui-kit-gap-175: 17.5px;
  --lavka-ui-kit-gap-180: 18px;
  --lavka-ui-kit-gap-195: 19.5px;
  --lavka-ui-kit-gap-205: 20.5px;
  --lavka-ui-kit-gap-360: 36px;
  /** Control-ы
  /** Вертикальные отступы */
  --lavka-ui-kit-control-inner-vertical-gap: var(--lavka-ui-kit-gap-40);
  --lavka-ui-kit-control-vertical-gap-xs: var(--lavka-ui-kit-gap-50);
  --lavka-ui-kit-control-vertical-gap-s: var(--lavka-ui-kit-gap-75);
  --lavka-ui-kit-control-vertical-gap-m: var(--lavka-ui-kit-gap-115);
  --lavka-ui-kit-control-vertical-total-gap-xs: calc(
      var(--lavka-ui-kit-control-inner-vertical-gap) + var(--lavka-ui-kit-control-vertical-gap-xs)
  );
  --lavka-ui-kit-control-vertical-total-gap-s: calc(
      var(--lavka-ui-kit-control-inner-vertical-gap) + var(--lavka-ui-kit-control-vertical-gap-s)
  );
  --lavka-ui-kit-control-vertical-total-gap-m: calc(
      var(--lavka-ui-kit-control-inner-vertical-gap) + var(--lavka-ui-kit-control-vertical-gap-m)
  );
  /** Горизонтальные отступы */
  --lavka-ui-kit-control-inner-horizontal-gap: var(--lavka-ui-kit-gap-40);
  --lavka-ui-kit-control-horizontal-gap-xs: var(--lavka-ui-kit-gap-80);
  --lavka-ui-kit-control-horizontal-gap-s: var(--lavka-ui-kit-gap-120);
  --lavka-ui-kit-control-horizontal-gap-m: var(--lavka-ui-kit-gap-120);
  --lavka-ui-kit-control-horizontal-total-gap-xs: calc(
      var(--lavka-ui-kit-control-inner-horizontal-gap) + var(--lavka-ui-kit-control-horizontal-gap-xs)
  );
  --lavka-ui-kit-control-horizontal-total-gap-s: calc(
      var(--lavka-ui-kit-control-inner-horizontal-gap) + var(--lavka-ui-kit-control-horizontal-gap-s)
  );
  --lavka-ui-kit-control-horizontal-total-gap-m: calc(
      var(--lavka-ui-kit-control-inner-horizontal-gap) + var(--lavka-ui-kit-control-horizontal-gap-m)
  );
}

:root {
  --lavka-ui-kit-transition-duration-faster: 0.15s;
  --lavka-ui-kit-transition-duration-default: 0.2s;
  --lavka-ui-kit-transition-timing-function-default: ease-out;
}

:root {
  --lavka-ui-kit-z-index-toolbar: 1;
  --lavka-ui-kit-z-index-modal: 4000;
  --lavka-ui-kit-z-index-notification: 4100;
}

body {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
}

p {
  margin: 0;
}

body.lavka-ui-kit-default-theme {
  --lavka-ui-kit-color-control-highlight: var(--lavka-ui-kit-color-blue-350);
  --lavka-ui-kit-color-error: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-fog: var(--lavka-ui-kit-color-gray-600-a50);
  --lavka-ui-kit-color-modal-alert-warning-bg: var(--lavka-ui-kit-color-status-waiting-bg);
  --lavka-ui-kit-color-modal-alert-warning-text: var(--lavka-ui-kit-color-status-waiting-main);
  --lavka-ui-kit-color-modal-alert-critical-bg: var(--lavka-ui-kit-color-status-error-bg);
  --lavka-ui-kit-color-modal-alert-critical-text: var(
      --lavka-ui-kit-color-status-error-main
  );
  --lavka-ui-kit-color-modal-close-bright: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-control-header-accent: var(--lavka-ui-kit-color-gray-550);
  --lavka-ui-kit-color-control-header-hovered: var(--lavka-ui-kit-color-gray-500);
  --lavka-ui-kit-color-control-header-select: var(--lavka-ui-kit-color-gray-500);
  --lavka-ui-kit-color-control-header-pressed: var(--lavka-ui-kit-color-gray-450);
}

body.lavka-ui-kit-default-theme_light {
  --lavka-ui-kit-color-surface-bg: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-surface-bg-minor: var(--lavka-ui-kit-color-gray-50);
  --lavka-ui-kit-color-surface-under-bg: var(--lavka-ui-kit-color-gray-50);
  --lavka-ui-kit-color-surface-floating: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-surface-line: var(--lavka-ui-kit-color-gray-175);
  --lavka-ui-kit-color-surface-card-stroke: var(--lavka-ui-kit-color-gray-175-a50);
  --lavka-ui-kit-color-surface-fog: var(--lavka-ui-kit-color-gray-600-a50);
  --lavka-ui-kit-color-surface-always-black: var(--lavka-ui-kit-color-gray-650);
  --lavka-ui-kit-color-control-main: var(--lavka-ui-kit-color-yellow-normal);
  --lavka-ui-kit-color-control-minor: var(--lavka-ui-kit-color-gray-175-a50);
  --lavka-ui-kit-color-control-link: var(--lavka-ui-kit-color-blue-normal);
  --lavka-ui-kit-color-control-error: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-control-error-minor: var(--lavka-ui-kit-color-red-normal-a10);
  --lavka-ui-kit-color-control-focus-stroke: var(--lavka-ui-kit-color-gray-650);
  --lavka-ui-kit-color-control-main-hovered: var(--lavka-ui-kit-color-yellow-deep);
  --lavka-ui-kit-color-control-main-pressed: var(--lavka-ui-kit-color-yellow-dark);
  --lavka-ui-kit-color-control-minor-hovered: var(--lavka-ui-kit-color-gray-200-a60);
  --lavka-ui-kit-color-control-minor-pressed: var(--lavka-ui-kit-color-gray-225-a75);
  --lavka-ui-kit-color-control-link-hovered: var(--lavka-ui-kit-color-blue-deep);
  --lavka-ui-kit-color-control-link-pressed: var(--lavka-ui-kit-color-blue-deep);
  --lavka-ui-kit-color-control-error-hovered: var(--lavka-ui-kit-color-red-deep);
  --lavka-ui-kit-color-control-error-pressed: var(--lavka-ui-kit-color-red-dark);
  --lavka-ui-kit-color-control-error-minor-hovered: var(--lavka-ui-kit-color-red-normal-a15);
  --lavka-ui-kit-color-control-error-minor-pressed: var(--lavka-ui-kit-color-red-normal-a20);
  --lavka-ui-kit-color-text-main: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-text-minor: var(--lavka-ui-kit-color-gray-600-a50);
  --lavka-ui-kit-color-text-always-black: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-text-minor-always-black: var(--lavka-ui-kit-color-gray-600-a50);
  --lavka-ui-kit-color-text-always-white: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-text-minor-always-white: var(--lavka-ui-kit-color-absolute-white-a50);
  --lavka-ui-kit-color-text-error: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-text-minor-error: var(--lavka-ui-kit-color-red-normal-a50);
  --lavka-ui-kit-color-status-waiting-main: var(--lavka-ui-kit-color-orange-dark);
  --lavka-ui-kit-color-status-planned-main: var(--lavka-ui-kit-color-purple-dark);
  --lavka-ui-kit-color-status-in-progress-main: var(--lavka-ui-kit-color-blue-deep);
  --lavka-ui-kit-color-status-success-main: var(--lavka-ui-kit-color-green-dark);
  --lavka-ui-kit-color-status-custom-main: var(--lavka-ui-kit-color-gray-450);
  --lavka-ui-kit-color-status-error-main: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-status-waiting-minor: var(--lavka-ui-kit-color-orange-normal-a15);
  --lavka-ui-kit-color-status-planned-minor: var(--lavka-ui-kit-color-purple-normal-a15);
  --lavka-ui-kit-color-status-in-progress-minor: var(--lavka-ui-kit-color-blue-normal-a15);
  --lavka-ui-kit-color-status-success-minor: var(--lavka-ui-kit-color-green-light-a30);
  --lavka-ui-kit-color-status-custom-minor: var(--lavka-ui-kit-color-gray-175-a50);
  --lavka-ui-kit-color-status-error-minor: var(--lavka-ui-kit-color-red-normal-a10);
  --lavka-ui-kit-color-bg: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-bg-minor: var(--lavka-ui-kit-color-gray-50);
  --lavka-ui-kit-color-bg-floating: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-line: var(--lavka-ui-kit-color-gray-175);
  --lavka-ui-kit-color-card-stroke: var(--lavka-ui-kit-color-gray-50);
  --lavka-ui-kit-color-card-divider: var(--lavka-ui-kit-color-gray-100);
  --lavka-ui-kit-color-ever-back: var(--lavka-ui-kit-color-gray-650);
  --lavka-ui-kit-color-control: var(--lavka-ui-kit-color-yellow-normal);
  --lavka-ui-kit-color-control-hovered: #f3e417;
  --lavka-ui-kit-color-control-pressed: #e8da17;
  --lavka-ui-kit-color-control-danger: var(--lavka-ui-kit-color-error);
  --lavka-ui-kit-color-control-danger-hovered: var(--lavka-ui-kit-color-error-hovered);
  --lavka-ui-kit-color-control-danger-pressed: var(--lavka-ui-kit-color-error-pressed);
  --lavka-ui-kit-color-control-danger-text: var(--lavka-ui-kit-color-text-on-error);
  --lavka-ui-kit-color-control-danger-light: var(--lavka-ui-kit-color-error-minor);
  --lavka-ui-kit-color-control-danger-light-hovered: var(--lavka-ui-kit-color-error-minor-hovered);
  --lavka-ui-kit-color-control-danger-light-pressed: var(--lavka-ui-kit-color-error-minor-pressed);
  --lavka-ui-kit-color-control-danger-light-text: var(--lavka-ui-kit-color-status-error-text);
  --lavka-ui-kit-color-bg-invert: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-link: var(--lavka-ui-kit-color-blue-normal);
  --lavka-ui-kit-color-link-hovered: var(--lavka-ui-kit-color-blue-deep);
  --lavka-ui-kit-color-link-pressed: var(--lavka-ui-kit-color-blue-dark);
  --lavka-ui-kit-color-text: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-text-on-error: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-text-on-control: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-status-waiting-text: var(--lavka-ui-kit-color-orange-dark);
  --lavka-ui-kit-color-status-waiting-bg: var(--lavka-ui-kit-color-orange-high);
  --lavka-ui-kit-color-status-planned-text: var(--lavka-ui-kit-color-purple-dark);
  --lavka-ui-kit-color-status-planned-bg: var(--lavka-ui-kit-color-purple-high);
  --lavka-ui-kit-color-status-in-progress-text: var(--lavka-ui-kit-color-blue-deep);
  --lavka-ui-kit-color-status-in-progress-bg: var(--lavka-ui-kit-color-blue-high);
  --lavka-ui-kit-color-status-success-text: var(--lavka-ui-kit-color-green-dark);
  --lavka-ui-kit-color-status-success-bg: var(--lavka-ui-kit-color-green-high);
  --lavka-ui-kit-color-status-custom-text: var(--lavka-ui-kit-color-gray-450);
  --lavka-ui-kit-color-status-custom-bg: var(--lavka-ui-kit-color-gray-150);
  --lavka-ui-kit-color-status-error-text: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-status-error-bg: var(--lavka-ui-kit-color-red-high);
  --lavka-ui-kit-box-shadow-top-day-elevation-2: 0 -4px 16px 0 rgb(43 41 36 / 6%);
  --lavka-ui-kit-box-shadow-top-day-elevation-3: 0 -4px 24px 0 rgb(43 41 36 / 12%);
  --lavka-ui-kit-box-shadow-bottom-day-elevation-1: 0 2px 5px 0 rgb(43 41 36 / 5%);
  --lavka-ui-kit-box-shadow-bottom-day-elevation-2: 0 4px 16px 0 rgb(43 41 36 / 6%);
  --lavka-ui-kit-box-shadow-bottom-day-elevation-3: 0 4px 24px 0 rgb(43 41 36 / 12%);
  --lavka-ui-kit-box-shadow-control-focus: 0 0 0 2px var(--lavka-ui-kit-color-absolute-white), 0 0 0 4px #262626;
  --lavka-ui-kit-color-text-invert: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-error: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-error-minor: var(--lavka-ui-kit-color-red-high);
  --lavka-ui-kit-color-error-hovered: var(--lavka-ui-kit-color-red-deep);
  --lavka-ui-kit-color-error-pressed: var(--lavka-ui-kit-color-red-dark);
  --lavka-ui-kit-color-error-minor-hovered: #fadcd4;
  --lavka-ui-kit-color-error-minor-pressed: #f6cfc5;
}

body.lavka-ui-kit-default-theme_dark {
  --lavka-ui-kit-color-surface-bg: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-surface-bg-minor: var(--lavka-ui-kit-color-gray-575);
  --lavka-ui-kit-color-surface-under-bg: var(--lavka-ui-kit-color-gray-650);
  --lavka-ui-kit-color-surface-floating: var(--lavka-ui-kit-color-gray-550);
  --lavka-ui-kit-color-surface-line: var(--lavka-ui-kit-color-gray-500);
  --lavka-ui-kit-color-surface-card-stroke: var(--lavka-ui-kit-color-gray-500-a50);
  --lavka-ui-kit-color-surface-fog: var(--lavka-ui-kit-color-absolute-black-a70);
  --lavka-ui-kit-color-surface-always-black: var(--lavka-ui-kit-color-absolute-black);
  --lavka-ui-kit-color-control-main: var(--lavka-ui-kit-color-yellow-normal);
  --lavka-ui-kit-color-control-minor: var(--lavka-ui-kit-color-gray-500-a50);
  --lavka-ui-kit-color-control-link: var(--lavka-ui-kit-color-blue-light);
  --lavka-ui-kit-color-control-error: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-control-error-minor: var(--lavka-ui-kit-color-red-normal-a30);
  --lavka-ui-kit-color-control-focus-stroke: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-control-main-hovered: var(--lavka-ui-kit-color-yellow-deep);
  --lavka-ui-kit-color-control-main-pressed: var(--lavka-ui-kit-color-yellow-dark);
  --lavka-ui-kit-color-control-minor-hovered: var(--lavka-ui-kit-color-gray-450-a50);
  --lavka-ui-kit-color-control-minor-pressed: var(--lavka-ui-kit-color-gray-400-a40);
  --lavka-ui-kit-color-control-link-hovered: var(--lavka-ui-kit-color-blue-normal);
  --lavka-ui-kit-color-control-link-pressed: var(--lavka-ui-kit-color-blue-normal);
  --lavka-ui-kit-color-control-error-hovered: var(--lavka-ui-kit-color-red-deep);
  --lavka-ui-kit-color-control-error-pressed: var(--lavka-ui-kit-color-red-dark);
  --lavka-ui-kit-color-control-error-minor-hovered: var(--lavka-ui-kit-color-red-normal-a25);
  --lavka-ui-kit-color-control-error-minor-pressed: var(--lavka-ui-kit-color-red-normal-a20);
  --lavka-ui-kit-color-text-main: var(--lavka-ui-kit-color-gray-150);
  --lavka-ui-kit-color-text-minor: var(--lavka-ui-kit-color-gray-150-a50);
  --lavka-ui-kit-color-text-always-black: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-text-minor-always-black: var(--lavka-ui-kit-color-gray-600-a50);
  --lavka-ui-kit-color-text-always-white: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-text-minor-always-white: var(--lavka-ui-kit-color-absolute-white-a50);
  --lavka-ui-kit-color-text-error: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-text-minor-error: var(--lavka-ui-kit-color-red-normal-a50);
  --lavka-ui-kit-color-status-waiting-main: var(--lavka-ui-kit-color-orange-light);
  --lavka-ui-kit-color-status-planned-main: var(--lavka-ui-kit-color-purple-light);
  --lavka-ui-kit-color-status-in-progress-main: var(--lavka-ui-kit-color-blue-light);
  --lavka-ui-kit-color-status-success-main: var(--lavka-ui-kit-color-green-light);
  --lavka-ui-kit-color-status-custom-main: var(--lavka-ui-kit-color-gray-300);
  --lavka-ui-kit-color-status-error-main: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-status-waiting-minor: var(--lavka-ui-kit-color-orange-normal-a20);
  --lavka-ui-kit-color-status-planned-minor: var(--lavka-ui-kit-color-purple-normal-a20);
  --lavka-ui-kit-color-status-in-progress-minor: var(--lavka-ui-kit-color-blue-normal-a20);
  --lavka-ui-kit-color-status-success-minor: var(--lavka-ui-kit-color-green-dark-a25);
  --lavka-ui-kit-color-status-custom-minor: var(--lavka-ui-kit-color-gray-500-a50);
  --lavka-ui-kit-color-status-error-minor: var(--lavka-ui-kit-color-red-normal-a20);
  --lavka-ui-kit-color-bg: var(--lavka-ui-kit-color-gray-650);
  --lavka-ui-kit-color-bg-minor: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-bg-floating: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-bg-invert: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-control: var(--lavka-ui-kit-color-yellow-normal);
  --lavka-ui-kit-color-control-hovered: #f3e417;
  --lavka-ui-kit-color-control-pressed: #e8da17;
  --lavka-ui-kit-color-control-danger: var(--lavka-ui-kit-color-error);
  --lavka-ui-kit-color-control-danger-hovered: var(--lavka-ui-kit-color-error-hovered);
  --lavka-ui-kit-color-control-danger-pressed: var(--lavka-ui-kit-color-error-pressed);
  --lavka-ui-kit-color-control-danger-text: var(--lavka-ui-kit-color-text-on-error);
  --lavka-ui-kit-color-control-danger-light: var(--lavka-ui-kit-color-error-minor);
  --lavka-ui-kit-color-control-danger-light-hovered: var(--lavka-ui-kit-color-error-minor-hovered);
  --lavka-ui-kit-color-control-danger-light-pressed: var(--lavka-ui-kit-color-error-minor-pressed);
  --lavka-ui-kit-color-control-danger-light-text: var(--lavka-ui-kit-color-status-error-text);
  --lavka-ui-kit-color-text: var(--lavka-ui-kit-color-gray-150);
  --lavka-ui-kit-color-text-on-error: var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-text-on-control: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-status-waiting-text: var(--lavka-ui-kit-color-orange-light);
  --lavka-ui-kit-color-status-planned-text: var(--lavka-ui-kit-color-purple-light);
  --lavka-ui-kit-color-status-in-progress-text: var(--lavka-ui-kit-color-blue-light);
  --lavka-ui-kit-color-status-success-text: var(--lavka-ui-kit-color-green-light);
  --lavka-ui-kit-color-status-custom-text: var(--lavka-ui-kit-color-gray-300);
  --lavka-ui-kit-color-status-error-text: var(--lavka-ui-kit-color-red-normal);
  --lavka-ui-kit-color-status-waiting-bg: rgb(255 166 13 / 20%);
  --lavka-ui-kit-color-status-planned-bg: rgb(132 74 247 / 20%);
  --lavka-ui-kit-color-status-in-progress-bg: rgb(38 92 255 / 20%);
  --lavka-ui-kit-color-status-success-bg: rgb(0 140 49 / 25%);
  --lavka-ui-kit-color-status-custom-bg: var(--lavka-ui-kit-color-gray-550);
  --lavka-ui-kit-color-status-error-bg: rgb(255 61 43 / 20%);
  --lavka-ui-kit-color-link: var(--lavka-ui-kit-color-blue-light);
  --lavka-ui-kit-color-link-hovered: var(
      --lavka-ui-kit-color-blue-normal
  );
  --lavka-ui-kit-color-link-pressed: var(--lavka-ui-kit-color-blue-deep);
  --lavka-ui-kit-color-line: var(--lavka-ui-kit-color-gray-500);
  --lavka-ui-kit-color-card-divider: var(--lavka-ui-kit-color-gray-550);
  --lavka-ui-kit-color-card-stroke: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-ever-back: var(
      --lavka-ui-kit-color-absolute-black
  );
  --lavka-ui-kit-box-shadow-top-day-elevation-2: 0 -4px 24px 0 rgb(0 0 0 / 40%);
  --lavka-ui-kit-box-shadow-top-day-elevation-3: 0 -4px 32px 0 rgb(0 0 0 / 50%);
  --lavka-ui-kit-box-shadow-bottom-day-elevation-1: 0 2px 6px 0 rgb(0 0 0 / 30%);
  --lavka-ui-kit-box-shadow-bottom-day-elevation-2: 0 4px 24px 0 rgb(0 0 0 / 40%);
  --lavka-ui-kit-box-shadow-bottom-day-elevation-3: 0 4px 32px 0 rgb(0 0 0 / 50%);
  --lavka-ui-kit-box-shadow-control-focus: 0 0 0 2px var(--lavka-ui-kit-color-gray-650), 0 0 0 4px var(--lavka-ui-kit-color-absolute-white);
  --lavka-ui-kit-color-text-invert: var(--lavka-ui-kit-color-gray-600);
  --lavka-ui-kit-color-error: var(--lavka-ui-kit-color-red-deep);
  --lavka-ui-kit-color-error-minor: rgb(255 61 43 / 30%);
  --lavka-ui-kit-color-error-hovered: var(--lavka-ui-kit-color-red-dark);
  --lavka-ui-kit-color-error-pressed: #cc0a04;
  --lavka-ui-kit-color-error-minor-hovered: rgb(255 61 43 / 25%);
  --lavka-ui-kit-color-error-minor-pressed: rgb(255 61 43 / 20%);
}

html,
body {
    height: 100%;
}

body {
    font-family: 'YS Text', 'Helvetica Neue', Arial, sans-serif;

    color: var(--lavka-ui-kit-color-text);
    background-color: var(--lavka-ui-kit-color-bg);
}

/* stylelint-disable-next-line selector-max-id */

#root {
    flex: 1 1;
    flex-direction: column;

    height: 100%;
}

.lavka-ui-kit-backdrop {
    z-index: var(--lavka-ui-kit-z-index-modal);
}

.lavka-ui-kit-header-corner {
    pointer-events: none;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-error-page {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-block-start: 200px;
}

@media (max-width: 1133px) {
  .lavka-ui-kit-error-page {
    margin-block-start: 120px;
  }
}

.lavka-ui-kit-error-page__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  inline-size: 100%;
  max-inline-size: 340px;
}

.lavka-ui-kit-error-page__imageContainer {
  position: relative;
  display: inline-flex;
  block-size: 225px;
  inline-size: 229px;
}

.lavka-ui-kit-error-page__tape {
  position: absolute;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  inset-block-start: 0;
  inset-inline-end: 0;
}

.lavka-ui-kit-error-page__bulletShape {
  position: absolute;
  fill: var(--lavka-ui-kit-color-yellow-normal);
  inset-block-end: 0;
  inset-inline-start: 0;
}

.lavka-ui-kit-error-page__errorCode {
  font-family: var(--lavka-ui-kit-typography-font-family-service-title);
  font-size: var(--lavka-ui-kit-typography-font-size-service-title);
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-service-title);
  line-height: var(--lavka-ui-kit-typography-line-height-service-title);
  position: absolute;
  font-size: 37px;
  inset-block-end: 46px;
  inset-inline-start: 72px;
  line-height: 1;
}

.lavka-ui-kit-error-page__title, .lavka-ui-kit-error-page__subtitle, .lavka-ui-kit-error-page__actions, .lavka-ui-kit-error-page__additionals {
  font-family: inherit;
  text-align: center;
}

.lavka-ui-kit-error-page__title {
  font-size: var(--lavka-ui-kit-typography-font-size-title4);
  font-weight: 500;
  line-height: var(--lavka-ui-kit-typography-line-height-title4-tight);
  color: var(--lavka-ui-kit-color-text-main);
  margin-block-start: var(--lavka-ui-kit-gap-240);
}

.lavka-ui-kit-error-page__subtitle {
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
  color: var(--lavka-ui-kit-color-text-minor);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-normal);
  margin-block-start: var(--lavka-ui-kit-gap-80);
}

.lavka-ui-kit-error-page__actions {
  inline-size: 100%;
  margin-block-start: var(--lavka-ui-kit-gap-160);
}

.lavka-ui-kit-error-page__additionals {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  color: var(--lavka-ui-kit-color-text-minor);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-normal);
  margin-block-start: var(--lavka-ui-kit-gap-240);
}

.lavka-ui-kit-error-page__additionalsName {
  position: relative;
  color: var(--lavka-ui-kit-color-gray-250);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-normal);
}

.lavka-ui-kit-error-page__additionalsName::after {
  position: relative;
  content: ":";
}

.lavka-ui-kit-error-page__additionalsItem {
  display: flex;
  align-items: center;
  column-gap: 4px;
}

.lavka-ui-kit-error-page__copyToClipboard {
  cursor: pointer;
  margin-inline-start: 4px;
}

.lavka-ui-kit-error-page__copyToClipboardIcon {
  fill: var(--lavka-ui-kit-color-text-minor);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-notification {
  box-sizing: border-box;
  border: 1px solid var(--lavka-ui-kit-color-surface-card-stroke);
  background: var(--lavka-ui-kit-color-surface-bg);
  border-radius: var(--lavka-ui-kit-border-radius-m);
  box-shadow: var(--lavka-ui-kit-box-shadow-bottom-day-elevation-2);
  inline-size: 100%;
  padding-block: var(--lavka-ui-kit-gap-120);
  padding-inline-end: var(--lavka-ui-kit-gap-120);
  padding-inline-start: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-notification__info {
  position: relative;
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  inline-size: 100%;
}

.lavka-ui-kit-notification__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  block-size: var(--lavka-ui-kit-gap-320);
  border-radius: 100%;
  color: var(--lavka-ui-kit-color-text-always-white);
  inline-size: var(--lavka-ui-kit-gap-320);
}

.lavka-ui-kit-notification__lead-inner {
  display: flex;
  overflow: hidden;
  flex: 1 1;
  flex-direction: column;
  justify-content: center;
  padding-inline: 0;
  padding-inline-start: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-notification__lead-inner_with-close-icon {
  padding-inline-end: 20px;
}

.lavka-ui-kit-notification__buttons {
  display: flex;
  justify-content: space-between;
  gap: var(--lavka-ui-kit-gap-80);
  padding-block-start: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-notification__button {
  flex: 1 1;
}

.lavka-ui-kit-notification__close {
  position: relative;
  color: var(--lavka-ui-kit-color-text-minor);
  cursor: pointer;
  inset-block-start: -6px;
  inset-inline-end: -6px;
  transition: opacity var(--lavka-ui-kit-transition-duration-default) ease-in;
}

.lavka-ui-kit-notification__close_hidden {
  opacity: 0;
  transition: opacity var(--lavka-ui-kit-transition-duration-default) ease-out;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-typography {
  padding: 0;
  margin: 0;
}

.lavka-ui-kit-typography:empty {
  display: none;
}

.lavka-ui-kit-typography_clamp {
  /* stylelint-disable*/
  display: -webkit-box;
  /* stylelint-enable */
  overflow: hidden;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  word-break: break-word;
}

.lavka-ui-kit-typography_uppercase {
  text-transform: uppercase;
}

.lavka-ui-kit-typography_line-through {
  text-decoration: line-through;
}

.lavka-ui-kit-typography_ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lavka-ui-kit-typography_width_20 {
  inline-size: 20%;
}

.lavka-ui-kit-typography_width_40 {
  inline-size: 40%;
}

.lavka-ui-kit-typography_width_60 {
  inline-size: 60%;
}

.lavka-ui-kit-typography_width_80 {
  inline-size: 80%;
}

.lavka-ui-kit-typography_width_100 {
  inline-size: 100%;
}

.lavka-ui-kit-typography_weight_light {
  font-weight: 100;
}

.lavka-ui-kit-typography_weight_regular {
  font-weight: normal;
}

.lavka-ui-kit-typography_weight_medium {
  font-weight: 500;
}

.lavka-ui-kit-typography_weight_bold {
  font-weight: bold;
}

.lavka-ui-kit-typography_weight_black {
  font-weight: 800;
}

.lavka-ui-kit-typography_variant_header {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-header);
}

.lavka-ui-kit-typography_variant_title1 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-title1);
}

.lavka-ui-kit-typography_variant_title2 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-title2);
}

.lavka-ui-kit-typography_variant_title3 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-title3);
}

.lavka-ui-kit-typography_variant_title4 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-title4);
}

.lavka-ui-kit-typography_variant_body1 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-body1);
}

.lavka-ui-kit-typography_variant_body2 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
}

.lavka-ui-kit-typography_variant_caption1 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
}

.lavka-ui-kit-typography_variant_caption2 {
  font-family: var(--lavka-ui-kit-typography-font-family);
  font-size: var(--lavka-ui-kit-typography-font-size-caption2);
}

.lavka-ui-kit-typography_variant-weight_header-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-header-light);
}

.lavka-ui-kit-typography_variant-weight_header-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-header-regular);
}

.lavka-ui-kit-typography_variant-weight_header-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-header-medium);
}

.lavka-ui-kit-typography_variant-weight_header-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-header-bold);
}

.lavka-ui-kit-typography_variant-weight_header-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-header-black);
}

.lavka-ui-kit-typography_variant-weight_title1-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title1-light);
}

.lavka-ui-kit-typography_variant-weight_title1-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title1-regular);
}

.lavka-ui-kit-typography_variant-weight_title1-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title1-medium);
}

.lavka-ui-kit-typography_variant-weight_title1-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title1-bold);
}

.lavka-ui-kit-typography_variant-weight_title1-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title1-black);
}

.lavka-ui-kit-typography_variant-weight_title2-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title2-light);
}

.lavka-ui-kit-typography_variant-weight_title2-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title2-regular);
}

.lavka-ui-kit-typography_variant-weight_title2-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title2-medium);
}

.lavka-ui-kit-typography_variant-weight_title2-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title2-bold);
}

.lavka-ui-kit-typography_variant-weight_title2-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title2-black);
}

.lavka-ui-kit-typography_variant-weight_title3-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title3-light);
}

.lavka-ui-kit-typography_variant-weight_title3-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title3-regular);
}

.lavka-ui-kit-typography_variant-weight_title3-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title3-medium);
}

.lavka-ui-kit-typography_variant-weight_title3-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title3-bold);
}

.lavka-ui-kit-typography_variant-weight_title3-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title3-black);
}

.lavka-ui-kit-typography_variant-weight_title4-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title4-light);
}

.lavka-ui-kit-typography_variant-weight_title4-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title4-regular);
}

.lavka-ui-kit-typography_variant-weight_title4-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title4-medium);
}

.lavka-ui-kit-typography_variant-weight_title4-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title4-bold);
}

.lavka-ui-kit-typography_variant-weight_title4-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-title4-black);
}

.lavka-ui-kit-typography_variant-weight_body1-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body1-light);
}

.lavka-ui-kit-typography_variant-weight_body1-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body1-regular);
}

.lavka-ui-kit-typography_variant-weight_body1-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body1-medium);
}

.lavka-ui-kit-typography_variant-weight_body1-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body1-bold);
}

.lavka-ui-kit-typography_variant-weight_body1-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body1-black);
}

.lavka-ui-kit-typography_variant-weight_body2-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body2-light);
}

.lavka-ui-kit-typography_variant-weight_body2-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body2-regular);
}

.lavka-ui-kit-typography_variant-weight_body2-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body2-medium);
}

.lavka-ui-kit-typography_variant-weight_body2-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body2-bold);
}

.lavka-ui-kit-typography_variant-weight_body2-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-body2-black);
}

.lavka-ui-kit-typography_variant-weight_caption1-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption1-light);
}

.lavka-ui-kit-typography_variant-weight_caption1-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption1-regular);
}

.lavka-ui-kit-typography_variant-weight_caption1-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption1-medium);
}

.lavka-ui-kit-typography_variant-weight_caption1-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption1-bold);
}

.lavka-ui-kit-typography_variant-weight_caption1-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption1-black);
}

.lavka-ui-kit-typography_variant-weight_caption2-light {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption2-light);
}

.lavka-ui-kit-typography_variant-weight_caption2-regular {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption2-regular);
}

.lavka-ui-kit-typography_variant-weight_caption2-medium {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption2-medium);
}

.lavka-ui-kit-typography_variant-weight_caption2-bold {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption2-bold);
}

.lavka-ui-kit-typography_variant-weight_caption2-black {
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-caption2-black);
}

.lavka-ui-kit-typography_leading_header-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-header-normal);
}

.lavka-ui-kit-typography_leading_header-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-header-tight);
}

.lavka-ui-kit-typography_leading_header-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-header-loose);
}

.lavka-ui-kit-typography_leading_title1-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-title1-normal);
}

.lavka-ui-kit-typography_leading_title1-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-title1-tight);
}

.lavka-ui-kit-typography_leading_title1-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-title1-loose);
}

.lavka-ui-kit-typography_leading_title2-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-title2-normal);
}

.lavka-ui-kit-typography_leading_title2-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-title2-tight);
}

.lavka-ui-kit-typography_leading_title2-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-title2-loose);
}

.lavka-ui-kit-typography_leading_title3-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-title3-normal);
}

.lavka-ui-kit-typography_leading_title3-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-title3-tight);
}

.lavka-ui-kit-typography_leading_title3-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-title3-loose);
}

.lavka-ui-kit-typography_leading_title4-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-title4-normal);
}

.lavka-ui-kit-typography_leading_title4-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-title4-tight);
}

.lavka-ui-kit-typography_leading_title4-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-title4-loose);
}

.lavka-ui-kit-typography_leading_body1-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-body1-normal);
}

.lavka-ui-kit-typography_leading_body1-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-body1-tight);
}

.lavka-ui-kit-typography_leading_body1-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-body1-loose);
}

.lavka-ui-kit-typography_leading_body2-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-body2-normal);
}

.lavka-ui-kit-typography_leading_body2-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-typography_leading_body2-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-body2-loose);
}

.lavka-ui-kit-typography_leading_caption1-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-normal);
}

.lavka-ui-kit-typography_leading_caption1-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
}

.lavka-ui-kit-typography_leading_caption1-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-loose);
}

.lavka-ui-kit-typography_leading_caption2-normal {
  line-height: var(--lavka-ui-kit-typography-line-height-caption2-normal);
}

.lavka-ui-kit-typography_leading_caption2-tight {
  line-height: var(--lavka-ui-kit-typography-line-height-caption2-tight);
}

.lavka-ui-kit-typography_leading_caption2-loose {
  line-height: var(--lavka-ui-kit-typography-line-height-caption2-loose);
}

.lavka-ui-kit-typography_align_left {
  text-align: start;
}

.lavka-ui-kit-typography_align_center {
  text-align: center;
}

.lavka-ui-kit-typography_align_right {
  text-align: end;
}

.lavka-ui-kit-typography_loading {
  animation: loading 1s linear infinite;
  background-attachment: fixed;
  background-clip: text;
  background-image: linear-gradient(90deg, var(--lavka-ui-kit-color-text-always-black), rgba(var(--lavka-ui-kit-color-text-main)/20%), var(--lavka-ui-kit-color-text-always-black));
  background-size: 200% auto;
  color: transparent;
  transition: color var(--lavka-ui-kit-transition-duration-faster) ease-in-out;
  /* stylelint-disable*/
  -webkit-background-clip: text;
  /* stylelint-enable */
}

@keyframes loading {
  from {
    background-position: 50% center;
  }
  to {
    background-position: -150% center;
  }
}

.lavka-ui-kit-typography_subtitle {
  color: var(--lavka-ui-kit-color-text-minor);
  margin-block-start: var(--lavka-ui-kit-gap-10);
}

.lavka-ui-kit-typography_color_default {
  color: inherit;
}

.lavka-ui-kit-typography_skeleton {
  animation: shine 2s infinite;
  background-attachment: fixed;
  background-color: var(--lavka-ui-kit-color-surface-bg-minor);
  background-image: linear-gradient(90deg, var(--lavka-ui-kit-color-status-custom-minor) 33%, var(--lavka-ui-kit-color-surface-bg) 50%, var(--lavka-ui-kit-color-status-custom-minor) 66%);
  background-size: 300% 100%;
  border-radius: var(--lavka-ui-kit-gap-80);
  min-block-size: 1em;
}

@keyframes shine {
  0% {
    background-position: right;
  }
  100% {
    background-position: left;
  }
}

.lavka-ui-kit-typography_skeleton:empty {
  display: block;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-button {
  --lavka-ui-kit-button-view-default-background-color: var(--lavka-ui-kit-color-control-minor);
  --lavka-ui-kit-button-view-default-background-color-hover: var(--lavka-ui-kit-color-control-minor-hovered);
  --lavka-ui-kit-button-view-default-background-color-active: var(--lavka-ui-kit-color-control-minor-pressed);
  --lavka-ui-kit-button-view-default-background-color-disabled: var(--lavka-ui-kit-color-control-minor);
  --lavka-ui-kit-button-view-action-background-color: var(--lavka-ui-kit-color-control-main);
  --lavka-ui-kit-button-view-action-background-color-hover: var(--lavka-ui-kit-color-control-main-hovered);
  --lavka-ui-kit-button-view-action-background-color-active: var(--lavka-ui-kit-color-control-main-pressed);
  --lavka-ui-kit-button-view-action-background-color-disabled: var(--lavka-ui-kit-color-control-main);
  --lavka-ui-kit-button-view-ghost-background-color: transparent;
  --lavka-ui-kit-button-view-ghost-background-color-hover: var(--lavka-ui-kit-color-control-minor-hovered);
  --lavka-ui-kit-button-view-ghost-background-color-active: var(--lavka-ui-kit-color-control-minor-pressed);
  --lavka-ui-kit-button-view-ghost-background-color-disabled: transparent;
  --lavka-ui-kit-button-view-dashed-background-color: transparent;
  --lavka-ui-kit-button-view-dashed-background-color-hover: var(--lavka-ui-kit-color-control-minor-hovered);
  --lavka-ui-kit-button-view-dashed-background-color-active: var(--lavka-ui-kit-color-control-minor-pressed);
  --lavka-ui-kit-button-view-dashed-background-color-disabled: var(--lavka-ui-kit-color-control-minor);
  --lavka-ui-kit-button-view-danger-action-background-color: var(--lavka-ui-kit-color-control-error);
  --lavka-ui-kit-button-view-danger-action-background-color-hover: var(--lavka-ui-kit-color-control-error-hovered);
  --lavka-ui-kit-button-view-danger-action-background-color-active: var(--lavka-ui-kit-color-control-error-pressed);
  --lavka-ui-kit-button-view-danger-action-background-color-disabled: var(--lavka-ui-kit-color-control-error);
  --lavka-ui-kit-button-view-danger-default-background-color: var(--lavka-ui-kit-color-control-error-minor);
  --lavka-ui-kit-button-view-danger-default-background-color-hover: var(
      --lavka-ui-kit-color-control-error-minor-hovered
  );
  --lavka-ui-kit-button-view-danger-default-background-color-active: var(
      --lavka-ui-kit-color-control-error-minor-pressed
  );
  --lavka-ui-kit-button-view-danger-default-background-color-disabled: var(--lavka-ui-kit-color-control-error-minor);
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: color, background-color, border-color;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  position: relative;
  display: inline-flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
  gap: var(--lavka-ui-kit-button-icon-gap);
}

.lavka-ui-kit-button:focus-visible {
  box-shadow: var(--lavka-ui-kit-box-shadow-control-focus);
  outline: none;
}

.lavka-ui-kit-button:disabled {
  box-shadow: none;
  cursor: default;
  opacity: 0.5;
}

.lavka-ui-kit-button_fullWidth {
  inline-size: 100%;
}

.lavka-ui-kit-button_view_default {
  background-color: var(--lavka-ui-kit-button-view-default-background-color);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_default:hover {
  background-color: var(--lavka-ui-kit-button-view-default-background-color-hover);
}

.lavka-ui-kit-button_view_default:active {
  background-color: var(--lavka-ui-kit-button-view-default-background-color-active);
}

.lavka-ui-kit-button_view_default:disabled {
  background-color: var(--lavka-ui-kit-button-view-default-background-color-disabled);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_action {
  background-color: var(--lavka-ui-kit-button-view-action-background-color);
  color: var(--lavka-ui-kit-color-text-always-black);
}

.lavka-ui-kit-button_view_action:hover {
  background-color: var(--lavka-ui-kit-button-view-action-background-color-hover);
}

.lavka-ui-kit-button_view_action:active {
  background-color: var(--lavka-ui-kit-button-view-action-background-color-active);
}

.lavka-ui-kit-button_view_action:disabled {
  background-color: var(--lavka-ui-kit-button-view-action-background-color-disabled);
  color: var(--lavka-ui-kit-color-text-always-black);
}

.lavka-ui-kit-button_view_ghost {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_ghost:hover {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color-hover);
}

.lavka-ui-kit-button_view_ghost:active {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color-active);
}

.lavka-ui-kit-button_view_ghost:disabled {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color-disabled);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_dashed {
  border-style: dashed;
  border-color: var(--lavka-ui-kit-color-surface-line);
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_dashed:hover {
  border-color: var(--lavka-ui-kit-color-control-minor-pressed);
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color-hover);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_dashed:active {
  border-color: var(--lavka-ui-kit-color-text-minor);
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color-active);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-button_view_dashed:disabled {
  border-color: var(--lavka-ui-kit-color-surface-line);
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color-disabled);
  color: var(--lavka-ui-kit-color-text-minor);
  opacity: 1;
}

.lavka-ui-kit-button_view_danger-action {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color);
  color: var(--lavka-ui-kit-color-text-always-white);
}

.lavka-ui-kit-button_view_danger-action:hover {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color-hover);
}

.lavka-ui-kit-button_view_danger-action:active {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color-active);
}

.lavka-ui-kit-button_view_danger-action:disabled {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color-disabled);
}

.lavka-ui-kit-button_view_danger-default {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color);
  color: var(--lavka-ui-kit-color-text-error);
}

.lavka-ui-kit-button_view_danger-default:hover {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color-hover);
}

.lavka-ui-kit-button_view_danger-default:active {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color-active);
}

.lavka-ui-kit-button_view_danger-default:disabled {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color-disabled);
}

.lavka-ui-kit-button_size_m {
  --lavka-ui-kit-button-icon-gap: var(--lavka-ui-kit-gap-240);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
  border-radius: var(--lavka-ui-kit-border-radius-m);
  padding-block: calc(var(--lavka-ui-kit-control-vertical-total-gap-m) - 1px);
  padding-inline: calc(var(--lavka-ui-kit-gap-240) - 1px);
}

.lavka-ui-kit-button_size_s {
  --lavka-ui-kit-button-icon-gap: var(--lavka-ui-kit-control-horizontal-total-gap-s);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
  border-radius: var(--lavka-ui-kit-border-radius-s);
  padding-block: calc(var(--lavka-ui-kit-control-vertical-total-gap-s) - 1px);
  padding-inline: calc(var(--lavka-ui-kit-control-horizontal-total-gap-s) - 1px);
}

.lavka-ui-kit-button_size_xs {
  --lavka-ui-kit-button-icon-gap: var(--lavka-ui-kit-control-horizontal-total-gap-xs);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  border-radius: var(--lavka-ui-kit-border-radius-xs);
  padding-block: calc(var(--lavka-ui-kit-control-vertical-total-gap-xs) - 1px);
  padding-inline: calc(var(--lavka-ui-kit-control-horizontal-total-gap-xs) - 1px);
}

.lavka-ui-kit-button_size_xxs {
  --lavka-ui-kit-button-icon-gap: var(--lavka-ui-kit-gap-80);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  border-radius: var(--lavka-ui-kit-border-radius-xxs);
  padding-block: calc(var(--lavka-ui-kit-gap-50) - 1px);
  padding-inline: calc(var(--lavka-ui-kit-gap-80) - 1px);
}

.lavka-ui-kit-button__icon {
  display: flex;
  align-items: center;
}

.lavka-ui-kit-button_loading .lavka-ui-kit-button__icon, .lavka-ui-kit-button_loading .lavka-ui-kit-button__text {
  opacity: 0;
}

.lavka-ui-kit-button__spin-wrap {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: color, background-color, border-color;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  inset: 0;
}

.lavka-ui-kit-button__spin-wrap_view_default {
  background-color: var(--lavka-ui-kit-button-view-default-background-color);
}

.lavka-ui-kit-button__spin-wrap_view_action {
  background-color: var(--lavka-ui-kit-button-view-action-background-color);
}

.lavka-ui-kit-button__spin-wrap_view_ghost {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color);
}

.lavka-ui-kit-button__spin-wrap_view_dashed {
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color);
}

.lavka-ui-kit-button__spin-wrap_view_danger-action {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color);
}

.lavka-ui-kit-button__spin-wrap_view_danger-default {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color);
}

.lavka-ui-kit-button:hover .lavka-ui-kit-button__spin-wrap_view_default {
  background-color: var(--lavka-ui-kit-button-view-default-background-color-hover);
}

.lavka-ui-kit-button:hover .lavka-ui-kit-button__spin-wrap_view_action {
  background-color: var(--lavka-ui-kit-button-view-action-background-color-hover);
}

.lavka-ui-kit-button:hover .lavka-ui-kit-button__spin-wrap_view_ghost {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color-hover);
}

.lavka-ui-kit-button:hover .lavka-ui-kit-button__spin-wrap_view_dashed {
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color-hover);
}

.lavka-ui-kit-button:hover .lavka-ui-kit-button__spin-wrap_view_danger-action {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color-hover);
}

.lavka-ui-kit-button:hover .lavka-ui-kit-button__spin-wrap_view_danger-default {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color-hover);
}

.lavka-ui-kit-button:active .lavka-ui-kit-button__spin-wrap_view_default {
  background-color: var(--lavka-ui-kit-button-view-default-background-color-active);
}

.lavka-ui-kit-button:active .lavka-ui-kit-button__spin-wrap_view_action {
  background-color: var(--lavka-ui-kit-button-view-action-background-color-active);
}

.lavka-ui-kit-button:active .lavka-ui-kit-button__spin-wrap_view_ghost {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color-active);
}

.lavka-ui-kit-button:active .lavka-ui-kit-button__spin-wrap_view_dashed {
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color-active);
}

.lavka-ui-kit-button:active .lavka-ui-kit-button__spin-wrap_view_danger-action {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color-active);
}

.lavka-ui-kit-button:active .lavka-ui-kit-button__spin-wrap_view_danger-default {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color-active);
}

.lavka-ui-kit-button:disabled .lavka-ui-kit-button__spin-wrap_view_default {
  background-color: var(--lavka-ui-kit-button-view-default-background-color-disabled);
}

.lavka-ui-kit-button:disabled .lavka-ui-kit-button__spin-wrap_view_action {
  background-color: var(--lavka-ui-kit-button-view-action-background-color-disabled);
}

.lavka-ui-kit-button:disabled .lavka-ui-kit-button__spin-wrap_view_ghost {
  background-color: var(--lavka-ui-kit-button-view-ghost-background-color-disabled);
}

.lavka-ui-kit-button:disabled .lavka-ui-kit-button__spin-wrap_view_dashed {
  background-color: var(--lavka-ui-kit-button-view-dashed-background-color-disabled);
}

.lavka-ui-kit-button:disabled .lavka-ui-kit-button__spin-wrap_view_danger-action {
  background-color: var(--lavka-ui-kit-button-view-danger-action-background-color-disabled);
}

.lavka-ui-kit-button:disabled .lavka-ui-kit-button__spin-wrap_view_danger-default {
  background-color: var(--lavka-ui-kit-button-view-danger-default-background-color-disabled);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-spin {
  display: inline-flex;
  animation: 1.8s infinite spin-turning cubic-bezier(0.25, 0, 0.75, 1);
  inline-size: fit-content;
}

@keyframes spin-turning {
  0% {
    transform: rotateZ(0);
  }
  100% {
    transform: rotateZ(540deg);
  }
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.HeaderWarning_header-warning__q6hjJ {
    padding:
        var(--lavka-ui-kit-gap-120) var(--lavka-ui-kit-gap-100) var(--lavka-ui-kit-gap-120) var(--lavka-ui-kit-gap-155);

    border: 1px solid var(--lavka-ui-kit-color-line);
    border-radius: var(--lavka-ui-kit-border-xxxs);
    background-color: var(--lavka-ui-kit-color-status-error-bg);
    box-shadow: 0 2px 4px rgba(89, 89, 89, 0.04), 0 2px 16px rgba(89, 89, 89, 0.08);
}

.HeaderWarning_header-warning__container__2dVtB {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

.HeaderWarning_header-warning__container__2dVtB a {
            color: var(--lavka-ui-kit-color-link);
        }

.HeaderWarning_header-warning__container__2dVtB button {
            border-radius: var(--lavka-ui-kit-border-xxxs);
            background-color: var(--lavka-ui-kit-color-status-error-bg);
        }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.BaseLayout_base-layout__lTS5s {
    display: flex;

    height: 100%;
}

.BaseLayout_base-layout__section__pfsVr {
        display: flex;
        flex: 1 1;
        flex-direction: column;

        width: 0;
    }

.BaseLayout_base-layout__content__u2vct {
        position: relative;

        flex: 1 1;
        flex-basis: 0;

        min-height: 0;
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.CopyButton_copy-button__button__AK2O6 {
        width: 100%;
    }

.CopyButton_copy-button__button-view__BhyvK {
        display: flex;
        align-items: center;
        gap: var(--lavka-ui-kit-gap-60);

        font-size: 14px;
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.LanguageSelect_language-select__Y-2-F {
    margin: var(--lavka-ui-kit-gap-80) var(--lavka-ui-kit-gap-100);
    margin-right: var(--lavka-ui-kit-gap-40);
}

.LanguageSelect_language-select_reset-margin__IYaoj {
        margin: 0;
    }

.LanguageSelect_language-select__lang__72Kfk {
        display: flex;
        align-items: center;

        white-space: nowrap;
    }

.LanguageSelect_language-select__flag__ETeGo {
        position: relative;

        display: inline-block;

        width: 24px;
    }

.LanguageSelect_language-select__flag-icon__aNrp\+ {
        position: absolute;
        top: 50%;
        left: 50%;

        transform: translate(-50%, -50%);
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-select {
  position: relative;
  display: inline-block;
  inline-size: 100%;
}

.lavka-ui-kit-select_size_m {
  --lavka-ui-kit-select-vertical-gap: var(--lavka-ui-kit-gap-155);
  --lavka-ui-kit-select-horizontal-gap: var(--lavka-ui-kit-gap-160);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-select_size_s {
  --lavka-ui-kit-select-vertical-gap: var(--lavka-ui-kit-gap-115);
  --lavka-ui-kit-select-horizontal-gap: var(--lavka-ui-kit-gap-160);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-select_size_xs {
  --lavka-ui-kit-select-vertical-gap: var(--lavka-ui-kit-gap-90);
  --lavka-ui-kit-select-horizontal-gap: var(--lavka-ui-kit-gap-120);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
}

.lavka-ui-kit-select__placeholder {
  position: absolute;
  display: block;
  overflow: hidden;
  font-size: inherit;
  font-weight: normal;
  inset-block: 0.5px 0;
  inset-inline: 0;
  line-height: inherit;
  padding-block: var(--lavka-ui-kit-select-vertical-gap);
  padding-inline: var(--lavka-ui-kit-select-horizontal-gap);
  padding-inline-end: var(--lavka-ui-kit-gap-480);
  pointer-events: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
}

.lavka-ui-kit-select__placeholder_transparent {
  color: var(--lavka-ui-kit-color-text-minor);
}

.lavka-ui-kit-select__placeholder:not(.lavka-ui-kit-select__placeholder_transparent) {
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-select__placeholder_hidden {
  opacity: 0;
}

.lavka-ui-kit-select__input {
  min-inline-size: var(--lavka-ui-kit-gap-320);
}

.lavka-ui-kit-select__icon-menu {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: transform;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  display: flex;
  color: var(--lavka-ui-kit-color-text-minor);
  transform: rotate(0);
}

.lavka-ui-kit-select_open .lavka-ui-kit-select__icon-menu {
  transform: rotate(180deg);
}

.lavka-ui-kit-select__icon-clear {
  display: none;
  color: var(--lavka-ui-kit-color-text-minor);
  cursor: pointer;
  transition: color var(--lavka-ui-kit-transition-duration-default) ease-in-out;
}

.lavka-ui-kit-select__icon-clear:hover {
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-select__empty-state-wrapper {
  cursor: auto;
  margin-block-start: var(--lavka-ui-kit-gap-30);
}

.lavka-ui-kit-select__input:hover .lavka-ui-kit-select__icon-clear_hoverToggle {
  display: flex;
}

.lavka-ui-kit-select__input:hover .lavka-ui-kit-select__icon-menu_hoverToggle {
  display: none;
}

.lavka-ui-kit-select_open.lavka-ui-kit-select_invalid .lavka-ui-kit-select__icon-menu {
  color: var(--lavka-ui-kit-color-error);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-menu {
  display: flex;
}

.lavka-ui-kit-menu__popup {
  box-sizing: border-box;
  background-color: var(--lavka-ui-kit-color-surface-floating);
  border-radius: var(--lavka-ui-kit-border-radius-l);
  /**
   * обводка 1px var(--lavka-ui-kit-color-surface-card-stroke) сделана через box-shadow, а не outline,
   * из-за бага в Safari, который пофикшен в 16.4 beta:
   * https://developer.apple.com/documentation/safari-release-notes/safari-16_4-release-notes
   *
   * можно заменить на outline, когда релиз выйдет из беты и пройдёт достаточно времени
   */
  box-shadow: 0 0 0 1px var(--lavka-ui-kit-color-surface-card-stroke), var(--lavka-ui-kit-box-shadow-bottom-day-elevation-2);
  min-inline-size: var(--lavka-ui-kit-gap-320);
}

.lavka-ui-kit-menu__popup::-webkit-scrollbar {
  block-size: 8px;
  inline-size: 8px;
  visibility: hidden;
}

.lavka-ui-kit-menu__popup::-webkit-scrollbar-track {
  background-color: transparent;
  margin-block: 0 0;
  margin-inline: 0 0;
}

.lavka-ui-kit-menu__popup::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 4px;
}

.lavka-ui-kit-menu__popup::-webkit-scrollbar-button {
  display: none;
}

.lavka-ui-kit-menu__popup:hover::-webkit-scrollbar-thumb {
  background-color: var(--lavka-ui-kit-color-surface-line);
}

.lavka-ui-kit-menu__items {
  display: flex;
  flex-flow: column nowrap;
  cursor: pointer;
  inline-size: 100%;
  margin-block: var(--lavka-ui-kit-gap-60);
  margin-inline: var(--lavka-ui-kit-gap-40);
  max-block-size: var(--lavka-ui-kit-gap-2500);
  min-block-size: var(--lavka-ui-kit-gap-240);
  overflow-y: auto;
}

.lavka-ui-kit-menu__items::-webkit-scrollbar {
  block-size: 8px;
  inline-size: 8px;
  visibility: hidden;
}

.lavka-ui-kit-menu__items::-webkit-scrollbar-track {
  background-color: transparent;
  margin-block: 0 0;
  margin-inline: 0 0;
}

.lavka-ui-kit-menu__items::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 4px;
}

.lavka-ui-kit-menu__items::-webkit-scrollbar-button {
  display: none;
}

.lavka-ui-kit-menu__items:hover::-webkit-scrollbar-thumb {
  background-color: var(--lavka-ui-kit-color-surface-line);
}

.lavka-ui-kit-menu__items:last-child {
  margin-block-end: var(--lavka-ui-kit-gap-60);
}

.lavka-ui-kit-menu__items .lavka-ui-kit-menu-item,
.lavka-ui-kit-menu__items .lavka-ui-kit-menu-group__label {
  margin-block: var(--lavka-ui-kit-gap-20);
  margin-block-end: 0;
  margin-inline: var(--lavka-ui-kit-gap-40);
}

.lavka-ui-kit-menu__items .lavka-ui-kit-menu-item:first-child,
.lavka-ui-kit-menu__items .lavka-ui-kit-menu-group__label:first-child {
  margin-block-start: 0;
}

.lavka-ui-kit-menu_noMaxHeight .lavka-ui-kit-menu__items {
  max-block-size: none;
  overflow-y: visible;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-popup {
  --lavka-ui-kit-popup-arrow-size: var(--lavka-ui-kit-gap-80);
  --lavka-ui-kit-popup-arrow-offset: calc(-1 * var(--lavka-ui-kit-popup-arrow-size) / 2);
  --lavka-ui-kit-popup-arrow-border-radius: 0;
  display: none;
}

.lavka-ui-kit-popup_visible {
  z-index: var(--lavka-ui-kit-z-index-modal);
  display: block;
}

.lavka-ui-kit-popup__content {
  position: relative;
  padding: 0;
  animation-duration: var(--lavka-ui-kit-transition-duration-default);
  animation-fill-mode: forwards;
  animation-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  background-color: var(--lavka-ui-kit-color-surface-floating);
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-popup__content_fadeOut {
  animation-name: lavka-ui-kit-fade-out;
}

.lavka-ui-kit-popup__arrow {
  visibility: hidden;
}

.lavka-ui-kit-popup__arrow, .lavka-ui-kit-popup__arrow::before {
  position: absolute;
  background: inherit;
  block-size: var(--lavka-ui-kit-popup-arrow-size);
  inline-size: var(--lavka-ui-kit-popup-arrow-size);
}

.lavka-ui-kit-popup__arrow::before {
  content: "";
  transform: rotate(45deg);
}

.lavka-ui-kit-popup__arrow_visible::before {
  visibility: visible;
}

.lavka-ui-kit-popup[data-popper-placement^=top] > .lavka-ui-kit-popup__content_fadeIn {
  animation-name: lavka-ui-kit-fade-to-top;
}

.lavka-ui-kit-popup[data-popper-placement^=bottom] > .lavka-ui-kit-popup__content_fadeIn {
  animation-name: lavka-ui-kit-fade-to-bottom;
}

.lavka-ui-kit-popup[data-popper-placement^=left] > .lavka-ui-kit-popup__content_fadeIn {
  animation-name: lavka-ui-kit-fade-to-left;
}

.lavka-ui-kit-popup[data-popper-placement^=right] > .lavka-ui-kit-popup__content_fadeIn {
  animation-name: lavka-ui-kit-fade-to-right;
}

.lavka-ui-kit-popup[data-popper-placement^=top] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow {
  inset-block-end: var(--lavka-ui-kit-popup-arrow-offset);
}

.lavka-ui-kit-popup[data-popper-placement^=top] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow::before {
  border-end-end-radius: var(--lavka-ui-kit-popup-arrow-border-radius);
}

.lavka-ui-kit-popup[data-popper-placement^=bottom] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow {
  inset-block-start: var(--lavka-ui-kit-popup-arrow-offset);
}

.lavka-ui-kit-popup[data-popper-placement^=bottom] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow::before {
  border-start-start-radius: var(--lavka-ui-kit-popup-arrow-border-radius);
}

.lavka-ui-kit-popup[data-popper-placement^=left] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow {
  inset-inline-end: var(--lavka-ui-kit-popup-arrow-offset);
}

.lavka-ui-kit-popup[data-popper-placement^=left] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow::before {
  border-start-end-radius: var(--lavka-ui-kit-popup-arrow-border-radius);
}

.lavka-ui-kit-popup[data-popper-placement^=right] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow {
  inset-inline-start: var(--lavka-ui-kit-popup-arrow-offset);
}

.lavka-ui-kit-popup[data-popper-placement^=right] > .lavka-ui-kit-popup__content > .lavka-ui-kit-popup__arrow::before {
  border-end-start-radius: var(--lavka-ui-kit-popup-arrow-border-radius);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-menu-item_size_m {
  --lavka-ui-kit-menu-item-vertical-gap: var(--lavka-ui-kit-gap-155);
  --lavka-ui-kit-menu-item-horizontal-gap: var(--lavka-ui-kit-gap-160);
  --lavka-ui-kit-menu-item-checkmark-offset: var(--lavka-ui-kit-gap-480);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-menu-item_size_s {
  --lavka-ui-kit-menu-item-vertical-gap: var(--lavka-ui-kit-gap-130);
  --lavka-ui-kit-menu-item-horizontal-gap: var(--lavka-ui-kit-gap-160);
  --lavka-ui-kit-menu-item-checkmark-offset: var(--lavka-ui-kit-gap-360);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-menu-item_size_xs {
  --lavka-ui-kit-menu-item-vertical-gap: var(--lavka-ui-kit-gap-115);
  --lavka-ui-kit-menu-item-horizontal-gap: var(--lavka-ui-kit-gap-120);
  --lavka-ui-kit-menu-item-checkmark-offset: var(--lavka-ui-kit-gap-320);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
}

.lavka-ui-kit-menu-item__content {
  position: relative;
  display: flex;
  align-items: center;
  background-color: transparent;
  border-radius: var(--lavka-ui-kit-border-radius-s);
  cursor: pointer;
  padding-block: var(--lavka-ui-kit-menu-item-vertical-gap);
  padding-inline: var(--lavka-ui-kit-menu-item-horizontal-gap);
  word-break: break-word;
}

.lavka-ui-kit-menu-item__content:hover {
  background-color: var(--lavka-ui-kit-color-control-minor);
}

.lavka-ui-kit-menu-item_hover .lavka-ui-kit-menu-item__content {
  background-color: var(--lavka-ui-kit-color-control-minor);
}

.lavka-ui-kit-menu-item__group-label {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  font-weight: 500;
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  color: var(--lavka-ui-kit-color-text-minor);
  cursor: default;
  margin-block-end: var(--lavka-ui-kit-gap-50);
  padding-block: var(--lavka-ui-kit-gap-50);
  padding-inline: var(--lavka-ui-kit-menu-item-horizontal-gap);
}

.lavka-ui-kit-menu-item_withCheckmark .lavka-ui-kit-menu-item__content {
  padding-inline-end: var(--lavka-ui-kit-menu-item-checkmark-offset);
}

.lavka-ui-kit-menu-item_active .lavka-ui-kit-menu-item__content {
  font-weight: 600;
}

.lavka-ui-kit-menu-item__text {
  flex: 1 1;
}

.lavka-ui-kit-menu-item__checkmark {
  position: absolute;
  inset-inline-end: var(--lavka-ui-kit-gap-80);
  visibility: hidden;
}

.lavka-ui-kit-menu-item_withCheckmark.lavka-ui-kit-menu-item_active .lavka-ui-kit-menu-item__checkmark {
  visibility: visible;
}

.lavka-ui-kit-menu-item_withCheckmark .lavka-ui-kit-menu-item_hover .lavka-ui-kit-menu-item__checkmark, .lavka-ui-kit-menu-item_withCheckmark .lavka-ui-kit-menu-item__content:hover .lavka-ui-kit-menu-item__checkmark {
  color: var(--lavka-ui-kit-color-text-minor);
  visibility: visible;
}

.lavka-ui-kit-menu-item_active .lavka-ui-kit-menu-item__content:hover .lavka-ui-kit-menu-item__checkmark {
  color: inherit;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-input {
  --lavka-ui-kit-input-inner-vertical-gap: var(--lavka-ui-kit-control-inner-vertical-gap);
  position: relative;
  display: inline-flex;
  box-sizing: border-box;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-start;
  cursor: text;
  inline-size: 100%;
  padding-block: var(--lavka-ui-kit-input-vertical-gap);
  padding-inline: var(--lavka-ui-kit-input-horizontal-gap);
  transform: translate3d(0, 0, 0);
}

.lavka-ui-kit-input, .lavka-ui-kit-input__multiline-no-icons-content {
  gap: var(--lavka-ui-kit-gap-40);
}

.lavka-ui-kit-input__multiline-no-icons-content {
  display: flex;
  flex-grow: 1;
  flex-wrap: wrap;
}

.lavka-ui-kit-input_size_m {
  --lavka-ui-kit-input-vertical-gap: var(--lavka-ui-kit-control-vertical-gap-m);
  --lavka-ui-kit-input-horizontal-gap: var(--lavka-ui-kit-control-horizontal-total-gap-m);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-input_size_s {
  --lavka-ui-kit-input-vertical-gap: var(--lavka-ui-kit-control-vertical-gap-s);
  --lavka-ui-kit-input-horizontal-gap: var(--lavka-ui-kit-control-horizontal-total-gap-s);
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-input_size_xs {
  --lavka-ui-kit-input-vertical-gap: var(--lavka-ui-kit-control-vertical-gap-xs);
  --lavka-ui-kit-input-horizontal-gap: var(--lavka-ui-kit-control-horizontal-total-gap-xs);
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
}

.lavka-ui-kit-input_pseudo {
  cursor: pointer;
}

.lavka-ui-kit-input_readOnly, .lavka-ui-kit-input_disabled {
  cursor: default;
}

.lavka-ui-kit-input__overlay {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: border-color, box-shadow;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  position: absolute;
  z-index: -1;
  display: block;
  border: 1px solid var(--lavka-ui-kit-color-surface-line);
  background-color: var(--lavka-ui-kit-color-surface-bg);
  inset: 0;
}

.lavka-ui-kit-input__overlay_size_m {
  border-radius: var(--lavka-ui-kit-border-radius-s);
}

.lavka-ui-kit-input__overlay_size_s {
  border-radius: var(--lavka-ui-kit-border-radius-s);
}

.lavka-ui-kit-input__overlay_size_xs {
  border-radius: var(--lavka-ui-kit-border-radius-xs);
}

.lavka-ui-kit-input__overlay_disabled {
  border-color: var(--lavka-ui-kit-color-surface-line);
  background-color: var(--lavka-ui-kit-color-surface-bg-minor);
}

.lavka-ui-kit-input__overlay_invalid {
  border-color: var(--lavka-ui-kit-color-status-error-main);
}

.lavka-ui-kit-input__control:focus ~ .lavka-ui-kit-input__overlay {
  --lavka-ui-kit-input-box-shadow-color: var(--lavka-ui-kit-color-control-focus-stroke);
  border-color: var(--lavka-ui-kit-color-control-focus-stroke);
  box-shadow: 0 0 0 1px var(--lavka-ui-kit-input-box-shadow-color);
}

.lavka-ui-kit-input__control:focus ~ .lavka-ui-kit-input__overlay_invalid {
  --lavka-ui-kit-input-box-shadow-color: var(--lavka-ui-kit-color-status-error-main);
  border-color: var(--lavka-ui-kit-color-status-error-main);
}

.lavka-ui-kit-input:not(.lavka-ui-kit-input_disabled):hover .lavka-ui-kit-input__overlay {
  border-color: var(--lavka-ui-kit-color-control-focus-stroke);
}

.lavka-ui-kit-input:not(.lavka-ui-kit-input_disabled):hover .lavka-ui-kit-input__overlay_invalid {
  border-color: var(--lavka-ui-kit-color-status-error-main);
}

.lavka-ui-kit-input__control {
  box-sizing: border-box;
  flex: 1 1;
  border: 0;
  background-color: transparent;
  color: var(--lavka-ui-kit-color-text-main);
  cursor: inherit;
  font-family: inherit;
  font-size: inherit;
  inline-size: 100%;
  line-height: inherit;
  min-inline-size: var(--lavka-ui-kit-gap-320);
  outline: none;
  padding-block: var(--lavka-ui-kit-input-inner-vertical-gap);
  padding-inline: 0;
}

.lavka-ui-kit-input__control::before {
  content: "​";
}

.lavka-ui-kit-input__control_disabled {
  color: var(--lavka-ui-kit-color-text-main);
}

.lavka-ui-kit-input__control::placeholder {
  color: var(--lavka-ui-kit-color-text-minor);
  opacity: 1;
}

.lavka-ui-kit-input__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  max-block-size: 1em;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-input-tag__icon {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.lavka-ui-kit-input-tag_disabled .lavka-ui-kit-input-tag__icon {
  cursor: unset;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-label {
  display: inline-flex;
  align-items: center;
  border-radius: var(--lavka-ui-kit-border-radius-xxs);
}

.lavka-ui-kit-label_size_m {
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  font-weight: 500;
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
  padding-block: var(--lavka-ui-kit-gap-40);
  padding-inline: var(--lavka-ui-kit-gap-80);
}

.lavka-ui-kit-label_size_s {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  font-weight: 500;
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  padding-block: var(--lavka-ui-kit-gap-50);
  padding-inline: var(--lavka-ui-kit-gap-60);
}

.lavka-ui-kit-label_size_xs {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  font-weight: 500;
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  padding-block: var(--lavka-ui-kit-gap-40);
  padding-inline: var(--lavka-ui-kit-gap-50);
}

.lavka-ui-kit-label__icon {
  display: flex;
  align-items: center;
}

.lavka-ui-kit-label > * + * {
  margin-inline-start: 6px;
}

.lavka-ui-kit-label_color_blue {
  background-color: var(--lavka-ui-kit-color-status-in-progress-minor);
  color: var(--lavka-ui-kit-color-status-in-progress-main);
}

.lavka-ui-kit-label_color_green {
  background-color: var(--lavka-ui-kit-color-status-success-minor);
  color: var(--lavka-ui-kit-color-status-success-main);
}

.lavka-ui-kit-label_color_red {
  background-color: var(--lavka-ui-kit-color-status-error-minor);
  color: var(--lavka-ui-kit-color-status-error-main);
}

.lavka-ui-kit-label_color_orange {
  background-color: var(--lavka-ui-kit-color-status-waiting-minor);
  color: var(--lavka-ui-kit-color-status-waiting-main);
}

.lavka-ui-kit-label_color_purple {
  background-color: var(--lavka-ui-kit-color-status-planned-minor);
  color: var(--lavka-ui-kit-color-status-planned-main);
}

.lavka-ui-kit-label_color_gray {
  background-color: var(--lavka-ui-kit-color-status-custom-minor);
  color: var(--lavka-ui-kit-color-status-custom-main);
}

.lavka-ui-kit-label_clickable {
  cursor: pointer;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.RoleInfo_role-info__sVOPq {
    display: flex;
    flex-direction: column;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.ThemeSwitch_theme-switch__CbQIX {
    display: flex;
    align-items: center;

    border-radius: var(--lavka-ui-kit-border-radius-l);
    column-gap: 6px;
}

.ThemeSwitch_theme-switch__CbQIX span {
        line-height: 22px;

        color: var(--lavka-ui-kit-color-text);
    font-size: 16px;
    font-weight: normal;
    line-height: 24px;
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-switch {
  --lavka-ui-kit-switch-width: var(--lavka-ui-kit-gap-360);
  --lavka-ui-kit-switch-gap: var(--lavka-ui-kit-gap-20);
  --lavka-ui-kit-switch-handle-size: var(--lavka-ui-kit-gap-180);
  --lavka-ui-kit-switch-handle-resize-offset: calc(-1 * var(--lavka-ui-kit-gap-60));
  display: inline-flex;
  /* stylelint-disable */
  /* stylelint-enable */
}

.lavka-ui-kit-switch__content {
  position: relative;
  display: inline-flex;
}

.lavka-ui-kit-switch__control {
  position: absolute;
  padding: 0;
  margin: 0;
  block-size: 100%;
  cursor: pointer;
  inline-size: 100%;
  inset-block-start: 0;
  inset-inline-start: 0;
  opacity: 0;
}

.lavka-ui-kit-switch__control:disabled {
  cursor: default;
}

.lavka-ui-kit-switch__switch {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: background-color;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  display: block;
  padding: var(--lavka-ui-kit-switch-gap);
  background-color: var(--lavka-ui-kit-color-control-minor);
  block-size: var(--lavka-ui-kit-switch-handle-size);
  border-radius: var(--lavka-ui-kit-border-radius-xxl);
  inline-size: var(--lavka-ui-kit-switch-width);
}

.lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-error);
}

.lavka-ui-kit-switch__handle {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: transform;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  position: relative;
  display: inline-block;
  block-size: var(--lavka-ui-kit-switch-handle-size);
  inline-size: var(--lavka-ui-kit-switch-handle-size);
  pointer-events: none;
  transform: translateX(0);
}

.lavka-ui-kit-switch__handle::before {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: inset;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  position: absolute;
  display: inline;
  background-color: var(--lavka-ui-kit-color-text-always-white);
  border-radius: calc(var(--lavka-ui-kit-switch-handle-size) / 2);
  box-shadow: var(--lavka-ui-kit-box-shadow-bottom-day-close);
  content: "";
  inset: 0;
  inset-inline-end: 0;
  inset-inline-start: 0;
}

.lavka-ui-kit-switch__control:focus-visible + .lavka-ui-kit-switch__switch {
  box-shadow: var(--lavka-ui-kit-box-shadow-control-focus);
}

.lavka-ui-kit-switch__control:checked + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-main);
}

.lavka-ui-kit-switch__control:checked + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-error);
}

.lavka-ui-kit-switch__control:checked + .lavka-ui-kit-switch__switch .lavka-ui-kit-switch__handle {
  transform: translateX(calc(var(--lavka-ui-kit-switch-width) - var(--lavka-ui-kit-switch-handle-size)));
}

.lavka-ui-kit-switch__control:hover + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-minor-hovered);
}

.lavka-ui-kit-switch__control:hover + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-control-error-hovered);
}

.lavka-ui-kit-switch__control:active + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-minor-pressed);
}

.lavka-ui-kit-switch__control:active + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-control-error-pressed);
}

.lavka-ui-kit-switch__control:active + .lavka-ui-kit-switch__switch .lavka-ui-kit-switch__handle::before {
  inset-inline-end: var(--lavka-ui-kit-switch-handle-resize-offset);
  inset-inline-start: 0;
}

.lavka-ui-kit-switch__control:disabled + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-minor);
  opacity: 0.5;
}

.lavka-ui-kit-switch__control:disabled + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-error);
}

.lavka-ui-kit-switch__control:disabled + .lavka-ui-kit-switch__switch .lavka-ui-kit-switch__handle::before {
  inset-inline-end: 0;
  inset-inline-start: 0;
}

.lavka-ui-kit-switch__control:checked:hover + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-main-hovered);
}

.lavka-ui-kit-switch__control:checked:hover + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-control-error-hovered);
}

.lavka-ui-kit-switch__control:checked:active + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-main-pressed);
}

.lavka-ui-kit-switch__control:checked:active + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-control-error-pressed);
}

.lavka-ui-kit-switch__control:checked:active + .lavka-ui-kit-switch__switch .lavka-ui-kit-switch__handle::before {
  inset-inline-end: 0;
  inset-inline-start: var(--lavka-ui-kit-switch-handle-resize-offset);
}

.lavka-ui-kit-switch__control:checked:disabled + .lavka-ui-kit-switch__switch {
  background-color: var(--lavka-ui-kit-color-control-main);
}

.lavka-ui-kit-switch__control:checked:disabled + .lavka-ui-kit-switch__switch_invalid {
  background-color: var(--lavka-ui-kit-color-error);
}

.lavka-ui-kit-switch__control:checked:disabled + .lavka-ui-kit-switch__switch .lavka-ui-kit-switch__handle::before {
  inset-inline-end: 0;
  inset-inline-start: 0;
}

[dir=rtl] .lavka-ui-kit-switch__control:checked + .lavka-ui-kit-switch__switch .lavka-ui-kit-switch__handle {
  transform: translateX(calc(var(--lavka-ui-kit-switch-handle-size) - var(--lavka-ui-kit-switch-width)));
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.AccountSettings_account-settings__9AG-H {
    padding: 0 var(--lavka-ui-kit-gap-160);

    color: var(--lavka-ui-kit-color-text);
}

.AccountSettings_account-settings__user-wrapper__x-8pa {
        display: flex;
        align-items: center;

        margin-bottom: var(--lavka-ui-kit-gap-160);
    }

.AccountSettings_account-settings__user-avatar__087M4 {
        width: 40px;
        height: 40px;
        margin-right: var(--lavka-ui-kit-gap-120);
    }

.AccountSettings_account-settings__user-name__YYHp- {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    }

.AccountSettings_account-settings__user-email__5VpBB {
        color: var(--lavka-ui-kit-color-text-minor);
    }

.AccountSettings_account-settings__title__xK41k {
        margin-bottom: var(--lavka-ui-kit-gap-160);
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    }

.AccountSettings_account-settings__link__ZrNoy,
    .AccountSettings_account-settings__item__4T1IB {
        margin-top: var(--lavka-ui-kit-gap-80);
    font-size: 14px;
    line-height: 20px;
    }

.AccountSettings_account-settings__link-container__bneg\+::first-letter {
        display: block;

        color: var(--lavka-ui-kit-color-red-normal);
    }

.AccountSettings_account-settings__link__ZrNoy:hover {
            color: var(--lavka-ui-kit-color-link-hovered);
        }

.AccountSettings_account-settings__languages-item__q6Sr8 {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

.AccountSettings_account-settings__languages__8m9vf {
        margin: var(--lavka-ui-kit-gap-195) 0 0;

        color: var(--lavka-ui-kit-color-status-custom-text);
    font-size: 12px;
    line-height: 16px;
    }

.AccountSettings_account-settings__settings__IdpSw:not(:last-child) {
            margin-bottom: var(--lavka-ui-kit-gap-160);
            padding-bottom: var(--lavka-ui-kit-gap-160);

            border-bottom: 1px solid rgba(138, 135, 132, 0.4);
        }

.AccountSettings_account-settings__logout-button__O-UNB {
        padding: var(--lavka-ui-kit-gap-120);

        cursor: pointer;
        -webkit-user-select: none;
                user-select: none;
        text-align: center;

        color: var(--lavka-ui-kit-color-status-error-text);
        border-radius: var(--lavka-ui-kit-border-radius-xs);
        background-color: var(--lavka-ui-kit-color-status-error-bg);
    }

.AccountSettings_account-settings__buttons-container__5XEEC {
        display: flex;
        flex-direction: column;
        gap: var(--lavka-ui-kit-gap-160);
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-tooltip {
  --lavka-ui-kit-popup-arrow-border-radius: var(--lavka-ui-kit-border-radius-min);
  padding: var(--lavka-ui-kit-gap-120);
  background-color: var(--lavka-ui-kit-color-surface-always-black);
  border-radius: var(--lavka-ui-kit-border-radius-xs);
  color: var(--lavka-ui-kit-color-text-always-white);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.Header_header__973nr {
    position: sticky;
    z-index: 2000;
    top: 0;
}

.Header_header__973nr .lavka-ui-kit-page-header__left-content {
        width: auto;
    }

.Header_header__extra__1lcRU {
        margin-right: var(--lavka-ui-kit-gap-195);
    }

.Header_header__companies-menu__BkBh2 {
        margin-right: var(--lavka-ui-kit-gap-80);
    }

.Header_header__version__d1aB8 {
        position: absolute;
        top: 40px;
        left: 50px;

        overflow: hidden;

        max-width: 60px;
        padding: 0 2px;

        white-space: nowrap;
        text-overflow: ellipsis;

        color: var(--lavka-ui-kit-color-gray-250);
        border-radius: 4px;
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-page-header__left-content {
  inline-size: 240px;
}

.lavka-ui-kit-page-header__center-content {
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
}

.lavka-ui-kit-page-header__right-content {
  display: flex;
  align-items: center;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-page-header-service-menu {
  position: relative;
  display: flex;
  /* перебиваем gap из ServiceLogo (специфичность в 2 класса перебивает 1 класс) */
}

.lavka-ui-kit-page-header-service-menu__active-service-logo-wrapper {
  margin-inline-start: -4px;
  /* перебиваем паддинги из PageHeaderButton (специфичность в 3 класса перебивает 2 класса) */
}

.lavka-ui-kit-page-header-service-menu__active-service-logo-wrapper.lavka-ui-kit-page-header-service-menu__active-service-logo-wrapper.lavka-ui-kit-page-header-service-menu__active-service-logo-wrapper {
  padding: 4px;
  padding-inline-end: 6px;
}

.lavka-ui-kit-page-header-service-menu__active-service-logo.lavka-ui-kit-page-header-service-menu__active-service-logo {
  gap: var(--lavka-ui-kit-gap-80);
}

.lavka-ui-kit-page-header-service-menu__menu-button-icon {
  display: flex;
  transition: transform var(--lavka-ui-kit-transition-duration-default) linear;
}

.lavka-ui-kit-page-header-service-menu__menu-button-icon_active {
  transform: rotateX(180deg);
}

.lavka-ui-kit-page-header-service-menu__menu-anchor {
  position: absolute;
  block-size: var(--lavka-ui-kit-gap-400);
  inset-inline-start: calc(-1 * var(--lavka-ui-kit-gap-80));
}

.lavka-ui-kit-page-header-service-menu__menu {
  display: flex;
  flex-direction: column;
  gap: var(--lavka-ui-kit-gap-40);
  /* Подобранная на глаз высота, чтобы последний пункт обрезался и было видно, что можно скроллить */
  max-block-size: 635px;
  overflow-y: auto;
}

.lavka-ui-kit-page-header-service-menu__menu-service-logo {
  color: var(--lavka-ui-kit-color-text-main);
  padding-block: var(--lavka-ui-kit-gap-80);
  padding-inline: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-page-header-service-menu__menu-service-logo:hover {
  background-color: var(--lavka-ui-kit-color-control-minor-hovered);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-button.lavka-ui-kit-page-header-button {
  --lavka-ui-kit-page-header-button-height: 40px;
  border: 0;
  block-size: var(--lavka-ui-kit-page-header-button-height);
  border-radius: var(--lavka-ui-kit-border-radius-s);
  color: var(--lavka-ui-kit-color-absolute-white);
  padding-block: 0;
  padding-inline: var(--lavka-ui-kit-gap-140);
}

.lavka-ui-kit-button.lavka-ui-kit-page-header-button_view_header-accent {
  --lavka-ui-kit-button-view-action-background-color: var(--lavka-ui-kit-color-control-header-accent);
  --lavka-ui-kit-button-view-action-background-color-hover: var(--lavka-ui-kit-color-control-header-hovered);
  --lavka-ui-kit-button-view-action-background-color-active: var(--lavka-ui-kit-color-control-header-pressed);
  --lavka-ui-kit-button-view-action-background-color-disabled: var(--lavka-ui-kit-color-control-header-accent);
}

.lavka-ui-kit-button.lavka-ui-kit-page-header-button_view_header-default {
  --lavka-ui-kit-button-view-default-background-color: transparent;
  --lavka-ui-kit-button-view-default-background-color-hover: var(--lavka-ui-kit-color-control-header-hovered);
  --lavka-ui-kit-button-view-default-background-color-active: var(--lavka-ui-kit-color-control-header-pressed);
  --lavka-ui-kit-button-view-default-background-color-disabled: transparent;
}

.lavka-ui-kit-button.lavka-ui-kit-page-header-button_variant_icon {
  inline-size: var(--lavka-ui-kit-page-header-button-height);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-page-header-service-logo {
  display: flex;
  align-items: center;
  border-radius: var(--lavka-ui-kit-border-radius-s);
  cursor: default;
  gap: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-page-header-service-logo.lavka-ui-kit-link {
  color: inherit;
}

.lavka-ui-kit-page-header-service-logo.lavka-ui-kit-link:hover {
  color: inherit;
}

.lavka-ui-kit-page-header-service-logo_clickable {
  cursor: pointer;
}

.lavka-ui-kit-page-header-service-logo__icon-wrap {
  display: flex;
  align-items: center;
}

.lavka-ui-kit-page-header-service-logo__icon-wrap_colorScheme_grayscale {
  filter: grayscale(1);
}

.lavka-ui-kit-page-header-service-logo__title-wrapper {
  position: relative;
  color: inherit;
}

.lavka-ui-kit-page-header-service-logo__title {
  font-family: var(--lavka-ui-kit-typography-font-family-service-title);
  font-size: var(--lavka-ui-kit-typography-font-size-service-title);
  letter-spacing: var(--lavka-ui-kit-typography-letter-spacing-service-title);
  line-height: var(--lavka-ui-kit-typography-line-height-service-title);
  padding-block-start: 1px;
  text-transform: uppercase;
}

.lavka-ui-kit-page-header-service-logo__nameplate {
  position: absolute;
  z-index: 1;
  display: flex;
  align-items: center;
  background-color: var(--lavka-ui-kit-color-blue-normal);
  block-size: 11.5px;
  border-radius: var(--lavka-ui-kit-border-xxxs);
  font-size: 8px;
  font-weight: 700;
  inset-block-end: -2px;
  inset-inline-end: -5px;
  line-height: 8px;
  max-inline-size: 90%;
  padding-block: 0.5px 0;
  padding-inline: 3px;
  text-transform: uppercase;
}

.lavka-ui-kit-page-header-service-logo__nameplate-content {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-link {
  cursor: pointer;
  text-decoration: none;
}

.lavka-ui-kit-link_view_default {
  color: var(--lavka-ui-kit-color-control-link);
}

.lavka-ui-kit-link_view_default:hover {
  color: var(--lavka-ui-kit-color-control-link-hovered);
}

.lavka-ui-kit-link_view_default:active {
  color: var(--lavka-ui-kit-color-control-link-pressed);
}

.lavka-ui-kit-link_view_critical {
  color: var(--lavka-ui-kit-color-error);
}

.lavka-ui-kit-link_view_critical:hover {
  color: var(--lavka-ui-kit-color-error-hovered);
}

.lavka-ui-kit-link_view_critical:active {
  color: var(--lavka-ui-kit-color-error-pressed);
}

.lavka-ui-kit-link_disabled {
  cursor: default;
  pointer-events: none;
}

.lavka-ui-kit-link_disabled, .lavka-ui-kit-link_disabled:hover, .lavka-ui-kit-link_disabled:active {
  color: var(--lavka-ui-kit-color-text-minor);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-popup__content.lavka-ui-kit-page-header-menu {
  padding: var(--lavka-ui-kit-gap-120);
  border-radius: var(--lavka-ui-kit-border-radius-l);
  /**
   * обводка 1px var(--lavka-ui-kit-color-surface-card-stroke) сделана через box-shadow, а не outline,
   * из-за бага в Safari, который пофикшен в 16.4 beta:
   * https://developer.apple.com/documentation/safari-release-notes/safari-16_4-release-notes
   *
   * можно заменить на outline, когда релиз выйдет из беты и пройдёт достаточно времени
   */
  box-shadow: 0 0 0 1px var(--lavka-ui-kit-color-surface-card-stroke), var(--lavka-ui-kit-box-shadow-bottom-day-elevation-2);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-page-header-user-menu__menu.lavka-ui-kit-popup__content.lavka-ui-kit-page-header-menu {
  box-sizing: border-box;
  max-inline-size: 350px;
  min-inline-size: 290px;
  padding-block: 0 var(--lavka-ui-kit-gap-160);
  padding-inline: 0;
}

.lavka-ui-kit-page-header-user-menu__user-avatar {
  cursor: pointer;
}

.lavka-ui-kit-page-header-user-menu__user-info {
  display: flex;
  align-items: center;
  border-radius: var(--lavka-ui-kit-border-radius-l) var(--lavka-ui-kit-border-radius-l) 0 0;
  color: var(--lavka-ui-kit-color-text-main);
  padding-block: var(--lavka-ui-kit-gap-180) var(--lavka-ui-kit-gap-140);
  padding-inline: var(--lavka-ui-kit-gap-160);
}

.lavka-ui-kit-page-header-user-menu__user-info_clickable:hover {
  background-color: var(--lavka-ui-kit-color-control-minor-hovered);
  color: var(--lavka-ui-kit-color-text-main);
  cursor: pointer;
}

.lavka-ui-kit-page-header-user-menu__user-info:last-child {
  border-radius: var(--lavka-ui-kit-border-radius-l);
  margin-block-end: calc(-1 * var(--lavka-ui-kit-gap-160));
  padding-block-end: var(--lavka-ui-kit-gap-160);
}

.lavka-ui-kit-page-header-user-menu__user-info:not(:last-child) {
  border-block-end: 1px solid var(--lavka-ui-kit-color-surface-line);
}

.lavka-ui-kit-page-header-user-menu__user-info-avatar {
  margin-inline-end: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-page-header-user-menu__user-info-name {
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  font-weight: 500;
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
  display: flex;
  align-items: center;
}

.lavka-ui-kit-page-header-user-menu__user-info-email {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  color: var(--lavka-ui-kit-color-text-minor);
}

.lavka-ui-kit-page-header-user-menu__user-info-icon {
  margin-inline-start: var(--lavka-ui-kit-gap-20);
}

.lavka-ui-kit-page-header-user-menu__logout-button-wrap {
  border-block-start: 1px solid var(--lavka-ui-kit-color-surface-line);
  padding-block: var(--lavka-ui-kit-gap-160) 0;
  padding-inline: var(--lavka-ui-kit-gap-160);
}

.lavka-ui-kit-page-header-user-menu__logout-link {
  display: block;
  border-radius: var(--lavka-ui-kit-border-radius-s);
}

.lavka-ui-kit-page-header-user-menu__logout-button {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
}

.lavka-ui-kit-page-header-user-menu__user-info + .lavka-ui-kit-page-header-user-menu__logout-button-wrap {
  border-block-start: 0;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-page-header-avatar {
  transition-duration: var(--lavka-ui-kit-transition-duration-default);
  transition-property: box-shadow;
  transition-timing-function: var(--lavka-ui-kit-transition-timing-function-default);
  position: relative;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  background-size: cover;
  border-radius: 100%;
  color: var(--lavka-ui-kit-color-text-always-white);
}

.lavka-ui-kit-page-header-avatar_active {
  /**
   * обводка сделана через box-shadow, а не outline,
   * из-за бага в Safari, который пофикшен в 16.4 beta:
   * https://developer.apple.com/documentation/safari-release-notes/safari-16_4-release-notes
   *
   * можно заменить на outline, когда релиз выйдет из беты и пройдёт достаточно времени
   */
  box-shadow: 0 0 0 2px var(--lavka-ui-kit-color-control-header-accent);
}

.lavka-ui-kit-page-header-avatar__skeleton {
  position: absolute;
  animation: skeleton-loading 1.5s infinite ease-in-out;
  background: linear-gradient(90deg, var(--lavka-ui-kit-color-gray-200) 0%, var(--lavka-ui-kit-color-gray-200) 20%, var(--lavka-ui-kit-color-gray-150) 60%, var(--lavka-ui-kit-color-gray-200) 70%, var(--lavka-ui-kit-color-gray-200) 100%);
  background-size: 400% 400%;
  border-radius: 100%;
  inset: 0;
}

.lavka-ui-kit-page-header-avatar_disabled {
  opacity: 0.5;
}

.lavka-ui-kit-page-header-avatar_size_xs {
  font-size: var(--lavka-ui-kit-typography-font-size-caption3);
  font-weight: 700;
  line-height: 9px;
  block-size: 20px;
  inline-size: 20px;
}

.lavka-ui-kit-page-header-avatar_size_s {
  font-size: var(--lavka-ui-kit-typography-font-size-caption2);
  font-weight: 500;
  line-height: 11px;
  block-size: 24px;
  inline-size: 24px;
}

.lavka-ui-kit-page-header-avatar_size_m {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  font-weight: 700;
  line-height: 13px;
  block-size: 32px;
  inline-size: 32px;
}

.lavka-ui-kit-page-header-avatar_size_l {
  font-size: var(--lavka-ui-kit-typography-font-size-body2);
  font-weight: 700;
  line-height: var(--lavka-ui-kit-typography-line-height-body2-tight);
  block-size: 40px;
  inline-size: 40px;
}

.lavka-ui-kit-page-header-avatar_size_xl {
  font-size: var(--lavka-ui-kit-typography-font-size-body1);
  font-weight: 700;
  line-height: var(--lavka-ui-kit-typography-line-height-body1-tight);
  block-size: 56px;
  inline-size: 56px;
}

.lavka-ui-kit-page-header-avatar__default-user {
  block-size: 100%;
  inline-size: 100%;
}

.lavka-ui-kit-page-header-avatar__badge {
  position: absolute;
  border: var(--lavka-ui-kit-color-absolute-white) solid 1px;
  border-radius: 100%;
  inset-block-end: 0;
  inset-inline-end: 0;
}

.lavka-ui-kit-page-header-avatar__badge_size_xs {
  font-size: var(--lavka-ui-kit-typography-font-size-caption2);
  line-height: var(--lavka-ui-kit-typography-line-height-caption2-tight);
  border-width: 1px;
  block-size: 6px;
  inline-size: 6px;
  inset-block-end: -1px;
  inset-inline-end: -1px;
}

.lavka-ui-kit-page-header-avatar__badge_size_s {
  font-size: var(--lavka-ui-kit-typography-font-size-caption2);
  line-height: var(--lavka-ui-kit-typography-line-height-caption2-tight);
  border-width: 1px;
  block-size: 6px;
  inline-size: 6px;
  inset-block-end: -1px;
  inset-inline-end: -1px;
}

.lavka-ui-kit-page-header-avatar__badge_size_m {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  border-width: 1px;
  block-size: 8px;
  inline-size: 8px;
  inset-block-end: -1px;
  inset-inline-end: -1px;
}

.lavka-ui-kit-page-header-avatar__badge_size_l {
  font-size: var(--lavka-ui-kit-typography-font-size-body1);
  line-height: var(--lavka-ui-kit-typography-line-height-body1-tight);
  border-width: 2px;
  block-size: 10px;
  inline-size: 10px;
  inset-block-end: -2px;
  inset-inline-end: -2px;
}

.lavka-ui-kit-page-header-avatar__badge_size_xl {
  font-size: var(--lavka-ui-kit-typography-font-size-body1);
  line-height: var(--lavka-ui-kit-typography-line-height-body1-tight);
  border-width: 2px;
  block-size: 10px;
  inline-size: 10px;
  inset-block-end: -2px;
  inset-inline-end: -2px;
}

.lavka-ui-kit-page-header-avatar__badge_state_active {
  background-color: var(--lavka-ui-kit-color-yellow-normal);
}

.lavka-ui-kit-page-header-avatar__badge_state_inactive {
  background-color: var(--lavka-ui-kit-color-gray-600);
}

.lavka-ui-kit-page-header-avatar__badge_state_online {
  background-color: var(--lavka-ui-kit-color-status-success-main);
}

@keyframes skeleton-loading {
  0% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-header {
  position: relative;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  background-color: var(--lavka-ui-kit-color-surface-always-black);
  box-shadow: var(--lavka-ui-kit-box-shadow-bottom-day-elevation-2);
  color: var(--lavka-ui-kit-color-text-always-white);
  min-block-size: var(--lavka-ui-kit-gap-560);
  padding-block: 0;
  padding-inline: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-header__content {
  flex: 1 1;
}

.lavka-ui-kit-header__extra-content {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}

.lavka-ui-kit-header__extra-content_placement_left {
  margin-inline-end: var(--lavka-ui-kit-gap-120);
}

.lavka-ui-kit-header__extra-content_placement_right {
  margin-inline-start: var(--lavka-ui-kit-gap-120);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-header-corner {
  position: absolute;
  color: var(--lavka-ui-kit-color-surface-always-black);
  inset-block-start: 100%;
}

.lavka-ui-kit-header-corner_placement_left {
  inset-inline-start: 0;
}

[dir=rtl] .lavka-ui-kit-header-corner_placement_left {
  transform: scaleX(-1);
}

.lavka-ui-kit-header-corner_placement_right {
  inset-inline-end: 0;
  transform: scaleX(-1);
}

[dir=rtl] .lavka-ui-kit-header-corner_placement_right {
  transform: none;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-page-header-companies-menu__menu-button {
  /* перебиваем паддинги из PageHeaderButton */
}

.lavka-ui-kit-page-header-companies-menu__menu-button.lavka-ui-kit-page-header-companies-menu__menu-button.lavka-ui-kit-page-header-companies-menu__menu-button {
  padding-inline-end: var(--lavka-ui-kit-gap-80);
}

.lavka-ui-kit-page-header-companies-menu__menu-button-content {
  display: flex;
  align-items: center;
}

.lavka-ui-kit-page-header-companies-menu__active-company-no-menu-wrap {
  padding-block: 0;
  padding-inline: var(--lavka-ui-kit-gap-140);
}

.lavka-ui-kit-page-header-companies-menu__active-company-name {
  font-size: var(--lavka-ui-kit-typography-font-size-caption1);
  line-height: var(--lavka-ui-kit-typography-line-height-caption1-tight);
  color: var(--lavka-ui-kit-color-absolute-white);
}

.lavka-ui-kit-page-header-companies-menu__menu-button-icon {
  display: flex;
  transition: transform var(--lavka-ui-kit-transition-duration-default) linear;
}

.lavka-ui-kit-page-header-companies-menu__menu-button-icon_active {
  transform: rotateX(180deg);
}

.lavka-ui-kit-page-header-companies-menu__search-input {
  margin-block-end: var(--lavka-ui-kit-gap-80);
}

.lavka-ui-kit-page-header-companies-menu__menu-items-wrap {
  display: flex;
  flex-direction: column;
  gap: var(--lavka-ui-kit-gap-40);
  /* Подобранная на глаз высота для меню из 10 пунктов. 10й обрезается, чтобы было видно, что можно скроллить */
  max-block-size: 448px;
  overflow-y: auto;
}

.lavka-ui-kit-page-header-companies-menu__menu-item {
  cursor: default;
}

.lavka-ui-kit-page-header-companies-menu__menu-item_clickable:not(.lavka-ui-kit-page-header-companies-menu__menu-item_active) {
  cursor: pointer;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-button.HeaderButton_header-button_active__SWVxb,
        .lavka-ui-kit-button.HeaderButton_header-button_active__SWVxb:hover {
            background-color: var(--lavka-ui-kit-color-gray-500);
        }

.HeaderButton_header-button__content__hRTUz {
        display: flex;
        align-items: center;
    }

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.NotFoundErrorInfo_not-found-error-info__93f2v {
    height: 100%;
    margin: auto;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.PageFallback_page-fallback__RU2vg {
    display: flex;
    justify-content: center;
    align-items: center;

    height: 600px;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.ForbiddenErrorInfo_forbidden-error-info__bHaza {
    height: 100%;
    margin: auto;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.NotificationEventsListener_notification-events-listener__ZdPC\+ > div {
    inset-block-end: auto;
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-notifications {
  position: fixed;
  z-index: var(--lavka-ui-kit-z-index-notification);
  display: flex;
  flex-direction: column-reverse;
  inline-size: var(--lavka-ui-kit-gap-3360);
  inset-block-end: 0;
  inset-inline-end: 0;
  margin-block-end: var(--lavka-ui-kit-gap-160);
  margin-inline-end: var(--lavka-ui-kit-gap-320);
  max-inline-size: var(--lavka-ui-kit-gap-3360);
}

/* min-width */

/* box-shadow */

/* z-index */

/* max-width */

/* color */

/*
 * Тут специально не указано дефолтное значение, чтобы в компонентах было явно видно,
 * до какого количества строк мы обрезаем текст
 */

.lavka-ui-kit-notification-wrapper {
  --lavka-ui-kit-notification-wrapper-height: 0;
  animation: fade-in 0.5s ease-out forwards;
  padding-block-start: var(--lavka-ui-kit-gap-80);
}

.lavka-ui-kit-notification-wrapper_hidden {
  animation: fade-out 0.7s linear forwards;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade-out {
  0% {
    margin-block-start: 0;
    opacity: 1;
  }
  50% {
    margin-block-start: 0;
    opacity: 0;
  }
  100% {
    margin-block-start: calc(-1 * var(--lavka-ui-kit-notification-wrapper-height));
    opacity: 0;
  }
}