﻿.purchase-card {
    display: flex;
    flex-direction: column;
    padding: 8px 8px 8px 4px;
    position: relative;
    background: #FFFFFF;
    border-radius: 4px;
    cursor: pointer;
    gap: 16px;
    font: 400 14px 'Inter';
    color: #2C2C2C;
    z-index: 3;
    width: 534px;
    box-shadow: -2px 2px 11px rgba(0, 0, 0, 0.15);
    border: 1px solid transparent;
    border-left: 4px solid transparent;
}

.request-card {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 7px;
    position: relative;
    background: #FFFFFF;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    gap: 8px;
    font: 400 12px 'Inter';
    color: #2C2C2C;
    border: 1px solid #FFFFFF;
    z-index: 3;
    width: 534px;
    cursor: pointer;
    margin-bottom: 0.5em;
}

.request-card:hover,
.request-card-selected{
    background: #F0F5FB;
    border: 1px solid #8F9EAE;
}

.purchase-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    row-gap: 5px;
}

.purchase-card-head div {
    display: flex;
    gap: 16px;
    align-items: center;
}

.purchase-card-wrapper {
    margin-bottom: 0.5em;
}

.purchase-card-left,
.request-card-left {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0px;
    gap: 8px;
    height: 100%;
}

.request-card-left {
    gap: 24px;
}

.purchase-card-right,
.request-card-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0px;
    gap: 8px;
    height: 100%;
}

.purchase-card .font-bold,
.request-card .font-bold {
    font-weight: 500;
}

.purchase-card .label-secondary {
    background: #f0f5fb;
    border-color: #f0f5fb !important;
}

.request-card-wrapper:hover .label-secondary,
.request-card-wrapper .request-card-selected .label-secondary {
    border-color: #8F9EAE !important;
}

.purchase-card .secondary,
.request-card .secondary {
    color: #8F9EAE !important;
}

.purchase-card-border-red .purchase-card {
    border-left: 4px solid #F64E60 !important;
}

.purchase-card-tools {
    gap: 6px;
    position: relative;
    display: flex;
    flex-direction: column;
    right: 10px;
    z-index: 2;
    width: auto;
}

.purchase-card-tools-item {
    padding: 5px 8px 5px 16px;
    width: 0;
    height: 34px;
    border-radius: 0px 4px 4px 0px;
    text-align: center;
    background: #F0F5FB;
    display: block;
    visibility: hidden;
}

.p-doc-details:not(:hover) .purchase-card-tools-item {
    padding: 0;
}

.purchase-card-wrapper:not(:hover) .purchase-card-tools-item:not(.purchase-card-tools-item--active) {
    padding: 0;
}

.purchase-card-tools-item.purchase-card-tools-item--active,
.purchase-card-tools-item.purchase-card-tag,
.p-doc-details:hover .purchase-card-tools-item,
.purchase-card-wrapper:hover .purchase-card-tools-item {
    visibility: visible;
    width: 48px;
}

.purchase-card-wrapper {
    display: flex;
    position: relative;
}

.purchase-card-tag {
    border: 0 !important;
}

.purchase-card-tools-item:hover,
.purchase-card-tools-item--active {
    background: #8F9EAE;
}

.purchase-card-tools-item svg [fill] {
    fill: #8F9EAE;
}

.purchase-card-tools-item:hover svg [fill],
.purchase-card-tools-item--active svg [fill] {
    fill: #FFFFFF;
}

