.red {
    color: #dc3545;
}
.green {
    color: #137752;
}

.text-lg a {
    color: #4984F0;
}
.text-gray {
    color: #7D7D7D;
}

.text-danger {
    color: #dc3545;
}
.text-success {
    color: #137752;
}
.mm-active {
    color: #4259E9;
}

.table-group__panel {
    height: 700px;
}
.menu--hidden:not(.menu--hover) .menu__list-link p {
    display: none;
}
.pagination__elem .pagination__link {
    padding-left: 10px;
    padding-right: 10px;
}

.form-group__input-box .mx-datepicker {
    width: 100%;
}
.mx-input-wrapper input {
    background: #F4F5FC;
    border: none;
    color: rgb(77, 77, 77);
}
.mx-input-wrapper .mx-icon-calendar svg {
    color: #4259E9;
}
.mx-input-wrapper .mx-icon-clear svg {
    color: #C35372;
}
.ss-content .ss-list {
    max-height: 300px;
}
.tr-sticky .td-sticky {
    z-index: 2;
}
.button-group input {
    width: 100%;
}
.modal-fancy .form-group + .form-group {
    margin-top: 24px;
    border-top: 1px solid #EAECF6;
    padding-top: 24px;
}

.table__link-text {
    max-width: 200px;
}
.mb-2 {
    margin-bottom: 8px;
}
.mb-3 {
    margin-bottom: 20px;
}
.mt-2 {
    margin-top: 8px;
}
.mt-3 {
    margin-top: 20px;
}
.mt-4 {
    margin-top: 30px;
}
.mt-5 {
    margin-top: 40px;
}
.mr-2 {
    margin-right: 20px;
}

