.task-title-y {
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    color: #000000;
    display: flex;
    align-items: center;
}

.task-desc-y {
    font-size: 14px;
    line-height: 17px;
}

.task-title-y p {
    margin: 0;
}

.title-y {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #0c4b86 !important;
}

.desc-y {
    font-size: 13px;
    line-height: 13px;
    color: #a5a7b5;
    font-weight: 600;
}

.flex-1 {
    flex: 1;
}

.flex-2 {
    flex: 2;
}

.flex-3 {
    flex: 3;
}

.m-0 {
    margin: 0 !important;
}

.mtb-1 {
    margin: 5px;
}

.text-start-y {
    text-align: start !important;
}

.text-center-y {
    text-align: center;
}

.text-end-y {
    text-align: end;
}

.pl-1 {
    padding-left: 10px;
}

.pl-6 {
    padding-left: 40px !important;
    padding-bottom: 5px;
}

.ptb-1 {
    padding: 10px 0;
}

.column {
    flex-direction: column;
}

.w-100 {
    width: 100%;
}

.task-list-card {
    min-height: 87px;
    padding: 10px 15px 15px 10px;
    border-radius: 3px !important;
    margin: 0 -20px 10px -20px !important;
    box-shadow: 0 5px 20px rgba(108, 108, 108, 0.1) !important;
}

.clr-border-of-before {
}

.clr-border-of-before::before {
    border: none !important;
}

.icon-bnt-redesign {
    padding-top: 15px !important;
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    font-size: 12px !important;
}

.clr-red {
    color: #e42734 !important;
}

.clr-blue {
    color: #0c4b86;
}

.clr-grey {
    color: #a5a7b5;
}

.history-label {
    font-style: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 15px;
    color: #a5a7b5;
}

.history-value {
    font-size: 12px;
    line-height: 15px;
}

.history-title {
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    color: #a5a7b5;
}

.d-block {
    display: block;
}

.action-text {
    color: #6191ef !important;
    font-size: 12px !important;
}

.h-100 {
    height: 100%;
}

.btn-disabled {
    width: 50% !important;
    margin-left: 10px !important;

    background-color: #929292 !important;
    color: white !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    border-radius: 4px !important;
}

.btn-design-decline {
    background-color: #e42734 !important;
    width: 269px !important;
    height: 50px;
    margin-top: 1.5rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    position: absolute !important;
    bottom: 26px;
    left: calc(50% - 134.5px);
    border-radius: 4px !important;
}

.btn-design-decline span {
    color: white;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 22px;
}

