/* Minification failed. Returning unminified contents.
(36,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(120,17): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(127,17): run-time error CSS1039: Token not allowed after unary operator: '-color-gray'
(135,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark'
(139,24): run-time error CSS1039: Token not allowed after unary operator: '-color-dark'
(146,28): run-time error CSS1039: Token not allowed after unary operator: '-color-light-blue-gray'
(147,22): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(155,22): run-time error CSS1039: Token not allowed after unary operator: '-color-light-gray'
(202,22): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(204,17): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(210,21): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(358,32): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(469,25): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(510,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(551,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(582,32): run-time error CSS1039: Token not allowed after unary operator: '-color-light-gray'
(586,32): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(607,28): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(615,23): run-time error CSS1039: Token not allowed after unary operator: '-font-family'
(617,17): run-time error CSS1039: Token not allowed after unary operator: '-color-gray'
(654,36): run-time error CSS1039: Token not allowed after unary operator: '-color-gray'
(655,36): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
(659,21): run-time error CSS1039: Token not allowed after unary operator: '-color-dark'
(663,30): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(664,36): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(680,25): run-time error CSS1039: Token not allowed after unary operator: '-color-red'
(757,32): run-time error CSS1039: Token not allowed after unary operator: '-color-white'
 */
main.main {
    padding-bottom: 100px;
}

.result {
    min-height: 45vh;
    margin-top: 20px;
}

.result__title {
    font-weight: 600;
    line-height: normal;
}

.result__content {
    margin-top: 30px;
    display: none;
}

.result__content {
    display: block;
}

.result__content-top p {
    font-size: 18px;
    font-weight: 700;
    line-height: 120%;
}

.result__content-products {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 30px;
    background-color: var(--color-white);
    border-radius: 10px;
    box-shadow: 0px 1px 4px 0px rgba(12, 12, 13, 0.10), 0px 1px 4px 0px rgba(12, 12, 13, 0.05);
}

.product__item {
    display: flex;
    gap: 20px;
    align-items: start;
    justify-content: space-between;
}

.product__item-image {
    width: 68px;
    height: 68px;
    min-width: 68px;
    display: flex;
    align-items: center;
    overflow: hidden;
    border-radius: 5px;
}

    .product__item-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        cursor: zoom-in;
    }

.product__item-about {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 176px;
}

.product__about-top,
.product__about-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .product__about-top a {
        width: max-content;
    }

    .product__about-top h3 {
        font-size: 16px;
        font-weight: 600;
        line-height: 125%;
        letter-spacing: 0.08px;
        text-decoration-line: underline;
        cursor: pointer;
    }

    .product__about-block p {
        display: block;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 12px;
    }

.product__about-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 239px;
}

.product__about-applicability,
.product__about-info {
    font-weight: 600;
    line-height: normal;
    text-decoration-line: underline;
    font-size: 12px;
}

.product__about-applicability {
    color: var(--color-red);
}

.product__about-info {
    display: flex;
    align-items: end;
    gap: 4px;
    color: var(--color-gray);
}

    .product__about-info:hover,
    .product__about-applicability:hover,
    .product__about-top h3:hover {
        text-decoration: none;
        color: currentColor;
        color: var(--color-dark);
    }

        .product__about-info:hover svg g path {
            fill: var(--color-dark);
        }

.product__item-table {
    width: 100%;
    max-width: 613px;
    border-radius: 10px;
    border: 1px solid var(--color-light-blue-gray);
    background: var(--color-white);
    overflow: hidden;
}

.product__table-top {
    display: flex;
    align-items: center;
    padding: 11px 16px 13px 16px;
    background: var(--color-light-gray);
    border-radius: 5px;
}

    .product__table-top p {
        color: rgba(25, 25, 25, 0.50);
        font-size: 10px;
        font-weight: 600;
        line-height: 125%;
        text-transform: uppercase;
    }

        .product__table-top p:nth-of-type(1) {
            width: 23%;
        }

        .product__table-top p:nth-of-type(2) {
            width: 16%;
        }

        .product__table-top p:nth-of-type(3) {
            width: 22%;
        }

        .product__table-top p:nth-of-type(4) {
            width: 39%;
        }