td.detail-link {
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
td.checkbox__td {
    padding-left: 24px;
}
.modal-actions {
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}
.modal-actions.actions-shown {
    opacity: 1;
    pointer-events: auto;
}
h6 {
    font-weight: 500;
    color: #121A2E;
    display: inline;
}
.text-center {
    text-align: center;
}
.ov-hide {
    overflow: hidden
}
textarea.form-group__input {
    padding-top: 16px;
    padding-bottom: 16px;
    height: 80px;
}

.button-switch {background: #F4F5FC; border-radius: 8px; overflow: hidden;display: flex;}
.button-switch button {display: flex; align-items: center; justify-content: center; background: transparent;border: none; width: 36px;height: 40px;}
.button-switch button:hover {background: #E2E8F9;}
.button-switch .active path {stroke: #4259E9;}
.product-line {display: grid; grid-template-columns: 2.81fr 1fr; gap: 16px; margin-top: 16px;}
.product-card {background: #fff;border-radius: 16px; padding: 16px; display: grid; grid-template-columns: 164px 1fr max-content; align-items: start; gap: 24px;}
.product-card__img {max-width: 100%;}
.product-card__name {font-weight: 600;font-size: 17px; color: #4259E9;-webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;overflow: hidden; white-space: normal;line-height: 1;margin-bottom: 8px;}
.product-card__number {color: #898C97; font-size: 12px; line-height: 1.2;}
.product-card__list {margin-top: 16px;display: grid;gap:8px 16px;}
.product-card__list--2 {grid-template-columns: 1fr max-content;}
.product-card__feature {display: grid;gap: 8px;grid-template-columns: max-content  1fr; line-height: 1;font-size: 14px;}
.product-card__feature svg {width: 16px;height: 16px;}
.product-card__cost {font-weight: 700;font-size: 20px;}
.modal-switcher {display: flex; gap:8px;}
.modal-switcher span {padding: 8px 16px;line-height: 1;color: #4259E9; background: #F1F4FF; border-radius: 500px; transition: .3s; cursor: pointer;}
.modal-switcher span:hover, .modal-switcher span.active {background: #B7C6FA;}
.product-info {border-radius: 16px; padding: 16px;display: flex; flex-direction: column; gap: 8px;}
.product-info--agreement {background: #FFF0E5;}
.product-info--agreement .product-info__status {color: #CA6E60;}
.product-info--del {background: #FFE4E9;}
.product-info--del .product-info__status {color: #C35372;}
.product-info--sent {background: #EDF0FD;}
.product-info--sent .product-info__status {color: #4259E9;}
.product-info__status {font-weight: 600;margin-bottom: 8px;}
.product-info__date {font-size: 12px; color: #898C97;}
.product-info__screen {margin-top: auto; display: flex; justify-content: center; align-items: center;height: 33px;border-radius: 8px; background: #fff;gap: 8px;}
.product-info__screen:hover {background: #E2E8F9; color: #4259E9;}
@media (max-width: 1199px) {
    .product-line {grid-template-columns: 100%;}
}
@media (max-width: 767px) {
    .product-card {grid-template-columns: 100%;}
}
@media (max-width: 575px) {
    .product-card__list--2 {grid-template-columns: 100%;}
}
.table-group__panel.no-height {
    height: unset;
}
.product-card img {
    width: 100%;
    height: 140px;
    object-fit: contain;
    object-position: center;
}
.product-card__feature.no_data {
    color: #898C97
}
.product-card__cost {
    min-width: 75px;
}
.product-card__feature {
    min-width: 178px;
}


.lds-dual-ring {
    /* change color here */
    color: #4259E9
}
.lds-dual-ring,
.lds-dual-ring:after {
    box-sizing: border-box;
}
.lds-dual-ring {
    display: inline-block;
    width: 40px;
    height: 40px;
}
.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 32px;
    height: 32px;
    margin: 8px;
    border-radius: 50%;
    border: 6.4px solid currentColor;
    border-color: currentColor transparent currentColor transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.fields-group .checkbox {
    display: block;
}
.ss-main .ss-values .ss-placeholder, .ss-main .ss-values .ss-value .ss-value-text,.ss-main .ss-values .ss-value .ss-value-delete {
    padding-top: 6px;
    padding-bottom: 6px;
}

.table-group__search-clear {
    display: block;
}
.icon-question {
    width: 24px;
    height: 24px;
    position: absolute;
    top: 25%;
    right: -25px;
    cursor: pointer;
}

.tooltip {
    display: block !important;
    z-index: 10000;
}

.tooltip .tooltip-inner {
    background: black;
    color: white;
    border-radius: 16px;
    padding: 5px 10px 4px;
}

.tooltip .tooltip-arrow {
    width: 0;
    height: 0;
    border-style: solid;
    position: absolute;
    margin: 5px;
    border-color: black;
    z-index: 1;
}

.tooltip[x-placement^="top"] {
    margin-bottom: 5px;
}

.tooltip[x-placement^="top"] .tooltip-arrow {
    border-width: 5px 5px 0 5px;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    border-bottom-color: transparent !important;
    bottom: -5px;
    left: calc(50% - 5px);
    margin-top: 0;
    margin-bottom: 0;
}

.tooltip[x-placement^="bottom"] {
    margin-top: 5px;
}

.tooltip[x-placement^="bottom"] .tooltip-arrow {
    border-width: 0 5px 5px 5px;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
    border-top-color: transparent !important;
    top: -5px;
    left: calc(50% - 5px);
    margin-top: 0;
    margin-bottom: 0;
}

.tooltip[x-placement^="right"] {
    margin-left: 5px;
}

.tooltip[x-placement^="right"] .tooltip-arrow {
    border-width: 5px 5px 5px 0;
    border-left-color: transparent !important;
    border-top-color: transparent !important;
    border-bottom-color: transparent !important;
    left: -5px;
    top: calc(50% - 5px);
    margin-left: 0;
    margin-right: 0;
}

.tooltip[x-placement^="left"] {
    margin-right: 5px;
}

.tooltip[x-placement^="left"] .tooltip-arrow {
    border-width: 5px 0 5px 5px;
    border-top-color: transparent !important;
    border-right-color: transparent !important;
    border-bottom-color: transparent !important;
    right: -5px;
    top: calc(50% - 5px);
    margin-left: 0;
    margin-right: 0;
}

.tooltip.popover .popover-inner {
    background: #f9f9f9;
    color: black;
    padding: 24px;
    border-radius: 5px;
    box-shadow: 0 5px 30px rgba(black, .1);
}

.tooltip.popover .popover-arrow {
    border-color: #f9f9f9;
}

.tooltip[aria-hidden='true'] {
    visibility: hidden;
    opacity: 0;
    transition: opacity .15s, visibility .15s;
}

.tooltip[aria-hidden='false'] {
    visibility: visible;
    opacity: 1;
    transition: opacity .15s;
}
.table-group .overlay .ss-main {
    width: 100%;
    padding: 13px 16px;
    margin-left: initial;
}