.btn-active {
    background: linear-gradient(104.82deg, #0c4b86 -17.14%, #e42734 83.14%);
    border-radius: 4px !important;
}

.btn-active-blue {
    background-color: #0c4b86 !important;
    border-radius: 4px !important;
}

.btn-disabled {
    background-color: grey;
    border-radius: 4px !important;
}

.for-two-btns {
    position: absolute;
    bottom: 0;
    left: calc(50% - 145px);
}

.btn-accept-mini {
    width: calc(50% - 5px) !important;
    height: 40px !important;
    margin: 0 10px 0 -10px !important;
    background-color: #0c4b86 !important;
    border-radius: 4px !important;
}

.btn-cancel-mini {
    background-color: #fff !important;
    border: 1px solid #e42734 !important;
    box-shadow: none !important;

    margin: 0 auto !important;
    width: calc(50% - 5px) !important;
    height: 40px !important;
    border-radius: 4px !important;
}

.btn-accept-mini span {
    color: #fff;
    font-size: 14px;
}

.btn-cancel-mini span {
    color: #e42734;
    font-size: 14px;
}

.btn-decline-mini {
    background-color: #e42734 !important;
    border: 1px solid #e42734 !important;
    box-shadow: none !important;
    color: white;
    margin: 0 auto !important;

    width: calc(50% - 5px) !important;
    height: 40px !important;
    border-radius: 4px !important;
}

.btn-decline-mini span {
    color: #fff;
    font-size: 14px;
}

.primary-outlined-button {
    border: 1px solid #6191ef !important;
    border-radius: 4px !important;
    color: #6191ef !important;
    width: 100%;
    height: 50px;
}

.btn-outlined-primary {
    width: 173px !important;
    height: 40px;
    margin-top: 1.5rem !important;
    margin-left: 10px !important;
    box-shadow: none !important;
    border: 1px solid #0c4b86 !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 17px !important;
    text-align: center !important;
    background-color: white !important;
    color: #0c4b86 !important;
    border-radius: 4px !important;
}

.light-bold {
    font-weight: 500 !important;
}

.bold {
    font-weight: 600 !important;
}

.some-text {
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
}

.slider-container {
    position: relative;
    overflow: hidden;
    width: calc(100% + 4rem);
    height: 100%;
    margin-left: -2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-bottom: 35px;
}

.pin-down {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.clr-blck {
    color: #000000 !important;
}

.profile {
    height: 100%;
}

.profile__icons {
    color: white;
    font-size: 24px !important;
}

.profile__info {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.profile__avatar {
    background-color: #e9e9e9 !important;
    color: black !important;
    width: 57px !important;
    height: 57px !important;
    font-size: 48px !important;
    border-radius: 0 !important;
}

.profile__avatar-border {
    border: 5px solid #4b88fe;
    border-radius: 50%;
    padding: 5px;
}

.profile__name {
    font-style: normal;
    font-weight: 600;
    font-size: 24px;
    line-height: 29px;
    margin-bottom: 4px;
    text-align: center;
    color: #ffffff;
}

.profile__position {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    margin-bottom: 10px;
    color: #b5b9d3;
}

.profile__additional-info {
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 18px;
    margin-bottom: 2px;
    color: #ffffff;
}

.productivity {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 50%);
    width: 325px;
    height: 92px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px;
    background: #ffffff;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    border-radius: 3px;
}

.productivity__text {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 3px;
    color: #000000;
}

.productivity__desc {
    margin: 0;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: #616161;
}

.top-block {
    height: 369px;
    background: linear-gradient(131.87deg, #e42734 7.81%, #0c4b86 90.62%);
    border: 0.5px solid #bebebe;
    position: relative;
}

.action-list {
    background-color: #ffffff;
    padding-top: 10px;
}

.action-list__arrow {
    color: #cccccc;
    width: 20px !important;
    height: 20px !important;
}

.action-list__text {
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    line-height: 20px !important;
    color: #e42734;
}

.action-list__item {
    position: relative;
    height: 55px;
}

.action-list__item::before {
    content: " ";
    position: absolute;
    bottom: 2px;
    right: 0;
    left: 55px;
    border-bottom: 0.5px solid #cccccc;
}

.with-footer .app-wrapper {
    min-height: 100vh;
}

.with-footer .app-main {
    padding-bottom: 80px;
}

.with-footer .app-content--inner {
    padding: 0 !important;
}

.MuiBottomNavigationAction-root.Mui-selected {
    color: #e42734 !important;
}

.MuiBottomNavigationAction-root.Mui-selected
.MuiBottomNavigationAction-wrapper::before {
    content: " ";
    width: calc(100% - 24px);
    position: absolute;
    top: 0;
    border-top: 4px solid #e42734;
    border-radius: 0 0 5px 5px;
}

.pb-8 {
    padding-bottom: 80px !important;
}

.task-list-icons button {
    width: 40px !important;
    min-width: 40px;
    height: 40px;
    padding: 0;

    text-align: center;
    background-color: #f5f5f5;
    border-radius: 7px;
    margin-right: 15px;
    color: #6191ef;
}

.task-list-icons div svg {
    width: 20px;
    height: 20px;
    transform: translateY(50%);
}

/* filter */

.filter-field {
    margin-bottom: 15px;
}

.filter-field__title {
    font-style: normal;
    font-weight: 500 !important;
    font-size: 18px !important;
    line-height: 22px !important;
    color: #2f3c47;
}

.snd-date-field {
    position: absolute;
    top: 0;
    right: 50%;
    transform: translateX(100%);
    padding: 6px 0 7px;
    z-index: -1;
}

.filters-calendar .MuiPickersModal-dialogRoot {
    height: 526px;
    box-shadow: 0 5px 10px rgba(108, 108, 108, 0.1);
    border-radius: 4px;
}

.filters-calendar .MuiPickersBasePicker-container {
    height: 100%;
}

.filters-calendar .MuiPickersBasePicker-pickerView {
    justify-content: flex-start;
    min-height: auto;
    height: 100%;
    width: 100%;
    min-width: 100%;
    background-color: #ffffff;
}

.filters-calendar .MuiPickersCalendar-transitionContainer {
    height: 100%;
}

.filters-calendar .MuiPickersCalendar-transitionContainer > div {
    height: 90%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.filters-calendar .calendar-text-fields {
    height: 100%;
}

.filters-calendar .MuiPickersCalendarHeader-switchHeader .MuiTypography-root {
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 22px;
    color: #6191ef;
}

.filters-calendar
.MuiPickersCalendarHeader-switchHeader
.MuiPickersCalendarHeader-iconButton {
    color: #6191ef;
}

.filters-calendar .MuiPickersCalendarHeader-daysHeader {
    justify-content: space-between;
}

.filters-calendar .MuiPickersCalendarHeader-dayLabel {
    color: #000000 !important;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
}

.filters-calendar .MuiPickersCalendar-week {
    border-bottom: 1px solid #e7e9f1;
    justify-content: space-around;
    padding-bottom: 10px;
    padding-top: 10px;
}

.filters-calendar .MuiDialogActions-root button {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    text-align: center;
    text-transform: uppercase;

    color: #5a92ff;
}

.calendar-text-fields .MuiInput-input {
    padding-bottom: 18px;
    font-style: normal;
    font-weight: normal;
    font-size: 14px !important;
    line-height: 17px;
}

.calendar-toolbar-input {
    height: 40px !important;
    padding-bottom: 2px !important;
    padding-top: 2px !important;
}

.add-photo-btn > span {
    justify-content: space-between !important;
}

.act-btn > span {
    justify-content: space-between !important;
}

/* end filter */

.action-blue-txt {
    font-style: normal !important;
    font-weight: normal !important;
    font-size: 12px !important;
    line-height: 15px !important;
    color: #5a92ff !important;
}

.custom-calendar {
    color: #5a92ff;
    text-transform: capitalize;
}

.custom-calendar .MuiPickersToolbar-toolbar {
    display: none !important;
}

.main-calendar {
    color: #5a92ff;
    text-transform: capitalize;
}

.main-calendar .MuiPickersBasePicker-pickerView {
    background-color: #fafafa;
}

.main-calendar .MuiPickersCalendarHeader-iconButton {
    background-color: #fafafa;
}

.f-size-24 {
    font-size: 24px !important;
}

.f-size-18 {
    font-size: 18px !important;
}

.f-size-14 {
    font-size: 14px !important;
}

.f-size-12 {
    font-size: 12px !important;
}

.ml-minus-1 {
    margin-left: -10px !important;
}

.d-block {
    display: block !important;
}

p {
    word-wrap: break-word;
}

.grayscale-1 {
    filter: grayscale(1);
}

.grayscale-0 {
    filter: grayscale(0);
}

.another-form-variant {
    padding-bottom: 45px !important;
}

.dots-in-the-end {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.header-tabbar {
    display: none;
}

.m-content {
    padding: 0 !important;
}

.form-group label {
    text-align: start;
}

.form-group label :last-child {
    width: 100%;
}

form {
    position: relative;
    height: 100% !important;
}

.main .task-2-actions,
.task-view .task-2-actions,
.process-view .process-2-actions {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 15px;
    border-radius: 10px 10px 0 0;
}

.checkbox-item {
    width: 100%;
}

.wiki-main-card {
    background: linear-gradient(94.86deg, #adb0ff 0%, #a35aff 100%);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    padding: 20px 15px;
    cursor: pointer;
}


.wiki-main-card > * {
    color: white;
}

.video-card {
    border: 0.5px solid #e2e3ed;
    border-radius: 4px;
}

.devide-line {
    position: relative;
    right: 0;
    left: 0;
    width: 100%;
    border-bottom: 0.5px solid rgb(245, 244, 244);
}


.hover-eff:hover {
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 4px;
}


.align-items-center {
    align-items: center !important;
}

.phone-number {
    background-color: #F5F5F9;
    border-radius: 4px;
    padding: 10px;
    gap: 10px;
    width: 150px;
}

.input-field {
    max-width: 340px;
}

.personal-info {
    min-height: 210px;
    width: 100%;
    border-radius: 4px;
    background-color: #fff;
    padding: 20px;
}

.personal-info__passport {
    border: none;
    padding: 10px;
    background-color: #9194A9;
    border-radius: 4px;
    color: #ffffff;
    width: 170px;
    cursor: pointer;
}

.main-title {
    color: #494C62;
    font-weight: 600;
    font-size: 14px;
    line-height: 17px;
    text-transform: uppercase;
    margin: 10px 0 10px 20px;
}

.title {
    color: #494C62;
    font-size: 14px;
    line-height: 17px;
    font-weight: 600;
    margin: 0 0 15px 0;
}

.half-width {
    width: 50%;
}

.full-width {
    width: 100%;
}

.grey-text {
    color: #9194A9;
    font-size: 14px;
    font-weight: 600;
    margin: 5px 0 20px;
}

.contact-btn {
    color: #6191EF;
    font-size: 14px;
    font-weight: 600;
}

.mt-1 {
    margin-top: 10px;
}

.mt-3 {
    margin-top: 30px;
}

.mr-1 {
    margin-right: 10px;
}

.history-btn {
    border: 1px solid #E2E3ED;
    border-radius: 4px;
    background-color: #ffffff;
    padding: 10px;
    color: #6191EF;
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
}

.client-type {
    margin-right: 10px !important;
}

.client-type-btn {
    border: none;
    padding: 6px;
    background-color: #9194A9;
    border-radius: 4px;
    color: #ffffff;
    cursor: pointer;
    width: 30px;
    height: 30px;
}

.key-btn {
    border: none;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    background-color: #9194A9;
    color: #ffffff;
    cursor: pointer;
}

.progress-bar {
    width: 150px;
}

.progress-bar .MuiLinearProgress-colorPrimary {
    background-color: #D2D3D9;
}

.progress-percent {
    margin: 0 14px 0 14px;
    color: #72768F;
    font-size: 16px;
    line-height: 20px;
}

.clients-choice {
    background-color: #ffffff;
    border: 1px solid #e2e3ed;
    border-radius: 4px;
    padding: 20px;
    display: flex;
    flex-direction: column;
}

.packet-choice {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: 265px;
    height: 30px;
    border: none;
    border-radius: 4px;
    color: #ffffff;
    background-color: #6191ef;
    font-weight: 600;
    cursor: pointer;
}

.preset-link {
    padding: 12px;
    background-color: #F5F5F9;
    border-radius: 4px;
    color: #6191ef;
    text-decoration: underline;
    font-weight: 600;
}

.packet-choice-wrapper {
    margin-right: 50px;
    margin-top: 5px;
}

.sale-title {
    color: #494C62;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 5px;
}

.sale-subtitle {
    color: #9194A9;
    font-size: 12px;
    font-weight: 500;
}

.docs-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    grid-column-gap: 52px;
    grid-row-gap: 0;
    align-items: end;
}

.docs-item {
    margin-bottom: 15px;
}

.first-block {
    grid-area: 1 / 1 / 2 / 4;
    height: 460px !important;
    overflow: auto;
}

.first-block::-webkit-scrollbar {
    width: 7px
}

.first-block::-webkit-scrollbar-thumb {
    background-color: #6191EF;
    border-radius: 4px
}

.second-block {
    grid-area: 2 / 1 / 3 / 4;
    height: 300px !important;
    overflow: auto;
}

.second-block::-webkit-scrollbar {
    width: 7px
}

.second-block::-webkit-scrollbar-thumb {
    background-color: #6191EF;
    border-radius: 4px
}

.third-block {
    grid-area: 1 / 4 / 3 / 5;
}

.third-block::-webkit-scrollbar {
    width: 7px
}

.third-block::-webkit-scrollbar-thumb {
    background-color: #6191EF;
    border-radius: 4px
}

@media screen and (max-width: 1300px) {
    .first-block {
        grid-area: 1 / 1 / 2 / 3;
    }

    .second-block {
        grid-area: 2 / 1 / 3 / 2;
        height: 571px !important;
    }

    .third-block {
        grid-area: 2 / 2 / 3 / 4;
    }
}

@media screen and (max-width: 850px) {
    .first-block {
        grid-area: auto;
    }

    .second-block {
        grid-area: auto;
    }

    .third-block {
        grid-area: auto;
    }
}

.btn-wrapper {
    margin-left: auto;
}

.btn-wrapper .outlined-btn {
    background-color: transparent;
    color: #6191ef;
    border-color: #6191ef;
    border-radius: 4px;
}

.deal-status {
    background: #E4E7FF;
    border-radius: 4px;
    color: #72768F;
    font-weight: 600;
    font-size: 14px;
    padding: 3px 10px;
}

.deal-completed-total {
    margin-left: auto;
    color: #FF4754;
    font-size: 18px;
    font-weight: 500;
}

.deal-deadline span {
    font-weight: 600;
    font-size: 14px;
    color: #000000;
}

.modal-preset {
    background: #FFFFFF;
    border: 1px solid #E2E3ED;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    color: #6191ef;
    padding: 15px 20px;
    margin-bottom: 10px;
    font-weight: 600;
    font-size: 14px;
    width: 100%;
}

.constuctor-link {
    font-weight: 600;
    font-size: 12px;
    color: #6191EF;
}

.modal-btn {
    width: 200px;
    margin-left: auto;
    margin-top: 20px;
}

.green {
    background-color: #77BF6C !important;
}

.btn-grey {
    border: none;
    background-color: #9194A9;
    padding: 8px 10px;
    border-radius: 4px;
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;
}

.pointer-none {
    pointer-events: none;
    cursor: default;
}