.product__table-content {
    padding: 6px 15px 9px;
}

.product__table-block {
    display: flex;
    align-items: center;
    padding: 4px 0 6px;
}

    .product__table-block:not(:last-of-type) {
        border-bottom: 1px solid rgba(25, 25, 25, 0.10);
    }

.product__table-btn {
    font-size: 12px;
    font-weight: 600;
    line-height: 120%;
    border-radius: 5px;
    background: var(--color-red);
    padding: 10px 30px;
    color: var(--color-white);
    margin-left: auto;
    transition: all .1s ease;
}

    .product__table-btn:hover {
        color: var(--color-white);
        background-color: #f10404;
    }

    .product__table-btn:active {
        background-color: rgba(25, 25, 25, 0.5);
    }

.product__table-item p {
    font-weight: 600;
    line-height: 120%;
    font-size: 12px;
}

.product__table-item:nth-of-type(2),
.product__table-item:nth-of-type(3) {
    font-weight: 500;
    line-height: 135%;
}

.product__table-item:nth-of-type(1) {
    width: 23%;
}

.product__table-item:nth-of-type(2) {
    width: 16%;
}

.product__table-item:nth-of-type(3) {
    width: 22%;
}

.result__content-products .product__item-image {
    width: 146px;
    height: 146px;
    min-width: 146px;
}

.result__content-products .product__table-content {
    padding-bottom: 0;
}

.result__content-products .product__item-about {
    max-width: 275px;
}

.result__content-products .product__about-block p,
.result__content-products .product__about-applicability,
.result__content-products .product__about-info,
.result__content-products .product__table-block p,
.result__content-products .product__table-btn {
    font-size: 14px;
}

.result__content-products .product__table-top p {
    font-size: 12px;
}

.result__not-found {
    margin-top: 25px;
    height: 18vh;
}

    .result__not-found p {
        font-size: 18px;
        font-weight: 600;
        line-height: normal;
    }

@media (max-width: 1279px) {
    .product__item {
        flex-wrap: wrap;
        gap: 22px 30px;
    }

    .product__item-table {
        max-width: 100%;
    }

    .result__content-products .product__item-about {
        width: calc(100% - 176px);
        max-width: 100%;
    }

    .product__about-block {
        max-width: 393px;
    }

    .product__item-about {
        width: calc(100% - 98px);
        max-width: 100%;
    }
}

@media (max-width: 999px) {
    .analogues__results .product__table-btn {
        padding: 10px;
    }

    .analogues__results .product__table-top p:nth-of-type(2) {
        width: 19%;
    }

    .analogues__results .product__table-top p:nth-of-type(3) {
        width: 25%;
    }

    .analogues__results .product__table-top p:nth-of-type(4) {
        width: 33%;
    }

    .analogues__results .product__table-item:nth-of-type(2) {
        width: 19%;
    }

    .analogues__results .product__table-item:nth-of-type(3) {
        width: 23%;
    }
}

