:root {
    --table-head-gradient: linear-gradient(#f6d20e, #e4c000);
    --transition: .3s;
    --color-primary: #2f737C;
    --light-gray: #858585;
    --extra-light-gray: #E0E0E0;
}

/* Common styles */
.mak-app-btn {
    margin: 10px auto;
    padding: 5px 10px;
    display: block;
    border-radius: 5px;
    box-shadow: none;
    border: 1px solid;
    transition: .3s;
}

.mak-app-btn:hover {
    filter: brightness(90%);
}

.text-blue {
    color: #1A66C0;
}

.text-red {
    color: #9c2121;
}

.text-green {
    color: #0F835C;
}

.mak-app__button {
    padding: 5px 10px;
    border-radius: 5px;
    box-shadow: none;
    border: 1px solid;
    transition: .3s;
}

.mak-app__button:hover {
    filter: brightness(90%);
}

.button-primary {
    background: var(--color-primary);
    color: #ffffff;
    border-color: #1f636C;
}

/* /Common styles */

/* ZM operations page styles */

.ignored-zm-transactions, .unbound-zm-transactions {
    display: grid;
    width: 100%;
}

.ignored-zm-transactions > div, .unbound-zm-transactions > div {
    display: grid;
    grid-template-columns: 12.5% 12.5% 12.5% 12.5% 12.5% 12.5% 12.5% 12.5%;
    grid-template-rows: auto;
}

.unbound-zm-transactions__head, .ignored-zm-transactions__head{
    align-items: center;
    background: var(--table-head-gradient);
}

.unbound-zm-transactions__head .head__cell, .ignored-zm-transactions__head .head__cell {
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    padding: 5px;
    color: #000000;
}

.unbound-zm-transactions__list-item, .ignored-zm-transactions__list-item {
    align-items: center;
    border-bottom: 1px solid #e0e0e0;
}

.unbound-zm-transactions__list-item > div, .ignored-zm-transactions__list-item > div {
    width: 100%;
    padding: 5px;
}

.unbound-zm-transactions__list-item div[data-ui] a, .ignored-zm-transactions__list-item div[data-ui] a {
    display: block;
    text-decoration: none;
}

/* modals */

.mak-app-modal {
    display: flex;
    flex-direction: column;
    width: 360px;
    position: fixed;
    left: calc(50% - 180px);
    top: 20%;
    z-index: 100001;
    background: #FDFDFD;
}

.mak-app-modal__background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: #000000;
    opacity: 0.3;
    z-index: 100000;
}

.mak-app-modal__close-btn {
    cursor: pointer;
    font-size: 18px;
    color: #CC0000;
    width: max-content;
    align-self: end;
    margin: 5px 10px;
}

.modal__group {
    display: flex;
    flex-direction: column;
    margin-bottom: 5px;
    padding: 0 10px;
}

.modal__group input, .modal__group textarea {
    border: 1px solid #E9E9E9 !important;
    border-radius: 5px;
    padding: 5px;
    box-shadow: none;
}

.modal__search-orders-result {
    display: flex;
    flex-direction: column;
    max-height: 200px;
    overflow-y: scroll;
    overflow-x: clip;
}

.modal__search-orders-result span {
    border: 1px solid #E9E9E9;
    margin: 2px 0;
    padding: 5px;
    transition: .3s;
    cursor: pointer;
}

.modal__search-orders-result span:hover {
    background: #DBF9FE;
}

.mak-app-modal__save-btn {
    background: #2F737C;
    color: #fff;
    border-color: #1F636C;
}

.mak-app__modals__additional {
    display: flex;
    flex-direction: column;
    position: fixed;
    width: 360px;
    left: calc(50% - 180px);
    top: 25vh;
    z-index: 100004;
    background: #FDFDFD;
}

.mak-app__modals__additional.mak-app__confirmation-modal {
    z-index: 100001;
}

.modal__group[data-is-payment], .modal__group[data-is-correction] {
    display: none;
}
.modal__group[data-is-payment].active, .modal__group[data-is-correction].active {
    display: flex;
}

/*todo: specify success, fail and other information style */

.mak-app__additional-modal__message-block {
    padding: 10px 20px;
}

.mak-app__additional-modal__message-block.success {
    color: green;
}

.mak-app__additional-modal__message-block.fail {
    color: darkred;
}

.mak-app-background__additional {
    z-index: 100002;
}
/* /modals */

/* car catalog */

.catalog-item-text.unpublished, .catalog-item__car-name.unpublished {
    color: darkred;
}

/* /car catalog */

/* order module */

span[data-add-transaction] {
    cursor: pointer;
    font-size: 18px;
    font-weight: bold;
}

.add-transaction__dropdown {
    display: none;
}

span[data-add-transaction]:focus + .add-transaction__dropdown {
    display: grid;
    grid-template-columns: auto;
    width: max-content;
    position: absolute;
    background: #FFFFFF;
    box-shadow: 0 0 5px #00000027;
}

.add-transaction__dropdown > span {
    padding: 5px 10px;
    cursor: pointer;
    transition: .3s;
    color: #2F737C;
}

.add-transaction__dropdown > span:hover {
    filter: brightness(80%);
}

