@font-face {
    font-family: 'SFProDisplay';
    src: url('fonts/SFProDisplay-Regular.eot');
    src: url('fonts/SFProDisplay-Regular.eot?#iefix') format('embedded-opentype'),
    url('fonts/SFProDisplay-Regular.woff') format('woff'),
    url('fonts/SFProDisplay-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'SFProDisplayLight';
    src: url('fonts/SFProDisplay-Light.eot');
    src: url('fonts/SFProDisplay-Light.eot?#iefix') format('embedded-opentype'),
    url('fonts/SFProDisplay-Light.woff') format('woff'),
    url('fonts/SFProDisplay-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'SFProDisplayMedium';
    src: url('fonts/SFProDisplay-Medium.eot');
    src: url('fonts/SFProDisplay-Medium.eot?#iefix') format('embedded-opentype'),
    url('fonts/SFProDisplay-Medium.woff') format('woff'),
    url('fonts/SFProDisplay-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'SFProDisplayBold';
    src: url('fonts/SFProDisplay-Bold.eot');
    src: url('fonts/SFProDisplay-Bold.eot?#iefix') format('embedded-opentype'),
    url('fonts/SFProDisplay-Bold.woff') format('woff'),
    url('fonts/SFProDisplay-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}


article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, main {
    display: block;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

.wrapper input:not([type="checkbox"]), .wrapper select, .wrapper textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

a {
    cursor:pointer;
    outline:0;
    text-decoration:none;
    color:inherit
}

body {
    font: 14px 'SFProDisplay';
    font-weight: normal;
    line-height: 1.29em;
    width: 100%;
    height: 100%;
    color: #262626;
    -webkit-font-smoothing:antialiased;
    -moz-font-smoothing:antialiased;
    -o-font-smoothing:antialiased;
    font-smoothing:antialiased
}

button {
    font-family: 'SFProDisplay';
    outline: 0;
    border: 0;
    padding: 0;
    cursor: pointer;
    transition: opacity .3s ease-out;
}

button:hover {
    opacity:  80%;
}

button:active {
    opacity:  100%;
}

img {
    max-width:100%;
    height: auto;
    user-select:none
}

picture {
    max-width: 100%;
    height: auto;
}

input,
textarea {
    outline: 0;
}

* {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color:transparent;
    -webkit-overflow-scrolling: touch;
}

h1, h2, h3, h4, h5, h6 {
    width: 100%;
    font-family: 'SFProDisplay';
}

h1 {
    font-family: 'SFProDisplayBold';
    font-size: 24px;
    line-height: 29px;
    margin: 0;
}

.inner, .wrapper, section, .container {
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    -o-transition:all .4s ease;
    transition:all .4s ease
}

.container:after {
    line-height:0;
    display:block;
    visibility:hidden;
    clear:both;
    height:0;
    content:' ';
}

.checkbox {
    position: relative;
}

.wrapper {
    position: relative;
    z-index: 10;
    width: 100%;
    min-width: 1280px;
    max-width: 1740px;
    height: 100%;
    min-height: 100vh;
    margin: 0 auto;
    background: #ffffff;
}

.container {
    width: 100%;
    height: 100%;
    margin: auto;
    padding: 0 20px;
}

.wrapper input, footer input, header input,
.wrapper textarea, footer textarea, header textarea,
.wrapper select, footer select, header select {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 17px;
    color: #595959;
    margin: 0;
    border: 0;
    background: #fff;
}

/* Стили для HEADER */

header {
    background: #25262D;
    position: relative;
    height: 65px;
}

.header__logo {
    position: fixed;
    top: 0px;
    width: 250px;
    height: 65px;
    margin-left: -20px;
    z-index: 1;
    background: #25262D;
}

.header__logo a {
    display: flex;
    height: 100%;
    align-items: center;
    justify-content: left;
}

.header__main {
    padding-left: 230px;
    display: flex;
    align-items: center;
    height: 100%;
    justify-content: space-between;
    position: relative;
}

.header__main:before {
    content: '';
    position: absolute;
    top: 0;
    left: 230px;
    width: 1px;
    height: 100%;
    display: block;
    background: rgb(255 255 255 / 10%);
}

.header__main--left {
    display: flex;
    align-items: center;
}

.header__main--left h1 {
    font-size: 24px;
    line-height: 29px;
    color: #FFFFFF;
    margin: 0 20px;
    width: auto;
}

.header__main--left .header__display--switch {
    display: flex;
    align-items: center;
    background: #393A42;
    border-radius: 5px;
    padding: 3px;
    height: 35px;
    margin-left: 10px;
}

.header__main--left .header__display--switch a {
    display: flex;
    align-items: center;
    border-radius: 4px;
    padding: 0 6px;
    margin-right: 5px;
    height: 100%;
    font-size: 13px;
    line-height: 16px;
    color: #FFFFFF;
    transition: background .3s ease-out;
}

.header__main--left .header__display--switch a:hover {
    background: rgb(101 100 197 / 50%);
}

.header__main--left .header__display--switch a.active,
.header__main--left .header__display--switch a.active:hover{
    background: #6564C5;
}

.header__main--left .header__display--switch a:last-child {
    margin-right: 0;
}

.header__main--left .update-tasks {
    background: #393A42;
    border-radius: 5px;
    width: 37px;
    height: 35px;
    margin-right: 10px;
    min-width: 37px;
    background-image:  url('../images/update-tasks.svg');
    background-repeat: no-repeat;
    background-position: center;
}

.header__main--left .add-month,
.header__main--left .add-group,
.header__main--left .add-protocol,
.header__main--left .add-team,
.header__main--left .close-sprint {
    background: #6564C5;
    border-radius: 5px;
    padding: 0 15px;
    height: 35px;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
}

.header__main--right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.header__main--right .header__switch {
    display: flex;
    background: #393A42;
    border-radius: 5px;
    padding: 3px;
    width: 67px;
    height: 35px;
    align-items: center;
    justify-content: space-between;
    margin-left:  20px;
}

.header__main--right .header__switch a img:last-child,
.header__main--right .header__switch a.active img:first-child {
    display:  none;
}

.header__main--right .header__switch a.active img:last-child {
    display: block;
}

.header__main--right .header__switch a {
    display: flex;
    align-items:  center;
    justify-content:  center;
    width:  29px;
    height: 100%;
    transition:  opacity .3s ease-out;
}

.header__main--right .header__switch a:hover {
    opacity:  80%;
}

.header__main--right .header__switch a:active,
.header__main--right .header__switch a.active:hover {
    opacity:  100%;
}

.header__main--right .header__switch a.active:first-child {
    background: #6564C5;
    border-radius: 5px 0px 0px 5px;
    cursor:  unset;
}

.header__main--right .header__switch a.active:last-child {
    background: #6564C5;
    border-radius: 0px 5px 5px 0px;
    cursor:  unset;
}

.header__main--right .header--status {
    width: 320px;
    margin-left: 20px;
    position: relative;
    height: 35px;
}

.header__main--right .header--status .picker__button {
    display: flex;
    align-items: center;
    width: 100%;
    height: 35px;
    background: #393A42;
    cursor: pointer;
    border-radius: 5px;
}

.header__main--right .header--status .picker__button:after {
    content: url('../images/arrow_down_grey.svg');
    position: absolute;
    top: 10px;
    right: 10px;
    display: block;
    width: 15px;
    height: 15px;
}

.header__main--right .header--status .picker__wrap.active .picker__button:after {
    transform: rotate(180deg);
}

.header__main--right .header--status .picker__button--title {
    font-weight: 300;
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    position: relative;
    padding-left: 42px;
    padding-right: 22px;
    height: 100%;
    display: flex;
    align-items: center;
    border-right: 1px solid #25262D;
}

.header__main--right .header--status .picker__button--title:before {
    content: url('../images/sort.svg');
    position: absolute;
    top: 8px;
    left: 14px;
    display: block;
    width: 15px;
    height: 15px;
}

.header__main--right .header--status .picker__button--value {
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    padding-left: 10px;
}

.header__main--right .header--status .picker__list--container {
    position: absolute;
    top: 40px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 100%;
    border-radius: 5px;
}

.header__main--right .header--status .picker__list {
    background: #393A42;
    position: relative;
    top: 0;
    padding: 10px;
    border-radius: 5px;
}

.header__main--right .header--status .picker__list--item {
    cursor: pointer;
    text-align: center;
    margin-bottom: 5px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header__main--right .header--status .picker__list--item.selected,
.header__main--right .header--status .picker__list--item.selected:hover,
.header__main--right .header--status .picker__list--item:hover {
    background: rgb(255 255 255 / 10%);
    border-radius: 5px;
}

.header__main--right .header--status .picker__list--item.selected:hover {
    cursor:  unset;
}

.header__main--right .header--status .picker__list--item:hover {
    background: rgb(255 255 255 / 5%);
}

.header__main--right .header--status .picker__list--item:last-child {
    margin-bottom: 0;
}

.header__main--right .header--status .picker__list--item .item__list {
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.header__main--right .search {
    width: 320px;
    height: 35px;
    background: #393A42;
    box-sizing: border-box;
    border-radius: 5px;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: 0 15px;
}

.header__main--right .search__button {
    position: relative;
    background-image: url('../images/search_grey.svg');
    background-repeat: no-repeat;
    background-position: 0;
    border: 0;
    padding: 0;
    width: 15px;
    height: 15px;
    cursor: pointer;
    margin-right: 10px;
    background-color: #393A42;
}

.header__main--right .search__line {
    width: 100%;
    height: 23px;
    padding: 0;
    font-size: 14px;
    line-height: 17px;
    color: #9CA6B4;
    background: #393A42;
}

.header__main--right .search__line::-webkit-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.header__main--right .search__line::-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.header__main--right .search__line:-ms-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.header__main--right .search__line:-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.header__main--right .add-project {
    background: #6564C5;
    border-radius: 5px;
    width: 121px;
    height: 35px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
}


/* Стили для HEADER - end*/

/* Стили для ASIDE */

aside {
    position: fixed;
    top: 65px;
    width: 250px;
    background: #25262D;
    height: 100%;
    padding: 0 15px;
    margin-left: -20px;
    z-index: 1;
}

aside .sidemenu__project {
    display: flex;
    background: #393A42;
    border-radius: 10px;
    cursor: pointer;
    min-height: 70px;
    height:  auto;
}

aside .sidemenu__project .picker__wrap {
    width:  100%;
}

aside .sidemenu__project .picker__button {
    width:  100%;
    display:  flex;
    padding: 15px;
}

aside .sidemenu__project .picker__list--container {
    position: absolute;
    top: auto;
    margin-top: 5px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 220px;
    border-radius: 10px;
    box-shadow: 0px 0px 20px rgb(37 38 45 / 10%);
}

aside .sidemenu__project .picker__list--wrap {
    padding: 10px 10px 5px 5px;
    background: #393A42;
    position: relative;
}

aside .sidemenu__project .picker__list--wrap:after {
    content: '';
    display: block;
    position: absolute;
    top: calc(100% - 60px);
    left: 0;
    width: 100%;
    height: 50px;
    z-index: 2;
    background: linear-gradient(180deg, rgba(47, 48, 55, 0) 0%, #2F3037 100%);
    border-radius: 0px 0px 10px 10px;
}

aside .sidemenu__project .picker__list--wrap.scroll-to-end:after {
    display: none;
}

aside .sidemenu__project .picker__list--wrap.scroll-to-end .picker__list {
    padding-bottom:  5px;
}

aside .sidemenu__project .picker__list {
    background: #393A42;
    position: relative;
    top: 0;
    max-height: 295px;
    overflow-y: scroll;
    margin-bottom: 10px;
    padding-right: 2px;
}

aside .sidemenu__project .picker__list::-webkit-scrollbar {
    width: 3px;
}

aside .sidemenu__project .picker__list::-webkit-scrollbar-track {
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

aside .sidemenu__project .picker__list::-webkit-scrollbar-thumb {
    opacity:1;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #9CA6B4;
    -webkit-box-shadow: none;
}

aside .sidemenu__project .picker__list--item {
    padding: 5px 10px;
    cursor: pointer;
    display:  flex;
    align-items:  center;
    border-radius: 2px;
    position:  relative;
    margin-bottom: 5px;
}

aside .sidemenu__project .picker__list--item:last-child {
    margin-bottom: 0;
}

aside .sidemenu__project .picker__list--item.selected .item__img,
aside .sidemenu__project .picker__list--item.selected:hover .item__img {
    background: #FF4D4F;
}

aside .sidemenu__project .item__img {
    width:  30px;
    height:  30px;
    display:  flex;
    align-items:  center;
    justify-content:  center;
    border-radius: 5px;
    font-family: 'SFProDisplayBold';
    font-size: 14px;
    line-height: 14px;
    color: #FFFFFF;
    z-index: 2;
    background: transparent;
}

aside .sidemenu__project .item__list {
    font-size: 14px;
    line-height: 17px;
    color: #FFFFFF;
    margin-left: 10px;
    z-index: 2;
}

aside .sidemenu__project .picker__list--item:hover .item__img {
    background: #393A42;
}

aside .sidemenu__project .picker__list--item.selected,
aside .sidemenu__project .picker__list--item:hover {
    background: rgb(156 166 180 / 10%);
    border-radius: 5px;
}

aside .sidemenu__project--img {
    background: #FF4D4F;
    border-radius: 10px;
    width: 40px;
    min-width: 40px;
    height: 40px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    font-size: 16px;
    font-family: 'SFProDisplayBold';
}

aside .sidemenu__project--info {
    margin-top: 2px;
    width: 100%;
    position:  relative;
    transition: all 0.2s ease-in-out;
}

aside .sidemenu__project--info:after {
    content: url('../images/arrow_down_grey.svg');
    position:  absolute;
    top: 10px;
    right: 3px;
}

aside .picker__wrap.active .sidemenu__project--info:after {
    transform:  rotateZ(180deg);
    top:  6px;
}

aside .sidemenu__project--info span {
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    color: #778192;
    display:  block;
    padding-right: 20px;
    z-index: 1;
    position:  relative;
}

aside .sidemenu__project--info .picker__button--value {
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 17px;
    color: #FFFFFF;
    padding-top: 2px;
}

aside .sidemenu__list {
    margin-top: 10px;
}

aside .sidemenu__item {
    width: 100%;
    margin-bottom: 7px;
    transition: background .3s ease-out;
}

aside .sidemenu__item a {
    display: flex;
    width: 100%;
    padding: 13px 0 13px 15px;
    margin-bottom: 5px;
    transition: transform 0.3s ease-in-out;
    align-items: flex-end;
}

aside .sidemenu__item.active a {
    background: #393A42;
    border-radius: 10px;
    cursor: auto;
    transform: none;
}

aside .sidemenu__item:hover {
    background: rgb(57 58 66 / 50%);
    border-radius: 10px;
}

aside .sidemenu__item a span {
    font-size: 14px;
    line-height: 17px;
    color: #778192;
    margin-left:  15px;
}

aside .sidemenu__item.active a span {
    font-size: 14px;
    line-height: 17px;
    color: #FFFFFF;
    font-family: 'SFProDisplayMedium';
}

aside .sidemenu__item img:nth-child(2),
aside .sidemenu__item.active img:first-child {
    display:  none;
}

aside .sidemenu__item.active img:nth-child(2) {
    display:  block;
}

aside .sidemenu__rest {
    display: flex;
    align-items: center;
    background: #393A42;
    border-radius: 10px;
    height: 45px;
    width: 100%;
    margin-top: 20px;
    padding: 0 15px;
    font-size: 14px;
    line-height: 17px;
    color: #778192;
    justify-content: space-between;
}

aside .sidemenu__rest .value {
    font-size: 16px;
    line-height: 19px;
    color: #FFFFFF;
    font-family: 'SFProDisplayMedium';
}

aside .sidemenu__lk {
    display: flex;
    align-items: center;
    background-image: url('../images/arrow_down_grey.svg');
    background-repeat: no-repeat;
    background-position: 100% 50%;
    width: 220px;
    cursor: pointer;
    position: fixed;
    bottom: 20px;
}

aside .sidemenu__lk--avatar {
    background: #FF4D4F;
    border-radius: 10px;
    width: 40px;
    min-width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #FFFFFF;
    margin-right: 16px;
    font-family: 'SFProDisplayMedium';
}

.sidemenu__lk--info span {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 145px;
}

.sidemenu__lk--title {
    color: #FFFFFF;
    font-size: 16px;
    line-height: 19px;
    font-family: 'SFProDisplayMedium';
}

.sidemenu__lk--subtitle {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

/* Стили для ASIDE - end*/

.main__container--otladka {
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

.main__container section {
    padding: 20px 0px 20px 250px;
}

.table__tasks--row {
    display: flex;
    align-items: center;
}

.table__tasks--row.relocatable {
    background: #FFFFFF;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

.table__tasks--row .cell {
    position:  relative;
}

.table__tasks--row .cell[data-cell="task"] {
    width: 97px;
    padding-left:  15px;
}

.table__tasks--row .cell[data-cell="type"] {
    width: 53px;
}

.table__tasks--row .cell[data-cell="title"] {
    width: calc(100% - 820px);
}

.table__tasks--row .cell[data-cell="plan"] {
    width: 94px;
}

.table__tasks--row .cell[data-cell="fact"] {
    width: 94px;
}

.table__tasks--row .cell[data-cell="period"] {
    width: 138px;
}

.table__tasks--row .cell[data-cell="status"] {
    width: 105px;
}

.table__tasks--row .cell[data-cell="action"] {
    width: 239px;
}

.table__tasks--row .table__header--column {
    display: flex;
    align-items: center;
}

.table__header .table__tasks--row {
    margin-bottom:  10px;
}

.table__header .table__tasks--row .title {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.table__tasks--header .table__tasks--month {
    background: #F2F4F5;
    border-radius: 5px;
    display: flex;
    align-items: center;
    height: 35px;
    margin-bottom: 0px;
}

.table__tasks--month .month--title {
    color: #9CA6B4;
    font-size: 13px;
    line-height: 16px;
    font-family: 'SFProDisplayBold';
    display: flex;
    align-items: center;
}

.table__tasks--month .month--title .popup__button {
    display: flex;
    margin-top: 0px;
    margin-left: 5px;
}

.table__tasks--month .month--title .popup__button button {
    border-radius: 5px;
    height: 26px;
    width: 26px;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 0;
}

.table__tasks--month .month--title .popup__button .save {
    background-color: #6564C5;
    margin-right: 5px;
    color: #FFFFFF;
    background-image: url(../images/edit__Check.svg);
}

.table__tasks--month .month--title .popup__button .cancel--edit {
    background-color: #e2e4e5;
    border: 1px solid #e2e4e5;
    background-image: url(../images/edit__cancel.svg);
}

.table__tasks--month .month--title span {
    color: #262626;
    padding-right: 1px;
}

.table__tasks--month .month--title .group__plan {
    position: relative;
    bottom: 1px;
    margin-left: 5px;
}

.table__tasks--month.edit .month--title .group__plan {
    display:  none;
}

.table__tasks--month .month--title span.able-to-edit {
    border-bottom: 1px solid transparent;
    cursor:  pointer;
}

.table__tasks--month .month--title span.able-to-edit:hover {
    border-bottom: 1px solid #262626;
}

.table__tasks--month .month-switch {
    width: 13px;
    min-width: 13px;
    height: 13px;
    margin-right: 10px;
    border: 1px solid #595959;
    box-sizing: border-box;
    border-radius: 2px;
    background-image: url('../images/month-switch-close.svg');
    background-repeat: no-repeat;
    background-position: center;
    cursor:  pointer;
}

.table__tasks--month .cell[data-cell="title"] input {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    resize: none;
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    padding: 7px 10px;
    width: 60%;
    min-height: 28px;
    height: 28px;
    overflow: hidden;
}

.table__tasks--month .month-switch.closed {
    background-image: url('../images/month-switch-open.svg');
}

.table__tasks--month .cell[data-cell="title"] {
    width: calc(100% - 670px);
    padding-left: 15px;
}

.table__tasks--month .cell[data-cell="plan"] {
    width: 94px;
}

.table__tasks--month .cell[data-cell="fact"] {
    width: 94px;
}

.table__tasks--month .cell[data-cell="period"] {
    width: 138px;
}

.table__tasks--month .cell[data-cell="status"] {
    width: 105px;
}

.table__tasks--month .cell[data-cell="action"] {
    width: 239px;
    padding-right: 6px;
}

.table__tasks--month .cell[data-cell="plan"] .title,
.table__tasks--month .cell[data-cell="fact"] .title,
.table__tasks--month .cell[data-cell="period"] .title {
    font-family: 'SFProDisplayBold';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
}

.table__tasks--header.warning .table__tasks--month .cell[data-cell="plan"] .title {
    color: #FF4D4F;
}

.table__tasks--month .cell[data-cell="action"] .table__inner--column {
    display:  flex;
    justify-content:  space-between;
    align-items: center;
}

.table__tasks--month .cell[data-cell="action"] .button--wrap {
    display:  flex;
    align-items:  center;
}

.table__tasks--month .cell[data-cell="action"] .add-task {
    background: #6564C5;
    border-radius: 5px;
    width:  23px;
    height:  23px;
    background-image: url('../images/add-task.svg');
    background-repeat: no-repeat;
    background-position: center;
}

.table__tasks--month .cell[data-cell="action"] .add-group.subgroup {
    background: rgba(101, 100, 197, 0.2);
    border-radius: 5px;
    width:  23px;
    height:  23px;
    margin-right:  5px;
    background-image: url('../images/add-subgroup.svg');
    background-repeat: no-repeat;
    background-position: center;
}

.table__tasks--month .cell[data-cell="action"] .residue__mounth {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    white-space: nowrap;
}

.table__tasks--month .cell[data-cell="action"] .residue__result {
    font-family: 'SFProDisplayBold';
    font-size: 13px;
    line-height: 16px;
    color: #000000;
    padding-left: 2px;
    white-space: nowrap;
}

.table__header .table__header--sort {
    background-image: url(../images/table_sort.svg);
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    cursor: pointer;
    width: 10px;
    height: 10px;
    margin-left: 3px;
}

.table__header .cell.descend .table__header--sort {
    background-image: url(../images/table_sort_descend.svg);
}

.table__header .cell.ascend .table__header--sort {
    background-image: url(../images/table_sort_descend.svg);
    transform: rotate(180deg);
    position: relative;
    top: 1px;
}

.table__tasks--group {
    margin-bottom: 24px;
}

.table__tasks--group:last-child {
    margin-bottom: 0px;
}

.table__tasks--group .group--title {
    display:  block;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    padding-left: 10px;
    margin-bottom: 10px;
}

.table__tasks--group .table__tasks--row,
.table__tasks--row.relocatable {
    border-top: 1px solid #F2F4F5;
    border-bottom: 1px solid #F2F4F5;
    min-height: 38px;
    height: auto;
    padding:  3px 0;
    width: calc(100% - 20px);
    display: flex;
    align-items: center;
    margin: 0 10px;
    cursor: move;
}

.table__tasks--row.widget--cloned {
    position: relative !important;
    opacity: 40%;
    width: calc(100% - 20px) !important;
}

.table__tasks--droppable + .table__tasks--droppable .table__tasks--row {
    border-top: 1px solid transparent;
}

.table__tasks--group .table__tasks--droppable:last-child .table__tasks--row {
    border-bottom: 1px solid #F2F4F5;
}

.table__tasks--group .table__tasks--droppable:hover {
    box-shadow: 0px 0px 8px rgb(0 0 0 / 10%);
    border-radius: 4px;
}

.table__tasks--group .table__tasks--droppable.table__tasks--empty:hover {
    box-shadow: none;
}

.table__tasks--group .table__tasks--droppable:hover .table__tasks--row {
    border-top: 1px solid transparent;
}

.table__tasks--group .table__tasks--droppable:last-child:hover .table__tasks--row {
    border-bottom: 1px solid transparent;
}

.table__tasks--group .table__tasks--row .cell[data-cell="task"],
.table__tasks--row.relocatable .cell[data-cell="task"] {
    width: 79px;
    padding-left:  5px;
    display:  flex;
    justify-content: flex-start;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"],
.table__tasks--row.relocatable .cell[data-cell="type"] {
    width: 61px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="title"],
.table__tasks--row.relocatable .cell[data-cell="title"] {
    width: calc(100% - 800px);
}

.table__tasks--group .table__tasks--row .cell[data-cell="plan"],
.table__tasks--row.relocatable .cell[data-cell="plan"] {
    width: 94px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="fact"],
.table__tasks--row.relocatable .cell[data-cell="fact"] {
    width: 94px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="period"],
.table__tasks--row.relocatable .cell[data-cell="period"] {
    width: 138px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"],
.table__tasks--row.relocatable .cell[data-cell="status"] {
    width: 105px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="action"],
.table__tasks--row.relocatable .cell[data-cell="action"] {
    width: 229px;
    display: flex;
    justify-content: flex-end;
}

.table__tasks--group .table__tasks--row .cell .title,
.table__tasks--row.relocatable .cell .title {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    display:  inline;
}

.table__tasks--group .table__tasks--row .cell .title.able-to-edit {
    cursor:  pointer;
    border-bottom:  1px solid transparent;
}

.table__tasks--group .table__tasks--row .cell .title.able-to-edit:hover {
    border-bottom:  1px solid #262626;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title.able-to-edit,
.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title.able-to-edit:hover {
    border: 1px solid #F2F4F5;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title,
.table__tasks--row.relocatable .cell[data-cell="type"] .title {
    background: #FFFFFF;
    border: 1px solid #F2F4F5;
    box-sizing: border-box;
    border-radius: 3px;
    width: fit-content;
    padding: 2px 6px;
    font-family: 'SFProDisplayBold';
    font-size: 10px;
    line-height: 12px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title[data-type="DZN"],
.table__tasks--row.relocatable .cell[data-cell="type"] .title[data-type="DZN"] {
    color: #722ED1;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title[data-type="INT"],
.table__tasks--row.relocatable .cell[data-cell="type"] .title[data-type="INT"] {
    color: #09D0C4;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title[data-type="PRO"],
.table__tasks--row.relocatable .cell[data-cell="type"] .title[data-type="PRO"] {
    color: #595959;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title[data-type="HTML"],
.table__tasks--row.relocatable .cell[data-cell="type"] .title[data-type="HTML"] {
    color: #FA8C16;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title[data-type="SEO"],
.table__tasks--row.relocatable .cell[data-cell="type"] .title[data-type="SEO"] {
    color: #FA816E;
}

.table__tasks--group .table__tasks--row .cell[data-cell="type"] .title[data-type="DEV"],
.table__tasks--row.relocatable .cell[data-cell="type"] .title[data-type="DEV"] {
    color: #1890FF;
}

.table__tasks--group .table__tasks--row .cell[data-cell="title"] .table__inner--column,
.table__tasks--row.relocatable .cell[data-cell="title"] .table__inner--column {
    max-width: 80%;
}

.table__tasks--group .table__tasks--row .cell[data-cell="title"] .title,
.table__tasks--row.relocatable .cell[data-cell="title"] .title {
    display: inline;
}

.table__tasks--group .table__tasks--row .cell[data-cell="title"] .title.pre-edit {
    padding: 0px 10px 0 11px;
    font-size: 12px;
    line-height: 14px;
    display: block;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress {
    display: flex;
    position: relative;
    width: fit-content;
    cursor:  auto;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--hint,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--hint {
    position: absolute;
    top: -27px;
    left: 0;
    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.15));
    height: 20px;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    padding: 0 4px;
    display: none;
    align-items: center;
    white-space: nowrap;
    background: #FFFFFF;
    border-radius: 2px;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--hint:after {
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    position: absolute;
    bottom: -3px;
    left: 6px;
    background: #FFFFFF;
    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.15));
    transform: rotate(125deg);
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress:hover .status--hint {
    display:  flex;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .progress--step,
.table__tasks--row.relocatable .cell[data-cell="status"] .progress--step {
    background: #E0E0E0;
    border-radius: 2px;
    width: 6px;
    height: 6px;
    margin-right: 1px;
    display: block;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .progress--step:last-child,
.table__tasks--row.relocatable .cell[data-cell="status"] .progress--step:last-child {
    margin-right: 0;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="backlog"] .progress--step:nth-child(2),
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="backlog"] .progress--step:nth-child(2) {
    background: #6564C5;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="sprint"] .progress--step:nth-child(2),
.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="sprint"] .progress--step:nth-child(3),
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="sprint"] .progress--step:nth-child(2),
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="sprint"] .progress--step:nth-child(3) {
    background: #1890FF;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="test"] .progress--step:nth-child(2),
.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="test"] .progress--step:nth-child(3),
.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="test"] .progress--step:nth-child(4),
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="test"] .progress--step:nth-child(2),
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="test"] .progress--step:nth-child(3),
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="test"] .progress--step:nth-child(4) {
    background: #FA8C16;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="problem"] .progress--step,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="problem"] .progress--step  {
    background: #FF4D4F;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="completed"] .progress--step,
.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="approved"] .progress--step,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="completed"] .progress--step,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="approved"] .progress--step {
    background: #01D663;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="completed"] .progress--step:last-child,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="completed"] .progress--step:last-child {
    background: #E0E0E0;
}

.table__tasks--group .table__tasks--row .cell[data-cell="action"] button,
.table__tasks--row.relocatable .cell[data-cell="action"] button {
    display:  none;
    padding:  0 10px;
    height:  24px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 14px;
    margin-left: 5px;
    transition:  opacity .3s ease-out;
}

.table__tasks--group .table__tasks--row .cell[data-cell="action"] .task-urgent,
.table__tasks--row.relocatable .cell[data-cell="action"] .task-urgent {
    background: #F2F4F5;
    color: #9CA6B4;
}

.table__tasks--group .table__tasks--row .cell[data-cell="action"] .task-to-do,
.table__tasks--row.relocatable .cell[data-cell="action"] .task-to-do {
    color: #6564C5;
    background: #EAEAF7;
}

.table__tasks--group .table__tasks--row .cell[data-cell="action"] .to-approve,
.table__tasks--row.relocatable .cell[data-cell="action"] .to-approve {
    background: rgba(1, 180, 83, 0.1);
    color: #01B453;
}

.table__tasks--group .table__tasks--droppable[data-status="unplanned"] .cell[data-cell="action"] .task-urgent,
.table__tasks--group .table__tasks--droppable[data-status="unplanned"] .cell[data-cell="action"] .task-to-do,
.table__tasks--group .table__tasks--droppable[data-status="completed"] .cell[data-cell="action"] .to-approve,
.table__tasks--row[data-status="unplanned"].relocatable .cell[data-cell="action"] .task-urgent,
.table__tasks--row[data-status="unplanned"].relocatable .cell[data-cell="action"] .task-to-do,
.table__tasks--row[data-status="completed"].relocatable .cell[data-cell="action"] .to-approve {
    display:  block;
}

.table__tasks--group .table__tasks--row .cell[data-cell="action"] .table__inner--column,
.table__tasks--row.relocatable .cell[data-cell="action"] .table__inner--column {
    display:  flex;
    justify-content: flex-end;
    padding-right: 5px;
    width: fit-content;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="backlog"] .status--hint {
    color: #6564C5;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="sprint"] .status--hint {
    color: #1890FF;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="test"] .status--hint {
    color: #FA8C16;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="completed"] .status--hint,
.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="approved"] .status--hint {
    color: #01D663;
}

.table__tasks--group .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="completed"] .status--hint span {
    color: #9CA6B4;
    padding-left: 2px;
}

.table__tasks--droppable[data-status="problem"],
.table__tasks--row[data-status="problem"].relocatable {
    background: #FFF1F1;
}

.table__tasks--droppable[data-status="problem"] .table__tasks--row,
.table__tasks--group .table__tasks--droppable[data-status="problem"]:hover .table__tasks--row {
    border: 0;
}

.table__tasks--droppable .table__tasks--row .cell[data-cell="status"] .status--progress[data-progress="problem"] .status--hint,
.table__tasks--row.relocatable .cell[data-cell="status"] .status--progress[data-progress="problem"] .status--hint {
    position: absolute;
    top: -4px;
    display: flex;
    filter: none;
    height: auto;
    font-size: 12px;
    line-height: 14px;
    color: #FF4D4F;
    padding: 0;
    background: transparent;
    border-radius: 0;
    left: 40px;
}

.table__tasks--droppable[data-status="problem"] .table__tasks--row .cell[data-cell="status"] .status--hint:after {
    display:  none;
}

.table__tasks--wrap.previous-month .table__tasks--header .table__tasks--row {
    display:  none;
}

.table__tasks--group .table__tasks--row .cell[data-cell="title"] .changes,
.table__tasks--row.relocatable .cell[data-cell="title"] .changes {
    font-size: 10px;
    line-height: 15px;
    color: #9CA6B4;
    display: block;
    letter-spacing: 0.05em;
}

.table__tasks--wrap {
    -ms-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
}

.table__tasks--wrap .table__tasks--inner {
    overflow:  hidden;
    transition: height .3s ease-out;
    width: calc(100% + 20px);
    margin-left: -10px;
    padding: 0 10px;
}

.table__tasks--wrap.previous-month .table__tasks--inner {
    height:  0;
}

.table__tasks--wrap .table__tasks {
    margin-bottom: 24px;
    margin-top:  10px;
}

.table__tasks--wrap .table__tasks--wrap .table__tasks {
    margin-bottom: 0px;
    margin-top:  0px;
}

.table__tasks--group .table__tasks--empty {
    display: flex;
    height: 46px;
    align-items: center;
    padding: 0 5px;
    margin: 0 10px;
    border-top: 1px solid #F2F4F5;
    border-bottom: 1px solid #F2F4F5;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.table__tasks--group .table__tasks--empty.hidden {
    display:  none;
}

.table__tasks--group .table__tasks--empty button {
    font-size: 12px;
    line-height: 14px;
    color: #6564C5;
    margin-left: 10px;
    background: transparent;
    display:  none;
}

.content__main[data-content="group"] .table__tasks--group .table__tasks--empty button {
    display:  block;
}

.table__tasks--group[data-group="unplanned"] .table__tasks--empty button {
    display:  block;
}

.table__tasks--new {
    background: #FFFFFF;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 10%);
    border-radius: 4px;
    position:  relative;
}

.table__tasks--group .table__tasks--new .table__tasks--row {
    min-height: 48px;
    padding: 8px 0;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__list--container {
    position: absolute;
    top: 40px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 150px;
    border-radius: 5px;
    box-shadow: 0px 0px 20px rgb(37 38 45 / 10%);
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__list {
    border-radius: 4px;
    background: #FFFFFF;
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    padding: 5px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__list--item {
    padding: 7px 10px;
    border-radius: 2px;
    cursor: pointer;
    white-space: nowrap;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__list--item:hover {
    background: rgba(101, 100, 197, 0.1);
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__list--item.selected,
.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__list--item.selected:hover {
    background: rgba(101, 100, 197, 0.15);
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button {
    box-sizing: border-box;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'SFProDisplayBold';
    font-size: 10px;
    line-height: 12px;
    color: #FFFFFF;
    padding: 0 10px;
    height: 22px;
    width: fit-content;
    cursor:  pointer;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button[data-type="HTML"] {
    background: #FA8C16;
    border: 1px solid #FA8C16;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button[data-type="PRO"] {
    background: #595959;
    border: 1px solid #595959;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button[data-type="DZN"] {
    background: #722ED1;
    border: 1px solid #722ED1;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button[data-type="DEV"] {
    background: #1890FF;
    border: 1px solid #1890FF;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button[data-type="SEO"] {
    background: #FA816E;
    border: 1px solid #FA816E;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__button[data-type="INT"] {
    background: #09D0C4;
    border: 1px solid #09D0C4;
}

.table__tasks--group .table__tasks--new .cell[data-cell="title"] textarea {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    resize: none;
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    padding:  7px 10px;
    width:  100%;
    min-height:  28px;
    height: 28px;
    overflow: hidden;
}

.table__tasks--group .table__tasks--new textarea::-webkit-input-placeholder,
.table__tasks--group .table__tasks--new input::-webkit-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.table__tasks--group .table__tasks--new textarea::-moz-placeholder,
.table__tasks--group .table__tasks--new input::-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.table__tasks--group .table__tasks--new textarea:-ms-input-placeholder,
.table__tasks--group .table__tasks--new input:-ms-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.table__tasks--group .table__tasks--new textarea:-moz-placeholder,
.table__tasks--group .table__tasks--new input:-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.table__tasks--group .table__tasks--new .cell[data-cell="task"] {
    width: 69px;
    padding-left:  5px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] {
    width: 61px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="title"] {
    width: calc(100% - 800px);
}

.table__tasks--group .table__tasks--new .cell[data-cell="plan"] {
    width: 104px;
    padding-left: 10px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="fact"] {
    width: 84px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="period"] {
    width: 148px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="status"] {
    width: 105px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="action"] {
    width: 229px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="title"] .table__inner--column {
    line-height: 0;
}

.table__tasks--group .table__tasks--new input {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 7px 10px;
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    max-width: 90%;
    height: 28px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="plan"] input {
    width:  80px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="plan"] input:invalid,
.table__tasks--group .table__tasks--new .cell[data-cell="fact"] input:invalid,
.popup__row .plan__block label input:invalid {
    border: 1px solid #FF4D4F;
    color: #FF4D4F;
}

.table__tasks--group .table__tasks--new .cell[data-cell="period"] input {
    width: 110px;
    z-index: 2;
    position: relative;
    background:  transparent;
    cursor: pointer;
}

.table__tasks--group .table__tasks--new .cell[data-cell="period"] .table__inner--column {
    position:  relative;
}

.table__tasks--group .table__tasks--new .cell[data-cell="period"] .table__inner--column:after {
    content: url(../images/calendar_timesheet.svg);
    position: absolute;
    display: block;
    bottom: 2px;
    left: 87px;
    cursor: pointer;
    z-index: 0;
}

.table__tasks--group .table__tasks--new .cell[data-cell="action"] .table__inner--column {
    padding-right: 1px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="action"] button {
    display: block;
    padding: 0 15px;
    height: 28px;
    margin-left: 10px;
}

.table__tasks--group .table__tasks--new .cell[data-cell="action"] .task-cancel {
    color: #595959;
    background: #F2F4F5;
}

.table__tasks--group .table__tasks--new .cell[data-cell="action"] .task-save {
    display: block;
    background: #6564C5;
    color: #FFFFFF;
}

.table__tasks--group .table__tasks--new .cell[data-cell="action"] .task-save.disabled,
.popup__button .save.disabled {
    cursor: not-allowed;
}

.table__tasks--group .table__tasks--new .cell[data-cell="type"] .picker__wrap {
    padding-left: 10px;
}

.table__tasks--group .table__tasks--new .table__tasks--row .title.able-to-edit:hover {
    border-bottom: 1px solid transparent;
    cursor:  auto;
}

.table__tasks--wrap.previous-month .table__tasks--month .cell[data-cell="action"] .table__inner--column {
    justify-content: flex-end;
}

.table__tasks--wrap.previous-month .table__tasks--month .cell[data-cell="action"] .button--wrap {
    display:  none;
}

.invalid--field {
    position: absolute;
    background: #FFFFFF;
    border-radius: 2px;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    white-space: nowrap;
    padding: 3px 4px;
    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.15));
    left: 10px;
    top: -25px;
}

.popup__edit .invalid--field {
    left: 140px;
}

.popup__group .plan__block label .invalid--field {
    left: 0;
    top: -10px;
    z-index: 2;
}

.invalid--field:after {
    content: '';
    display: block;
    width: 5px;
    height: 5px;
    position: absolute;
    bottom: -3px;
    left: 6px;
    background: #FFFFFF;
    filter: drop-shadow(0px 2px 8px rgba(0, 0, 0, 0.15));
    transform: rotate(125deg);
}

.table__tasks--wrap.hidden {
    margin-bottom: 5px;
}

.content__main[data-content="group"] .table__tasks--row .cell[data-cell="period"] {
    width: 128px;
}

.content__main[data-content="group"] .table__tasks--row .cell[data-cell="status"] {
    width: 115px;
}

.content__main[data-content="group"] .table__tasks--wrap .table__tasks--inner {
    height: 0;
}

.content__main[data-content="group"] .table__tasks--wrap.hidden .table__tasks--inner {
    overflow:  hidden;
}

.content__main[data-content="group"] .table__tasks--wrap .table__tasks {
    margin-top: 0px;
}

.content__main[data-content="group"] .table__tasks--month .cell[data-cell="action"] .table__inner--column {
    justify-content:  flex-end;
}

.content__main[data-content="group"] .table__tasks--month .cell[data-cell="action"] .residue__mounth {
    margin-right: 20px;
}

.content__main[data-content="group"] .table__tasks--month .cell[data-cell="period"] {
    width: 128px;
}

.content__main[data-content="group"] .table__tasks--month .cell[data-cell="status"] {
    width: 170px;
}

.content__main[data-content="group"] .table__tasks--month .cell[data-cell="action"] {
    width: 184px;
}

.table__tasks--subgroup {
    margin: 20px 0 15px 0;
}

.table__tasks--block {
    flex-direction:  column;
}

.table__tasks--wrap.table__tasks--subgroup.move-from .table__tasks--block {
    position:  relative !important;
    opacity:  40%;
}

.table__tasks--block.relocatable {
    background: #FFFFFF;
    box-shadow: 0px 0px 8px rgb(0 0 0 / 10%);
    border-radius: 4px;
    width: calc(100% - 20px);
    border-top: 5px solid #FFFFFF;
}

.content__main[data-content="group"] .table__tasks--wrap.table__tasks--subgroup  .table__tasks--inner {
    height:  auto;
    transition: height 0s ease-out;
    overflow: visible;
}

.table__tasks--subgroup .table__tasks--header .table__tasks--month,
.content__main > .table__tasks--block .table__tasks--header .table__tasks--month {
    background: transparent;
    border-radius: 0;
    height: auto;
    margin-bottom: 8px;
}

.table__tasks--subgroup .table__tasks--month .cell[data-cell="title"],
.content__main > .table__tasks--block .table__tasks--month .cell[data-cell="title"] {
    width: 100%;
    padding-left: 0;
}

.table__tasks--subgroup .table__tasks--month .subgroup--title,
.content__main > .table__tasks--block .table__tasks--month .subgroup--title {
    display: block;
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    margin-right: 10px;
    padding-left: 15px;
    cursor: move;
}

.table__tasks--subgroup .table__tasks--month .add-task,
.content__main > .table__tasks--block .table__tasks--month .add-task {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F2F4F5;
    border-radius: 2px;
    width: 17px;
    height: 17px;
    background-image: url(../images/add-task-subgroup.svg);
    background-repeat: no-repeat;
    background-position: center;
}

.table__tasks--subgroup .table__tasks--droppable {
    position:  relative;
}

.table__tasks--subgroup .table__tasks--droppable.table__tasks--empty {
    margin-left: 0;
    padding-left: 15px;
}

.table__tasks--subgroup .table__tasks--droppable:before,
.table__tasks--subgroup .table__tasks--new:before,
.content__main > .table__tasks--block .table__tasks--droppable:before {
    content: '';
    display:  block;
    background: #6564C5;
    width:  2px;
    height:  100%;
    position:  absolute;
    left:  0;
    top: 0;
}

.content__main > .table__tasks--block .table__tasks--droppable {
    position:  relative;
}

.table__tasks--subgroup + .table__tasks--droppable .table__tasks--row {
    border-top: 1px solid transparent;
}

.table__tasks--subgroup .table__tasks--empty .add-task {
    width: auto;
}

.table__tasks--month .cell[data-cell="status"] .progress__block {
    width:  140px;
    padding: 3px;
    background: #FFFFFF;
    border-radius: 3px;
    position:  relative;
    height: 25px;
    display:  none;
}

.table__tasks--wrap.hidden .table__tasks--month .cell[data-cell="status"] .progress__block {
    display:  block;
}

.table__tasks--month .cell[data-cell="status"] progress {
    background: rgba(156, 166, 180, 0.25);
    border-radius: 3px;
    height: 19px;
    max-width: 100%;
}

.table__tasks--month .cell[data-cell="status"] progress::-webkit-progress-bar {
    background-color: #FFFFFF;
    border-radius: 3px;
}

.table__tasks--month .cell[data-cell="status"] progress::-webkit-progress-value {
    background: rgba(156, 166, 180, 0.25);
    border-radius: 3px;
}

.table__tasks--month .cell[data-cell="status"] progress::-moz-progress-bar {
    background: rgba(156, 166, 180, 0.25);
    border-radius: 3px;
}

.table__tasks--month .cell[data-cell="status"] .progress__block.in-process progress::-webkit-progress-value {
    background: rgba(1, 180, 83, 0.15);
}

.table__tasks--month .cell[data-cell="status"] .progress__block.in-process progress::-moz-progress-bar {
    background: rgba(1, 180, 83, 0.15);
}

.table__tasks--month .cell[data-cell="status"] .progress__block.problem progress::-webkit-progress-value {
    background: rgba(255, 77, 79, 0.15);
}

.table__tasks--month .cell[data-cell="status"] .progress__block.problem progress::-moz-progress-bar {
    background: rgba(255, 77, 79, 0.15);
}

.table__tasks--month .cell[data-cell="status"] .progress__block .progress-value {
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
    position:  absolute;
    top:  48%;
    transform: translate(-50%, -50%);
    left: calc(50%/2 + 3px);
}

.table__tasks--month .cell[data-cell="status"] .progress__block.in-process .progress-value {
    color: #01B453;
}

.table__tasks--month .cell[data-cell="status"] .progress__block.problem .progress-value {
    color: #FF4D4F;
}

.table__tasks--group .table__tasks--row .cell[data-cell="task"] .table__inner--column,
.table__tasks--row.relocatable .cell[data-cell="task"] .table__inner--column {
    width: fit-content;
}

.wrapper__shadow {
    display: none;
    content: '';
    background: #333333;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 10;
}

.wrapper__shadow.active {
    display: block;
}

.popup {
    position:  fixed;
    top:  50%;
    left:  -100%;
    transition:  opacity .3s ease-out;
    width:  390px;
    background: #FFFFFF;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 15px 20px 20px 20px;
    z-index: -1;
    opacity: 0;
}

.popup.active {
    left:  50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup__title {
    font-family: 'SFProDisplayMedium';
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    padding-bottom: 15px;
    border-bottom: 1px solid rgb(232 232 232 / 50%);
    margin-bottom: 12px;
}

.popup__button {
    display: flex;
    margin-top: 20px;
}

.popup__button button {
    border-radius: 5px;
    font-size: 12px;
    line-height: 14px;
    height:  38px;
    padding:  0 30px;
}

.popup__button .save,
.popup__button .time-add__save {
    background: #6564C5;
    margin-right:  15px;
    color: #FFFFFF;
}

.popup__button .cancel,
.popup__button .time-add__cancel {
    background: #F2F4F5;
    color: #595959;
}

.popup__row {
    display: flex;
}

.popup__row label span {
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
    display: block;
    margin-bottom: 5px;
}

.popup__row label input {
    max-width:  100%;
    width:  100%;
    background: transparent;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height:  38px;
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    padding: 0 10px;
    z-index: 1;
    position: relative;
}

.popup__row label input::-webkit-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__row label input::-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__row label input:-ms-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__row label input:-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__group .title__block {
    width: 100%;
    margin-bottom: 15px;
}

.popup__group .plan__block {
    width: 90px;
    margin-right: 15px;
}

.popup__group .plan__block label {
    position:  relative;
}

.popup__group .period__block {
    width: 105px;
    position:  relative;
}

.popup__group .period__block input {
    cursor:  pointer;
}

.popup__group .period__block:after {
    content: url(../images/calendar_timesheet.svg);
    position: absolute;
    display: block;
    bottom: 6px;
    right: 10px;
    cursor: pointer;
    z-index: 0;
}

.popup__group.subgroup .plan__block,
.popup__group.subgroup .period__block {
    display: none;
}

.popup__group.subgroup .title__block {
    margin-bottom: 0px;
}

.popup.popup__edit {
    top: 0;
    left: auto;
    right: -100%;
    transform: none;
    width: 570px;
    height: 100vh;
    box-shadow: 0px 0px 25px rgb(0 0 0 / 15%);
    padding: 30px 20px;
    opacity: 1 !important;
    transition:  right .3s ease-out;
    border-radius:  0;
    overflow: scroll;
}

.popup.popup__edit::-webkit-scrollbar {
    display:  none;
}

.popup.popup__edit::-webkit-scrollbar-track {
    display:  none;
}

.popup.popup__edit::-webkit-scrollbar-thumb {
    display:  none;
}

.popup.popup__edit.active {
    right:  0;
}

.popup__edit .title {
    font-family: 'SFProDisplayBold';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    display:  block;
}

.popup__task--block[data-edit="link"] {
    padding-left: 10px;
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    margin-bottom: 20px;
}

.popup__task--block[data-edit="link"] a.title {
    font-family: 'SFProDisplayMedium';
    font-size: 13px;
    line-height: 16px;
    color: #6564C5;
    border-bottom: 1px solid #6564C5;
    transition:  border .3s ease-out;
    width:  fit-content;
}

.popup__task--block[data-edit="link"] a.title:hover {
    border-bottom: 1px solid transparent;
}

.popup__task--block[data-edit="title"] {
    padding: 0 10px;
}

.popup__task--block[data-edit="title"]:hover {
    background: #F2F4F5;
    border-radius: 5px;
    padding: 10px;
    margin-top: -10px;
    margin-bottom: 10px;
    cursor: pointer;
}

.popup__task--block[data-edit="title"]:hover .title {
    margin-bottom:  0;
}

.popup__task--block[data-edit="title"] .title {
    font-family: 'SFProDisplayMedium';
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    margin-bottom:  20px;
}

.popup__edit .popup__button {
    display:  none;
}

.popup__task--block[data-edit="type"] {
    margin: 0 10px;
    display: flex;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid rgb(232 232 232 / 50%);
    border-top: 1px solid rgb(232 232 232 / 50%);
    margin-bottom: 20px;
}

.popup__task--block[data-edit="type"] .type__value {
    margin-left: 16px;
    display: flex;
    align-items: center;
}

.popup__task--block[data-edit="type"] .type__block {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px 6px;
    background: #FFFFFF;
    border: 1px solid #F2F4F5;
    box-sizing: border-box;
    border-radius: 3px;
    margin-right: 14px;
    font-size: 10px;
    line-height: 12px;
    font-family: 'SFProDisplayBold';
    cursor:  pointer;
    transition:  background .3s ease-out, border .3s ease-out;
}

.popup__task--block[data-edit="type"] .type__block[data-type="PRO"] {
    color: #595959;
}

.popup__task--block[data-edit="type"] .type__block[data-type="DZN"] {
    color: #722ED1;
}

.popup__task--block[data-edit="type"] .type__block[data-type="HTML"] {
    color: #FA8C16;
}

.popup__task--block[data-edit="type"] .type__block[data-type="DEV"] {
    color: #1890FF;
}

.popup__task--block[data-edit="type"] .type__block[data-type="INT"] {
    color: #09D0C4;
}

.popup__task--block[data-edit="type"] .type__block[data-type="SEO"] {
    color: #FA816E;
}

.popup__task--block[data-edit="type"] .type__block.active {
    color:  #FFFFFF;
    padding: 4px 9px;
}

.popup__task--block[data-edit="type"] .type__block:hover {
    color:  #FFFFFF;
}

.popup__task--block[data-edit="type"] .type__block[data-type="PRO"].active,
.popup__task--block[data-edit="type"] .type__block[data-type="PRO"]:hover {
    background: #595959;
    border:  1px solid #595959;
}

.popup__task--block[data-edit="type"] .type__block[data-type="DZN"].active,
.popup__task--block[data-edit="type"] .type__block[data-type="DZN"]:hover {
    background: #722ED1;
    border:  1px solid #722ED1;
}

.popup__task--block[data-edit="type"] .type__block[data-type="HTML"].active,
.popup__task--block[data-edit="type"] .type__block[data-type="HTML"]:hover {
    background: #FA8C16;
    border:  1px solid #FA8C16;
}

.popup__task--block[data-edit="type"] .type__block[data-type="DEV"].active,
.popup__task--block[data-edit="type"] .type__block[data-type="DEV"]:hover {
    background: #1890FF;
    border:  1px solid #1890FF;
}

.popup__task--block[data-edit="type"] .type__block[data-type="INT"].active,
.popup__task--block[data-edit="type"] .type__block[data-type="INT"]:hover {
    background: #09D0C4;
    border:  1px solid #09D0C4;
}

.popup__task--block[data-edit="type"] .type__block[data-type="SEO"].active,
.popup__task--block[data-edit="type"] .type__block[data-type="SEO"]:hover {
    background: #FA816E;
    border:  1px solid #FA816E;
}

.popup__task--block[data-edit="type"] .type__block:last-child {
    margin-right: 0;
}

.popup__task--block[data-edit="desc"] .title,
.popup__task--block[data-edit="result"] .title {
    margin-bottom:  10px;
}

.popup__task--block[data-edit="desc"] {
    border-bottom: 1px solid rgb(232 232 232 / 50%);
    padding-bottom:  20px;
    margin:  0 10px 11px 10px;
}

.popup__task--block[data-edit="desc"] pre,
.popup__task--block[data-edit="result"] pre {
    white-space: break-spaces;
}

.popup__task--block[data-edit="desc"].empty .text__wrap,
.popup__task--block[data-edit="result"].empty .text__wrap {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__task--block[data-edit="desc"] .text__wrap,
.popup__task--block[data-edit="result"] .text__wrap {
    padding: 10px;
    margin-top: -10px;
    margin-bottom: -10px;
    margin-left: -10px;
    width: calc(100% + 10px);
}

.popup__task--block[data-edit="desc"] .text__wrap:hover,
.popup__task--block[data-edit="result"] .text__wrap:hover {
    background: #F2F4F5;
    border-radius: 5px;
    cursor: pointer;
    margin-top: -10px;
    margin-bottom: -10px;
    margin-left: -10px;
    width: calc(100% + 10px);
}

.popup__task--block[data-edit="plan"],
.popup__task--block[data-edit="fact"],
.popup__task--block[data-edit="period"],
.popup__task--block[data-edit="task_tag"],
.popup__task--block[data-edit="task_link"],
.popup__task--block[data-edit="year"],
.popup__task--block[data-edit="month"] {
    display:  flex;
    align-items:  center;
    margin: 0 10px 15px 10px;
    position:  relative;
}

.popup__task--block[data-edit="plan"] .title,
.popup__task--block[data-edit="fact"] .title,
.popup__task--block[data-edit="period"] .title,
.popup__task--block[data-edit="task_tag"] .title,
.popup__task--block[data-edit="task_link"] .title,
.popup__task--block[data-edit="year"] .title,
.popup__task--block[data-edit="month"] .title {
    width:  110px;
    min-width: 110px;
    margin-right: 30px;
    white-space:  nowrap;
}

.popup__task--block[data-edit="plan"] .value,
.popup__task--block[data-edit="fact"] .value,
.popup__task--block[data-edit="period"] .value,
.popup__task--block[data-edit="task_tag"] .value,
.popup__task--block[data-edit="task_link"] .value,
.popup__task--block[data-edit="year"] .value,
.popup__task--block[data-edit="month"] .value {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F2F4F5;
    border: 1px solid #F2F4F5;
    box-sizing: border-box;
    border-radius: 3px;
    padding: 0 9px;
    height: 26px;
    font-size: 13px;
    line-height: 16px;
    color: #000000;
}

.popup__task--block[data-edit="task_link"] .value {
    max-width:  100%;
    overflow:  hidden;
    justify-content: flex-start;
}

.popup__task--block[data-edit="task_link"] .value a {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popup__task--block[data-edit="plan"] .value.able-to-edit:hover,
.popup__task--block[data-edit="fact"] .value.able-to-edit:hover,
.popup__task--block[data-edit="period"] .value.able-to-edit:hover,
.popup__task--block[data-edit="task_tag"] .value.able-to-edit:hover,
.popup__task--block[data-edit="task_link"] .value.able-to-edit:hover,
.popup__task--block[data-edit="year"] .value.able-to-edit:hover,
.popup__task--block[data-edit="month"] .value.able-to-edit:hover  {
    border-radius: 5px;
    width: 100%;
    justify-content: flex-start;
    cursor: pointer;
}

.popup__task--block[data-edit="result"] {
    padding-bottom:  20px;
    margin-left: 10px;
    margin-top: 18px;
}

.popup__task--block[data-edit="title"].edited {
    margin-top:  -10px;
    margin-right: 10px;
    line-height: 0;
}

.popup__task--block[data-edit="title"].edited:hover {
    background: transparent;
    padding: 0 0 0 10px;
    margin-bottom: 0;
    cursor: auto;
}

.popup__task--block[data-edit="title"].edited textarea {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    width: 100%;
    padding: 10px;
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    font-family: 'SFProDisplayMedium';
    resize: none;
    overflow: hidden;
    height: 41px;
}

.popup__task--block[data-edit="title"].edited .popup__button {
    margin-top:  10px;
    margin-bottom: 10px;
}

.popup__task--block.edited .popup__button {
    display:  flex;
    align-items:  center;
    margin-top: 0;
}

.popup__task--block.edited .popup__button button {
    border-radius: 5px;
    width:  26px;
    height:  26px;
    background-repeat: no-repeat;
    background-position: center center;
    padding: 0;
    font-size: 12px;
    line-height: 14px;
}

.popup__task--block.edited .popup__button .save {
    background-color: #6564C5;
    margin-right:  5px;
    background-image: url('../images/edit__Check.svg');
}

.popup__task--block.edited .popup__button .cancel--edit {
    background-color: #F2F4F5;
    border: 1px solid #F2F4F5;
    background-image: url('../images/edit__cancel.svg');
}

.popup__task--block[data-edit="desc"].edited textarea,
.popup__task--block[data-edit="result"].edited textarea {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 20px 20px 17px 20px;
    width: 100%;
    resize: none;
    min-height: 70px;
    overflow-y: hidden;
    font-weight: 300;
    font-size: 13px;
    line-height: 20px;
    font-family: 'SFProDisplayLight';
}

.popup__task--block[data-edit="desc"].edited .save,
.popup__task--block[data-edit="result"].edited .save {
    background-image: none;
    width: 88px;
    margin-right: 10px;
}

.popup__task--block[data-edit="desc"].edited .cancel--edit,
.popup__task--block[data-edit="result"].edited .cancel--edit {
    background-image: none;
    width: 72px;
    color: #595959;
}

.popup__task--block[data-edit="desc"].edited .popup__button,
.popup__task--block[data-edit="result"].edited .popup__button {
    margin-top: 8px;
}

.popup__task--block[data-edit="plan"].edited .popup__button,
.popup__task--block[data-edit="fact"].edited .popup__button,
.popup__task--block[data-edit="period"].edited .popup__button,
.popup__task--block[data-edit="task_tag"].edited .popup__button,
.popup__task--block[data-edit="year"].edited .popup__button,
.popup__task--block[data-edit="month"].edited .popup__button  {
    margin-left: 10px;
}

.popup__task--block[data-edit="plan"].edited input,
.popup__task--block[data-edit="fact"].edited input,
.popup__task--block[data-edit="period"].edited input,
.popup__task--block[data-edit="task_tag"].edited input,
.popup__task--block[data-edit="year"].edited input {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 5px 10px;
    height: 26px;
    font-size: 13px;
    line-height: 16px;
    display: flex;
    align-items: center;
    color: #000000;
    width: 100%;
}

.popup__task--block[data-edit="plan"].edited input::-webkit-input-placeholder,
.popup__task--block[data-edit="fact"].edited input::-webkit-input-placeholder,
.popup__task--block[data-edit="period"].edited input::-webkit-input-placeholder,
.popup__task--block[data-edit="task_tag"].edited input::-webkit-input-placeholder,
.popup__task--block[data-edit="year"].edited input::-webkit-input-placeholder  {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__task--block[data-edit="plan"].edited input::-moz-input-placeholder,
.popup__task--block[data-edit="fact"].edited input::-moz-input-placeholder,
.popup__task--block[data-edit="period"].edited input::-moz-input-placeholder,
.popup__task--block[data-edit="task_tag"].edited input::-moz-placeholder,
.popup__task--block[data-edit="year"].edited input::-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__task--block[data-edit="plan"].edited input:-ms-input-placeholder,
.popup__task--block[data-edit="fact"].edited input:-ms-input-placeholder,
.popup__task--block[data-edit="period"].edited input:-ms-input-placeholder,
.popup__task--block[data-edit="task_tag"].edited input:-ms-input-placeholder,
.popup__task--block[data-edit="year"].edited input:-ms-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__task--block[data-edit="plan"].edited input::-moz-input-placeholder,
.popup__task--block[data-edit="fact"].edited input::-moz-input-placeholder,
.popup__task--block[data-edit="period"].edited input::-moz-placeholder,
.popup__task--block[data-edit="task_tag"].edited input:-moz-placeholder,
.popup__task--block[data-edit="year"].edited input:-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__task--block[data-edit="plan"].edited input:invalid,
.popup__task--block[data-edit="fact"].edited input:invalid,
.popup__task--block[data-edit="period"].edited input:invalid,
.popup__task--block[data-edit="task_tag"].edited input:invalid,
.popup__task--block[data-edit="year"].edited input:invalid  {
    border: 1px solid #FF4D4F;
    color: #FF4D4F;
}

.popup__task--block[data-edit="month"].edited .picker__wrap {
    position:  relative;
    width:  100%;
}

.popup__task--block[data-edit="month"].edited .picker__button {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 5px 10px;
    height: 26px;
    font-size: 13px;
    line-height: 16px;
    display: flex;
    align-items: center;
    color: #000000;
    width: 100%;
    cursor:  pointer;
}

.popup__task--block[data-edit="month"].edited .picker__list--container {
    position: absolute;
    top: auto;
    margin-top: 5px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 100%;
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

.popup__task--block[data-edit="month"].edited .picker__list--wrap {
    padding: 5px;
    border: 1px solid rgb(234 237 241 / 70%);
    background: #FFFFFF;
    position: relative;
}

.popup__task--block[data-edit="month"].edited .picker__list {
    background: #FFFFFF;
    position: relative;
    top: 0;
    max-height: 195px;
    overflow-y: scroll;
    margin-bottom: 10px;
    padding-right: 2px;
}

.popup__task--block[data-edit="month"].edited .picker__list::-webkit-scrollbar {
    width: 3px;
}

.popup__task--block[data-edit="month"].edited .picker__list::-webkit-scrollbar-track {
    -webkit-border-radius: 2px;
    border-radius: 5px;
}

.popup__task--block[data-edit="month"].edited .picker__list::-webkit-scrollbar-thumb {
    opacity:1;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background: #9CA6B4;
    -webkit-box-shadow: none;
}

.popup__task--block[data-edit="month"].edited .picker__wrap.empty .picker__button--value {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__task--block[data-edit="month"].edited .picker__list--item {
    padding: 5px 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    border-radius: 2px;
    position: relative;
    margin-bottom: 5px;
}

.popup__task--block[data-edit="month"].edited .picker__list--item.selected,
.popup__task--block[data-edit="month"].edited .picker__list--item:hover {
    background:  #F2F4F5;
}

.popup__task--block[data-edit="period"].edited input {
    cursor:  pointer;
}

.popup__task--block[data-edit="period"].edited .clear__field {
    display: block;
    width: 16px;
    height: 16px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 73px;
    z-index: 2;
    background-image: url(../images/edit__cancel.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor:  pointer;
    padding:  4px;
}

.popup__task--checkbox {
    margin: 0 10px 15px 10px;
    position: relative;
    width: 100%;
    display: flex;
}

.popup__task--checkbox input {
    position: absolute;
    top: 0;
    opacity: 0;
}

.popup__task--checkbox label {
    font-family: 'SFProDisplayBold';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    display: flex;
    align-items: center;
    position: relative;
    margin-left: 0;
}

.popup__task--checkbox label span {
    width: 110px;
    min-width: 110px;
    margin-right: 30px;
    white-space: nowrap;
    display:  block;
    cursor:  pointer;
}

.popup__task--checkbox .custom-checkbox+label::after{
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #D9D9D9;
    border-radius: 2px;
    margin-right: 10px;
    float: left;
    background: #FFFFFF;
    box-sizing: border-box;
    cursor:  pointer;
}

.popup__task--checkbox .custom-checkbox:checked+label::after{
    border: 0;
    background-color: #6564C5;
    background-image: url(/local/templates/new_lk/images/filter_check.svg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.datepicker--cell.-current- {
    background: rgb(94 119 249 / 10%);
}

.template--droppable {
    height: 38px;
    opacity: 40%;
    border: 0;
    box-sizing: border-box;
    border-radius: 4px;
    position: relative;
    background: #F2F4F5;
}

.table__tasks--subgroup .template--droppable:before {
    content: '';
    display: block;
    background: #6564C5;
    width: 2px;
    height: calc(100% + 2px);
    position: absolute;
    left: -1px;
    top: -1px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="title"] {
    width: calc(100% - 600px);
    padding-left: 5px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] {
    width: 89px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] {
    width: 89px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] {
    width: 89px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="plan"] {
    width: 94px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="fact"] {
    width: 94px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="status"] {
    width: 145px;
}

.content__main[data-content="design"] .table__tasks--group .table__tasks--row {
    width: 100%;
    margin: 0;
    cursor: auto;
    border-radius: 4px;
}

.content__main[data-content="design"] .table__header .table__tasks--row {
    margin-bottom: 0;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"][data-status="approved"] .title,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"][data-status="approved"] .title,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"][data-status="approved"] .title {
    color: #01D663;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__wrap,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__wrap,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__wrap {
    width: 100%;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__button,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__button,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__button {
    width: 100%;
    display: flex;
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__button--value,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__button--value,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__button--value {
    border-bottom:  1px solid transparent;
    cursor:  pointer;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__button--value:hover,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__button--value:hover,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__button--value:hover {
    border-bottom:  1px solid #9CA6B4;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list--container,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list--container,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list--container {
    position: absolute;
    top: auto;
    margin-top: 5px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 320px;
    border-radius: 6px;
    box-shadow: 0px 0px 20px rgb(37 38 45 / 10%);
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list--wrap,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list--wrap,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list--wrap {
    background: #FFFFFF;
    position: relative;
    padding: 10px 5px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list {
    background: #FFFFFF;
    position: relative;
    top: 0;
    max-height: 295px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-right: 5px;
    margin-bottom: 10px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list--wrap.scroll-to-end .picker__list,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list--wrap.scroll-to-end .picker__list,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list--wrap.scroll-to-end .picker__list {
    padding-bottom: 5px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list::-webkit-scrollbar,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list::-webkit-scrollbar,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list::-webkit-scrollbar {
    width: 3px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list::-webkit-scrollbar-track,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list::-webkit-scrollbar-track,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list::-webkit-scrollbar-track {
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list::-webkit-scrollbar-thumb,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list::-webkit-scrollbar-thumb,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list::-webkit-scrollbar-thumb {
    opacity:1;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #E0E0E0;
    -webkit-box-shadow: none;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list--inner,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list--inner,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list--inner {
    display: flex;
    flex-direction: column;
    padding-right: 2px;
    position:  relative;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list input[type="checkbox"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list input[type="checkbox"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list input[type="checkbox"] {
    position: absolute;
    top: 0;
    opacity: 0;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list label,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list label,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list label {
    display: flex;
    position: relative;
    align-items: flex-start;
    cursor:  pointer;
    padding: 5px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list label:hover,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list label:hover,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list label:hover,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list label.selected,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list label.selected,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list label.selected {
    background: #f6f5f5;
    border-radius: 4px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--title,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--title,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--title {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    display: block;
    margin-left: 10px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img {
    background: #FFFFFF;
    border: 1px solid #F2F4F5;
    box-sizing: border-box;
    border-radius: 3px;
    width: fit-content;
    padding: 2px 6px;
    font-family: 'SFProDisplayBold';
    font-size: 10px;
    line-height: 12px;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img[data-type="DZN"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img[data-type="DZN"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img[data-type="DZN"] {
    color: #722ED1;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img[data-type="DEV"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img[data-type="DEV"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img[data-type="DEV"] {
    color: #1890FF;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img[data-type="HTML"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img[data-type="HTML"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img[data-type="HTML"] {
    color: #FA8C16;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img[data-type="INT"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img[data-type="INT"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img[data-type="INT"] {
    color: #09D0C4;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img[data-type="SEO"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img[data-type="SEO"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img[data-type="SEO"] {
    color: #FA816E;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--img[data-type="PRO"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--img[data-type="PRO"],
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--img[data-type="PRO"] {
    color: #595959;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--search,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--search,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--search {
    position: relative;
    width: 100%;
    background: transparent;
    z-index: 2;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 0px 5px;
    width: 100%;
    height: 28px;
    margin-bottom: 10px;
}

.content__main[data-content="design"] .table__tasks--wrap .table__tasks--inner {
    overflow: visible;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--search-line,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--search-line,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--search-line {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    width:  calc(100% - 25px);
    height: 100%;
    padding: 0;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--search-line::-moz-placeholder,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--search-line::-moz-placeholder,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--search-line::-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--search-line:-ms-input-placeholder,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--search-line:-ms-input-placeholder,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--search-line:-ms-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--search-line:-moz-placeholder,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--search-line:-moz-placeholder,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--search-line:-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list .picker__list--search-button,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list .picker__list--search-button,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list .picker__list--search-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    display: block;
    background-image: url(../images/search_grey.svg);
    background-repeat: no-repeat;
    background-position: 0;
    border: 0;
    padding: 0;
    width: 15px;
    height: 15px;
    cursor:  pointer;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] form,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] form,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] form {
    position:  relative;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list--wrap:after,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list--wrap:after,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list--wrap:after {
    content: '';
    display: block;
    position: absolute;
    top: 270px;
    left: 0;
    width: 305px;
    height: 35px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 46.88%, #FFFFFF 100%);
    z-index: 2;
}

.content__main[data-content="design"] .table__tasks--row .cell[data-cell="design"] .picker__list--wrap.scroll-to-end:after,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="html"] .picker__list--wrap.scroll-to-end:after,
.content__main[data-content="design"] .table__tasks--row .cell[data-cell="development"] .picker__list--wrap.scroll-to-end:after {
    display:  none;
}

.content__main[data-content="group"] .table__tasks--month .cell[data-cell="action"] .residue__mounth {
    margin-right:0;
}

main.authorization__wrap {
    height: 100%;
    min-height: 100vh;
    width: 100vw;
    background-image: url('/local/templates/new_lk/images/authorization_bg.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.authorization__wrap .container {
    padding: 20px;
    max-width: 840px;
    position: relative;
}

.authorization__inner {
    background: #6564C5;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.15);
    border-radius: 30px;
    position: relative;
    display: flex;
    justify-content: space-between;
    height: calc(100vh - 40px);
    min-height: 370px;
    max-height: 410px;
    top: -3px;
    min-width:  800px;
}

.authorization__left {
    width: calc(100% - 400px);
    padding: 0 120px;
    display: flex;
    align-items: center;
    background-image: url('/local/templates/new_lk/images/authorization_bg_mini.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: left;
    border-radius: 30px 0px 0px 30px;
}

.authorization__left p {
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    color: #FFFFFF;
    opacity: 0.8;
    padding-top:  15px;
    border-top: 1px solid rgb(255 255 255 / 20%);
    margin-top: 15px;
    position: relative;
    top: -4px;
}

.authorization__right {
    width: 400px;
    min-width: 400px;
    height: 100%;
    background: #FFFFFF;
    border-radius: 30px 30px 30px 0px;
    padding: 0 50px;
    position: relative;
    display: flex;
    align-items: center;
}

.authorization__right .form--title {
    font-size: 24px;
    line-height: 35px;
    color: #262626;
    margin-bottom: 20px;
    display: block;
    font-family: 'SFProDisplayBold';
}

.authorization__right form.error .form--title {
    margin-bottom: 5px;
}

.authorization__right .form--title .highlighted {
    color:  #6564C5;
}

.authorization__right form {
    width:  100%;
    position: relative;
    top: 1px;
}

.authorization__right form .error--title {
    display: none;
}

.authorization__right form.error .error--title {
    display: block;
    margin-bottom: 20px;
    font-family: 'SFProDisplayLight';
    font-size: 12px;
    line-height: 14px;
    color: #FF4D4F;
    margin-top: 5px;
}

.authorization__right label {
    width: 100%;
    display: block;
    position: relative;
    margin-bottom: 20px;
}

.authorization__right label span {
    display: block;
    font-size: 11px;
    line-height: 13px;
    color: #9CA6B4;
    margin-bottom: 2px;
}

.authorization__right label input {
    height: 45px;
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    color: #333333;
    padding: 0 10px;
}

.authorization__right form.error label input {
    border: 1px solid #FF4D4F;
}

.authorization__right label input::-webkit-input-placeholder {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    font-family: 'SFProDisplayLight';
}

.authorization__right label input::-moz-placeholder {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    font-family: 'SFProDisplayLight';
}

.authorization__right label input:-ms-input-placeholder {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    font-family: 'SFProDisplayLight';
}

.authorization__right input[type="submit"] {
    background: #6564C5;
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.016);
    border-radius: 5px;
    margin-bottom: 15px;
    margin-top: 30px;
    display: block;
    width: 100%;
    height: 45px;
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 22px;
    text-align: center;
    color: #FFFFFF;
    transition: opacity .3s ease-out;
    cursor: pointer;
}

.authorization__right input[type="submit"]:hover {
    opacity: 80%;
}

.authorization__right input[type="submit"]:active {
    opacity: 100%;
}

.authorization__right .form__policy {
    width: 100%;
    display: flex;
}

.authorization__right .form__policy input {
    position:  absolute;
    top:  0;
    opacity: 0;
}

.authorization__right .form__policy label {
    position: relative;
    margin-left: 0;
    font-family: 'SFProDisplayLight';
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    cursor: pointer;
    margin-bottom: 0;
    display: flex;
    align-items: center;
}

.authorization__right .custom-checkbox+label::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #D9D9D9;
    border-radius: 2px;
    margin-right: 10px;
    float: left;
    background: #FFFFFF;
    box-sizing: border-box;
}

.authorization__right .form__policy .custom-checkbox:checked+label::before {
    border: 0;
    background-color: #6564C5;;
    background-image: url('/local/templates/new_lk/images/filter_check.svg');
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.authorization__dev {
    font-size: 12px;
    line-height: 14px;
    color: #FFFFFF;
    opacity: 0.7;
    font-family: 'SFProDisplayLight';
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.container .authorization__dev {
    display:  none;
}

.authorization__dev a {
    font-family: 'SFProDisplayMedium';
    transition:  opacity .3s ease-out;
}

.authorization__dev a:hover {
    opacity: 80%;
}

.authorization__dev a:active {
    opacity:  100%;
}

.main__container--catalog .project__list {
    margin-top: 2px;
    display: flex;
    flex-wrap: wrap;
}

.main__container--catalog .project__list .project__block {
    display: flex;
    margin-bottom: 20px;
    width: calc(100%/3 - 40px/3);
    height: 270px;
    border-radius: 10px;
    position: relative;
    margin-right: 20px;
    overflow: hidden;
    flex-direction: column;
}

.main__container--catalog .project__list .project__block:hover .project__block--img:after {
    opacity: 0.7;
}

.main__container--catalog .project__list .project__block:hover .project__block--img img {
    transform: scale(1.1);
}

.main__container--catalog .project__list .project__block:nth-child(3n+3) {
    margin-right: 0;
}

.main__container--catalog .project__list .project__block .project__block--img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.main__container--catalog .project__list .project__block .project__block--img img {
    transition: transform .3s ease-out;
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.main__container--catalog .project__list .project__block .project__block--img:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(37, 38, 45, 0.49) 40.63%, #25262D 100%);
    width: 100%;
    height: 100%;
    transition: opacity .3s ease-out;
}

.main__container--catalog .project__list .project__block .project__block--label {
    display: flex;
    position: absolute;
    align-items: center;
    top: 10px;
    right: 10px;
    border-radius: 5px;
    padding: 5px 10px;
    color: #FFFFFF;
}

.main__container--catalog .project__list .project__block .project__block--label .value {
    font-family: 'SFProDisplayBold';
    font-size: 20px;
    line-height: 24px;
}

.main__container--catalog .project__list .project__block .project__block--label .title {
    font-size: 12px;
    line-height: 12px;
}

.main__container--catalog .project__list .project__block .project__block--label.red .title {
    padding-right: 5px;
}

.main__container--catalog .project__list .project__block .project__block--label.violet .title {
    padding-left: 5px;
}

.main__container--catalog .project__list .project__block .project__block--label.violet {
    background: #6564C5;
}

.main__container--catalog .project__list .project__block .project__block--label.red {
    background: #FF4D4F;
}

.main__container--catalog .project__list .project__block .project__block--title {
    display: block;
    font-family: 'SFProDisplayBold';
    font-size: 24px;
    line-height: 29px;
    color: #FFFFFF;
    margin: 165px 0 5px 20px;
    z-index: 1;
}

.main__container--catalog .project__list .project__block .project__block--type {
    padding: 5px 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    font-size: 12px;
    line-height: 14px;
    color: #FFFFFF;
    z-index: 2;
    margin-left: 20px;
    display: block;
    width: fit-content;
    width: -moz-fit-content;
}

.main__container--catalog .project__list .project__block .project__block--type.support {
    background: #6564C5;
}

.main__container--catalog .project__list .project__block .project__block--type.project {
    background: #FF4D4F;
}

.main__container--catalog .project__list .project__block .project__block--type.archieve {
    background: #9CA6B4;
}

.main__container--catalog .project__list .project__block object {
    z-index: 2;
}

.main__container--catalog .project__list .project__block .project__block--link {
    font-size: 14px;
    line-height: 17px;
    color: #FFFFFF;
    margin-left: 20px;
    z-index: 2;
    border-bottom: 1px solid #FFFFFF;
    transition: border .3s ease-out;
}

.main__container--catalog .project__list .project__block .project__block--link:hover {
    border-bottom: 1px solid transparent;
}

.main__container--catalog .project__list .project__block .project__block--link:active {
    border-bottom: 1px solid #FFFFFF;
}

.main__container--catalog .project__list .project__block.one-time .project__block--img:after {
    display: none;
}

.main__container--catalog .project__list .project__block.one-time {
    align-items: center;
}

.main__container--catalog .project__list .project__block.one-time .project__block--title {
    margin: 105px 0 9px 0px;
}

.main__container--catalog .project__list .project__block.one-time .project__block--type {
    margin-left: 0;
    background: rgba(255, 255, 255, 0.1);
}

.main__container--protocol .content__main {
    display: flex;
    justify-content: space-between;
}

.main__container--protocol .content__main--right {
    width: 320px;
    min-width: 320px;
    margin-left: 20px;
}

.main__container--protocol .content__main--list {
    width: calc(100% - 340px);
}

.main__container--protocol .content__main--protocol {
    background: #FFFFFF;
    border-radius: 10px;
    margin-bottom: 20px;
    padding: 30px;
    position: relative;
}

.main__container--protocol .content__main--protocol:last-child {
    margin-bottom: 0;
}

.main__container--protocol .protocol__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    margin-bottom: 7px;
}

.main__container--protocol .protocol__date {
    background: #EAEAF7;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #6564C5;
}

.main__container--protocol .protocol__button {
    display: flex;
    align-items: center;
    position: relative;
    justify-content: flex-end;
}

.main__container--protocol .edit-protocol {
    background: #F2F4F5;
    box-shadow: 0px 2px 0px rgb(0 0 0 / 2%);
    border-radius: 5px;
    padding: 7px 20px 6px 15px;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #6564C5;
    min-height: 27px;
}

.main__container--protocol .edit-protocol span {
    padding-left: 22px;
    position: relative;
}

.main__container--protocol .edit-protocol span:before {
    content: url('/local/templates/new_lk/images/edit_protocol.svg');
    position: absolute;
    top: 1px;
    left: 0px;
    display: block;
    width: 12px;
    height: 12px;
}

.main__container--protocol .protocol__publicate {
    position: absolute;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    right: 0;
    top: 37px;
}

.main__container--protocol .send-to-mail {
    background: #6564C5;
    border-radius: 5px;
    margin-left: 5px;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
    padding: 5px 15px;
    min-height: 27px;
}

.main__container--protocol .send-to-mail.active {
    background: #EAEAF7;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #6564C5;
    padding: 5px 15px 5px 10px;
    cursor: auto;
    opacity: 1;
}

.main__container--protocol .send-to-mail span {
    padding-left: 27px;
    position: relative;
}

.main__container--protocol .send-to-mail span:before {
    content: url('/local/templates/new_lk/images/letter_protocol.svg');
    position: absolute;
    top: -2px;
    left: 0px;
    display: block;
    width: 12px;
    height: 12px;
}

.main__container--protocol .send-to-mail.active span:before {
    content: url('/local/templates/new_lk/images/letter_protocol_send.svg');
}

.main__container--protocol .protocol__title {
    display: block;
    font-weight: 600;
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    margin-bottom: 15px;
    letter-spacing: 0.03em;
    max-width: 75%;
}

.main__container--protocol .protocol__content {
    max-height: 300px;
    overflow: hidden;
    transition: all .3s ease-out;
    position: relative;
}

.main__container--protocol .protocol__content--wrap {
    font-size: 13px;
    line-height: 17px;
    color: #262626;
    font-family: 'SFProDisplayLight';
}

.main__container--protocol .protocol__content--wrap pre {
    white-space: break-spaces;
}

.main__container--protocol .protocol__content:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0px;
    display: block;
    width: 100%;
    height: 74px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%);
}

.main__container--protocol .content__main--protocol.active .protocol__content:after,
.main__container--protocol .protocol__content.short_ver:after {
    display: none;
}

.main__container--protocol .protocol__content p {
    font-size: 13px;
    line-height: 17px;
    color: #262626;
    margin-bottom: 5px;
    font-family: 'SFProDisplayLight';
}

.main__container--protocol .protocol__content p b {
    font-weight: 600;
    letter-spacing: 0.02em;
}

.main__container--protocol .protocol__content ol {
    margin-bottom: 10px;
    counter-reset: item;
}

.main__container--protocol .protocol__content ol li:before {
    content: counter(item) ') ';
    counter-increment: item;
    font-size: 13px;
    line-height: 17px;
    color: #262626;
    float: left;
    padding-right: 2px;
    font-family: 'SFProDisplayLight';
}

.main__container--protocol .protocol__border {
    border-bottom: 1px solid #EAEDF1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
    top: -4px;
}

.main__container--protocol .content__main--protocol.active .protocol__border {
    top: 0px;
    margin-bottom: 15px;
}

.main__container--protocol .protocol__border--visibility {
    width: 50px;
    height: 21px;
    border: 1px solid #EAEDF1;
    border-bottom: 0;
    border-radius: 15px 15px 0 0;
    background: #FFFFFF;
    position: relative;
    bottom: -1px;
    position: relative;
    cursor: pointer;
}

.main__container--protocol .protocol__border--visibility:after {
    content: url('/local/templates/new_lk/images/arrow_up_violet.svg');
    position: absolute;
    bottom: -4px;
    left: 16px;
    display: block;
    width: 15px;
    height: 15px;
    transform: rotate(180deg);
}

.main__container--protocol .content__main--protocol.active .protocol__border--visibility:after {
    transform: rotate(0deg);
}

.main__container--protocol .protocol__participant {
    display: flex;
    align-items: flex-start;
    margin-top: 12px;
    margin-bottom: 20px;
}

.main__container--protocol .protocol__participant.empty p {
    color: #9CA6B4;
}

.main__container--protocol .protocol__participant span {
    font-weight: 600;
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    white-space: nowrap;
    margin-right: 15px;
    letter-spacing: 0.02em;
}

.main__container--protocol .protocol__participant p {
    font-weight: normal;
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-family: 'SFProDisplayLight';
}

.main__container--protocol .protocol__file {
    display: flex;
}

.main__container--protocol .protocol__file span {
    font-weight: 600;
    font-size: 13px;
    line-height: 16px;
    color: #000000;
    white-space: nowrap;
    letter-spacing: 0.02em;
}

.main__container--protocol .protocol__file--list {
    margin-left: 38px;
}

.main__container--protocol .protocol__file.empty .protocol__file--list {
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    font-family: 'SFProDisplayLight';
}

.main__container--protocol .protocol__file--item {
    font-size: 12px;
    line-height: 14px;
    color: #BFBFBF;
    font-family: 'SFProDisplayLight';
    margin-bottom: 10px;
    text-transform: uppercase;
}

.main__container--protocol .protocol__file--item:last-child {
    margin-bottom: 0;
}

.main__container--protocol .protocol__file--item a {
    color: #6564C5;
    position: relative;
    margin-left: 20px;
    padding-right: 2px;
    font-size: 13px;
    line-height: 16px;
    text-transform: none;
    border-bottom: 1px solid transparent;
}

.main__container--protocol .protocol__file--item a:hover {
    border-bottom: 1px solid #6564C5;
}

.main__container--protocol .protocol__file--item a:before {
    content: url('/local/templates/new_lk/images/file.svg');
    position: absolute;
    top: -2px;
    left: -20px;
    display: block;
    width: 15px;
    height: 18px;
}

.main__container--protocol .protocol__file--item span {
    font-size: 12px;
    line-height: 14px;
    font-family: 'SFProDisplayLight';
    text-transform: uppercase;
    color: #9CA6B4;
    font-weight: 300;
    letter-spacing: 0;
}

.main__container--protocol .protocol__nav {
    background: #FFFFFF;
    border-radius: 10px;
    padding: 10px;
    position: sticky;
    top: 10px;
    max-height: calc(100vh - 95px);
    overflow: hidden;
}

.main__container--protocol .protocol__nav.scrolled {
    max-height: calc(100vh - 20px);
}

.main__container--protocol .protocol__nav--wrap {
    max-height: calc(100vh - 95px);
}

.main__container--protocol .protocol__nav--wrap::-webkit-scrollbar {
    width: 5px;
}

.main__container--protocol .protocol__nav--wrap::-webkit-scrollbar-track {
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

.main__container--protocol .protocol__nav--wrap::-webkit-scrollbar-thumb {
    opacity:0.1;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #EAEAF7;
    background-color: #EAEAF7;
    -webkit-box-shadow: none;
}

.main__container--protocol .protocol__nav--wrap.scroll-active {
    overflow-y: scroll;
    position: static;
}

.main__container--protocol .protocol__nav--wrap.scroll-active:after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 45px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.79) 52.08%, #FFFFFF 92.19%);
    z-index: 2;
}

.main__container--protocol .protocol__nav--wrap.scroll-active.scroll-to-end:after {
    display: none;
}

.main__container--protocol .protocol__nav .protocol__link {
    display: block;
    width: 100%;
    border-radius: 5px;
    padding: 10px 0;
}

.main__container--protocol .protocol__nav--wrap.scroll-active .protocol__link {
    width: calc(100% - 13px);
}

.main__container--protocol .protocol__nav .protocol__link:hover,
.main__container--protocol .protocol__nav .protocol__link.active,
.main__container--protocol .protocol__nav .protocol__link.current {
    background: #EAEAF7;
}

.main__container--protocol .protocol__nav .protocol__link--content {
    padding: 0 10px;
    width: 100%;
    display: block;
    border-left: 2px solid #EAEAF7;
}

.main__container--protocol .protocol__nav .protocol__link:hover .protocol__link--content,
.main__container--protocol .protocol__nav .protocol__link.active .protocol__link--content,
.main__container--protocol .protocol__nav .protocol__link.current .protocol__link--content {
    border-left: 2px solid #6564C5;
}

.main__container--protocol .protocol__nav .protocol__link--title {
    font-size: 13px;
    line-height: 16px;
    margin-bottom: 5px;
    color: #262626;
    display: block;
}

.main__container--protocol .protocol__nav .protocol__link--subtitle {
    font-size: 12px;
    line-height: 14px;
    color: #BFBFBF;
    display: block;
}

.protocol__form {
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity .3s ease-out;
    width: 310px;
    background: #FFFFFF;
    box-shadow: 0px 0px 15px rgb(0 0 0 / 15%);
    border-radius: 4px;
    padding: 15px 20px;
    z-index: -1;
    opacity: 0;
}

.protocol__form.active,
.protocol__form--send.active {
    z-index: 11;
}

.protocol__form .protocol__form--title {
    display: block;
    font-size: 14px;
    line-height: 17px;
    color: #262626;
    margin-bottom: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.protocol__form input[type="email"] {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 38px;
    width: 100%;
    padding: 0 15px;
    color: #262626;
    font-size: 13px;
    line-height: 16px;
    font-family: 'SFProDisplayLight';
}


.protocol__form input[type="email"]::-webkit-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.protocol__form input[type="email"]::-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.protocol__form input[type="email"]:-ms-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.protocol__form input[type="email"]:-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.protocol__form .popup__button {
    margin-top: 15px;
}

.protocol__form .popup__button .send {
    background: #6564C5;
    border-radius: 5px;
    margin-right: 5px;
    width: 107px;
    height: 30px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
    padding: 0;
}

.protocol__form .popup__button .cancel {
    height: 30px;
    padding: 0;
    width: 92px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #6564C5;
}

.protocol__form--send {
    background: #FFFFFF;
    box-shadow: 0px 0px 15px rgb(0 0 0 / 15%);
    border-radius: 4px;
    padding: 22px 20px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    font-size: 14px;
    line-height: 17px;
    color: #262626;
    opacity: 0;
}

.protocol__form--send p {
    padding-left: 30px;
    position: relative;
}

.protocol__form--send p:before {
    content: url(/local/templates/new_lk/images/letter_protocol_send_big.svg);
    position: absolute;
    top: -2px;
    left: 0px;
    display: block;
    width: 12px;
    height: 12px;
}

.popup__protocol {
    position: fixed;
    top: 0;
    right: -100%;
    width: 670px;
    background: #FFFFFF;
    z-index: 11;
    height: 100vh;
    transition: right 400ms cubic-bezier(.6, .2, .4, 1);
}

.popup__protocol.active {
    right: 0;
}

.popup__protocol.active .popup__close {
    background: #FFFFFF;
    border-radius: 20px;
    width: 36px;
    height: 36px;
    background: #FFFFFF;
    position: absolute;
    top: 15px;
    left: -50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity .3s ease-out;
}

.popup__protocol.active .popup__close:after {
    content: url('/local/templates/new_lk/images/protocol_popup_close.svg');
    display: block;
    position: relative;
    top: 2px;
}

.popup__protocol .popup__protocol--header {
    height: 66px;
    background: #F2F4F5;
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 18px;
    line-height: 21px;
    color: #333333;
    font-family: 'SFProDisplayMedium';
    padding: 0 30px;
    letter-spacing: 0.02em;
}

.popup__protocol .popup__protocol--header .protocol--edit,
.popup__protocol.edit .popup__protocol--header .protocol--add {
    display: none;
}

.popup__protocol.edit .popup__protocol--header .protocol--edit {
    display: flex;
}

.popup__protocol .popup__protocol--body {
    height: calc(100vh - 66px);
    padding: 20px 30px;
    overflow: scroll;
}

.popup__protocol .popup__protocol--body form {
    padding-bottom: 62px;
}

.popup__protocol  .popup__protocol--buttons {
    width: calc(100% + 60px);
    margin-left: -30px;
    padding: 15px 30px;
    position: fixed;
    bottom: 0;
    z-index: 15;
    background: #FFFFFF;
    box-shadow: none;
    transition: box-shadow .3s ease-out;
}

.popup__protocol  .popup__protocol--buttons.shadow {
    box-shadow: 0px 0px 15px rgb(0 0 0 / 15%);
}

.popup__protocol  .popup__protocol--buttons button {
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.016);
    border-radius: 4px;
    padding: 8px 20px;
    font-size: 12px;
    line-height: 22px;
    font-family: 'SFProDisplay';
}

.popup__protocol  .popup__protocol--buttons .save {
    background: #6564C5;
    margin-right: 10px;
    color: #FFFFFF;
    font-size: 14px;
}

.popup__protocol  .popup__protocol--buttons .save .protocol--edit,
.popup__protocol.edit  .popup__protocol--buttons .save .protocol--add {
    display: none;
}

.popup__protocol.edit  .popup__protocol--buttons .save .protocol--edit {
    display: flex;
}

.popup__protocol  .popup__protocol--buttons .cancel {
    background: #F2F4F5;
    color: #6564C5;
}

.popup__protocol .popup__protocol--body label {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 20px;
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
}

.popup__protocol .popup__protocol--body label span {
    margin-bottom: 5px;
    position: relative;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"] {
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-weight: 600;
    position: relative;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"] span {
    letter-spacing: 0.02em;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"] .warning {
    display: none;
    font-weight: 300;
    font-size: 10px;
    line-height: 12px;
    text-align: right;
    color: #FF0000;
    position: absolute;
    top: 0;
    right: 0;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"].warning .warning {
    display: block;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"].warning input {
    border: 1px solid #FF0000;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"] input,
.popup__protocol .popup__protocol--body label[data-field="protocol_participant"] input {
    height: 41px;
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-family: 'SFProDisplay';
    text-overflow: ellipsis;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_name"] input {
    font-size: 14px;
    line-height: 17px;
    font-family: 'SFProDisplayMedium';
}

.popup__protocol .popup__protocol--body label input::-webkit-input-placeholder,
.popup__protocol .popup__protocol--body label textarea::-webkit-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__protocol .popup__protocol--body label input::-moz-placeholder,
.popup__protocol .popup__protocol--body label textarea::-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__protocol .popup__protocol--body label input:-ms-input-placeholder,
.popup__protocol .popup__protocol--body label textarea:-ms-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__protocol .popup__protocol--body label input:-moz-placeholder,
.popup__protocol .popup__protocol--body label textarea:-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_date"] {
    max-width: 130px;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_date"] input {
    background: transparent;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 38px;
    width: 130px;
    font-size: 13px;
    line-height: 16px;
    font-family: 'SFProDisplay';
    color: #262626;
    padding: 0 15px;
    cursor: pointer;
    position: relative;
    z-index: 99;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_date"] span:before {
    content: url('/local/templates/new_lk/images/protocol_popup_check.svg');
    display: block;
    position: absolute;
    top: 30px;
    left: 109px;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_descr"] textarea {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    width: 100%;
    min-height: 130px;
    height: 130px;
    overflow: scroll;
    resize: none;
    font-size: 13px;
    line-height: 16px;
    padding: 15px;
    color: #262626;
    font-family: 'SFProDisplay';
}

.popup__protocol .popup__protocol--body label[data-field="protocol_descr"] textarea::-webkit-scrollbar {
    display: none;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_descr"] textarea::-webkit-scrollbar-track {
    display: none;
}

.popup__protocol .popup__protocol--body label[data-field="protocol_descr"] textarea::-webkit-scrollbar-thumb {
    display: none;
}

.popup__protocol .popup__protocol--body .protocol__photo--wrap {
    margin-top: 24px;
}

.popup__protocol .popup__protocol--body .protocol__photo--title {
    font-family: 'SFProDisplay';
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
    margin-bottom: 5px;
    display: block;
}

.popup__protocol .popup__protocol--body .file-input-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    line-height: 0;
    font-size: 0;
}

.popup__protocol .popup__protocol--body .protocol__photo--inner {
    width: 100%;
}

.popup__protocol .popup__protocol--body .file-input--wrap {
    border: 1px dashed #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 79px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transition: background .3s ease-out;
}

.popup__protocol .popup__protocol--body .file-input--wrap .file-input--button {
    background: #6564C5;
    box-shadow: 0px 2px 0px rgb(0 0 0 / 2%);
    border-radius: 5px;
    width: 128px;
    height: 30px;
    margin-bottom: 5px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
    font-family: 'SFProDisplay';
}

.popup__protocol .popup__protocol--body .file-input--wrap .file-input--button span {
    padding-left: 22px;
    position: relative;
}

.popup__protocol .popup__protocol--body .file-input--wrap .file-input--button span:before {
    content: url('/local/templates/new_lk/images/upload_file-violet.svg');
    position: absolute;
    top: 0;
    left: 0;
}

.popup__protocol .popup__protocol--body .file-input--wrap .file-input--text {
    display: block;
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    font-family: 'SFProDisplay';
}

.popup__protocol .popup__protocol--body .protocol__photo--wrap .file__uploaded {
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    padding: 8px 10px;
    width: fit-content;
    width: -moz-fit-content;
}

.popup__protocol .popup__protocol--body .protocol__photo--wrap .file__uploaded--name {
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    margin: 0 5px;
}

.popup__protocol .popup__protocol--body .protocol__photo--wrap .file__uploaded--size {
    font-size: 10px;
    line-height: 12px;
    display: flex;
    align-items: center;
    color: #9CA6B4;
    margin-right: 10px;
}

.popup__protocol .popup__protocol--body .protocol__photo--wrap .file__uploaded--delete {
    background: #F2F4F5;
    box-shadow: 0px 2px 0px rgb(0 0 0 / 2%);
    border-radius: 20px;
    width: 13px;
    height: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity .3s ease-out;
    position: relative;
}

.popup__protocol .popup__protocol--body .protocol__photo--wrap .file__uploaded--delete:after {
    content: url('/local/templates/new_lk/images/upload_file-delete.svg');
    position: relative;
}

.popup__protocol .popup__protocol--body .protocol__participant {
    position: relative;
}

.popup__protocol .popup__protocol--body .protocol__participant > span {
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
    margin-bottom: 5px;
    position: relative;
}

.popup__protocol .popup__protocol--body .protocol__participant .picker__list--container {
    position: absolute;
    top: auto;
    margin-top: 5px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 300px;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0px 0px 20px rgb(37 38 45 / 10%);
}

.popup__protocol .popup__protocol--body .protocol__participant .picker__button {
    height: 41px;
    width: 100%;
    background: transparent;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 0 15px;
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-family: 'SFProDisplay';
    text-overflow: ellipsis;
    display: flex;
    align-items: center;
    z-index: 1;
    position: relative;
    cursor: pointer;
}

.popup__protocol .protocol__participant .picker__button.empty {
    color: #9CA6B4;
    font-family: 'SFProDisplayLight';
}

.popup__protocol .protocol__participant .picker__button .picker__button--value {
    display: none;
}

.popup__protocol .protocol__participant .picker__button.empty .picker__button--value {
    display: block;
}

.popup__protocol .protocol__participant .picker__list--wrap {
    padding: 5px;
}

.popup__protocol .protocol__participant .picker__list--wrap:after {
    content: '';
    display: block;
    position: absolute;
    top: calc(100% - 20px);
    left: 0;
    width: calc(100% - 15px);
    height: 20px;
    z-index: 2;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 46.88%, #FFFFFF 100%);
}

.popup__protocol .protocol__participant.manual .picker__list--wrap:after {
    display: none;
}

.popup__protocol .protocol__participant .picker__list--wrap.scroll-to-end:after {
    display: none;
}

.popup__protocol .protocol__participant .picker__manual--button {
    display: block;
}

.popup__protocol .protocol__participant.manual .picker__manual--button {
    display: none;
}

.popup__protocol .protocol__participant .picker__manual--button .manual-input {
    background: #6564C5;
    box-shadow: 0px 2px 0px rgb(0 0 0 / 2%);
    border-radius: 5px;
    width: 112px;
    height: 28px;
    margin-bottom: 5px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
    font-family: 'SFProDisplay';
}

.popup__protocol .protocol__participant .picker__manual--button > span {
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-family: 'SFProDisplay';
    display: block;
    margin-bottom: 5px;
}

.popup__protocol .protocol__participant .picker__manual--back {
    background: #F2F4F5;
    height: 36px;
    width: calc(100% + 10px);
    margin-left: -5px;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    align-items: center;
    padding: 0 10px;
    cursor: pointer;
    transition: opacity .3s ease-out;
    display: none;
}

.popup__protocol .protocol__participant.manual .picker__manual--back {
    display: flex;
}

.popup__protocol .protocol__participant  .picker__manual--back span {
    position: relative;
    padding-left: 22px;
}

.popup__protocol .protocol__participant  .picker__manual--back span:after {
    content: url(../images/arrow_down_grey.svg);
    position: absolute;
    top: -2px;
    left: -1px;
    transform: rotate(91deg);
}

.popup__protocol .protocol__participant .picker__wrap {
    position: relative;
}

.popup__protocol .protocol__participant .picker__wrap:after {
    content: url('/local/templates/new_lk/images/protocol_popup_check.svg');
    display: block;
    position: absolute;
    top: 13px;
    right: 10px;
    z-index: 0;
}

.popup__protocol .protocol__participant .picker__form--manual {
    display: none;
}

.popup__protocol .protocol__participant.manual .picker__form--manual {
    display: block;
    margin-bottom: 15px;
}

.popup__protocol .protocol__participant .picker__form--manual .form__manual--title {
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-family: 'SFProDisplayMedium';
    display: block;
    margin-bottom: 5px;
}

.popup__protocol .protocol__participant .picker__form--manual label {
    margin-bottom: 10px;
    position: relative;
}

.popup__protocol .protocol__participant .picker__form--manual label span {
    margin-bottom: 5px;
    position: relative;
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
}

.popup__protocol .protocol__participant .picker__form--manual label input {
    height: 38px;
    width: 100%;
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 0 10px;
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    font-family: 'SFProDisplay';
    text-overflow: ellipsis;
}

.popup__protocol .protocol__participant .picker__form--manual label.warning input {
    border: 1px solid #FF0000;
}

.popup__protocol .protocol__participant .picker__form--manual .picker__form--button-wrap {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.popup__protocol .protocol__participant .picker__form--manual .manual__form--button {
    display: flex;
    align-items: center;
}

.popup__protocol .protocol__participant .picker__form--manual .manual__form--button button {
    box-shadow: 0px 2px 0px rgb(0 0 0 / 2%);
    border-radius: 2px;
    height: 28px;
    font-size: 12px;
    line-height: 22px;
}

.popup__protocol .protocol__participant .picker__form--manual .manual__form--button .save {
    width: 81px;
    margin-right: 5px;
    background: #6564C5;
    font-weight: 500;
    color: #FFFFFF;
}

.popup__protocol .protocol__participant .picker__form--manual .manual__form--button .cancel {
    background: #F2F4F5;
    color: #6564C5;
    width: 63px;
    font-size: 12px;
    line-height: 22px;
}

.popup__protocol .protocol__participant .picker__form--manual .picker__form--button-wrap .clear-form {
    display: block;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    border-bottom: 1px solid #9CA6B4;
    transition: border .3s ease-out;
    cursor: pointer;
}

.popup__protocol .protocol__participant.manual .picker__list {
    display: none;
}

.popup__protocol .protocol__participant .picker__form--manual .picker__form--button-wrap .clear-form:hover {
    border-bottom: 1px solid transparent;
}

.popup__protocol .protocol__participant .picker__list {
    background: #ffffff;
    position: relative;
    top: 0;
    max-height: 270px;
    overflow-y: scroll;
    margin-bottom: 10px;
    padding-right: 5px;
}

.popup__protocol .protocol__participant .picker__list::-webkit-scrollbar {
    width: 4px;
}

.popup__protocol .protocol__participant .picker__list::-webkit-scrollbar-track {
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

.popup__protocol .protocol__participant .picker__list::-webkit-scrollbar-thumb {
    opacity:0.1;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #E8E8E8;
    -webkit-box-shadow: none;
}

.popup__protocol .protocol__participant .picker__list .picker__list--item {
    padding: 5px;
    display: flex;
    border-radius: 2px;
    align-items: center;
    cursor: pointer;
    transition: background .3s ease-out;
}

.popup__protocol .protocol__participant .picker__list .picker__list--item:hover {
    background: rgba(94, 119, 249, 0.15);
}

.popup__protocol .protocol__participant .picker__list .picker__list--item .item__img {
    width: 40px;
    height: 40px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #C4C4C4;
    border-radius: 5px;
    overflow: hidden;
}

.popup__protocol .protocol__participant .picker__list .picker__list--item .item__info {
    display: flex;
    flex-direction: column;
}

.popup__protocol .protocol__participant .picker__list .picker__list--item .item__title {
    font-size: 12px;
    line-height: 14px;
    color: #333333;
    margin-bottom: 2px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.popup__protocol .protocol__participant .picker__list .picker__list--item .item__subtitle {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.popup__protocol .protocol__participant .picker__button .picker__button--item {
    background: #6564C5;
    padding: 4px 3px 4px 6px;
    border-radius: 4px;
    color: #ffffff;
    margin-right: 7px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: auto;
    text-transform: capitalize;
}

.popup__protocol .protocol__participant .picker__button .picker__button--item .picker__item--delete {
    position: relative;
    margin-left: 5px;
    cursor: pointer;
    width: 15px;
    height: 15px;
}

.popup__protocol .protocol__participant .picker__button .picker__button--item .picker__item--delete div:first-child,
.popup__protocol .protocol__participant .picker__button .picker__button--item .picker__item--delete div:last-child {
    position: absolute;
    top: 8px;
    left: 2px;
    display: block;
    width: 10px;
    height: 1px;
    background: #FFFFFF;
    transform: rotate(135deg);
}

.popup__protocol .protocol__participant .picker__button .picker__button--item .picker__item--delete div:last-child {
    transform: rotate(45deg);
}

.popup__protocol .protocol__participant .picker__form--manual label .warning_hint {
    display: none;
}

.popup__protocol .protocol__participant .picker__form--manual label.warning .warning_hint {
    display: block;
    font-weight: 300;
    font-size: 10px;
    line-height: 12px;
    text-align: right;
    color: #FF0000;
    position: absolute;
    top: 0;
    right: 0;
}



.datepicker--buttons {
    display: flex;
    padding: 10px 14px;
}

.datepicker--buttons .apply {
    width: 84px;
    height: 28px;
    background: #6564C5;
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.016);
    border-radius: 2px;
    margin-right: 10px;
    font-weight: 500;
    font-size: 12px;
    line-height: 22px;
    color: #FFFFFF;
}

.datepicker--buttons .cancel {
    width: 63px;
    height: 28px;
    background: #F2F4F5;
    box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.016);
    border-radius: 2px;
    font-weight: normal;
    font-size: 12px;
    line-height: 22px;
    color: #6564C5;
}

.datepicker--buttons button {
    transition: opacity .3s ease-out;
}

.datepicker--buttons button:hover {
    opacity: 80%;
}

.datepicker--buttons button:active {
    opacity: 100%;
}

.datepicker--cell-day:hover,
.datepicker--cell.-selected-,
.datepicker--cell.-selected-.-current-{
    background: #6564C5 !important;
}

.main__container--team .team__wrap {
    display: flex;
    flex-wrap: wrap;
}

.main__container--team .team__wrap .team__block {
    width: calc(25% - 90px/4);
    margin-right: 30px;
    margin-bottom: 36px;
    height: 332px;
    height: 23.056vw;
    max-height: 402px;
    overflow: hidden;
    z-index: 1;
}
.main__container--team .team__wrap .team__block:hover {
    overflow: visible;
    z-index: 2;
}

.main__container--team .team__wrap .team__block:hover .team__block--inner:before {
    content: '';
    position: absolute;
    top: -10px;
    left: -10px;
    width: calc(100% + 20px);
    height: calc(100% + 20px);
    background: #FFFFFF;
    box-shadow: 0px 0px 20px rgba(37, 38, 45, 0.15);
    border-radius: 10px;
}


.main__container--team .team__wrap .team__block--inner {
    position: relative;
}

.main__container--team .team__wrap .team__block:nth-child(4n+4) {
    margin-right: 0;
}

.main__container--team .team__wrap .team__block--photo {
    position: relative;
    background: #C4C4C4;
    border-radius: 10px;
    overflow: hidden;
    line-height: 0;
    font-size: 0;
    z-index: 3;
    height: 280px;
    height: 19.445vw;
    max-height: 340px;
    overflow: hidden;
}

.main__container--team .team__wrap .team__block--photo img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.main__container--team .team__wrap .team__block--label {
    position: absolute;
    left: 10px;
    bottom: 10px;
    background: #6564C5;
    border-radius: 5px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
}

.main__container--team .team__wrap .team__block--name {
    display: block;
    font-weight: 600;
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    margin: 10px 0 5px 0;
    letter-spacing: 0.03em;
    z-index: 3;
    position: relative;
}

.main__container--team .team__wrap .team__block--phone {
    display: block;
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
    z-index: 3;
    position: relative;
}

.main__container--team .team__wrap  .team__block--button {
    background: #FFFFFF;
    display: flex;
    width: 100%;
    border-radius: 0 0 10px 10px;
    padding-top: 20px;
    z-index: 3;
    position: relative;
    padding-bottom: 4px;
    opacity: 0;
}
.main__container--team .team__wrap .team__block:hover  .team__block--button {
    opacity: 1;
}


.main__container--team .team__wrap  .team__block--button button {
    font-size: 13px;
    line-height: 16px;
    color: #6564C5;
    border-bottom: 1px solid #6564C5;
    background: #FFFFFF;
    transition: border .3s ease-out;
    margin-right: 10px;
    opacity: 1;
}

.main__container--team .team__wrap  .team__block--button button:hover {
    border-bottom: 1px solid transparent;
}

.main__container--team .team__wrap  .team__block--button button:active {
    border-bottom: 1px solid #6564C5;
}

.popup__delete--team {
    position: fixed;
    top: 50%;
    left: -100%;
    transition: opacity .3s ease-out;
    width: 360px;
    background: #FFFFFF;
    box-shadow: 0px 0px 15px rgb(0 0 0 / 15%);
    border-radius: 10px;
    padding: 25px 30px;
    z-index: -1;
    opacity: 0;
}

.popup__delete--team.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup__delete--team p {
    font-size: 14px;
    line-height: 17px;
    color: #333333;
    margin-bottom: 5px;
}

.popup__delete--team .team--title {
    display: block;
    font-weight: 600;
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    margin-bottom: 20px;
    letter-spacing: 0.03em;
}

.popup__delete--team  .delete {
    background: #EB5757;
    border-radius: 5px;
    width: 104px;
    height: 34px;
    margin-right: 10px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
}

.popup__delete--team .cancel {
    background: #F2F4F5;
    border-radius: 5px;
    width: 102px;
    height: 34px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #828282;
}

.popup__team {
    position: fixed;
    top: 50%;
    left: -100%;
    transition: opacity .3s ease-out;
    width: 485px;
    background: #FFFFFF;
    box-shadow: 0px 0px 15px rgb(0 0 0 / 15%);
    border-radius: 10px;
    padding: 15px 20px 20px 20px;
    z-index: -1;
    opacity: 0;
}

.popup__team.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup__team .popup__team--body {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.popup__team .popup__team--img {
    width: 125px;
    min-width: 125px;
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.popup__team .popup__team--form {
    width: calc(100% - 145px);
}

.popup__team .popup__team--header {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgb(232 232 232 / 50%);
}

.popup__team .popup__team--header .popup__team--title {
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    margin-right: 20px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.popup__team .popup__team--header .popup__team--title .team-edit,
.popup__team.edit .popup__team--header .popup__team--title .add-to-team {
    display: none;
}

.popup__team.edit .popup__team--header .popup__team--title .team-edit {
    display: block;
}

.popup__team .popup__team--header .popup__team--checkbox {
    position: relative;
    top: 1px;
    display: flex;
}

.popup__team.edit .popup__team--header .popup__team--checkbox {
    display: none;
}

.popup__team .popup__team--header .popup__team--checkbox input {
    position: absolute;
    top: 0;
    opacity: 0;
}

.popup__team .popup__team--header .popup__team--checkbox label {
    font-size: 12px;
    line-height: 16px;
    color: #262626;
    display: flex;
    align-items: center;
    position: relative;
    margin-left: 0;
}

.popup__team .popup__team--header .popup__team--checkbox label span {
    white-space: nowrap;
    display: block;
    cursor: pointer;
    padding-left: 26px;
}

.popup__team .popup__team--header .popup__team--checkbox label .custom-checkbox+span::after {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    flex-grow: 0;
    border: 1px solid #E8E8E8;
    border-radius: 2px;
    background: #FFFFFF;
    box-sizing: border-box;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
}

.popup__team .popup__team--header .popup__team--checkbox label .custom-checkbox:checked+span::after {
    border: 0;
    background-color: #5E77F9;
    background-image: url(/local/templates/new_lk/images/filter_check.svg);
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.popup__team .popup__team--body .popup__team--field > input {
    background: #FFFFFF;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 38px;
    padding: 0 15px;
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    font-family: 'SFProDisplay';
    width: 100%;
}

.popup__team .popup__team--body .popup__team--field > input::-webkit-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.popup__team .popup__team--body .popup__team--field > input::-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.popup__team .popup__team--body .popup__team--field > input:-ms-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.popup__team .popup__team--body .popup__team--field > input:-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.popup__team .popup__team--body .popup__team--field > input[type="tel"] {
    width: 150px;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"] > input,
.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"] > input,
.popup__team .popup__team--body[data-type="client"] .popup__team--field .picker__wrap {
    display: none;
}

.popup__team .popup__team--body .popup__team--field .field--title {
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
    margin-bottom: 5px;
}

.popup__team .popup__team--body .popup__team--field .field--warning {
    display: none;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .field--warning .stuff-client,
.popup__team .popup__team--body[data-type="client"] .popup__team--field .field--warning .stuff-team {
    display: none;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .field--warning .stuff-team,
.popup__team .popup__team--body[data-type="client"] .popup__team--field .field--warning .stuff-client {
    display: block;
}

.popup__team .popup__team--body .popup__team--field.warning .field--warning {
    display: block;
    font-weight: 300;
    font-size: 10px;
    line-height: 12px;
    text-align: right;
    color: #FF0000;
    position: absolute;
    top: 0;
    right: 0;
}

.popup__team .popup__team--body .popup__team--field {
    margin-bottom: 15px;
    position: relative;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .picker__button {
    position: relative;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .picker__button:after {
    content: url('../images/arrow_d_field-popuper.svg');
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    z-index: 0;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .sidemenu__project--info {
    background: transparent;
    cursor: pointer;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 38px;
    display: flex;
    align-items: center;
    padding: 0 15px;
    font-size: 12px;
    line-height: 14px;
    color: #262626;
    position: relative;
    z-index: 1;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .sidemenu__project--info.empty {
    color: #9CA6B4;
}

.popup__team .popup__team--body .popup__team--field.warning  .sidemenu__project--info,
.popup__team .popup__team--body .popup__team--field.warning > input {
    border: 1px solid #FF0000;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .picker__list--container {
    position: absolute;
    top: auto;
    margin-top: 5px;
    z-index: 2;
    max-height: 0;
    overflow: hidden;
    transition: all .3s ease-out;
    width: 300px;
    border-radius: 4px;
    box-shadow: 0px 0px 20px rgba(37, 38, 45, 0.1);
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .picker__list--wrap {
    padding: 10px 5px 10px 10px;
    background: #FFFFFF;
    position: relative;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"] .picker__list--wrap:after {
    content: '';
    display: block;
    position: absolute;
    top: calc(100% - 40px);
    left: 0;
    width: calc(100% - 15px);
    height: 20px;
    z-index: 2;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 46.88%, #FFFFFF 100%);
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field .picker__list--wrap.scroll-to-end:after {
    display: none;
}

.popup__team .popup__team--button {
    margin-top: 15px;
}

.popup__team .popup__team--button .save {
    background: #6564C5;
    border-radius: 5px;
    height: 38px;
    padding: 0 30px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
    margin-right: 10px;
}

.popup__team .popup__team--button .save .team-edit,
.popup__team.edit .popup__team--button .save .add-to-team {
    display: none;
}

.popup__team.edit .popup__team--button .save .team-edit {
    display: block;
}

.popup__team .popup__team--button .cancel {
    background: #F2F4F5;
    border-radius: 5px;
    height: 38px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #6564C5;
    padding: 0 30px;
}

.popup__team .popup__team--img .img__wrap {
    background: #C4C4C4;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 5px;
}

.popup__team .popup__team--img .img__wrap img {
    min-height: 100%;
    min-width: 100%;
    object-fit: cover;
}

.popup__team .popup__team--img span {
    font-size: 13px;
    line-height: 16px;
    color: #6564C5;
    border-bottom: 1px solid #6564C5;
    cursor: pointer;
    transition: border .3s ease-out;
}

.popup__team .popup__team--img span:hover {
    border-bottom: 1px solid transparent;
}

.popup__team .popup__team--img span:active {
    border-bottom: 1px solid #6564C5;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--img span {
    display: none;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"] .picker__list {
    background: #ffffff;
    position: relative;
    top: 0;
    max-height: 270px;
    overflow-y: scroll;
    margin-bottom: 10px;
    padding-right: 10px;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"] .picker__list {
    background: #ffffff;
    position: relative;
    top: 0;
    margin-bottom: 5px;
    padding: 5px;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"] .picker__list::-webkit-scrollbar {
    width: 4px;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"] .picker__list::-webkit-scrollbar-track {
    -webkit-border-radius: 2px;
    border-radius: 2px;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"] .picker__list::-webkit-scrollbar-thumb {
    opacity:0.1;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background: #E8E8E8;
    -webkit-box-shadow: none;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item {
    padding: 5px;
    display: flex;
    border-radius: 2px;
    align-items: center;
    cursor: pointer;
    transition: background .3s ease-out;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"]  .picker__list--item {
    padding: 7px 10px;
    display: flex;
    border-radius: 2px;
    align-items: center;
    cursor: pointer;
    transition: background .3s ease-out;
    font-size: 12px;
    line-height: 14px;
    color: #262626;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item:hover,
.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"]  .picker__list--item:hover {
    background: rgba(94, 119, 249, 0.15);
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item.selected,
.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item.selected:hover,
.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"]  .picker__list--item.selected,
.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"]  .picker__list--item.selected:hover {
    background: rgba(94, 119, 249, 0.25);
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-position"] .picker__list--wrap {
    padding: 0px;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item .item__img {
    width: 40px;
    height: 40px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #C4C4C4;
    border-radius: 5px;
    overflow: hidden;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item .item__info {
    display: flex;
    flex-direction: column;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item .item__title {
    font-size: 12px;
    line-height: 14px;
    color: #333333;
    margin-bottom: 2px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.popup__team .popup__team--body[data-type="team"] .popup__team--field[data-field="stuff-name"]  .picker__list--item .item__subtitle {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.main__container--kanban aside .sidemenu__item a,
.main__container--backlog aside .sidemenu__item a {
    display: flex;
    align-items: center;
}

.main__container--kanban aside .sidemenu__item a g,
.main__container--backlog aside .sidemenu__item a g {
    fill: #778192;
}

.main__container--kanban aside .sidemenu__item.active a g,
.main__container--backlog aside .sidemenu__item.active a g {
    fill: #FFFFFF;
}

.main__container--kanban aside .sidemenu__item a span,
.main__container--backlog aside .sidemenu__item a span {
    margin-left: 10px;
}

.main__container--kanban section {
    min-height: calc(100vh - 65px);
}

.main__container--kanban .content__main {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: calc(100vh - 105px);
}

.sprint__filter {
    margin: 30px 0 20px;
    display: flex;
    align-items: center;
}

.sprint__filter .sprint__participants {
    display: flex;
    align-items: center;
    margin-right: 20px;
}

.sprint__filter .sprint__participant {
    width: 40px;
    height: 40px;
    position: relative;
    margin-right: -10px;
    cursor: pointer;
    transition: transform 0.1s ease-out;
}

.sprint__filter .sprint__participant:hover {
    transform: translateY(-4px);
    z-index: 100;
}

.sprint__filter .sprint__participant input {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    opacity: 0;
}

.sprint__filter .sprint__participant .box {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sprint__filter .sprint__participant input:checked + .box {
    outline: 2px solid #6564C5;
}

.sprint__filter .sprint__participant .box__img {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EAEAF7;
    border: 2px solid #FFFFFF;
    border-radius: 50%;
    overflow: hidden;
}

.sprint__filter .sprint__participant .box__img img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.sprint__filter .only-my-tasks {
    background: #EAEAF7;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
    border-radius: 5px;
    padding: 7px 15px 6px 15px;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #6564C5;
    min-height: 36px;
    margin-right: 15px;
}

.sprint__filter .clear-filter {
    background: #F2F4F5;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02);
    border-radius: 5px;
    padding: 7px 15px 6px 15px;
    font-weight: normal;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #6564C5;
    min-height: 36px;
    margin-right: 15px;
    display: none;
}

.sprint__filter.clear-active .clear-filter {
    display: block;
}

.hovered {
    position: relative;
}

.hovered .hovered__text {
    display: none;
    position: absolute;
    bottom: -24px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 12px;
    line-height: 14px;
    color: #FFFFFF;
    padding: 2px 5px;
    background: #393A42;
    z-index: 101;
    white-space: nowrap;
    border-radius: 3px;
}

.hovered.hovered-active .hovered__text {
    display: block;
}

.kanban__wrap {
    height: 100%;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.kanban__wrap.scroll-view {
    overflow: scroll;
    width: calc(100% + 20px);
}

.kanban__wrap.scroll-view::-webkit-scrollbar {
    display: none;
}

.kanban__wrap.scroll-view::-webkit-scrollbar-track {
    display: none;
}

.kanban__wrap.scroll-view::-webkit-scrollbar-thumb {
    display: none;
}

.kanban__header {
    display: flex;
    align-items: center;
}

.kanban__wrap.scroll-view .kanban__header:after,
.kanban__wrap.scroll-view .kanban__body:after {
    content: '';
    position: relative;
    display: block;
    width: 20px;
    min-width: 20px;
    height: 20px;
    background: transparent;
}

.kanban__column {
    background: #F2F4F5;
    border-radius: 0 0 4px 4px;
    margin-right: 10px;
    width: 100%;
    padding: 0 5px 5px 5px;
    min-width: 170px;
}

.kanban__column:last-child {
    margin-right: 0;
}

.kanban__header .kanban__column {
    border-radius: 4px 4px 0 0;
    padding: 15px 10px;
    font-size: 14px;
    line-height: 17px;
    color: #5e6c84;
    font-family: 'SFProDisplayMedium';
    text-transform: uppercase;
    display: flex;
}

.kanban__header .kanban__column .title {
    margin-right: 5px;
}

.kanban__wrap.scroll-view .kanban__header .kanban__column .title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kanban__header .kanban__column .count {
    text-transform: none;
    white-space: nowrap;
    font-size: 13px;
}

.kanban__wrap.scroll-view .kanban__header .kanban__column .count {
    margin-left: auto;
}

.kanban__body {
    height: 100%;
    flex-grow: 1;
    display: flex;
}

.task__wrap {
    margin-bottom: 5px;
    position: relative;
}

.task__wrap:last-child {
    margin-bottom: 0;
}

.task {
    width: 100%;
    padding: 10px 10px 10px 13px;
    background: #FFFFFF;
    border-radius: 4px;
    position: relative;
    box-shadow: 0 3px 6px 0 rgba(9, 30, 66, 0.15);
    transition: background .2s ease-out;
    cursor: move;
}

.task:before {
    content: '';
    position: absolute;
    top: 10px;
    left: 5px;
    width: 3px;
    height: calc(100% - 20px);
    border-radius: 2px;
}

.task[data-priority="low"]:before {
    background-color: #F2F4F5;
}

.task[data-priority="medium"]:before {
    background-color: #00fa32;
}

.task[data-priority="high"]:before {
    background-color: #FF4D4F;
}

.task:hover {
    background: #ebecf0;
}

.task.task--cloned {
    opacity: 0.5;
}

.task * {
    user-select: none;
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.task .task__title {
    position: relative;
    margin-bottom: 10px;
}

.task .task__title p {
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.task .task__project {
    padding: 2px 5px;
    background: #F2F4F5;
    width: fit-content;
    width: -moz-fit-content;
    border-radius: 2px;
    margin-bottom: 10px;
}

.task .task__component,
.task .task__period {
    color: #5e6c84;
    font-size: 13px;
    margin-bottom: 3px;
    line-height: 15px;
}

.task .task__component.hovered .hovered__text,
.task .task__period.hovered .hovered__text {
    width: auto;
    white-space: nowrap;
    left: 0;
    transform: none;
}

.task .task__component.hovered .hovered__text:before,
.task .task__period.hovered .hovered__text:before {
    left: 20px;
    transform: none;
}

.task .task__period {
    margin-bottom: 10px;
}

.task .task__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.kanban__wrap.columns .task .task__bottom {
    flex-direction: column;
    align-items: flex-start;
}

.task .task__labels {
    display: flex;
    align-items: center;
}

.kanban__wrap.columns .task .task__labels {
    margin-bottom: 5px;
}

.task .task__priority {
    width: 16px;
    height: 16px;
    margin-right: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.task[data-priority="medium"] .task__priority {
    background: url('/upload/frontend/priority_medium.svg') no-repeat center center;
    background-size: contain;
}

.task[data-priority="low"] .task__priority {
    background: url('/upload/frontend/priority_low.svg') no-repeat center center;
    background-size: contain;
}

.task[data-priority="high"] .task__priority {
    background: url('/upload/frontend/priority_high.svg') no-repeat center center;
    background-size: contain;
}

.task .task__priority.hovered .hovered__text {
    width: auto;
    white-space: nowrap;
}

.task .task__time {
    background: #EAEAF7;
    padding: 2px 7px;
    border-radius: 5px;
    color: #6564C5;
    font-family: 'SFProDisplayMedium';
    font-size: 13px;
    line-height: 15px;
    white-space: nowrap;
}

.task .task__time.hovered .hovered__text {
    width: 150px;
    left: -20px;
    transform: none;
}

.task .task__time.hovered .hovered__text:before {
    left: 28px;
    transform: none;
    top: -5px;
}

.task .task__info {
    display: flex;
    align-items: center;
}

.kanban__wrap.columns .task .task__info {
    flex-direction: row-reverse;
}

.task .task__number {
    white-space: nowrap;
    font-size: 13px;
    line-height: 15px;
    margin-right: 5px;
}

.task .task__number.hovered .hovered__text {
    white-space: nowrap;
    width: auto;
}

.task .task__executor {
    width: 24px;
    height: 24px;
}

.kanban__wrap.columns .task .task__executor {
    margin-right: 5px;
}

.task .task__executor--avatar {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
}

.task .task__executor--avatar img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.task .task__executor.hovered .hovered__text {
    width: auto;
    white-space: nowrap;
}

.kanban__column:last-child .task .task__executor.hovered .hovered__text {
    left: auto;
    right: -10px;
    transform: none;
}

.kanban__wrap.columns .kanban__column:last-child .task .task__executor.hovered .hovered__text {
    left: 50%;
    transform: translateX(-50%);
    right: auto;
}

.kanban__column:last-child .task .task__executor.hovered .hovered__text:before {
    left: auto;
    transform: none;
    right: 16px;
}

.kanban__wrap.columns .kanban__column:last-child .task .task__executor.hovered .hovered__text:before {
    left: 50%;
    transform: translateX(-50%);
    right: auto;
}

.task .hovered .hovered__text {
    width: 100%;
    white-space: normal;
    padding: 3px 5px;
    top: calc(100% + 5px);
    bottom: auto;
}

.task .hovered .hovered__text:before {
    content: '';
    border: 5px solid transparent;
    border-bottom-color: #393A42;
    border-top-width: 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -5px;
}

.kanban__column.available_to_drop {
    background: #EAEAF7;
    outline: 2px dashed #6564C5;
}

.kanban__column.available_to_drop .task__wrap {
    display: none;
}

.popup__sprint-close {
    position: fixed;
    top: 50%;
    left: -100%;
    width: 450px;
    background: #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 15px 20px 20px 20px;
    z-index: -1;
    opacity: 0;
}

.popup__sprint-close.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup__sprint-close .sprint-close {
    background: #6564C5;
    margin-right: 15px;
    color: #FFFFFF;
}

.popup__sprint-close .popup__sprint--stats {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    margin-bottom: 10px;
}

.popup__sprint-close .popup__sprint--stats p:not(:last-child) {
    margin-bottom: 5px;
}

.popup__sprint-close .popup__sprint--stats b {
    font-family: 'SFProDisplayMedium';
}

.popup__sprint-close .popup__sprint--select > p {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    margin-bottom: 5px;
}

.popup__sprint-close .dropdown__wrap {
    width: 100%;
    position: relative;
}

.popup__sprint-close .dropdown__wrap > label {
    width: 100%;
    margin-bottom: 0;
    flex-direction: column;
    margin-right: 0;
    position: relative;
    display: flex;
}

.popup__sprint-close .dropdown__wrap > label:before {
    content: url(../images/arrow_down_grey.svg);
    position: absolute;
    top: 31px;
    right: 10px;
}

.popup__sprint-close .dropdown__wrap.active > label:before {
    top: 25px;
    transform: rotate(180deg);
}

.popup__sprint-close .dropdown__wrap > label .field--title {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    display: block;
    margin-bottom: 5px;
}

.popup__sprint-close .dropdown__wrap > label input {
    max-width: 100%;
    width: 100%;
    background: transparent;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 38px;
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    padding: 0 10px;
    z-index: 1;
    position: relative;
    cursor: pointer;
}

.popup__sprint-close .dropdown__wrap > label input::-webkit-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__sprint-close .dropdown__wrap > label input::-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__sprint-close .dropdown__wrap > label input:-ms-input-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__sprint-close .dropdown__wrap > label input:-moz-placeholder {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup__sprint-close .dropdown__list {
    position: absolute;
    top: 57px;
    left: 0;
    width: 100%;
    background: #ffffff;
    z-index: 2;
    box-shadow: 0 3px 10px rgba(35, 35, 35, 0.06);
    display: none;
    border-radius: 0 0 5px 5px;
    overflow: hidden;
}

.popup__sprint-close .dropdown__wrap.active .dropdown__list {
    display: block;
}

.popup__sprint-close .dropdown__list--inner {
    max-height: 250px;
    overflow: scroll;
    position: static;
}

.popup__sprint-close .dropdown__wrap.hidden .dropdown__list--inner:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 46.88%, #FFFFFF 100%);
    z-index: 2;
}

.popup__sprint-close .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after {
    display: none;
}

.popup__sprint-close .dropdown__list--inner::-webkit-scrollbar {
    display: none;
}

.popup__sprint-close .dropdown__list--inner::-webkit-scrollbar-track {
    display: none;
}

.popup__sprint-close .dropdown__list--inner::-webkit-scrollbar-thumb {
    display: none;
}

.popup__sprint-close .dropdown__list--row {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.popup__sprint-close .dropdown__list--row input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
}

.popup__sprint-close .dropdown__list--row .box {
    border: 0;
    border-bottom: 1px solid #F0F0F0;
    padding: 10px 15px;
    display: flex;
}

.popup__sprint-close .dropdown__list--row .box span {
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
}

.popup__sprint-close .dropdown__list--row:hover .box {
    background: #EAEAF7;
}

.popup__sprint-close .dropdown__list--row:hover .box span {
    color: #6564C5;
}

.popup__sprint-close .dropdown__list--row:hover input:checked + .box {
    background: #FFFFFF;
}

.popup__sprint-close .dropdown__list--row input:checked + .box span,

.popup__sprint-close .dropdown__list--row:hover input:checked + .box span{
    opacity: 0.5;
    color: #232323;
}

.sprint__wrap * {
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.main__container--backlog .sprint__filter {
    margin-top: 0;
}

.sprint__header {
    background: #F2F4F5;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    padding: 7px 15px;
}

.sprint.available .sprint__header {
    outline: 2px dashed #6564C5;
}

.sprint__header--left {
    display: flex;
}

.sprint__header--left .sprint__switch {
    width: 13px;
    min-width: 13px;
    height: 13px;
    margin-right: 10px;
    border: 1px solid #595959;
    box-sizing: border-box;
    border-radius: 2px;
    background-image: url(../images/month-switch-open.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
}

.sprint-opened .sprint__header--left .sprint__switch {
    background-image: url(../images/month-switch-close.svg);
}

.sprint__header--left .sprint__title {
    font-size: 14px;
    line-height: 16px;
    font-family: 'SFProDisplayBold';
    color: #262626;
    margin-right: 10px;
}

.sprint__header--left .sprint__tasks {
    color: #9CA6B4;
    font-size: 14px;
    line-height: 16px;
    font-family: 'SFProDisplay';
}

.sprint .run-sprint {
    background: #6564C5;
    border-radius: 5px;
    padding: 10px 15px;
    font-weight: normal;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
}

.sprint .run-sprint:disabled {
    opacity: 0.6;
    cursor: auto;
}

.sprint.current .run-sprint {
    display: none;
}

.sprint__body--inner {
    padding: 10px 0 5px 0;
}

.sprint__body--info {
    display: flex;
    margin-bottom: 10px;
    align-items: center;
    padding: 0 15px;
}

.sprint.filter-empty .sprint__body--info,
.sprint.empty .sprint__body--info {
    margin-bottom: 0;
}

.sprint__body--participants {
    display: flex;
    margin-right: 10px;
}

.sprint__body--participants:empty {
    margin-right: 0;
}

.sprint__body--participant {
    width: 25px;
    height: 25px;
    margin-right: 7px;
}

.sprint__body--participant:last-child {
    margin-right: 0;
}

.sprint__body--participant .sprint__avatar {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sprint__body--participant .sprint__avatar img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.sprint__body--participant .hovered__text {
    top: calc(100% + 5px);
    bottom: auto;
    padding: 5px;
}

.sprint__body--participant .hovered__text .hovered__text--row {
    display: flex;
    margin-bottom: 6px;
}

.sprint__body--participant .hovered__text .hovered__text--row:last-child {
    margin-bottom: 0;
}

.sprint__body--participant .hovered__text--row .title {
    white-space: nowrap;
}

.sprint__body--participant .hovered__text--row .value {
    white-space: nowrap;
    margin-left: 10px;
    font-family: 'SFProDisplayBold';
}

.sprint__body--participant.hovered-active .hovered__text:before {
    content: '';
    border: 5px solid transparent;
    border-bottom-color: #393A42;
    border-top-width: 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -5px;
}

.sprint__body--info .open-sprint-info {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EAEAF7;
    transition: background .3s ease-out;
}

.sprint__body--info .open-sprint-info:hover {
    background: transparent;
}

.sprint__body--info .open-sprint-info div {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 2px;
    background: #6564C5;
}

.sprint__body--info .open-sprint-info div:last-child {
    margin-right: 0;
}

.sprint.empty .sprint__body--info .open-sprint-info,
.sprint.filter-empty .sprint__body--info .open-sprint-info {
    display: none;
}

.sprint__task--wrap {
    padding: 0 15px;
    border-radius: 4px;
    transition: box-shadow .3s ease-out;
}

.sprint__task--wrap:hover {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

.sprint__task--wrap.template {
    opacity: 40%;
    border: 0;
    box-sizing: border-box;
    border-radius: 4px;
    position: relative;
    background: #F2F4F5;
    margin: 0 15px;
}

.sprint__task--wrap.template + .sprint__task--wrap .sprint__task {
    border-top: 1px solid transparent;
}

.sprint__task {
    border-top: 1px solid #F2F4F5;
    min-height: 52px;
    height: auto;
    padding: 5px 0 5px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: move;
    position: relative;
}

.content__main > .sprint__task {
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
    background: #FFFFFF;
}

.sprint__task.task--cloned {
    opacity: 0.5;
}

.sprint__task:before {
    content: '';
    position: absolute;
    top: 3px;
    left: 1px;
    width: 2px;
    height: calc(100% - 6px);
    border-radius: 2px;
}

.sprint__task[data-priority="low"]:before {
    background-color: #F2F4F5;
}

.sprint__task[data-priority="medium"]:before {
    background-color: #00fa32;
}

.sprint__task[data-priority="high"]:before {
    background-color: #FF4D4F;
}

.sprint__task--left {
    padding-right: 20px;
}

.sprint__task--wrap:last-child .sprint__task {
    border-bottom: 1px solid #F2F4F5;
}

.sprint__task--wrap:hover .sprint__task,
.sprint__task--wrap:hover + .sprint__task--wrap .sprint__task {
    border-top: 1px solid transparent;
}

.sprint__task--left .title {
    font-family: 'SFProDisplayLight';
    font-size: 13px;
    line-height: 16px;
    color: #262626;
    margin-bottom: 10px;
}

.sprint__task--bottom {
    display: flex;
    align-items: center;
    font-size: 12px;
    line-height: 15px;
    color: #9CA6B4;
}

.sprint__task--bottom .separator {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    overflow: hidden;
    background: #6564C5;
    margin: 0 6px;
}

.sprint__task--right {
    display: flex;
    align-items: center;
}

.sprint__task--project {
    padding: 2px 5px;
    background: #F2F4F5;
    width: fit-content;
    width: -moz-fit-content;
    border-radius: 2px;
    margin-right: 10px;
    white-space: nowrap;
    font-size: 13px;
    line-height: 15px;
}

.sprint__task--executor {
    margin-right: 10px;
}

.sprint__task--executor .task__executor--avatar {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
}

.sprint__task--executor .task__executor--avatar img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.sprint__task--number {
    white-space: nowrap;
    font-size: 13px;
    line-height: 15px;
    margin-right: 10px;
}

.sprint__task--number.test {
    text-decoration: line-through;
}

.sprint__task--priority {
    width: 16px;
    height: 16px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sprint__task[data-priority="low"] .sprint__task--priority {
    background: url(/upload/frontend/priority_low.svg) no-repeat center center;
    background-size: contain;
}

.sprint__task[data-priority="medium"] .sprint__task--priority {
    background: url(/upload/frontend/priority_medium.svg) no-repeat center center;
    background-size: contain;
}

.sprint__task[data-priority="high"] .sprint__task--priority {
    background: url(/upload/frontend/priority_high.svg) no-repeat center center;
    background-size: contain;
}

.sprint__task--time {
    background: #EAEAF7;
    padding: 2px 7px;
    border-radius: 5px;
    color: #6564C5;
    font-family: 'SFProDisplayMedium';
    font-size: 13px;
    line-height: 15px;
    white-space: nowrap;
}

.sprint.empty .sprint__list--empty,
.sprint.filter-empty .sprint__filter--empty {
    display: flex;
    height: 46px;
    align-items: center;
    margin: 0 15px;
    border-top: 1px solid #F2F4F5;
    border-bottom: 1px solid #F2F4F5;
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
}

.sprint.empty .sprint__list--empty.available,
.sprint.filter-empty .sprint__filter--empty.available {
    background: #EAEAF7;
    outline: 2px dashed #6564C5;
    margin: 0;
    padding: 0 15px;
}

.sprint__body {
    overflow-y: clip;
    transition: height .3s ease-out;
    padding: 0 10px;
    width: calc(100% + 20px);
    margin-left: -10px;
}

.sprint:not(.sprint-opened) .sprint__body {
    height: 0;
}

.sprint {
    margin-bottom: 5px;
}

.sprint.sprint-opened {
    margin-bottom: 35px;
}

.sprint__wrap:last-child .sprint {
    margin-bottom: 0;
}

.popup__sprint--info {
    position: fixed;
    top: 50%;
    left: -100%;
    width: 540px;
    background: #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 15px 20px 20px 20px;
    z-index: -1;
    opacity: 0;
}

.popup__sprint--info.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup__sprint--info .popup__title {
    border-bottom: 0;
    margin-bottom: 20px;
    padding-bottom: 0;
}

.popup__sprint--info .popup__button .cancel {
    background: #6564C5;
    color: #FFFFFF;
}

.popup__sprint--info .load__table--header {
    display: flex;
    margin-bottom: 6px;
}

.popup__sprint--info .load__table--header .title {
    color: #9CA6B4;
    font-size: 13px;
    line-height: 16px;
    font-family: 'SFProDisplayLight';
}

.popup__sprint--info .load__table--cell[data-cell='executor'] {
    width: 250px;
}

.popup__sprint--info .load__table--cell[data-cell='task'] {
    width: 100px;
    text-align: center;
}

.popup__sprint--info .load__table--cell[data-cell='estimate'] {
    width: 150px;
    text-align: right;
}

.popup__sprint--info .load__table--row {
    border-top: 1px solid #F2F4F5;
    padding: 5px 0;
    display: flex;
    align-items: center;
    position: relative;
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
}

.popup__sprint--info .load__table--row:last-child {
    border-bottom: 1px solid #F2F4F5;
}

.popup__sprint--info .load__table--row .load__table--cell[data-cell='executor'] {
    display: flex;
    align-items: center;
    padding-right: 15px;
}

.popup__sprint--info .load__table--img {
    width: 32px;
    min-width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

.popup__sprint--info .load__table--img img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.popup__sprint--info .load__table--row .load__table--cell[data-cell='executor'] .title {
    font-family: 'SFProDisplay';
}

.popup__sprint--info .load__table--footer {
    display: flex;
    margin-top: 10px;
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
}

.sprint__task .hovered .hovered__text {
    bottom: auto;
    top: calc(100% + 5px);
}

.sprint__task .hovered .hovered__text:before {
    content: '';
    border: 5px solid transparent;
    border-bottom-color: #393A42;
    border-top-width: 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -5px;
}

.sprint__task .sprint__task--time .hovered__text {
    right: 0;
    transform: none;
    left: auto;
}

.sprint__task .sprint__task--time .hovered__text:before {
    left: auto;
    transform: none;
    right: 8px;
}

.sprint__task--wrap:last-child .hovered__text {
    top: auto;
    bottom: calc(100% + 5px);
}

.sprint__task--wrap:last-child .hovered__text:before {
    transform: translateX(-50%) rotate(180deg);
    top: auto;
    bottom: -5px;
}

.popup__sprint--run {
    position: fixed;
    top: 50%;
    left: -100%;
    width: 540px;
    background: #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 15px 20px 20px 20px;
    z-index: -1;
    opacity: 0;
}

.popup__sprint--run.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup__sprint--run .popup__sprint--text {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    margin-bottom: 10px;
}

.popup__sprint--run .popup__sprint--text b {
    font-family: 'SFProDisplayMedium';
}

.popup__sprint--run .popup__sprint--field {
    width: 100%;
    position: relative;
}

.popup__sprint--run .popup__sprint--field label {
    width: 100%;
}

.popup__sprint--run .popup__sprint--field label span:not(.box) {
    font-size: 12px;
    line-height: 14px;
    color: #9CA6B4;
    display: block;
    margin-bottom: 5px;
}

.popup__sprint--run .popup__sprint--field label .box {
    display: block;
}

.popup__sprint--run .popup__sprint--field label input {
    max-width: 100%;
    width: 100%;
    background: transparent;
    border: 1px solid #EAEDF1;
    box-sizing: border-box;
    border-radius: 5px;
    height: 38px;
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    padding: 0 10px;
    z-index: 1;
    position: relative;
}

.popup__sprint--run .popup__sprint--field label input.warning {
    border: 1px solid rgb(255, 0, 0);
}

.popup__sprint--run .popup__sprint--row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0;
}

.popup__sprint--run .popup__sprint--row .popup__sprint--field {
    width: calc(50% - 5px);
}

.popup__sprint--run .popup__sprint--row input {
    cursor: pointer;
}

.popup__sprint--run .sprint-run {
    background: #6564C5;
    margin-right: 15px;
    color: #FFFFFF;
}

.popup__sprint--run .popup__sprint--row .popup__sprint--field label .box:before {
    content: '';
    position: absolute;
    right: 5px;
    top: 28px;
    background: url('../images/calendar_timesheet.svg') no-repeat center center;
    background-size: contain;
    width: 20px;
    height: 20px;
    z-index: 0;
}

.popup-task {
    position: fixed;
    top: 50%;
    left: -100%;
    max-width: calc(100vw - 300px);
    width: 1280px;
    background: #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 20px 20px 30px 20px;
    z-index: -1;
    opacity: 0;
}

.popup-task.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 11;
}

.popup-task__header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.popup-task__path {
    color: #5e6c84;
    font-size: 14px;
    line-height: 16px;
    margin-right: auto;
}

.popup-task__path .separator {
    padding: 0 3px;
    position: relative;
    top: -1px;
}

.popup-task__close {
    width: 15px;
    height: 15px;
    background: transparent url('../images/edit__cancel.svg') no-repeat center center;
    background-size: 15px;
    position: relative;
    cursor: pointer;
}

.popup-task__close:before {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border-radius: 5px;
    background-color: transparent;
    z-index: -1;
    transition: background-color .3s ease-out;
}

.popup-task__close:hover:before {
    background-color: #F2F4F5;
}

.popup-task__inner {
    display: flex;
    align-items: flex-start;
}

.popup-task__content {
    width: calc(60% - 50px);
}

.popup-task__content .title {
    font-family: 'SFProDisplayMedium';
    font-size: 16px;
    line-height: 18px;
    color: #262626;
    margin-bottom: 15px;
}

.popup-task__aside {
    width: 40%;
    margin-left: 50px;
    padding-top: 8px;
}

.popup-task__title {
    position: relative;
    width: calc(100% + 8px);
    margin-bottom: 10px;
    line-height: 0;
    font-size: 0;
    background: #FFFFFF;
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 8px;
    left: -8px;
    border: 2px solid transparent;
}

.popup-task__title:hover {
    background: #F2F4F5;
}

.popup-task__title.editing {
    background: #FFFFFF;
    border: 2px solid #6564C5;
}

.popup-task__title textarea {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: 'SFProDisplayMedium';
    font-size: 24px;
    line-height: 26px;
    color: #262626;
    resize: none;
    height: 26px;
    width: 100%;
    overflow: hidden;
}

.popup-task__title textarea::-webkit-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 20px;
    line-height: 22px;
    color: #9CA6B4;
}

.popup-task__title textarea::-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 20px;
    line-height: 22px;
    color: #9CA6B4;
}

.popup-task__title textarea:-ms-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 20px;
    line-height: 22px;
    color: #9CA6B4;
}

.popup-task__title textarea:-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 20px;
    line-height: 22px;
    color: #9CA6B4;
}

.popup-task__block--editable .popup-task__buttons {
    display: none;
    position: absolute;
    bottom: -31px;
    right: 0;
    z-index: 3;
}

.popup-task__block--editable.editing .popup-task__buttons {
    display: flex;
}

.popup-task__buttons button {
    border-radius: 5px;
    width: 26px;
    height: 26px;
    background-repeat: no-repeat;
    background-position: center center;
}

.popup-task__buttons .field-save {
    background-color: #6564C5;
    margin-right: 5px;
    background-image: url('../images/edit__Check.svg');
}

.popup-task__buttons .field-cancel {
    background-color: #F2F4F5;
    border: 1px solid #F2F4F5;
    background-image: url('../images/edit__cancel.svg');
}

.popup-task__block--editable .popup-task__error {
    display: none;
}

.popup-task__block--editable.warning  {
    border: 2px solid #FF4D4F;
}

.popup-task__block--editable.warning .popup-task__error {
    display: block;
    position: absolute;
    right: 0;
    top: -18px;
    font-size: 12px;
    line-height: 12px;
    color: #FF4D4F;
}

.popup-task__description-wrap {
    margin-bottom: 15px;
}

.popup-task__description {
    position: relative;
    width: calc(100% + 8px);
    line-height: 0;
    font-size: 0;
    background: #FFFFFF;
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 8px;
    left: -8px;
    border: 2px solid transparent;
}

.popup-task__description:hover {
    background: #F2F4F5;
}

.popup-task__description.editing {
    background: #FFFFFF;
    border: 1px solid #dadee1;
}

.popup-task__description .description__inner {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    width: 100%;
    overflow: hidden;
}

.popup-task__description .description__inner.empty {
    color: #9CA6B4;
}

.popup-task__description textarea {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    resize: none;
    height: 16px;
    width: 100%;
    overflow: hidden;
}

.popup-task__description textarea::-webkit-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup-task__description textarea::-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup-task__description textarea:-ms-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup-task__description textarea:-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.popup-task__status {
    margin-bottom: 10px;
}

.popup-task__status .dropdown__wrap {
    width: 100%;
    position: relative;
}

.popup-task__status .open-dropdown {
    border-radius: 3px;
    width: fit-content;
    width: -moz-fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #C1C7D0;
    position: relative;
}

.popup-task__status[data-status="for-today"] .open-dropdown {
    background: #C1C7D0;
}

.popup-task__status[data-status="in-progress"] .open-dropdown {
    background: #1668e2;
}

.popup-task__status[data-status="problem"] .open-dropdown {
    background: #FF4D4F;
}

.popup-task__status[data-status="test"] .open-dropdown {
    background: #FA8C16;
}

.popup-task__status[data-status="transfer"] .open-dropdown {
    background: #6564C5;
}

.popup-task__status[data-status="ready"] .open-dropdown {
    background: #09bc2d;
}

.popup-task__status .open-dropdown:before {
    content: url('../images/arrow_down_lightwhite.svg');
    position: absolute;
    top: 9px;
    right: 10px;
}

.popup-task__status[data-status="to-do"] .open-dropdown:before {
    content: url('../images/arrow_down_darkgrey.svg');
}

.popup-task__status .open-dropdown input {
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
    border: 0;
    width: 100%;
    background: transparent;
    padding: 8px 30px 8px 10px;
    text-overflow: ellipsis;
    cursor: pointer;
    text-transform: uppercase;
}

.popup-task__status[data-status="to-do"] .open-dropdown input {
    color: #172B4D;
}

.popup-task__status .dropdown__list {
    position: absolute;
    top: 37px;
    left: 0;
    width: 240px;
    background: #ffffff;
    z-index: 2;
    box-shadow: 0 0 10px 3px rgba(35, 35, 35, 0.06);
    display: none;
    border-radius: 5px;
    overflow: hidden;
}

.popup-task__status .active .dropdown__list {
    display: block;
}

.popup-task__status .dropdown__list--row {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.popup-task__status .dropdown__list--row input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
}

.popup-task__status .dropdown__list--row .box {
    border: 0;
    border-bottom: 1px solid #F0F0F0;
    padding: 10px 15px;
    display: flex;
    transition: background .3s ease-out;
}

.popup-task__status .dropdown__list--row .box:hover {
    background: #EAEAF7;
}

.popup-task__status .dropdown__list--row .box span {
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    transition: color .3s ease-out;
}

.popup-task__status .dropdown__list--row:hover .box span {
    color: #6564C5;
}

.popup-task__status .dropdown__list--row:hover input:checked + .box {
    background: #FFFFFF;
}

.popup-task__status .dropdown__list--row  input:checked + .box span,
.popup-task__status .dropdown__list--row:hover input:checked + .box span {
    opacity: 0.5;
    color: #232323;
}

.popup-task__details {
    border-radius: 4px;
    border: 1px solid rgba(156, 166, 180, 0.3);
}

.details__header {
    font-family: 'SFProDisplayMedium';
    font-size: 16px;
    line-height: 18px;
    color: #262626;
    padding: 10px 10px;
    border-bottom: 1px solid rgba(156, 166, 180, 0.3);
}

.details__body {
    padding: 10px;
}

.details__row {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
}

.details__row:last-child {
    margin-bottom: 0;
}

.details__title {
    width: 40%;
    min-width: 120px;
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #434f62;
    padding-right: 25px;
    padding-top: 8px;
    white-space: nowrap;
}

.details__value {
    width: 60%;
    flex-grow: 1;
    position: relative;
}

.details__row--components .open-dropdown,
.details__row--project .open-dropdown,
.details__row--sprint .open-dropdown,
.details__row--priority .open-dropdown {
    position: relative;
    width: 100%;
    line-height: 0;
    font-size: 0;
    background: #FFFFFF;
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 6px;
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.details__row--components .open-dropdown:hover,
.details__row--project .open-dropdown:hover,
.details__row--sprint .open-dropdown:hover,
.details__row--priority .open-dropdown:hover {
    background: #F2F4F5;
}

.details__row--components .active .open-dropdown,
.details__row--project .active .open-dropdown,
.details__row--sprint .active .open-dropdown,
.details__row--priority .active .open-dropdown {
    background: #FFFFFF;
    border: 2px solid #6564C5;
}

.details__row--components .open-dropdown input,
.details__row--project .open-dropdown input,
.details__row--sprint .open-dropdown input,
.details__row--priority .open-dropdown input {
    width: calc(100% - 20px);
    padding: 0;
    border: 0;
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    background: transparent;
    text-overflow: ellipsis;
}

.details__row--components .open-dropdown input::-webkit-input-placeholder,
.details__row--project .open-dropdown input::-webkit-input-placeholder,
.details__row--sprint .open-dropdown input::-webkit-input-placeholder,
.details__row--priority .open-dropdown input::-webkit-input-placeholder,
.details__row--deadline label input::-webkit-input-placeholder,
.details__row--time-plan label input::-webkit-input-placeholder,
.details__row--author .open-dropdown input::-webkit-input-placeholder,
.details__row--tester .open-dropdown input::-webkit-input-placeholder,
.details__row--executor .open-dropdown input::-webkit-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.details__row--components .open-dropdown input::-moz-placeholder,
.details__row--project .open-dropdown input::-moz-placeholder,
.details__row--sprint .open-dropdown input::-moz-placeholder,
.details__row--priority .open-dropdown input::-moz-placeholder,
.details__row--deadline label input::-moz-placeholder,
.details__row--time-plan label input::-moz-placeholder,
.details__row--author .open-dropdown input::-moz-placeholder,
.details__row--tester .open-dropdown input::-moz-placeholder,
.details__row--executor .open-dropdown input::-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.details__row--components .open-dropdown input:-ms-input-placeholder,
.details__row--project .open-dropdown input:-ms-input-placeholder,
.details__row--sprint .open-dropdown input:-ms-input-placeholder,
.details__row--priority .open-dropdown input:-ms-input-placeholder,
.details__row--deadline label input:-ms-input-placeholder,
.details__row--time-plan label input:-ms-input-placeholder,
.details__row--author .open-dropdown input:-ms-input-placeholder,
.details__row--tester .open-dropdown input:-ms-input-placeholder,
.details__row--executor .open-dropdown input:-ms-input-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.details__row--components .open-dropdown input:-moz-placeholder,
.details__row--project .open-dropdown input:-moz-placeholder,
.details__row--sprint .open-dropdown input:-moz-placeholder,
.details__row--priority .open-dropdown input:-moz-placeholder,
.details__row--deadline label input:-moz-placeholder,
.details__row--time-plan label input:-moz-placeholder,
.details__row--author .open-dropdown input:-moz-placeholder,
.details__row--tester .open-dropdown input:-moz-placeholder,
.details__row--executor .open-dropdown input:-moz-placeholder {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #9CA6B4;
}

.details__row--components .dropdown__list,
.details__row--project .dropdown__list,
.details__row--sprint .dropdown__list,
.details__row--priority .dropdown__list {
    position: absolute;
    top: 37px;
    left: 0;
    width: 100%;
    background: #ffffff;
    z-index: 3;
    box-shadow: 0 0 10px 3px rgba(35, 35, 35, 0.06);
    display: none;
    border-radius: 5px;
    overflow: hidden;
}

.details__row--components .active .dropdown__list,
.details__row--project .active .dropdown__list,
.details__row--sprint .active .dropdown__list,
.details__row--priority .active .dropdown__list {
    display: block;
}

.details__row--components .dropdown__list--inner,
.details__row--project .dropdown__list--inner,
.details__row--sprint .dropdown__list--inner,
.details__row--priority .dropdown__list--inner {
    max-height: 200px;
    overflow: scroll;
    position: static;
}

.details__row--components .dropdown__wrap.hidden .dropdown__list--inner:after,
.details__row--project .dropdown__wrap.hidden .dropdown__list--inner:after,
.details__row--sprint .dropdown__wrap.hidden .dropdown__list--inner:after,
.details__row--priority .dropdown__wrap.hidden .dropdown__list--inner:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 46.88%, #FFFFFF 100%);
    z-index: 2;
}

.details__row--components .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after,
.details__row--project .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after,
.details__row--sprint .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after,
.details__row--priority .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after {
    display: none;
}

.details__row--components .dropdown__list--inner::-webkit-scrollbar,
.details__row--project .dropdown__list--inner::-webkit-scrollbar,
.details__row--sprint .dropdown__list--inner::-webkit-scrollbar,
.details__row--priority .dropdown__list--inner::-webkit-scrollbar,
.details__row--author .dropdown__list--inner::-webkit-scrollbar,
.details__row--tester .dropdown__list--inner::-webkit-scrollbar,
.details__row--executor .dropdown__list--inner::-webkit-scrollbar {
    display: none;
}

.details__row--components .dropdown__list--inner::-webkit-scrollbar-track,
.details__row--project .dropdown__list--inner::-webkit-scrollbar-track,
.details__row--sprint .dropdown__list--inner::-webkit-scrollbar-track,
.details__row--priority .dropdown__list--inner::-webkit-scrollbar-track,
.details__row--author .dropdown__list--inner::-webkit-scrollbar-track,
.details__row--tester .dropdown__list--inner::-webkit-scrollbar-track,
.details__row--executor .dropdown__list--inner::-webkit-scrollbar-track {
    display: none;
}

.details__row--components .dropdown__list--inner::-webkit-scrollbar-thumb,
.details__row--project .dropdown__list--inner::-webkit-scrollbar-thumb,
.details__row--sprint .dropdown__list--inner::-webkit-scrollbar-thumb,
.details__row--priority .dropdown__list--inner::-webkit-scrollbar-thumb,
.details__row--author .dropdown__list--inner::-webkit-scrollbar-thumb,
.details__row--tester .dropdown__list--inner::-webkit-scrollbar-thumb,
.details__row--executor .dropdown__list--inner::-webkit-scrollbar-thumb {
    display: none;
}

.details__row--components .dropdown__list--row,
.details__row--project .dropdown__list--row,
.details__row--sprint .dropdown__list--row,
.details__row--priority .dropdown__list--row {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.details__row--components .dropdown__list--row input,
.details__row--project .dropdown__list--row input,
.details__row--sprint .dropdown__list--row input,
.details__row--priority .dropdown__list--row input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
}

.details__row--components .dropdown__list--row .box,
.details__row--project .dropdown__list--row .box,
.details__row--sprint .dropdown__list--row .box,
.details__row--priority .dropdown__list--row .box {
    border: 0;
    border-bottom: 1px solid #F0F0F0;
    padding: 10px 15px;
    display: flex;
    transition: background .3s ease-out;
}

.details__row--components .dropdown__list--row:hover .box,
.details__row--project .dropdown__list--row:hover .box,
.details__row--sprint .dropdown__list--row:hover .box,
.details__row--priority .dropdown__list--row:hover .box {
    background: #EAEAF7;
}

.details__row--components .dropdown__list--row .box span,
.details__row--project .dropdown__list--row .box span,
.details__row--sprint .dropdown__list--row .box span,
.details__row--priority .dropdown__list--row .box span {
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    transition: color .3s ease-out;
}

.details__row--components .dropdown__list--row:hover .box span,
.details__row--project .dropdown__list--row:hover .box span,
.details__row--sprint .dropdown__list--row:hover .box span,
.details__row--priority .dropdown__list--row:hover .box span {
    color: #6564C5;
}

.details__row--components .dropdown__list--row:hover input:checked + .box,
.details__row--project .dropdown__list--row:hover input:checked + .box,
.details__row--sprint .dropdown__list--row:hover input:checked + .box,
.details__row--priority .dropdown__list--row:hover input:checked + .box {
    background: #FFFFFF;
}

.details__row--components .dropdown__list--row  input:checked + .box span,
.details__row--components .dropdown__list--row:hover input:checked + .box span,
.details__row--project .dropdown__list--row  input:checked + .box span,
.details__row--project .dropdown__list--row:hover input:checked + .box span,
.details__row--sprint .dropdown__list--row  input:checked + .box span,
.details__row--sprint .dropdown__list--row:hover input:checked + .box span,
.details__row--priority .dropdown__list--row  input:checked + .box span,
.details__row--priority .dropdown__list--row:hover input:checked + .box span {
    opacity: 0.5;
    color: #232323;
}

.details__row--priority .dropdown__list--row .box__img {
    width: 16px;
    min-width: 16px;
    height: 16px;
    margin-right: 5px;
}

.dropdown-field__clear {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    top: 8px;
    display: none;
    background: #F2F4F5 url('../images/edit__cancel.svg') no-repeat center center;
    background-size: 7px;
    cursor: pointer;
}

.dropdown__wrap.active .dropdown-field__clear,
.popup-task__block--editable.editing + .dropdown-field__clear {
    display: block;
}

.details__row--deadline label,
.details__row--time-plan label {
    position: relative;
    width: 100%;
    line-height: 0;
    font-size: 0;
    background: #FFFFFF;
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 6px;
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: center;
}

.details__row--deadline label:hover,
.details__row--time-plan label:hover {
    background: #F2F4F5;
}

.details__row--deadline label input,
.details__row--time-plan label input {
    width: 100%;
    padding: 0;
    border: 0;
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    background: transparent;
}

.popup-task__time-plan.empty input {
    color: #9CA6B4;
}

.details__row--deadline label.editing,
.details__row--time-plan label.editing {
    background: #FFFFFF;
    border: 2px solid #6564C5;
}

.details__row--time-plan label.warning {
    border: 2px solid #FF4D4F;
}

.popup-task__time-plan ~ .popup-task__buttons {
    display: none;
    position: absolute;
    right: 0;
    top: 35px;
}

.popup-task__time-plan.editing ~ .popup-task__buttons {
    display: block;
}

.details__row--author .open-dropdown,
.details__row--tester .open-dropdown,
.details__row--executor .open-dropdown {
    position: relative;
    width: 100%;
    line-height: 0;
    font-size: 0;
    background: #FFFFFF;
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 6px;
    border: 2px solid transparent;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.details__row--author .open-dropdown:hover,
.details__row--tester .open-dropdown:hover,
.details__row--executor .open-dropdown:hover {
    background: #F2F4F5;
}

.details__row--author .active .open-dropdown,
.details__row--tester .active .open-dropdown,
.details__row--executor .active .open-dropdown {
    background: #FFFFFF;
    border: 2px solid #6564C5;
}

.details__row--author .open-dropdown input,
.details__row--tester .open-dropdown input,
.details__row--executor .open-dropdown input {
    width: calc(100% - 50px);
    text-overflow: ellipsis;
    padding: 0;
    border: 0;
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    background: transparent;
}

.details__row--author .open-dropdown__img,
.details__row--tester .open-dropdown__img,
.details__row--executor .open-dropdown__img {
    width: 24px;
    min-width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: #EAEAF7;
    margin-right: 6px;
    position: relative;
}

.details__row--author .open-dropdown__img svg,
.details__row--tester .open-dropdown__img svg,
.details__row--executor .open-dropdown__img svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.details__row--author .open-dropdown__img img,
.details__row--tester .open-dropdown__img img,
.details__row--executor .open-dropdown__img img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 2;
}

.details__row--author .dropdown__list,
.details__row--tester .dropdown__list,
.details__row--executor .dropdown__list {
    position: absolute;
    top: 45px;
    left: 0;
    width: 100%;
    background: #ffffff;
    z-index: 3;
    box-shadow: 0 0 10px 3px rgba(35, 35, 35, 0.06);
    display: none;
    border-radius: 5px;
    overflow: hidden;
}

.details__row--author .active .dropdown__list,
.details__row--tester .active .dropdown__list,
.details__row--executor .active .dropdown__list {
    display: block;
}

.details__row--author .dropdown__list--inner,
.details__row--tester .dropdown__list--inner,
.details__row--executor .dropdown__list--inner {
    max-height: 200px;
    overflow: scroll;
    position: static;
}

.details__row--author .dropdown__list--row,
.details__row--tester .dropdown__list--row,
.details__row--executor .dropdown__list--row {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.details__row--author .dropdown__list--row input,
.details__row--tester .dropdown__list--row input,
.details__row--executor .dropdown__list--row input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
}

.details__row--author .dropdown__list--row .box,
.details__row--tester .dropdown__list--row .box,
.details__row--executor .dropdown__list--row .box {
    border: 0;
    border-bottom: 1px solid #F0F0F0;
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    transition: background .3s ease-out;
}

.details__row--author .dropdown__list--row:hover .box,
.details__row--tester .dropdown__list--row:hover .box,
.details__row--executor .dropdown__list--row:hover .box {
    background: #EAEAF7;
}

.details__row--author .dropdown__list--row:hover input:checked + .box,
.details__row--tester .dropdown__list--row:hover input:checked + .box,
.details__row--executor .dropdown__list--row:hover input:checked + .box {
    background: #FFFFFF;
}

.details__row--author .dropdown__list--row .box__img,
.details__row--tester .dropdown__list--row .box__img,
.details__row--executor .dropdown__list--row .box__img {
    width: 24px;
    min-width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: #EAEAF7;
    margin-right: 6px;
}

.details__row--author .dropdown__list--row .box__img img,
.details__row--tester .dropdown__list--row .box__img img,
.details__row--executor .dropdown__list--row .box__img img {
    min-width: 100%;
    min-height: 100%;
    object-fit: cover;
}

.details__row--author .dropdown__list--row .box__value,
.details__row--tester .dropdown__list--row .box__value,
.details__row--executor .dropdown__list--row .box__value {
    font-family: 'SFProDisplayLight';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    transition: color .3s ease-out;
}

.details__row--author .dropdown__list--row:hover .box__value,
.details__row--tester .dropdown__list--row:hover .box__value,
.details__row--executor .dropdown__list--row:hover .box__value {
    color: #6564C5;
}

.details__row--author .dropdown__list--row  input:checked + .box .box__value,
.details__row--author .dropdown__list--row:hover input:checked + .box .box__value,
.details__row--tester .dropdown__list--row  input:checked + .box .box__value,
.details__row--tester .dropdown__list--row:hover input:checked + .box .box__value,
.details__row--executor .dropdown__list--row  input:checked + .box .box__value,
.details__row--executor .dropdown__list--row:hover input:checked + .box .box__value {
    opacity: 0.5;
    color: #232323;
}

.details__row--author .dropdown-field__clear,
.details__row--tester .dropdown-field__clear,
.details__row--executor .dropdown-field__clear {
    top: 12px;
}

.details__row--author .dropdown__wrap.hidden .dropdown__list--inner:after,
.details__row--tester .dropdown__wrap.hidden .dropdown__list--inner:after,
.details__row--executor .dropdown__wrap.hidden .dropdown__list--inner:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.7) 46.88%, #FFFFFF 100%);
    z-index: 2;
}

.details__row--author .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after,
.details__row--tester .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after,
.details__row--executor .dropdown__wrap.hidden.scroll-to-end .dropdown__list--inner:after {
    display: none;
}

.details__row--priority.empty .open-dropdown__img {
    display: none;
}

.details__row--priority .open-dropdown__img {
    width: 16px;
    min-width: 16px;
    margin-right: 5px;
}

.popup-task__time-tracker {
    margin-bottom: 25px;
}

.popup-task__comments {
    position: relative;
}

.popup-task__comments .comments__sort {
    position: absolute;
    right: -5px;
    top: -4px;
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #434f62;
    cursor: pointer;
    transition: background .3s ease-out;
    border-radius: 5px;
    overflow: hidden;
    padding: 5px 30px 5px 5px;
}

.popup-task__comments .comments__sort:hover {
    background: #F2F4F5;
}

.popup-task__comments .comments__sort[data-sort="first-new"]:after {
    content: '';
    position: absolute;
    right: 5px;
    top: 4px;
    background: url('/upload/frontend/popup_task_sort_new_first.svg') no-repeat center center;
    background-size: contain;
    width: 17px;
    height: 17px;
}

.popup-task__comments .comments__sort[data-sort="first-old"]:after {
    content: '';
    position: absolute;
    right: 5px;
    top: 4px;
    background: url('/upload/frontend/popup_task_sort_old_first.svg') no-repeat center center;
    background-size: contain;
    width: 17px;
    height: 17px;
}

.popup-task__comments .comment-field__wrap {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}

.popup-task__comments .comment-field__img {
    width: 32px;
    height: 32px;
    min-width: 32px;
    margin-right: 8px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #EAEAF7;
}

.popup-task__comments .comment-field__img img {
    min-width: 100%;
    min-height: 100%;
    object-fit: contain;
}

.popup-task__comments .comment-field__space {
    width: calc(100% - 40px);
    position: relative;
    line-height: 0;
    font-size: 0;
    background: #FFFFFF;
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 8px;
    border: 2px solid transparent;
}

.popup-task__comments .comment-field__space:hover {
    background: #F2F4F5;
}

.popup-task__comments .description__inner {
    background: transparent;
    border: 0;
    padding: 0;
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    width: 100%;
    overflow: hidden;
}

.popup-task__comments .description__inner.empty {
    color: #9CA6B4;
}

.comment-list__block {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
}

.comment-list__block:last-child {
    margin-bottom: 0;
}

.comment__photo {
    width: 32px;
    height: 32px;
    min-width: 32px;
    margin-right: 8px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #EAEAF7;
}

.comment__photo img {
    min-width: 100%;
    min-height: 100%;
    object-fit: contain;
}

.comment__body {
    width: calc(100% - 40px);
    position: relative;
}

.comment__header {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.comment__author {
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #434f62;
    margin-right: 15px;
}

.comment__date {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #434f62;
}

.comment__content {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    margin-bottom: 10px;
}

.comment__action {
    display: flex;
    align-items: center;
    margin-left: -5px;
}

.comment__action .separator {
    width: 3px;
    min-width: 3px;
    height: 3px;
    border-radius: 50%;
    overflow: hidden;
    background: #434f62;
    margin: 0 5px;
}

.comment-edit,
.comment-delete {
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #434f62;
    cursor: pointer;
    transition: background .3s ease-out;
    border-radius: 5px;
    overflow: hidden;
    padding: 5px;
    background: transparent;
}

.comment-edit:hover,
.comment-delete:hover {
    background: #F2F4F5;
    opacity: 1;
}

.popup__delete--comment {
    position: fixed;
    top: 50%;
    left: -100%;
    transition: opacity .3s ease-out;
    width: 360px;
    background: #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    border-radius: 10px;
    padding: 25px 30px;
    z-index: -1;
    opacity: 0;
}

.popup__delete--comment.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 13;
}

.popup__delete--comment p {
    font-size: 14px;
    line-height: 17px;
    color: #333333;
    margin-bottom: 20px;
}

.popup__delete--comment  .delete {
    background: #EB5757;
    border-radius: 5px;
    width: 104px;
    height: 34px;
    margin-right: 10px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #FFFFFF;
}

.popup__delete--comment .cancel {
    background: #F2F4F5;
    border-radius: 5px;
    width: 102px;
    height: 34px;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #828282;
}

.comment-list__block .popup-task__buttons {
    display: none;
    margin-top: 10px;
}

.comment-list__block.editing .popup-task__buttons {
    display: block;
}

.comment-list__block.editing .comment__action {
    display: none;
}

.time-tracker__line {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.time-tracker__buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px;
}

.time-tracker__buttons button {
    width: 28px;
    min-width: 28px;
    height: 28px;
    margin-right: 5px;
    border-radius: 5px;
    overflow: hidden;
    background-color: #EAEAF7;
    display: flex;
    align-items: center;
    justify-content: center;
}

.time-tracker__text {
    font-family: 'SFProDisplay';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
}

.time-tracker__text .time-tracked {
    font-weight: 600;
}

.popup__time-add {
    position: fixed;
    top: 50%;
    left: -100%;
    width: 500px;
    background: #FFFFFF;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding: 20px;
    z-index: -1;
    opacity: 0;
}

.popup__time-add.active {
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 13;
}

.popup__time-add .popup__header {
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid rgba(232, 232, 232, 0.5);
}

.popup__time-add .popup__header p {
    font-size: 18px;
    line-height: 21px;
    color: #262626;
    margin-right: 20px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.popup__time-add .popup__field {
    width: calc(50% - 7.5px);
    margin: 0 15px 0 0;
}

.popup__time-add .popup__field:last-child {
    margin-right: 0;
}

.popup__time-add .popup__field label {
    display: block;
}

.popup__time-add .field__title {
    font-size: 10px;
    line-height: 12px;
    color: #9CA6B4;
    margin-bottom: 5px;
}

.popup__time-add input[name="TIME_REMAIN"] {
    background: #F2F4F5;
    cursor: auto;
}

.time-tracking__wrap {
    border-radius: 5px;
    transition: all .3s ease-out;
    padding: 6px;
    border: 2px solid transparent;
    cursor: pointer;
}

.time-tracking__wrap:hover {
    background: #F2F4F5;
}

.time-tracking__line {
    width: 100%;
    height: 4px;
    border-radius: 4px;
    background: #dfe1e6;
    margin-bottom: 5px;
}

.time-tracking__line div {
    height: 4px;
    border-radius: 4px;
    background: #6564C5;
    transition: width .3s ease-out;
    width: 0;
}

.time-tracking__text {
    color: #5e6c84;
    font-size: 13px;
    line-height: 15px;
}

.time-tracker__staff-wrap {
    display: none;
    height: 35px;
    margin-top: 10px;
}

.time-tracker__staff-wrap.active {
    display: flex;
}

.time-tracker__staff {
    display: flex;
    align-items: center;
    background: #6564C5;
    height: 100%;
    width: 0;
    overflow: hidden;
    padding: 0 10px;
    min-width: 100px;
}

.time-tracker__staff:nth-child(2) {
    background: #FA8C16;
}

.time-tracker__staff:nth-child(3) {
    background: #09bc2d;
}

.time-tracker__staff:nth-child(4) {
    background: #1668e2;
}

.time-tracker__staff:nth-child(5) {
    background: #C1C7D0;
}

.time-tracker__staff .staff__img {
    width: 22px;
    height: 22px;
    min-width: 22px;
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #FFFFFF;
    margin-right: 10px;
}

.time-tracker__staff p {
    font-family: 'SFProDisplayBold';
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
}

.time-tracker__worklogs {
    display: none;
    margin-top: 5px;
}

.time-tracker__worklogs.active {
    display: block;
}

.time-tracker__list {
    display: none;
}

.time-tracker__list.active {
    display: block;
}

.time-tracker__action {
    font-family: 'SFProDisplayMedium';
    font-size: 14px;
    line-height: 16px;
    color: #434f62;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 6px 8px 6px 1px;
    border-radius: 5px;
    transition: background .3s ease-out;
}

.time-tracker__action:hover {
    background: #F2F4F5;
}

.time-tracker__action p {
    margin-right: 10px;
    position: relative;
    margin-left: 6px;
}

.time-tracker__action svg {
    transform: rotate(180deg);
}

.time-tracker__action.active svg {
    transform: none;
}

.time-tracker__worklog .worklog__img {
    width: 24px;
    height: 24px;
    min-width: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    overflow: hidden;
    margin-right: 10px;
}

.time-tracker__worklog .worklog__img img {
    min-height: 100%;
    min-width: 100%;
    object-fit: cover;
}

.time-tracker__worklog .worklog__time {
    font-family: 'SFProDisplayBOLD';
    font-size: 14px;
    line-height: 16px;
    color: #262626;
    flex-grow: 1;
}

.time-tracker__worklog {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 8px 0;
}

.worklog__action {
    display: flex;
    align-items: center;
}

.worklog__action button {
    width: 28px;
    min-width: 28px;
    height: 28px;
    margin-left: 5px;
    border-radius: 5px;
    overflow: hidden;
    background-color: #EAEAF7;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dropable{
    position: relative;
}
.sprint-item{
    width: 100%;
    height: 26px;
    padding-top: 3px;
}
.sprint-item:hover{
    cursor: pointer;
    background-color: #e3e6e7;
}

.sprint_item_date{
    margin-left: 10px;
}

.select-sprint{
    top: -10px;
    left: 28%;
    position: absolute;
    width: 72%;
    background-color: #F2F4F5;
}

.worklog__action .worklog-delete svg {
    transform: rotate(45deg);
}

@media only screen and (max-width: 1340px) {
    .header__main--right .search {
        width: 280px;
    }
    .header__main--right .header--status {
        width: 300px;
    }
}

@media only screen and (max-height: 540px) {
    .authorization__dev {
        display:  none;
    }

    .container .authorization__dev {
        display:  block;
        padding-top: 20px;
        text-align: center;
        position:  relative;
        bottom:  0;
    }
}