@media (max-width: 767px) {
    .result {
        min-height: 238px;
        margin-top: 35px;
    }

    .result__content {
        margin-top: 20px;
    }

    .result__content-products {
        padding: 0;
        margin-top: 39px;
    }

        .result__content-products .product__item-image {
            width: 91px;
            height: 91px;
            min-width: 91px;
        }

        .result__content-products .product__item-about {
            width: calc(100% - 111px);
        }

    .product__item {
        gap: 25px 20px;
        padding: 20px;
        background-color: var(--color-white);
        border-radius: 20px;
    }

    .product__item-image {
        width: 91px;
        height: 91px;
        min-width: 91px;
    }

    .product__item-about {
        gap: 20px;
    }

    .product__item-about {
        width: calc(100% - 111px);
    }

    .product__about-bottom {
        max-width: calc(100% + 111px);
        margin-left: -111px;
    }

    .product__about-top h3 {
        font-size: 14px;
    }

    .product__item-table {
        border: none;
        background-color: transparent;
        border-radius: 0;
    }

    .product__table-top {
        display: none;
    }

    .product__table-block .product__table-item {
        width: auto;
    }

    .product__table-block {
        display: grid;
        grid-template-columns: 0.8fr 1fr;
        gap: 10px;
        padding: 20px 0;
    }

    .product__table-btn {
        margin: 10px 0 0;
        grid-column: span 2;
        height: 37px;
        font-size: 14px;
        order: 5;
    }

    .product__table-block {
        border-top: 1px solid rgba(25, 25, 25, 0.10);
        border-bottom: none;
    }

        .product__table-block:last-of-type {
            padding-bottom: 0;
        }

    .product__table-item p,
    .product__about-applicability,
    .product__about-info,
    .product__about-block p {
        font-size: 14px;
    }

    .product__table-content {
        padding: 0;
    }

    .result__not-found p {
        margin-top: 20px;
        font-size: 16px;
    }

    .product__table-item {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .product__table-block p.product__table-name {
        color: rgba(25, 25, 25, 0.50);
        font-size: 12px;
        line-height: 125%;
    }

    .product__table-item:nth-child(1) {
        order: 1;
    }

    .product__table-item:nth-child(2) {
        order: 3;
    }

    .product__table-item:nth-child(3) {
        order: 2;
    }

    .product__table-item:nth-child(4) {
        order: 4;
    }

        .product__table-item:nth-child(4) p:last-of-type {
            font-weight: 700;
            color: var(--color-red);
        }

    .product__table-item {
        width: 100% !important;
    }
}

.analogues {
    margin-top: 40px;
}

.analogues__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.analogues__top-select {
    position: relative;
    border-radius: 5px;
}

.analogues__sort {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    position: relative;
    z-index: 1;
    height: 32px;
}

.analogues__sort-select {
    position: absolute;
    top: 32px;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    background-color: var(--color-white);
    box-shadow: 0px 1px 4px 0px rgba(12, 12, 13, 0.10), 0px 1px 4px 0px rgba(12, 12, 13, 0.05);
    border-radius: 5px;
}

.sort-option,
.sort-title {
    font-weight: 600;
    line-height: 120%;
}

.sort-option {
    padding: 6px 16px;
    cursor: pointer;
}

    .sort-option:hover {
        background: rgba(255, 0, 0, 0.10);
    }

.analogues__top-select.active .analogues__sort-select {
    display: flex;
}

.analogues__top-select.active .analogues__sort svg {
    transform: rotate(-180deg);
}

.analogues__content {
    margin-top: 20px;
    display: flex;
    gap: 20px;
}

.analogues__form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 20px;
    padding-right: 15px;
    box-shadow: 0px 1px 4px 0px rgba(12, 12, 13, 0.10), 0px 1px 4px 0px rgba(12, 12, 13, 0.05);
    background-color: var(--color-white);
    border-radius: 10px;
    max-width: 300px;
    width: max-content;
    height: max-content;
    user-select: none;
}

    .analogues__form .form-filter-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

.analogues__form-filters {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-height: 263px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 15px;
    padding-top: 2px;
    padding-bottom: 4px;
}

    .analogues__form-filters::-webkit-scrollbar {
        width: 3px;
    }

    .analogues__form-filters::-webkit-scrollbar-track {
        background-color: var(--color-light-gray);
    }

    .analogues__form-filters::-webkit-scrollbar-thumb {
        background-color: var(--color-red);
        border-radius: 6px;
    }

@media (min-width: 768px) {
    .analogues__form {
        position: sticky;
        top: 120px;
    }

    .analogues__form-filters {
        max-height: 320px;
    }
}

.analogues__results {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 30px;
    background-color: var(--color-white);
    border-radius: 10px;
    box-shadow: 0px 1px 4px 0px rgba(12, 12, 13, 0.10), 0px 1px 4px 0px rgba(12, 12, 13, 0.05);
    max-width: 963px;
    height: max-content;
}

