@media screen  and (max-width: 800px){
    #charge_page {
        padding-top: 140px !important;
    }
    .page_header {
        flex-direction: column;
    }
    .page_header span {
        margin-left: 0 !important;
        margin-right: auto;
        text-align: center;
        padding: 10px !important;
    }
    .page_header p {
        text-align: left !important;
        margin-top: 10px;
    }

}


.charge_page h2 {
    margin-bottom: 10px;
}
.charge_page h3 {
    color: #8b00ff;
    font-size: 20px;
    font-weight: 600;
}
.page_header {
    display: flex;
    justify-content: space-between;
}   

.page_header p {
    font-size: 20px;
    text-align: right;
}
.page_header span {
    width: fit-content;
    display: block;
    margin-top: 10px;
    padding: 4px 10px;
    border-radius: 6px;
    color: #fff;
    font-size: 20px;
    margin-left: auto;
}
.page_header span.green_status {

    background: #0a0;
}
.page_header span.red_status {

    background: rgb(170, 0, 0);
}

.price {
    margin-top: 20px;
    font-size: 42px;
    font-weight: 300;
}

.documents_block, .invoices_block, .comment_block {
    margin-top: 30px;
}

.documents_list {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;

}

.document {
    display: flex;
    gap: 20px;
    align-items: center;
}

.document a:hover {
    text-decoration: underline;
}


.invoices_block input {
    margin: 20px 0;
}


.invoices_block {
    margin-bottom: 20px;
}