/* Start:/table/style.css?17666700604581*/
.container__www-table-style___WzeKv {
--column-controls: 4%;
    --column-adress: 11%;
    --column-reg-number: 8%;
    --column-reason: 13%;
    --column-downtime: 12%;
    --column-stop-date: 12%;
    --column-incharge: 13%;
    --column-mechanic: 11%;
    --column-company: 16%;
    --grid-column-template: var(--column-controls) var(--column-adress) var(--column-reg-number) var(--column-reason) var(--column-downtime) var(--column-stop-date) var(--column-incharge) var(--column-mechanic) var(--column-company);
}

.grid__www-table-style___fseyh {
    display: grid;
    grid-template-columns: var(--grid-column-template);
}

.grid__www-table-style___fseyh>div {
    position: relative;

    /* overflow: hidden; */
    border-bottom: 1px solid black;

}

.title-container__www-table-style___TKT-S {}

.filter-container__www-table-style___XcNJK {
    &>div{
        display: flex;
        padding:2px; 
    }

    & button{
        margin:2px;

        &.asc-mode{
            clip-path: polygon(30% 0%, 70% 0%, 100% 100%, 0% 100%);
        }

        &.desc-mode{
            clip-path: polygon(0% 0%, 100% 0%, 70% 100%, 30% 100%);
        }
    }

    & button>svg{
        height: 100%;
    }
}

.filter-container__www-table-style___XcNJK input {
    width: 100%;
}

.table-row__www-table-style___7BvSp {
    position: relative;

    &>div {
        padding: 10px;
    }
}

div.controls__www-table-style___SvBON {
    position: absolute;
    left: -20px;
}

.history-container__www-table-style___gXiku {
    overflow: hidden;
    height: fit-content;
    height: 0;
    transition: 1s;

    &>div {
        border-left: 5px solid black;
    }
}

.comment-container__www-table-style___vMX21 {
    overflow: hidden;
    height: fit-content;
    height: 0;
    transition: 1s;


    &>div {
        padding: 10px;
        border-left: 5px solid black;
    }
}

.reason-input__www-table-style___MVZ0- {
    position: absolute;
    z-index: 10;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    background: white;
}

.reason-input__www-table-style___MVZ0-:hover {
    width: auto;
    height: 50vh;
}

div:has(:is(.reason-input__www-table-style___MVZ0-:hover)) {
    overflow: visible;
}

.table-header-main {
    display: flex;
    flex-direction: column;

    border-radius: 16px 16px 0 0;

    color: #fff;

    background-color: rgb(27 160 41 / 81%);

}

#address-header {
    border-radius: 16px 0 0;
}

#company-header {
    border-radius: 0 16px 0 0;

}

#header-cont {
    &:first-child {
        border-radius: 16px 16px 0 0;

    }

    &>div {
        align-content: center;
        padding: 10px;

    }

    &>h5 {
        font-size: 20px;
        text-align: center;
    }
}


.lift-control-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: center;


    &>button:first-child svg {
        width: 10px;
        height: 18px;
    }

    &>button:last-child svg {
        height: 18px;

    }
}

.table-data {}

.table-scroll {
    overflow-x: auto;

    /* скролл на контейнере */
    width: 100%;

    -webkit-overflow-scrolling: touch;
}

.lift-item {
    padding: 10px 0;
}

.header-filter {
    color: black;
    background-color: #bcbcbc;

}


.table-nav-buttons {
    display: flex;
    flex-direction: row;
    gap: 30px;

    margin-top: 50px;
    margin-bottom: 30px;

    &>button {
        width: fit-content;
    }

    &>button:last-child{
        margin-left: auto;
    }
}

.limit-table {
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-bottom: 30px;
}


.table-pagination {
    display: flex;
    flex-direction: row;
    gap: 20px;
    justify-content: center;

    margin: 30px 0;

    &>div {
        padding: 10px 20px;
        border: 1px solid #dadada;
        border-radius: 10px;
    }

    &>.button-1 {
        width: fit-content;
    }
}

@media (width <=768px) {
    .table-pagination {
        flex-direction: column;
        align-items: center;
        justify-content: center;

        &>div {
            width: fit-content;
        }
    }

    .table-main {
        overflow-x: auto;
        width: 1300px !important;
        max-width: none;

        -webkit-overflow-scrolling: touch;

        /* плавный скролл на iOS */
    }
}

@media print {
    body * {
        visibility: hidden;
    }

    #table-container,
    #table-container * {
        color: black;
        visibility: visible;
    }

    #table-container {
        position: absolute;
        top: 0;
        left: 0;
    }
}
/* End */
/* /table/style.css?17666700604581 */