.filter__label {
    font-family: var(--font-family);
    font-size: 12px;
    color: var(--color-gray);
    font-style: normal;
    font-weight: 500;
    line-height: 135%;
    cursor: pointer;
    width: auto;
    min-width: 130px;
}

.filter__checkbox {
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

    .filter__checkbox + .checkmark {
        position: relative;
        top: 1px;
        left: 0;
        padding-left: 30px;
        cursor: pointer;
        display: inline-block;
    }

        .filter__checkbox + .checkmark:before {
            content: '';
            position: absolute;
            left: 0;
            top: -2px;
            width: 20px;
            height: 20px;
            border-radius: 4px;
            border: 1px solid var(--color-gray);
            background-color: var(--color-white);
        }

    .filter__checkbox:checked + .checkmark {
        color: var(--color-dark);
    }

        .filter__checkbox:checked + .checkmark:before {
            background: var(--color-red);
            border: 1px solid var(--color-red);
        }

        .filter__checkbox:checked + .checkmark:after {
            content: '';
            position: absolute;
            left: 2px;
            top: 0px;
            width: 16px;
            height: 16px;
            background-position: center;
            background-repeat: no-repeat;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M13.3337 4L6.00033 11.3333L2.66699 8' stroke='white' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        }

        .filter__checkbox:checked + .checkmark + .label-text {
            color: var(--color-red);
        }

@media (max-width: 767px) {
    .analogues {
        margin-top: 45px;
        padding-bottom: 98px;
    }

    .analogues__top {
        flex-direction: column;
        gap: 20px;
        justify-content: start;
        align-items: start;
    }

    .analogues__top-block {
        display: flex;
        align-items: start;
        justify-content: space-between;
        flex-direction: row-reverse;
        width: 100%;
        padding: 4px 0;
        border-top: 1px solid rgba(25, 25, 25, 0.10);
        border-bottom: 1px solid rgba(25, 25, 25, 0.10);
    }

    .analogues__form {
        height: 32px;
        position: relative;
        display: flex;
        align-items: start;
        justify-content: center;
        width: max-content;
        box-shadow: none;
        background-color: transparent;
        padding: 0;
    }

        .analogues__form h3 {
            cursor: pointer;
            position: relative;
            z-index: 2;
            padding: 6px 6px 6px 0;
            width: 100%;
            max-width: 116px;
        }

            .analogues__form h3::after {
                content: '';
                position: absolute;
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.41107 6.9107C4.73651 6.58527 5.26414 6.58527 5.58958 6.9107L10.0003 11.3214L14.4111 6.9107C14.7365 6.58527 15.2641 6.58527 15.5896 6.9107C15.915 7.23614 15.915 7.76378 15.5896 8.08921L10.5896 13.0892C10.2641 13.4147 9.73651 13.4147 9.41107 13.0892L4.41107 8.08921C4.08563 7.76378 4.08563 7.23614 4.41107 6.9107Z' fill='%23191919'/%3E%3C/svg%3E");
                width: 40px;
                height: 20px;
                top: 50%;
                transform: translateY(-50%);
                right: -23px;
                z-index: 1;
                background-repeat: no-repeat;
                background-position: right;
            }

        .analogues__form.active h3::after {
            transform: rotate(-180deg) translateY(-50%);
            background-position: left;
            top: -23%;
        }

        .analogues__form .reset-filter-btn {
            margin-left: 30px;
        }

    .analogues__form-filters {
        display: none;
        position: absolute;
        top: 32px;
        left: 0;
        background-color: var(--color-white);
        padding: 8px;
        box-shadow: 0px 1px 4px 0px rgba(12, 12, 13, 0.10), 0px 1px 4px 0px rgba(12, 12, 13, 0.05);
        border-radius: 5px;
        width: calc(100vw - 30px);
    }

    .analogues__form.active .analogues__form-filters {
        display: flex;
    }

    .analogues__content {
        margin-top: 34px;
    }

    .analogues__results {
        gap: 18px;
        padding: 0;
        box-shadow: none;
        background-color: transparent;
    }

    .filter__label {
        font-size: 14px;
    }
}