.stages-bar {
    display: flex;
    width: max-content;
    position: relative;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.stages-bar::before {
    position: absolute;
    top: 50%;
    height: 1px;
    width: 100%;
    transform: translate(0%, -50%);
    background: #8F9EAE;
    content: "";
}

.stages-bar .stage-item {
    width: 8px;
    height: 8px;
    background: #8F9EAE;
    border-radius: 50%;
}

.stages-bar .stage-item {
    width: 8px;
    height: 8px;
    background: #8F9EAE;
    border-radius: 50%;
}

.stages-bar .stage-item.stage-special {
    width: 12px;
    height: 12px;
    background: #1BC5BD;
}

.stages-bar .stage-item.stage-current {
    background: #FFA800;
}

.purchase-responsible .symbol-label {
    background: #FFEDCB !important;
    color: #FFA800 !important;
    width: 36px !important;
    height: 36px !important;
}

.purchase-card-tools .purchase-card-tags-select {
    position: relative;
    margin: -3px;
}

.purchase-card-tools .purchase-card-tags-select .ant-select{
    visibility: hidden;
}

.select-tag-item {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 12px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 130%;
    color: #8F9EAE;
    white-space: normal;
}

.purchase-card .purch-card-region {
    display: flex;
    align-items: center;
    gap: 4px;
}

.purchase-card .purch-card-customer,
.purchase-card .purch-card-region,
.request-card .request-card-customer {
    color: #8F9EAE;
}

.purchase-card .purch-card-customer:hover,
.request-card .request-card-customer:hover {
    color: #3996FF;
}

.purchase-card .purch-card-region svg [stroke],
.request-card .request-card-customer svg [stroke] {
    stroke: #8F9EAE;
}

.purchase-card .purch-card-region svg [fill],
.request-card .request-card-customer svg [fill] {
    fill: #8F9EAE;
}

.request-card .request-card-customer:hover svg [stroke] {
    stroke: #3996FF;
}

.purch-card-label {
    font-size: 14px;
    display: flex;
    gap: 8px;
    background: #F0F5FB;
    color: #8F9EAE;
    border-radius: 4px;
    padding: 4px 8px;
    line-height: 130%;
    align-items: center;
}

.purch-card-label svg path[fill] {
    fill: #8F9EAE;
}

.purch-card-label svg path[stroke] {
    stroke: #8F9EAE;
}

.purch-card-label.purch-card-label-blue {
    background: #E1F0FF;
    color: #3996FF;
}

.purch-card-label.purch-card-label-blue svg path[fill] {
    fill: #3996FF;
}

.purch-card-label.purch-card-label-blue svg path[stroke] {
    stroke: #3996FF;
}

.purch-card-label.purch-card-label-red {
    background: #FFE2E5;
    color: #F64E60;
}

.purch-card-label.purch-card-label-red svg path[fill] {
    fill: #F64E60;
}

.purch-card-label.purch-card-label-red svg path[stroke] {
    stroke: #F64E60;
}

.purch-card-price {
    font-weight: 500;
    font-size: 20px;
    line-height: 130%;
    color: #2C2C2C;
}

.purch-card-region-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/*yellow card*/
.purchase-card-wrapper-yellow .purchase-card {
    border-left: 4px solid #FFA800;
}

.purchase-card-wrapper-yellow:not(:hover) .purchase-card {
    background: #FFF5E3;
}

.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-criterions,
.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-region,
.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-customer {
    color: #F68E14 !important;
}

.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-region svg path[fill] {
    fill: #F68E14;
}

.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-label {
    background: #FFEDCB !important;
    color: #F68E14 !important;
    border-color: #FFEDCB !important;
}

.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-label svg path[fill] {
    fill: #F68E14 !important;
}

.purchase-card-wrapper-yellow:not(:hover) .purchase-card .purch-card-label svg path[stroke] {
    stroke: #F68E14;
}

/*blue card*/
.purchase-card-wrapper-blue .purchase-card {
    border-left: 4px solid #3996FF;
}

.purchase-card-wrapper-blue:not(:hover) .purchase-card {
    background: #ecf4fb;
}

.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-criterions,
.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-region,
.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-customer {
    color: #3996FF !important;
}

.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-region svg path[fill] {
    fill: #3996FF;
}

.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-label {
    background: #d5e7f9 !important;
    color: #3996FF !important;
    border-color: #d5e7f9 !important;
}

.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-label svg path[fill] {
    fill: #3996FF !important;
}

.purchase-card-wrapper-blue:not(:hover) .purchase-card .purch-card-label svg path[stroke] {
    stroke: #3996FF;
}

@media (max-width: 991px) {
    .purchase-card-wrapper,
    .purchase-card,
    .request-card,
    #requests-layout__list__items .ant-row {
        width: 100%;
    }

    .purchase-card-wrapper .purchase-card-tools {
        display: none !important;
    }
}

