﻿/************************Table************************/

.content-body-main .form-group {
    margin-bottom: 1rem;
}

.content-body-main .table td {
    font-family: var(--font-family-inter);
}

.content-body-main .table th {
    border-top: none;
    background-color: #CDE0F9 !important;
    font-family: var(--font-family-inter);
    font-weight: 500;
}

.content-body-main .table th,
.content-body-main .table td {
    padding: 12px 16px !important;
    color: #101828;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0.15px;
}

.table-wrapper {
    overflow: auto;
}

.table.dataTable tbody tr td {
    border-bottom: 1px solid #EAECF0 !important;
}

    .content-body-main .table th:first-child {
        border-top-left-radius: 8px;
        border-bottom-left-radius: 8px;
    }

.content-body-main .table.has-border tr:not(:first-child) th:first-child {
    border-top-left-radius: 0px;
}

.content-body-main .table.has-border th:first-child {
    border-bottom-left-radius: 0px;
}

.content-body-main .table th.th-DapAn-item:first-child {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.content-body-main .table th:last-child {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.content-body-main .table.has-border tr:not(:first-child) th:last-child {
    border-top-right-radius: 0px;
}

.content-body-main .table.has-border th:last-child {
    border-bottom-right-radius: 0px;
}

.content-body-main .table th.th-CauHoi-item:last-child[rowspan="1"] {
    border-bottom-right-radius: 0;
}

.content-body-main .table th.th-DapAn-item:last-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.content-body-main .table tbody tr:last-child td {
    border-bottom: 1px solid #EAECF0;
}

.table-wrapper .container-fluid {
    padding: 0;
}

.content-body-main .table.has-border {
}

    .content-body-main .table.has-border thead tr th:not(:last-child) {
        border-right: 1px solid #EAECF0;
    }

    .content-body-main .table.has-border thead tr:not(:first-child) th:last-child {
        border-right: 1px solid #EAECF0;
    }

    .content-body-main .table.has-border thead tr:not(:last-child) th {
        border-bottom: 1px solid #EAECF0;
    }

    .content-body-main .table.has-border tbody tr td {
        border-right: 1px solid #EAECF0;
    }

        .content-body-main .table.has-border tbody tr td:first-child {
            border-left: 1px solid #EAECF0;
        }

    .content-body-main .table.has-border tbody tr:last-child td:first-child {
        border-bottom-left-radius: 8px;
    }

    .content-body-main .table.has-border tbody tr:last-child td:last-child {
        border-bottom-right-radius: 8px;
    }

th input[type="checkbox"],
td input[type="checkbox"] {
    width: 100%;
}

td .form-group.input-group.date input {
    width: 100%;
}

.pageSizePanel-wrapper-total {
    margin-bottom: 0;
}

.dt-container {
    position: relative;
}

.dt-container {
    position: relative;
}

    .dt-container .dt-info {
        position: absolute;
        bottom: 9px;
        left: 0;
        display: none !important;
    }

.dataTables_length select,
.dt-length select {
    background: #FFFFFF;
    border: 1px solid #E2E4E9 !important;
    padding: 8px 12px !important;
    border-radius: 8px !important;
    outline: none;
    height: 42px;
    font-family: Roboto, sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    /* identical to box height, or 150% */
    letter-spacing: 0.5px;
    box-shadow: none;
    /* Content/text-main */
    color: var(--text-main);
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) center;
    background-image: url('data:image/svg+xml,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.22007 8.47C4.52007 8.17 4.99007 8.17 5.28007 8.47L12.0001 15.19L18.7201 8.47C18.7887 8.39631 18.8715 8.33721 18.9635 8.29622C19.0555 8.25523 19.1548 8.23319 19.2556 8.23141C19.3563 8.22963 19.4563 8.24816 19.5497 8.28588C19.6431 8.3236 19.7279 8.37974 19.7991 8.45096C19.8703 8.52218 19.9265 8.60702 19.9642 8.7004C20.0019 8.79379 20.0204 8.89382 20.0187 8.99452C20.0169 9.09523 19.9948 9.19454 19.9539 9.28654C19.9129 9.37854 19.8538 9.46134 19.7801 9.53L12.5301 16.78C12.2301 17.08 11.7601 17.08 11.4701 16.78L4.22007 9.53C4.07962 9.38938 4.00073 9.19875 4.00073 9C4.00073 8.80125 4.07962 8.61063 4.22007 8.47Z" fill="%230A0D14"/></svg>');
    margin-bottom: 0;
    min-width: 100px;
    margin-top: 16px
}

.dataTables_length label {
    margin-bottom: 0;
}

.dataTables_bottom {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.group-button-action {
    display: flex;
    gap: 8px;
    align-items: center;
}

.group-button-action .btn {
    border-radius: 8px !important;
    padding: 8px 16px !important;
    font-family: var(--font-family-inter);
    font-style: normal;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 1.42 !important;
    color: #FFFFFF;
    font-weight: 500 !important;
    min-width: 125px;
    outline: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    margin-bottom: 0;
    height: 36px;
    letter-spacing: 0.1px !important;
    min-height: 36px !important;
}

.group-button-action .btn-light {
    background: var(--white) !important;
    border: 1px solid #E3E4E5 !important;
    padding: 8px 16px;
    color: var(--body) !important;
}

.total-filter {
  /* position: absolute;
  top: -45px;
  left: 0; */
  font-size: 16px;
  color: var(--primary);
  margin-bottom: 10px;
}

.total-filter span {
  font-family: var(--font-family-inter);
  font-weight: 500;
  color: #F7605C;
  font-size: 24px;
  padding-left: 5px;
}

.form-control {
    display: block;
    width: 100%;
    height: 40px;
    padding: 8px 16px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.3;
    color: var(--body);
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #E2E4E9;
    border-radius: 8px !important;
    box-shadow: unset;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.pageSizePanel-wrapper-total,
.pageSizePanel-wrapper {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

    .pageSizePanel-wrapper-total select[id*="ddlpPageSize"] {
        margin-bottom: 0 !important;
    }

        .pageSizePanel-wrapper-total select[id*="ddlpPageSize"]:focus {
            outline: none;
        }

.pageSizePanel-wrapper,
.page-record-custom .dt-paging {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: 16px;
}

    .page-record-custom .dt-paging nav,
    .pagination-wrapper {
        display: flex;
        flex-flow: row nowrap;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

.page-record-custom .dt-paging {
    margin-top: 16px;
}

    .dataTables_paginate .paginate_button,
    .page-record-custom .dt-paging .dt-paging-button,
    .pagination-wrapper li {
        padding: 8px !important;
        border: none !important;
        background: none !important;
        margin: 0;
        min-width: 36px;
        height: 36px;
        font-family: Roboto, sans-serif;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 1.43;
        letter-spacing: 0.1px;
        color: var(--text-main);
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }

.pageSizePanel-wrapper > a:not(:last-child) {
    margin-right: 8px;
}

.pagination-wrapper li.PagedList-skipToFirst a,
.pagination-wrapper li.PagedList-skipToPrevious a,
.pagination-wrapper li.PagedList-skipToNext a,
.pagination-wrapper li.PagedList-skipToLast a {
    display: inline-block;
    width: 20px;
    height: 20px;
}

.pageSizePanel-wrapper > a:first-child > a:before,
.pageSizePanel-wrapper > a:nth-child(2) > a:before,
.pageSizePanel-wrapper > a:last-child > a:before,
.pageSizePanel-wrapper > a:nth-last-child(2) > a:before,
.dataTables_paginate .paginate_button.first > a > a:before,
.dataTables_paginate .paginate_button.previous > a > a:before,
.dataTables_paginate .paginate_button.next > a > a:before,
.dataTables_paginate .paginate_button.last > a > a:before,
.page-record-custom .dt-paging nav .dt-paging-button.first a:before,
.page-record-custom .dt-paging nav .dt-paging-button.previous a:before,
.page-record-custom .dt-paging nav .dt-paging-button.next a:before,
.page-record-custom .dt-paging nav .dt-paging-button.last a:before,
.pagination-wrapper li.PagedList-skipToFirst a::before,
.pagination-wrapper li.PagedList-skipToPrevious a::before,
.pagination-wrapper li.PagedList-skipToNext a::before,
.pagination-wrapper li.PagedList-skipToLast a::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.pageSizePanel-wrapper > a:not(:first-child):not(:nth-child(2)):not(:last-child):not(:nth-last-child(2)).page_disabled {
    background-color: #0765E3 !important;
    color: #fff !important;
    border-radius: 8px;
}

.pageSizePanel-wrapper > a:first-child,
.pageSizePanel-wrapper > a:nth-child(2),
.pageSizePanel-wrapper > a:last-child,
.pageSizePanel-wrapper > a:nth-last-child(2),
.page-record-custom .dt-paging nav .dt-paging-button.first a,
.page-record-custom .dt-paging nav .dt-paging-button.previous a,
.page-record-custom .dt-paging nav .dt-paging-button.next a,
.page-record-custom .dt-paging nav .dt-paging-button.last a,
.pagination-wrapper li a i {
    font-size: 0;
    position: relative;
}

    .pageSizePanel-wrapper > a:first-child > a::before,
    .dataTables_paginate .paginate_button.first > i::before,
    .dataTables_paginate .paginate_button.first > a::before,
    .dataTables_paginate .paginate_button.first > a > a::before,
    .dataTables_paginate .paginate_button.first > span::before,
    .page-record-custom .dt-paging nav .dt-paging-button.first a:before,
    .pagination-wrapper li.PagedList-skipToFirst a::before {
        background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.79167 2.5C4.47501 2.5 4.20834 2.73333 4.17501 3.04167L4.16667 3.125V16.875C4.15562 17.0408 4.21087 17.2041 4.32027 17.3291C4.42966 17.4542 4.58424 17.5306 4.75 17.5417C4.91577 17.5527 5.07913 17.4975 5.20415 17.3881C5.32917 17.2787 5.40562 17.1241 5.41667 16.9583V3.125C5.41667 2.95924 5.35082 2.80027 5.23361 2.68306C5.1164 2.56585 4.95743 2.5 4.79167 2.5ZM15.65 2.68333C15.5437 2.57698 15.4026 2.51254 15.2526 2.50182C15.1025 2.49111 14.9537 2.53484 14.8333 2.625L14.7667 2.68333L7.89167 9.55833C7.78532 9.66466 7.72088 9.80578 7.71016 9.95579C7.69945 10.1058 7.74318 10.2546 7.83334 10.375L7.89167 10.4417L14.7667 17.3167C14.8786 17.4277 15.0283 17.4923 15.1859 17.4975C15.3434 17.5028 15.4971 17.4483 15.6162 17.345C15.7353 17.2417 15.811 17.0973 15.8281 16.9406C15.8451 16.7839 15.8024 16.6265 15.7083 16.5L15.65 16.4333L9.21667 10L15.65 3.56667C15.9 3.31667 15.9 2.925 15.65 2.68333Z" fill="%230A0D14"/></svg>');
    }


    .pageSizePanel-wrapper > a:nth-child(2) > a:before,
    .dataTables_paginate .paginate_button.previous > i::before,
    .dataTables_paginate .paginate_button.previous > a::before,
    .dataTables_paginate .paginate_button.previous > a > a::before,
    .dataTables_paginate .paginate_button.previous > span::before,
    .page-record-custom .dt-paging nav .dt-paging-button.previous a:before,
    .pagination-wrapper li.PagedList-skipToPrevious a::before {
        background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.9418 3.51666C13.1918 3.76666 13.1918 4.15833 12.9418 4.4L7.34177 10L12.9418 15.6C13.0032 15.6572 13.0524 15.7262 13.0866 15.8029C13.1207 15.8795 13.1391 15.9623 13.1406 16.0462C13.1421 16.1301 13.1266 16.2135 13.0952 16.2913C13.0638 16.3692 13.017 16.4398 12.9576 16.4992C12.8983 16.5585 12.8276 16.6053 12.7498 16.6368C12.6719 16.6682 12.5886 16.6836 12.5047 16.6822C12.4207 16.6807 12.338 16.6623 12.2613 16.6281C12.1847 16.594 12.1157 16.5447 12.0584 16.4833L6.01677 10.4417C5.89973 10.3245 5.83398 10.1656 5.83398 10C5.83398 9.83437 5.89973 9.67552 6.01677 9.55833L12.0584 3.51666C12.3084 3.26666 12.7001 3.26666 12.9418 3.51666Z" fill="%230A0D14"/></svg>');
    }


    .pageSizePanel-wrapper > a:nth-last-child(2) > a:before,
    .dataTables_paginate .paginate_button.next > i::before,
    .dataTables_paginate .paginate_button.next > a::before,
    .dataTables_paginate .paginate_button.next > a > a::before,
    .dataTables_paginate .paginate_button.next > span::before,
    .page-record-custom .dt-paging nav .dt-paging-button.next a:before,
    .pagination-wrapper li.PagedList-skipToNext a::before {
        background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.0583 3.51665C6.8083 3.76665 6.8083 4.15831 7.0583 4.39998L12.6583 9.99998L7.0583 15.6C6.99689 15.6572 6.94764 15.7262 6.91348 15.8029C6.87932 15.8795 6.86095 15.9623 6.85947 16.0462C6.85799 16.1301 6.87343 16.2135 6.90486 16.2913C6.9363 16.3691 6.98308 16.4398 7.04243 16.4992C7.10178 16.5585 7.17248 16.6053 7.2503 16.6367C7.32812 16.6682 7.41148 16.6836 7.4954 16.6821C7.57932 16.6807 7.66208 16.6623 7.73875 16.6281C7.81541 16.594 7.88441 16.5447 7.94163 16.4833L13.9833 10.4416C14.2333 10.1916 14.2333 9.79998 13.9833 9.55831L7.94163 3.51665C7.82444 3.3996 7.66559 3.33386 7.49997 3.33386C7.33434 3.33386 7.17549 3.3996 7.0583 3.51665Z" fill="%230A0D14"/></svg>');
    }

    .pageSizePanel-wrapper > a:last-child > a:before,
    .dataTables_paginate .paginate_button.last > i::before,
    .dataTables_paginate .paginate_button.last > a::before,
    .dataTables_paginate .paginate_button.last > a > a::before,
    .dataTables_paginate .paginate_button.last > span::before,
    .page-record-custom .dt-paging nav .dt-paging-button.last a:before,
    .pagination-wrapper li.PagedList-skipToLast a::before {
        background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.2084 2.5C15.525 2.5 15.7917 2.73333 15.825 3.04167L15.8334 3.125V16.875C15.8388 16.9571 15.8281 17.0394 15.8017 17.1173C15.7754 17.1953 15.7339 17.2672 15.6798 17.3291C15.6256 17.3911 15.5598 17.4417 15.486 17.4781C15.4123 17.5146 15.3321 17.5362 15.25 17.5417C15.1679 17.5471 15.0856 17.5364 15.0077 17.51C14.9297 17.4837 14.8578 17.4422 14.7959 17.3881C14.734 17.3339 14.6833 17.2681 14.6469 17.1943C14.6104 17.1206 14.5888 17.0404 14.5834 16.9583V3.125C14.5834 2.78333 14.8667 2.5 15.2084 2.5ZM4.35002 2.68333C4.45635 2.57698 4.59746 2.51254 4.74747 2.50182C4.89748 2.49111 5.04632 2.53484 5.16669 2.625L5.23335 2.68333L12.1084 9.55833C12.3334 9.78333 12.3584 10.125 12.1667 10.375L12.1084 10.4417L5.23335 17.3167C5.12142 17.4277 4.97168 17.4923 4.81414 17.4975C4.65659 17.5028 4.50288 17.4483 4.38379 17.345C4.26471 17.2417 4.18905 17.0973 4.17196 16.9406C4.15488 16.7839 4.19765 16.6265 4.29169 16.5L4.35002 16.4333L10.7834 10L4.35002 3.56667C4.23298 3.44948 4.16724 3.29063 4.16724 3.125C4.16724 2.95937 4.23298 2.80052 4.35002 2.68333Z" fill="%230A0D14"/></svg>');
    }

.page-link {
    font-size: 14px;
    position: relative;
    display: block;
    padding: 0;
    margin-left: 0;
    line-height: 1.43;
    color: #007bff;
    background-color: #fff;
    border: none;
    font-family: 'Roboto Medium', sans-serif;
    font-weight: 500 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    box-shadow: unset;
}

.dataTables_wrapper .dataTables_paginate .paginate_button a.page-link:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button a.page-link:active {
    outline: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button a.page-link:hover {
    background-color: transparent !important;
    color: #101828 !important;
}

.page-record-custom .dt-paging .dt-paging-button,
.dataTables_paginate .paginate_button {
    padding: 8px !important;
    border: none !important;
    background: none !important;
    margin: 0;
    min-width: 36px;
    height: 36px;
    font-family: 'Roboto Medium', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.43;
    letter-spacing: 0.1px;
    color: var(--text-main);
}

    .page-record-custom .dt-paging .dt-paging-button.current,
    .dataTables_paginate .paginate_button.page-item.active,
    .pagination-wrapper > li.active {
        background-color: #0765E3 !important;
        color: #fff;
        border-radius: 8px;
    }

        .dataTables_paginate .paginate_button.page-item.active a.page-link,
        .pagination-wrapper > li.active a {
            color: #fff !important;
            background-color: transparent;
            border: none;
        }

.table-lichcongtac-CMS-wrapper {
    overflow-x: scroll;
}

.pageSizePanel-wrapper > a,
.dataTables_wrapper .dataTables_paginate .paginate_button {
    margin-left: 8px;
    width: auto;
    min-width: 36px;
}

.pageSizePanel-wrapper > a {
    box-sizing: border-box;
    display: inline-block;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    color: #333 !important;
    border-radius: 2px;
    padding: 8px !important;
    border: none !important;
    background: none !important;
    margin: 0;
    height: 36px;
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 1.43;
    letter-spacing: 0.1px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:first-child {
    margin-left: 0;
}

ul.pagination {
    margin-left: 16px !important;
    margin-bottom: 0 !important;
}

.dataTables_length label {
    margin-bottom: 0 !important;
}

.page-record-custom {
    display: flex;
    justify-content: flex-end;
}

/***************************Responsive Media******************************/

@media screen and (max-width:1442px){
    
}

@media screen and (max-width:1367px){
    
}

@media screen and (max-width:1024px){
    
}

@media screen and (max-width: 992px){
    
}

@media screen and (max-width: 800px){

}

@media screen and (max-width: 768px){
    .total-filter span {
        font-size: 20px;
    }
    
    .page-record-custom {
        justify-content: flex-start;
    }
}

@media screen and (max-width: 600px) {

}

@media screen and (max-width: 540px) {
    
}

@media screen and (max-width: 426px){

}

@media screen and (max-width: 376px){

}

@media screen and (max-width: 320px) {

}