.reports {
    margin-top: 104px;
}

.report_row {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.report_info,
.report_card {
    width: 232px;
    min-width: 232px;
    height: 232px;
}

.report_card {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}

.rc_favo svg,
.rc_ava img,
.rc_ava {
    width: 100%;
    height: 100%;
}

.rc_ava img {
    object-fit: cover;
}

.rc_tags {
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 5px;
    position: absolute;
    top: 12px;
    left: 0;
}

.rc_tag {
    width: 78px;
    height: 20px;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rc_favo {
    position: absolute;
    top: 11px;
    right: 11px;
    width: 23px;
    height: 23px;
    cursor: pointer;
    z-index: 2;
}

.rc_link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.rc_favo svg path {
    transition: .3s;
    fill: #fff0;
}

.rc_favo:hover svg path {
    stroke: var(--c-red);
}

.rc_favo.active svg path {
    fill: var(--c-red);
    stroke: var(--c-red);
}

.rc_favo.active:hover svg path {
    fill: var(--c-red);
    stroke: var(--c-white);
}

.rc_favo svg {
    width: 100%;
    height: 100%;
}

.rc_favo svg path {
    transition: .3s;
}

.rc_favo.active svg path {
    fill: var(--c-red);
}

.ri_name {
    font-size: 16px;
    line-height: 135%;
}

.ri_station {
    margin-top: 15px;
    display: flex;
    gap: 10px;
    align-items: center;
}

.ris_color {
    min-width: 15px;
    width: 15px;
    height: 15px;
    background-color: #0001;
    border-radius: 100%;
}

.ris_name {
    padding-top: 2px;
    font-size: 12px;
}

.ri_prices {
    width: 100%;
    margin-top: 15px;
}

.report_bl *,
.ri_price_row * {
    letter-spacing: normal;
}

.ri_price_row {
    font-size: 14px;
    display: flex;
    align-items: center;
    padding: 2px 70px 0 7px;
    justify-content: space-between;
    background-color: #E7ECEA;
    border-radius: 8px;
    width: 100%;
    height: 36px;
}

.ri_price_row + .ri_price_row {
    margin-top: 6px;
}

.rip_type {
    font-size: 11px;
}

.ri_counter {
    line-height: 135%;
    margin-top: 15px;
}

.report_bl {
    display: flex;
    flex-direction: column;
    min-height: 220px;
    width: 100%;
    background-color: #F2F2F2;
    border-radius: 10px;
    padding: 24px 24px 24px 30px;
}
.rb_answer{
    margin-top: 24px;
}
.rb_answer .report_bl{
    padding: 10px 0 10px 20px;
    min-height: unset;
    border-radius: unset;
    border-left: 2px solid var(--c-red);
}

.rb_head {
    font-weight: 700;
    display: flex;
    justify-content: space-between;
}

.rb_text {
    margin-top: 16px;
    margin-bottom: auto;
    line-height: 135%;
}

.rb_text * {
    line-height: 135%;
}

.rb_text p + p {
    margin-top: .5em;
}

.rb_btns {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    margin-top: 16px;
}

.rb_btn_complain {
    cursor: pointer;
    line-height: 135%;
    text-decoration: underline;
    transition: .3s;
}

.rb_btn_complain:hover {
    color: var(--c-red);
}

.report_row + .report_row {
    margin-top: 26px;
}

.pagination {
    margin-top: 67px;
}

@media screen and (max-width: 1440px) {
    .report_info {
        width: 200px;
        min-width: 200px;
    }

    .ri_price_row {
        padding-right: 30px;
    }
}

@media screen and (max-width: 1140px) {
    .reports {
        margin-top: 70px;
    }
}

@media screen and (max-width: 1032px) {
    .report_row {
        flex-wrap: wrap;
    }

    .report_info {
        width: calc(100% - 232px - 20px);
    }

    .report_bl {
        padding: 24px;
        min-height: unset;
    }
}

@media screen and (max-width: 808px) {
    .pagination,
    .reports {
        margin-top: 24px;
    }

    .pagination_mid {
        gap: 8px;
    }

    .pagination {
        --size: 32px;
        gap: 8px;
    }

    .report_card {
        height: 373px;
    }

    .report_info, .report_card {
        width: calc((100% - 10px) / 2);
        min-width: unset;
    }

    .report_info {
        height: unset;
        display: flex;
        flex-direction: column;
    }

    .ri_station,
    .ri_prices {
        margin-top: 34px;
    }

    .ri_counter {
        margin-top: auto;
    }

    .report_row {
        display: flex;
        gap: 16px 10px;
        align-items: unset;
    }

    .ri_price_row {
        padding-right: 14px;
    }
}

@media screen and (max-width: 495px) {
    .report_card {
        height: calc(100vw * 283 / 375);
    }
}

@media screen and (max-width: 340px) {
    .ri_station,
    .ri_prices {
        margin-top: 20px;
    }
}