.criterions-compact {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
    font-family: 'Inter';
    font-size: 14px;
    font-weight: 400;
}

.criterions-compact .criterions-compact-tree {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0px;
    gap: 8px;
}

.criterions-compact .criterions-compact-tree .criterions-compact-tree-root {
    font-weight: 600;
}

.criterions-compact .criterions-compact-tree ul {
    padding-left: 35px;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}

.criterions-compact .criterions-compact-tree .criterions-percent {
    font-weight: 600;
}

.criterions-compact .criterions-compact-tree .criterions-percent:after {
    content: '%';
}

.criterions-compact .criterions-compact-tree .criterions-name:before {
    content: '–';
    margin-right: 3px;
}

#tipy.criterions {
    background: #E1F0FF;
    color: #2C2C2C;
    border: 1px solid #8F9EAE !important;
}

#tipy.criterions:before {
    border: 1px solid #8F9EAE;
    border-right: 0;
    border-top: 0;
}

.purchase-card-wrapper .ant-select-dropdown > div{
    width: 200px !important;
}

.purchase-card-wrapper .ant-select-dropdown {
    left: 20px !important;
    top: 0 !important;
}

.purchase-card-tools-item.ant-select {
    padding: 0;
}

.purchase-card-tools-item.ant-select .ant-select-selector {
    height: 100%;
    padding: 5px 8px 5px 16px;
}

.purchase-card-tools-item.ant-select:not(.purchase-card-tag) .ant-select-selector::before {
    background-image: url(/images/bookmark.svg);
    background-repeat: no-repeat;
    background-size: 100% 200%;
    background-position-y: 100%;
    position: relative;
    width: 100%;
    height: 100%;
    content: '';
    margin: auto;
}

.purchase-card-tools-item.ant-select-open:not(.purchase-card-tag) {
    width: 48px;
    background-color: #8F9EAE;
    visibility: visible;
}

.purchase-card-tools-item.ant-select:not(.purchase-card-tag):hover .ant-select-selector::before,
.purchase-card-tools-item.ant-select-open:not(.purchase-card-tag) .ant-select-selector::before {
    background-position-y: 0%;
}

.purchase-card svg g > * {
    transition: none !important;
}

.purchase-card-tags-mobile {
    display: flex;
    padding: 0px;
    gap: 4px;
    margin-bottom: 5px;
    justify-items: end;
    max-width: 100px;
    flex-wrap: wrap;
}

.purchase-card-tags-mobile .tag-icon {
    width: 16px;
    height: 16px;
    border-radius: 2px;
}

@media (min-width: 992px) {
    .purchase-card-tags-mobile {
        display: none;
    }
}

.purchase-card-tags {
    width: 20px;
    gap: 6px;
    display: flex;
    flex-direction: column;
    position: relative;
    right: -4px;
}

.purchase-card-tag {
    width: 20px;
    height: 34px;
    border-radius: 4px 0 0 4px;
}

.purchase-card-tags .ant-select-selection-overflow {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.purchase-card-tags .ant-select-selection-overflow-item > span > span:last-child  {
    display: none;
}

.purchase-card-tags .ant-select-selector {
    padding: 0;
}

.purchase-card-tags .ant-select-selection-overflow-item-suffix {
    display: none;
}

.purchase-card-wrapper:not(:hover) .purchase-card-tags--empty .ant-select {
    display: none;
}

.purchase-card-tags--empty .ant-select {
    background: #F0F5FB;
    display: block;
    border-radius: 4px 0 0 4px;
    padding-left: 2px;
}

.purchase-card-tags--empty .ant-select:hover {
    background: #8F9EAE;
}

.purchase-card-tags--empty .ant-select .ant-select-selector::before {
    position: relative;
    width: 100%;
    height: 34px;
    content: '+';
    margin: auto;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
    color: #8F9EAE;
}


.purchase-card-tags--empty .ant-select:hover .ant-select-selector::before {
    color: #F0F5FB;
}

.purchase-card-tags .ant-select:not(.ant-select-customize-input) .ant-select-selector {
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), visibility 0s;
}

.ant-row:not(#selected-purch-clone) .purchase-card-selected.purchase-card-hidden {
    visibility: hidden;
}