.existing-transactions {
    overflow-y: scroll;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #2f737C #F9F9F9;
    max-height: 400px;
}

.existing-transaction {
    display: grid;
    border: 1px solid #E9E9E9;
    margin: 0 0 5px 0;
}

.existing-transaction .modal__grid {
    display: grid;
    margin: 5px 5px 0;
    padding-bottom: 5px;
}

.existing-transaction .modal__grid:first-child {
    grid-template-columns: 33.3% 33.3% 33.3%;
    border-bottom: 1px solid #EFEFEF;
}

.existing-transaction .modal__grid:nth-child(2) {
    border-bottom: 1px solid #EFEFEF;
}

.existing-transaction .modal__grid:last-child {
    grid-template-columns: 66.6% 33.3%;
}

.existing-transaction .modal__grid:first-child div:nth-child(2) {
    text-align: center;
}

.existing-transaction .modal__grid:first-child div:last-child,
.existing-transaction .modal__grid:last-child div:last-child {
    text-align: right;
}

span[data-use-transaction] {
    color: #2F737C;
    transition: .3s;
    cursor: pointer;
}

span[data-use-transaction]:hover {
    filter: brightness(80%);
}
/* /order module */

/* car models - edit model form modal */

.show-request-details__modal {
    position: fixed;
    top: 20%;
    left: 25%;
    width: 50%;
    background: #f9f9f9;
    display: grid;
    grid-template-columns: 20% 20% 20% 20% 20%;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.edit-car-model__modal, .show-request-details__modal {
    z-index: 100001;
}

.model-requests {
    display: grid;
    width: 100%;
    margin-bottom: 30px;
}

.model-requests__header, .model-requests__request {
    display: grid;
    grid-template-columns: 10% 30% 20% 20% 20%;
    border-bottom: 1px solid #E0E0E0;
}

.model-requests__request:nth-child(2n) {
    background: #F9F9F9;
}

.model-requests__header {
    background: linear-gradient(#f6d20e, #e4c000);
    color: #0F0F0F;
}

.model-requests__request-type, .model-requests__header > div {
    padding: 5px;
    text-align: center;
    font-weight: bold;
}

.model-requests__request-type {
    background: #F0F0F0;
    border-bottom: 1px solid #E0E0E0;
}

.model-requests__header > div, .model-requests__request > div {
    padding: 5px;
}

.model-requests__request > div:nth-child(1), .model-requests__request > div:nth-child(4) {
    text-align: center;
}

.model-requests__request > div:last-child {
    text-align: right;
}

.show-request-details__modal > div {
    display: grid;
    margin: 0 0 15px 0;
}

.show-request-details__modal a[data-close], .show-request-details__modal a[data-cancel],
.show-request-details__modal a[data-confirm] {
    cursor: pointer;
}
/* /car models - edit model form modal */

/* car models search */

.published p[data-target], .car-model-search {
    display: inline-block;
}

.car-model-search input {
    border: 1px solid #E9E9E9 !important;
    border-radius: 3px;
    box-shadow: none;
    margin: 0 0 0 10px;
}

.search-result-euro-cell {
    display: grid;
    grid-template-columns: auto auto;
}

.search-result-euro-cell > div:first-child {
    align-self: center;
    padding: 0 5px 0 0;
}

table tr th.table__head__cell-with-checkbox {
    display: flex;
    height: 100%;
    justify-content: space-evenly;
    align-items: center;
}

.unpublished-model {
    font-style: italic;
}
.unpublished-model::before {
    content: "* ";
}

/* /car models search */

/* car models codes */

.codes-list__code {
    display: grid;
    width: auto;
    border: 1px solid #E9E9E9;
    padding: 5px;
    margin-left: 15px;
    grid-template-columns: 6% 20% 20% 20% 20% 7% 7%;
}

.codes-list__deleted-code {
    background: #9c212122;
    color: #9c2121;
}

.code__btn {
    cursor: pointer;
    transition: .3s;
    align-self: center;
}

.code__btn:hover {
    filter: brightness(80%);
}

.code__btn-primary {
    color: #2f737C;
}

.code__btn-danger {
    color: #9c2121;
}

.code-details__container {
    display: grid;
    grid-template-columns: 50% 50%;
}

.details__item {
    border: 1px solid #E9E9E9;
    padding: 5px;
}

.codes-table, .codes-and-models__statistics {
    display: grid;
}

.codes-table__codes {
    display: none;
}

.codes-table__codes.active {
    display: block;
}

.codes-table__head, .codes-table__code {
    display: grid;
    grid-template-columns: 3% 22% 8% 10% 10% 10% 10% 8% 9% 10%;
}

.codes-and-models__header {
    display: grid;
    grid-template-columns: 34% 33% 33%;
    align-items: center;
}

.codes-and-models__header > div {
    width: 100%;
    text-align: center;
    border: 1px solid #888888;
    border-right: none;
    border-left: none;
    color: #000000;
    height: 100%;
}

.codes-and-models__header > div:first-child {
    border-left: 1px solid #888888;
    border-right: 1px solid #888888;
}

.codes-and-models__header .statistics-area {
    display: grid;
}

.statistics-area .statistics {
    display: grid;
    grid-template-columns: 25% 25% 25% 25%;
}

.statistics-area .statistics > div {
    border-right: 1px solid #888888;
}

.statistics-area > div:first-child {
    border-bottom: 1px solid #888888;
    border-right: 1px solid #888888;
}

.codes-table__full-code-info {
    display: none;
    grid-template-columns: 16.66% 16.66% 16.66% 16.66% 16.66% 16.67%;
}

.codes-table__full-code-info > div:last-child {
    display: flex;
    flex-direction: column;
}

.codes-table__code {
    display: none;
}

.codes-table__code.active, .codes-table__full-code-info.active {
    display: grid;
}

.codes-table__head, .codes-and-models__header, .table_head {
    background: linear-gradient(#f6d20e, #e4c000);
    color: #0F0F0F;
}

.codes-table__head > div, .codes-table__code > div, .codes-table__full-code-info > div {
    border: 1px solid #888888;
    border-right: none;
    border-top: none;
    padding: 5px;
    text-align: center;
}

.codes-table__head > div:first-child, .codes-table__code > div:first-child {
    display: inline-flex;
    justify-content: center;
}

.codes-table__head > div:last-child, .codes-table__code > div:last-child, .codes-table__full-code-info > div:nth-child(6n) {
    border-right: 1px solid #888888;
}

.codes-table__code > div {
    word-wrap: break-word;
}

.codes-table__codes {
    border-bottom: 1px solid #888888;
}

.codes-table__code:last-child > div, .codes-table__full-code-info:last-child > div {
    border-bottom: none;
}

.codes-table__show-codes {
    border: 1px solid #888888;
    border-top: none;
    padding: 5px;
}

.codes-table__codes a[data-remove] {
    color: #9c2121;
    transition: .3s;
}

.codes-table__codes a[data-remove]:hover {
    filter: brightness(90%);
}

.code-control-buttons {
    display: none;
    width: 360px;
    position: fixed;
    bottom: 3%;
    left: calc(50% - 180px);
    background: #FFFFFF;
    border: 1px solid #C0C0C0;
    border-radius: 3px;
    box-shadow: 0 0 5px #00000099;
    z-index: 100000;
}

.code-control-buttons.active {
    display: flex;
}

.codes-and-models__data > div {
    border: 1px solid #888888;
    border-top: none;
}

.statistics__block {
    display: grid;
    grid-template-columns: 34% 8.25% 8.25% 8.25% 8.25% 8.25% 8.25% 8.25% 8.25%;
}

.statistics__block > div {
    padding: 5px;
    width: 100%;
    text-align: center;
    border-right: 1px solid #888888;
}

.statistics__block > div:first-child {
    text-align: left;
}

.statistics__block > div:last-child {
    border: none;
}

/* /car models codes */

/* car catalog switch */

.catalog-view-switch__container {
    width: 35%;
    margin: 0 0 25px 0;
}

.catalog-view-switch__title {
    margin: 0 0 5px 0;
}

/* /car catalog switch */

/* create new model modal */

.modal__add-model-to-list .current-model, .modal__add-new-model .current-model {
    text-align: center;
}

/* /create new model modal */

/* add model to list modal */

.button.add-models-to-list-group {
    position: fixed;
    width: 300px;
    bottom: 20px;
    left: calc(50% - 150px);
}

.tab-model button {
    margin: 0 0 0 3px;
}

.tooltip {
    display: none;
    width: 26px;
    padding: 3px;
    border: 1px solid #888;
    border-radius: 13px;
    text-align: center;
    cursor: pointer;
    align-self: center;
}

.tooltip.active {
    display: block;
}

.mak-app-modal.tooltips-list {
    width: 660px;
    display: grid;
    left: calc(50% - 330px);
    max-height: 65vh;
    overflow-y: auto;
}

.mak-app-modal.tooltips-list .mak-app-modal__close-btn {
    justify-self: end;
}

.tooltip-item {
    display: grid;
    grid-template-columns: 10% 10% 15% 5% 35% 15% 10%;
    border-bottom: 1px solid #888888;
}

.tooltip-item:nth-child(2n) {
    background: #F0F0F0
}

.tooltip-item > div {
    padding: 5px;
}

.tooltip-item a.choose-btn {
    cursor: pointer;
    text-align: center;
}

/* /add model to list modal */

/* unpublished models list */

.short-model-info__table {
    display: grid;
}

.short-model-info__table-head {
    display: grid;
    grid-template-columns: 10% 50% 30% 10%;
    background: linear-gradient(#f6d20e, #e4c000);
    color: #0F0F0F;
    text-align: center;
    border-top: 1px solid #888888;
    border-bottom: 1px solid #888888;
}

.short-model-info__table-head > div, .short-model-info__table-body > div > div {
    padding: 5px;
    border-right: 1px solid #888888;
}

.short-model-info__table-head > div:first-child, .short-model-info__table-body > div > div:first-child,
.short-model-info__table-body > div > div:nth-child(8n+1) {
    border-left: 1px solid #888888;
}

.short-model-info__table-body > div > div:nth-child(n+3) {
    text-align: center;
}

.short-model-info__table-body > div.active {
    display: grid;
    border-bottom: 1px solid #888888;
}

.short-model-info__table-body > div {
    display: none;
}

.short-model-info__table-body > div:nth-of-type(odd) {
    grid-template-columns: 10% 50% 15% 15% 10%;
}

.short-model-info__table-body > div:nth-of-type(even) {
    grid-template-columns: 12.5% 12.5% 12.5% 12.5% 12.5% 12.5% 12.5% 12.5%;
}

.short-model-info__table-body input, .short-model-info__table-body select {
    width: 100%;
    border: 1px solid #E0E0E0 !important;
    border-radius: 5px;
    appearance: textfield;
    padding: 9px 10px 7px 10px;
}

/* /unpublished models list */

/* user codes and models statistics page */

.codes-full-list, .models-full-list {
    display: none;
}

.codes-full-list.active, .models-full-list.active {
    display: grid;
}

.codes-full-list__head {
    display: grid;
    grid-template-columns: 20% 12.5% 10% 12.5% 12.5% 12.5% 10% 10%;
    background: linear-gradient(#f6d20e, #e4c000);
    color: #0F0F0F;
    text-align: center;
    border-top: 1px solid #888888;
    border-bottom: 1px solid #888888;
}

.codes-full-list__body {
    display: grid;
}

.codes-full-list__code-short, .codes-full-list__code-full {
    display: none;
    grid-template-columns: 20% 12.5% 10% 12.5% 12.5% 12.5% 10% 10%;
    border-bottom: 1px solid #888888;
}

.codes-full-list__code-full {
    grid-template-columns: auto auto auto auto auto auto auto;
}

.codes-full-list__code-short.active, .codes-full-list__code-full.active {
    display: grid;
}

.codes-full-list__head > div, .codes-full-list__code-short > div, .codes-full-list__code-full > div, .models-full-list__head > div, .models-full-list__model > div {
    padding: 5px;
    text-align: center;
    border-right: 1px solid #888888;
    word-break: break-word;
}

.codes-full-list__head > div:first-child, .codes-full-list__code-short > div:first-child,
.codes-full-list__code-full > div:first-child, .models-full-list__head > div:first-child,
.models-full-list__model > div:first-child, .codes-full-list__code-full > div:nth-child(8) {
    border-left: 1px solid #888888;
}

.codes-full-list__code-full > div:nth-child(-n+7) {
    border-bottom: 1px solid #888888;
}

.codes-full-list__code-short > div:first-child {
    text-align: left;
}

.codes-full-list__code-short.published, .codes-full-list__code-full.published, .models-full-list__model.published {
    background: #DDFFDD;
}

.codes-full-list__code-short.deleted, .codes-full-list__code-full.deleted, .models-full-list__model.deleted {
    background: #FFDDDD;
}

.models-full-list__body {
    display: grid;
}

.models-full-list__head {
    display: grid;
    grid-template-columns: 10% 12.5% 10% 10.5% 9% 10% 18% 10% 10%;
    background: linear-gradient(#f6d20e, #e4c000);
    color: #0F0F0F;
    text-align: center;
    border-top: 1px solid #888888;
    border-bottom: 1px solid #888888;
}

.models-full-list__model {
    display: grid;
    grid-template-columns: 10% 12.5% 10% 10.5% 9% 10% 18% 10% 10%;
    border-bottom: 1px solid #888888;
}

/* /user codes and models statistics page */

/* join car models */

.setup-section {
    display: grid;
}

.setup-section input, .models-for-join__search-block input {
    border: 1px solid #888 !important;
    width: 200px;
    padding: 7px 0 7px 10px;
    margin: 0 0 25px 0;
}

.model-data__item span[data-restore] {
    font-size: 18px;
    color: var(--color-primary);
}

.models-for-join__search-block input {
    margin: 0 5px 0 0;
}

.main-model-results, .similar-models__list, .models-for-join__results, .selected-models-for-join__list {
    display: none;
    height: auto;
    max-height: 200px;
    overflow-y: auto;
    margin: 0 auto 30px 0;
    padding: 0;
    list-style: none;
}

.main-model-results.active, .similar-models__list.active, .models-for-join__results.active, .selected-models-for-join__list.active {
    display: block;
}

.main-model-results li, .similar-models__list li, .models-for-join__results li {
    cursor: pointer;
    margin: 0 0 5px 0;
    transition: var(--transition);
}

.main-model-results li:hover, .similar-models__list li:hover, .models-for-join__results li:hover {
    color: var(--color-primary);
}

.selected-models-for-join__list li {
    transition: var(--transition);
    margin: 0 0 5px 0;
}

.selected-models-for-join__list li span.remove-selected-joining-model {
    color: #CC0000;
    font-size: 15px;
    margin-left: 10px;
    line-height: 1;
    cursor: pointer;
}

.main-model__data {
    display: grid;
    grid-template-columns: 20% 20% 20% 20% 20%;
    margin: 0 auto 30px;
}

.model-data__item {
    display: flex;
    flex-direction: column;
    padding: 5px;
}

.model-data__item input[data-name], .model-data__item select[data-name] {
    border: 1px solid #888;
    padding: 5px 10px;
}

.joining-model-data {
    display: flex;
    justify-content: space-between;
    padding: 2px 10px;
    word-break: break-word;
}

.joining-model-data span.use-selected-value {
    color: var(--color-primary);
    font-weight: bold;
    cursor: pointer;
}

span[data-toggle-result], span[data-toggle-similar], span[data-toggle-models-for-join] {
    display: none;
    color: var(--color-primary);
    transition: var(--transition);
    margin: 5px 10px 0 auto;
    width: 185px;
    cursor: pointer;
}

span[data-toggle-result].active, span[data-toggle-similar].active, span[data-toggle-models-for-join].active {
    display: block;
}

span[data-toggle-result]:hover, span[data-toggle-similar]:hover {
    filter: brightness(85%);
}

.models-for-join {
    display: none;
}

.models-for-join.active {
    display: block;
}

.models-for-join__search-block {
    display: flex;
}

/* /join car models */

/* add new code */

.modal__add-new-code .tabs-group > div
{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 5px;
}

.modal__add-new-code .tabs-group > div input
{
    width: 63%;
    outline: none;
    padding: 5px 10px;
    border-color: var(--light-gray) !important;
}

.modal__add-new-code .tabs-group > div label
{
    width: 35%;
    text-align: right;
}

/* /add new code */

/* order page: copy buttons */

.copy-buttons
{
    display: none;
}

.copy-buttons.active
{
    display: flex;
    flex-direction: column;
    position: absolute;
    margin: -165px 0 0 440px;
    padding: 5px;
    background: white;
}

.copy-buttons button {
    margin-bottom: 5px;
}

.copy-buttons.active.edit-order-page {
    margin: -213px 0 0 385px;
}

@media (max-width: 450px) {
    .copy-buttons.active
    {
        margin: -149px 0 0 75px;
        padding: 5px;
        background: white;
    }
    .copy-buttons.active.edit-order-page {
        margin: -200px 0 0 55px;
    }
}

.demand-for-products-order, .demand-for-products-lid
{
    display: none;
}

.demand-for-products-order.active, .demand-for-products-lid.active
{
    display: flex;
    flex-direction: column;
    position: absolute;
    margin: -165px 0 0 167px;
    padding: 5px;
    background: white;
}

.demand-for-products-lid.active {
    margin: -165px 0 0 0;
}

.demand-for-products-order input, .demand-for-products-lid input  {
    margin-bottom: 5px;
}

.demand-for-products-order.active.edit-order-page, .demand-for-products-lid.active.edit-order-page {
    margin: -213px 0 0 385px;
}

@media (max-width: 450px) {
    .demand-for-products-order.active, .demand-for-products-lid.active
    {
        margin: -149px 0 0 75px;
        padding: 5px;
        background: white;
    }
    .demand-for-products-order.active.edit-order-page, .demand-for-products-lid.active.edit-order-page {
        margin: -200px 0 0 55px;
    }
}

.wrapper-save-demand-for-products-search {
    display: block;
    margin-top: 20px;
}

/* /order page: copy buttons */

/* clients page */

.clients-table {
    display: grid;
}

.clients-table__row {
    display: grid;
    grid-template-columns: 3% 5% 13% 25% 8% auto 13%;
}

.clients-table__row.table_head {
    text-align: center;
    font-weight: bold;
}

.clients-table__row:nth-child(2n) {
    background: var(--extra-light-gray);
}

.clients-table__cell {
    padding: 5px 10px;
}

.clients-table__cell:nth-child(1), .clients-table__cell:nth-child(4) {
    text-align: center;
}

.clients-table__cell:last-child {
    display: flex;
    flex-direction: column;
    text-align: right;
}

.clients-page.pagination ul {
    display: flex;
    list-style: none;
}

.clients-page.pagination li {
    margin: 0 1rem 0 0;
}

.clients-page.pagination li a {
    padding: 6px 10px;
    border: 1px solid var(--color-primary);
    background: #fff;
    color: var(--color-primary);
    text-decoration: none;
    transition: .3s;
}

.clients-page.pagination li a:hover, .clients-page.pagination li .current {
    color: #fff;
    background: var(--color-primary);
}

.clients-search-form {
    margin: 20px 0;
}

.clients-search-form form {
    display: flex;
    width: 100%;
    align-items: center;
}

.clients-search-form input, .clients-search-form button,
.clients-search-form label, .clients-search-form a {
    padding: 5px 10px;
    margin: 0 5px 0 0;
}

.clients-search-form label {
    padding-left: 0;
}

.clients-search-form input {
    width: 200px;
    outline: none;
}

.clients-search-form input, .clients-search-form button, .clients-search-form a {
    box-sizing: border-box;
    border: 1px solid var(--color-primary);
    outline: none;
    line-height: 18px !important;
    font-size: 13px !important;
}

.clients-search-form a {
    text-decoration: none;
}

.clients-table__buttons {
    display: none;
    width: 360px;
    position: fixed;
    left: calc(50% - 180px);
    bottom: 5%;
    z-index: 100;
}

.clients-table__buttons.active {
    display: block;
}

.remove-clients-btn {
    padding: 5px 10px;
    border: none;
    transition: .3s;
    display: block;
    margin: 0 auto;
}

.clients-table__row.client-disabled {
    background: #FFCCCC;
}

.base-client-info
{
    text-align: center;
    display: flex;
    flex-direction: column;
}

.base-client-info.client-is-active::before {
    content: "✔ активен";
    align-self: end;
    margin: 0 10px 0 0;
    color: #008000FF;
}

.base-client-info.client-is-inactive:before
{
    content: "❌ неактивен";
    align-self: end;
    margin: 0 10px 0 0;
}

.client-info__edit-section {
    display: flex;
}

.client-info__edit-section__items {
    width: 35%;
}

.client-info__edit-section__editor-section {
    width: 65%;
    padding: 0 0 0 10px;
}

.extra-client-info p {
    text-align: center;
    font-weight: bold;
}

.extra-client-info ul {
    list-style: none;
}

.client-name-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 20px;
}

.client-name-block p {
    margin: 0;
    padding: 0;
}

.client-name-block a {
    font-size: 18px;
    text-decoration: none;
    color: unset;
    cursor: pointer;
    padding: 3px;
}

.client-order-block {
    text-align: center;
    margin: 0 0 5px 0;
}

.base-client-info label {
    align-self: end;
    margin: 5px 40px 0 0;
}

.base-client-info textarea {
    width: 100%;
    border: 1px solid var(--extra-light-gray) !important;
    box-shadow: none;
}

.extra-client-info a {
    cursor: pointer;
    text-decoration: none;
}

.extra-client-info ul {
    margin: 0 40px;
    padding: 0;
}

.extra-client-info li {
    display: flex;
    margin: 5px 0;
    align-items: center;
}

.extra-client-info input {
    box-shadow: none;
    border: 1px solid var(--extra-light-gray) !important;
    width: 100%;
}

.edit-client-modal button {
    border: none !important;
    padding: 5px;
}

.mak-app__text-input-with-signature.mak-app__form-component.juridical-info-block, .mak-app__textarea-with-signature.mak-app__form-component.juridical-info-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* /clients page */

/* order page: clients */

.client-phones, .client-names, .client-addresses
{
    display: flex;
    flex-direction: column;
}

.client-phones p.client-phone, .client-names a.client-name, .client-addresses a.client-address {
    display: flex;
    padding: 3px 10px;
    margin: 0;
    cursor: pointer;
    justify-content: space-between;
}

.client-phones p.client-phone:hover, .client-names a.client-name:hover, .client-addresses a.client-address:hover {
    background: var(--extra-light-gray);
}

.client-phones .client-phone span:last-child
{
    rotate: 135deg;
}

td.client-phone {
    display: flex;
    align-items: start;
}

td.client-phone .form-group {
    margin: 0;
}

td.client-phone input {
    min-width: 125px;
}

.edit-client-btn {
    rotate: 135deg;
    padding: 5px;
    text-decoration: none;
    color: var(--color-primary);
    filter: brightness(150%);
    cursor: pointer;
    font-size: 1rem;
    margin: 20px 0 0 0;
}

.edit-client-btn:hover {
    text-decoration: none;
    color: inherit;
    filter: brightness(100%);
}

/* /order page: clients */

/* edit client modal */

.mak-app-modal.client-info-modal.edit-client-modal {
    width: 450px;
    left: calc(50% - 225px);
}

.mak-app-modal.client-info-modal.edit-client-modal input, .mak-app-modal.client-info-modal.edit-client-modal textarea {
    outline: none;
}

.base-client-info__block.client-email__block input {
    border: none;
    border-bottom: 1px solid var(--light-gray);
}

.mak-app__form-component {
    margin-bottom: 2px;
}

.client-email__block a {
    font-size: 16px;
    padding: 0 5px 0 3px;
    text-decoration: none;
    cursor: pointer;
}

.client-email__block a:hover {
    text-decoration: none;
}

.base-client-info__block.client-juridical-status {
    font-style: italic;
    margin: 10px 0 0 0;
}

.client-info__edit-section__items ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.client-info__edit-section__items ul li {
    border-bottom: 1px solid var(--light-gray);
}

.client-info__edit-section__items ul li a {
    cursor: pointer;
    display:block;
    width: 100%;
    height: 100%;
    padding: 0 0 2px 5px;
    transition: .3s;
}

.client-info__edit-section__items ul li a:hover {
    color: var(--color-primary);
    text-decoration: none;
    background: #f0f0f0;
}

.client-info__edit-section__editor-section h2 {
    font-size: 16px;
    margin: 2px auto 10px 10px;
}

.client-info__edit-section__editor-section h2 .mak-app__button.mak-app__form-component {
    background: none;
    font-size: 12px;
    padding: 0;
    margin: 0 0 0 5px;
}

.client-info__edit-section__editor-section .button {
    display: block;
    width: 50%;
    margin: 10px auto 10px;
}

.client-info__edit-section__editor-section textarea {
    display: block;
    width: 90%;
    margin: 0 0 0 10px;
    border: 1px solid var(--extra-light-gray) !important;
    box-shadow: none;
}

.mak-app__text-input-with-signature.mak-app__form-component {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px 0 10px;
}

.mak-app__text-input-with-signature.mak-app__form-component.client-messenger {
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: 0 0 10px 0;
}

.mak-app__text-input-with-signature.mak-app__form-component.client-messenger select {
    margin: 0 0 5px 0;
    border: 1px solid var(--extra-light-gray);
    border-radius: 5px;
    padding: 5px 15px;
}

.mak-app__text-input-with-signature.mak-app__form-component.client-messenger input {
    margin: 0 5px 0 0;
    border: 1px solid var(--extra-light-gray) !important;
    box-shadow: none;
    border-radius: 5px;
}

.mak-app__checkbox-with-label.mak-app__form-component.is-juridical-checkbox {
    margin: 0 0 0 25px;
}

.juridical-info-block, .payment-details-block {
    display: none;
}

.juridical-info-block.active, .payment-details-block.active {
    display: block;
    margin: 10px 0 0 0;
}

.mak-app__text-input-with-signature.mak-app__form-component.juridical-info-block,
.mak-app__textarea-with-signature.mak-app__form-component.juridical-info-block {
    padding: 0 10px;
    justify-content: space-between;
    margin: 0 0 2px 0;
}

.mak-app__textarea-with-signature.mak-app__form-component.juridical-info-block textarea {
    width: 100%;
}

.mak-app__form-component input {
    border: 1px solid var(--extra-light-gray) !important;
    box-shadow: none;
}

.mak-app__textarea.mak-app__form-component.client-address,
.mak-app__textarea.mak-app__form-component.payment-details  {
    text-align: right;
}

.mak-app__textarea.mak-app__form-component.client-address button,
.mak-app__textarea.mak-app__form-component.payment-details button{
    margin: 2px 20px 0 0;
}

.mak-app__text-input-with-signature.mak-app__form-component.client-car {
    justify-content: normal;
    flex-wrap: wrap;
}

.mak-app__text-input-with-signature.mak-app__form-component.client-car input {
    margin: 0 5px 0 0;
}

.mak-app__text-input-with-signature.mak-app__form-component.client-car div[data-found-cars] {
    width: 100%;
    max-height: 350px;
    overflow-y: scroll;
}

.found-car-item {
    margin: 0 0 5px 10px;
    transition: .3s;
    cursor: pointer;
}

.found-car-item:hover {
    background: #f0f0f0;
}
/* /edit client modal */

.sel_lang.reserve > h3 > span {
    font-size: 16px;
}

.search-glasses-euro, .search-mobis-car {
    display: block;
    width: 100%;
    margin: 10px 0;
}

.search-glasses-euro span, .search-mobis-car span {
    display: inline-block;
    border: 1px solid #000;
    border-radius: 3px;
    margin: 3px 3px 3px 0;
    padding: 3px;
    background-color: #2F737C;
    color: #fff !important;
    text-decoration: none !important;
    cursor: pointer;
}

td[data-distributor-full-name] {
    text-decoration: underline;
    color:#1a66fa;
    cursor: pointer;
}

.table-orders-filter-by-date {
    border-bottom: 1px dotted #000;
    cursor: pointer;
}

/* start popup-incoming-call*/

.popup-incoming-call {
    display: block;
    position: fixed;
    right:20px;
    top:20px;
    width: 350px;
    height: auto;
    border: 1px solid #07545E;
    padding: 20px;
    text-align: center;
    background: #f5feff;
}
.popup-incoming-call-close, .popup-incoming-call-close:hover {
    position: absolute;
    top:5px;
    right: 5px;
    text-decoration: none;
}
.popup-incoming-call-phone {
    color: #07545E;
    font-size: 20px;
    font-weight: bold;
    display: block;
    text-align: center;
    background: #fff;
    padding: 5px 0;
    border: 1px solid #07545E;
    border-radius: 10px;
    margin-top: 5px;
}
.popup-incoming-call small{
    display: block;
    font-weight: bold;
    font-size: 13px;
    margin-top: 10px;
}
#popup-incoming-call-create-order,
#popup-incoming-call-create-demand,
#popup-incoming-call-create-lid {
    margin: 10px auto;
}
.call-ok {
    /*color: #0F835C;*/
}
.call-error {
    /*color: red;*/
}
.search-distributor-reserve {
    border-bottom: 1px dotted #000;
    cursor: pointer;
}
/* end popup-incoming-call*/

.button-call {
    display: inline-block;
    cursor: pointer;
    width: 15px;
    height: 15px;
    background: url("/images/icon-phone.png");
    background-size: 15px;
}
.popup-orders-calls-edit {
    display: inline-block;
    cursor: pointer;
    width: 15px;
    height: 15px;
    background: url("/images/icon-info.svg");
    background-size: 15px;
}
.popup-orders-calls-edit.active {
    background: url("/images/icon-info-active.svg");
    background-size: 15px;
}
.popup-orders-calls-edit-orders-count {
    display: inline-block;
    color:#F4CF12;
    position: absolute;
    margin: -1px 0 0 15px;
    font-size: 12px;
}
.wrapper-agreements-enter {
    position: relative;
}
#agreements-enter, #agreements-enter:hover {
    border: 1px solid;
    position: absolute;
    bottom:1px;
    right: 1px;
    text-decoration: underline;
    color:#fff;
    padding: 0 5px;
    background-color: #2F737C;
}
.basket-clear, .basket-clear:hover {
    color:#F4CA22;
    display: block;
    margin-bottom: 10px;
    font-size: 10px;
}
.order-margin {
/*    position: absolute;
    margin-top: -50px;
    right: 2px;*/
}
.order-margin span {
    color:#2f737C;
}
.missing-call {
    padding: 2px 3px;
    background: #000;
    color: #ffff00;
    cursor: pointer;
}
.popup-lid-order th{
    padding: 5px;
    white-space:nowrap;
    background: #F7D409;
}
.popup-lid-order td {
    padding: 5px;
    border-bottom: 1px solid;
}
.popup-lid-order td.center {
    text-align: center;
}

.popup-lid-order input {
    width:70px !important;
    text-align: center;
}
.check_reserve_supplier_block, .check_delivery_ordered_block, .check_basket_avail_block {
    margin-top: 2px;
    font-size: 11px;
}
.basketItemLineClassDefault td.paymentSafronov,
.basketItemLineClassReserveSupplier td.paymentSafronov,
.basketItemLineClassDeliveryOrdered td.paymentSafronov ,
.basketItemLineClassAvailable td.paymentSafronov {
    background-color: #ffefce !important;
}

.basketItemLineClassDefault td {
    background-color: #f2caa7 !important;
}

.basketItemLineClassReserveSupplier td {
    background-color: #e0ffe0 !important;
}

.basketItemLineClassDeliveryOrdered td {
    background-color: #e2d3dd !important;
}

.basketItemLineClassAvailable td {
    color:#000;
    background-color: #05B04F !important;
}

.check_reserve_supplier_number {
    width: 110px;
    padding: 5px;
    margin-bottom: 2px;
}

.check_reserve_supplier_number::placeholder {
    color: #c4c4c4;
    opacity: 1; /* Firefox */
}

.paymentBasketItem {
    display: block;
    margin-top: 3px;
}
.executionDateHide {
    display: none;
}
.executionDateNoValue {
    display: inline-block;
    color: #0aa89e;
    border-bottom: 1px dashed #0aa89e;
    text-decoration: none;
    cursor: pointer;
}
#time-list .time-list-execution-dates-count {
    color:red;
}
.incoming, tr.incoming td {
    background-color: #ccfccc !important;
}
.outgoing, tr.outgoing td {
    background-color: #afeeee !important;
}
.missed, tr.missed td {
    background-color: #ffcbc9 !important;
}
.today, tr.today td {
    background-color: #fff5c4 !important;
}
.manager-name {
    background-color: #ccfccc;
    display: inline-block;
}
.status-partner, .comment-partner, .history-partner {
    display: block;
    background-color: #000;
    color:#fff;
    font-size: 12px;
    padding: 3px;
}
.status-partner span, .comment-partner span, .history-partner span {
    display: inline-block;
    color: #0aa89e;
    border-bottom: 1px dashed #0aa89e;
    text-decoration: none;
    cursor: pointer;
}
.check_delivery_ordered_date {
    display: block;
    width: 100%;
    height: 30px;
    box-sizing: border-box;
    outline: none;
    border: 1px solid #eee !important;
    padding-left: inherit;
    font-size: 12px;
}
.time-intervals-result {
    display: none;
    background: #e0fffb;
    padding: 5px;
}
.time-intervals-result a {
    display: inline-block;
    margin-right: 5px;
    text-align: center;
}
.synonymSearch {
    color:#0645ad;
    font-size: 10px;
    display: inline-block;
    position: absolute;
    margin-left: 5px;
}
.popup-orders-calls {
    position: absolute;
    border: 1px solid green;
    border-radius: 5px;
    min-width: 600px;
    background: #fff;
    padding: 5px;
    z-index: 12;
    margin-top: 10px;
    display: none;
    color: #000;
}

.popup-orders-calls table {
    margin-top: 10px !important;
}

.popup-orders-calls::before, .popup-orders-calls::after {
    content: '';
    position: absolute;
    left: 20px; top: -20px;
    border: 10px solid transparent;
    border-bottom: 10px solid green;
}
.popup-orders-calls::after {
    border-bottom: 10px solid white;
    top: -19px;
}
.order-status-2 td {
    background-color:#C6C6C6 !important;
}
.order-status-3 td {
    background-color:#FE5458 !important;
}
.order-status-4 td {
    background-color:#00afee !important;
}
.order-status-9 td {
    background-color:#05B04F !important;
}
.popup-orders-calls-close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 20px;
    height: 20px;
    background-color: #ccc;
    border: none;
    border-radius: 50%;
    font-size: 14px;
    cursor: pointer;
    z-index: 1001;
    display: inline-block;
    text-align: center;
}
.popup-orders-calls-close-btn:hover {
    background-color: #999;
}
.popup-orders-calls-order-link, .popup-orders-calls-order-link:hover {
    color: #000;
    text-decoration: underline;
}
.expected-revenue-small {
    display: inline-block;
    margin: 10px 0 20px 0;
    font-weight: bold;
    border:1px solid #2F737C;
}
.expected-revenue-small table {
    margin-bottom: 0;
}
.expected-revenue-small table td {
    padding: 10px;
}
.expected-revenue-small span {
    color:#2f737C;
}
.expected-revenue {
    display: none;
}
.expected-revenue h2 {
    margin: 0 0 10px 0;
}
.expected-revenue.show {
    display: block;
}