@font-face {
    font-family: 'inter-black';
    src: url('../fonts/Inter-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'inter-bold';
    src: url('../fonts/Inter-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'inter-regular';
    src: url('../fonts/Inter-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'inter-medium';
    src: url('../fonts/Inter-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'inter-light';
    src: url('../fonts/Inter-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'inter-semibold';
    src: url('../fonts/Inter-SemiBold.ttf') format('truetype');
}
* {
    font-family: 'inter-regular';
}


.inter-bold {
    font-family: inter-bold !important;
}
.inter-semibold {
    font-family: inter-semibold !important;
}

.inter-medium {
    font-family: inter-medium !important;
}

:root {
    /*--khcn-color-blue: #F85900;*/
    --custom-text-dark: #172B4D;
    --custom-color-placeholder: #B9C0C7;
    --custom-margin-m-1: 0.25;
    --custom-color-green: #4676FB;
    --custom-color-thead: #F3F6FF;
    --custom-color-input-stroke: #CED4DA;
    --color-brading-blue: #06527A;
    --custom-text-gray: #99A1A9;
    --color-neutral: #B3BAC5;
    --custom-border-gray: #E2E2E2;
    /*thêm giao diện khoa học công nghệ*/
    --khcn-color-white: #ffffff;
    --khcn-color-blue: #0B83BF;

    --color-primary: #0368B2;
    --color-gray-dark: #3D3845;
    --color-rga-gray: #747273;
    --color-rga-gray-tint: #979797;
    --color-table-header: #E6EEF2;
    --color-table-header-border: #C1C7D0;
     
    --color-brading-red: #BA0018;
    --color-feedback-blue: #2126e9;
    --color-moderate-blue: #5357B6;
     
    --color-brading-blue-active: #1e6387;
    --color-brading-blue-light: #cddce4;
    --color-brading-blue-tint: #BAE2FF;
    --color-brading-red-tint: #c0192f;
    --color-invalid-red: #f1416c;
    --color-gray-light: #F7FFE2;
    --color-gray-tint-500: #D1CBCB;
    --color-gray: #8993A4;
    --bg-gray: #E9E9E9;
    --bg-gray-500: #F5F5F5;
    --bg-gray-600: #EDEDED;
    --bg-gray-700: #D8D4D4;
    --height-menu-login: 70px;
    --heigh-menu-nav: 90px;
    --max-width-page: 1440px;
    --bs-component-active-bg: #009ef7;
    --color-text-primary: #035189;
    --color-text-primary-tint: #2FAEED;
    --bg-color-primary-blue: #033189;
    --color-menu-footer: #0066B2;
    --bg-color-primary-meeting: #63B5E6;
}



html, body {
    font-family: inter-regular;
    font-size: 14px !important;
    font-weight: 400;
    line-height: 16.94px;
    margin-bottom: 0px !important;
    color: var(--color-gray-dark);
    font-size: 14px;
}


.select2-results__group{
    color: black !important;
    font-weight: 600 !important;
}

.fa-to-chuc-font {
    font-size: 5px!important;
    float: left;
    margin-top: 6px;
    margin-right: 4px;
    color: #0366d6!important;
}


.required:after {
    content: "*";
    position: relative;
    font-size: inherit;
    color: var(--bs-danger);
    padding-left: 0.25rem;
    font-weight: 600;
}

.pull-right {
    text-align: right;
}
/*--------- Beign:: Custom Adminlte layout ------------------------------------*/
/* begin: menu */
[class*=sidebar-light-] .nav-treeview > .nav-item > .nav-link.active {
    color: var(--khcn-color-blue, "#777");
    font-family: inter-bold;
    background-color: white;
    border-right: 3px solid var(--khcn-color-blue);
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

    [class*=sidebar-light-] .nav-treeview > .nav-item > .nav-link.active:hover {
        color: var(--khcn-color-blue, "#777");
        font-family: inter-bold;
    }

.nav-sidebar > .nav-item .nav-icon {
    color: var(--khcn-color-blue, "#777");
}

/*fix align icon fa-cirlce*/
.nav-sidebar > .nav-item .nav-link {
    display: flex;
    align-items: center;
    gap: 3px;
}

.nav-sidebar > .nav-item .nav-icon.fas.fa-circle {
    font-size: 0.4em;
    margin-top: 2px;
}
/*fix arrow menu*/
.nav-sidebar > .nav-item .nav-link > p > .right {
    color: var(--custom-color-placeholder);
}

.user-menu > a > span {
    line-height: 20px;
    font-weight: 600;
    color: var(--custom-text-dark);
}

/*fix menu level 0 active */
.sidebar-light-navy .nav-sidebar > .nav-item > .nav-link.active {
    background-color: white;
    color: var(--khcn-color-blue, "#777");
    font-weight: 600;
    border-right: 2px solid #F85900;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

[class*=sidebar-light-] .nav-sidebar > .nav-item > .nav-link.active {
    box-shadow: none;
}

/* end: menu */
.brand-link.hni-brand-link {
    border-bottom: 1px dashed var(--khcn-color-blue);
}
/*--------- End:: Custom Adminlte layout ------------------------------------*/

/*--------- Beign:: Body Container Common ------------------------------------*/
.hni-body-container {
    background-color: var(--white, "#FFFFFF");
    border-radius: var(--bs-border-radius);
    padding: 0px !important;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/*--------- End:: Body Container Common ------------------------------------*/

/*--------- Begin:: Pccc Content Page Common ------------------------------------*/
.hni-card-header {
    margin: 0 0 7px 0;
    padding: 0px;
    border-bottom: 0px;
}

.hni-card-body {
    margin: 0px;
    padding: 0px !important;
}

/*--------- End:: Pccc Content Page Common ------------------------------------*/


/*--------- Beign::  Table _ Pagination  ------------------------------------*/
.fv-row, .row-custom {
    margin-top: 0.9rem !important;
}

.hni-search-col {
    padding-bottom: 10px;
}


/*table START*/

table thead th, .table thead th {
    background-color: #F3F6FF;
    border-top: 1px dashed var(--custom-border-gray, "#E2E2E2");
    border-bottom: 1px dashed var(--custom-border-gray, "#E2E2E2");
    font-weight: normal;
    background-color: var(--custom-color-thead);
    padding-top: 0.68rem;
    padding-bottom: 0.68rem;
}

table thead tr {
    border-bottom: 1px dashed var(--custom-border-gray, "#E2E2E2") !important;
}

table tbody tr:first-child td {
    border-top: 1px dashed var(--custom-border-gray, "#E2E2E2");
}


.table-scroller {
    height: calc(70vh - 250px);
    overflow-y: auto;
    padding-bottom: 0 !important;
}

div.table-scroller::-webkit-scrollbar {
    width: 6px;
}

div.table-scroller::-webkit-scrollbar-thumb {
    background-color: #55555540 !important;
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}

.table-scroller thead {
    position: sticky;
    top: 0;
    z-index: 10;
    transition: 0.3s;
    transform: translateY(-1px);
}

/*table END*/

.indicator-progress {
    display: none;
}

[data-kt-indicator=on] > .indicator-progress {
    display: inline-block;
}

[data-kt-indicator=on] > .indicator-label {
    display: none;
}


/*V2*/
.pagination-container li {
    border-radius: 8px;
    border: 1px solid var(--color-neutral);
    margin-right: 0.5rem;
    /*padding: 0.35rem 0.1rem;*/
    padding: 0.25rem 0.01rem;
}

    .pagination-container li.active {
        border: 1px solid var(--color-brading-blue);
    }

    .pagination-container li span,
    .pagination-container li a {
        color: var(--color-neutral);
        border-radius: 8px;
        line-height: 1.25;
        padding: 0.5rem 0.65rem;
    }

    .pagination-container li i {
        font-size: 12px;
    }

    .pagination-container li:hover {
        border: 1px solid var(--color-brading-blue);
    }

        .pagination-container li:hover a {
            color: var(--color-brading-blue);
        }

        .pagination-container li:hover i {
            color: var(--color-brading-blue);
        }

    .pagination-container li.active span {
        /*border: 1px solid var(--color-brading-blue);*/
        color: var(--color-brading-blue);
        background-color: transparent;
    }

.flex-stack {
    justify-content: space-between;
    align-items: center;
}

.ms-20 {
    margin-left: 5rem !important;
}



/*--------- Begin:: Custom Form badge ------------------------------------*/

.hni-badge {
    display: inline-block;
    border-radius: 6px;
    padding: 7px 13px;
    width: 125px;
    text-align: center;
}

    .hni-badge.hni-badge-green {
        color: #0eb714;
        background-color: #DDF2E5;
    }

    .hni-badge.hni-badge-yellow {
        color: #f19f02;
        background-color: #FFF7E6
    }
    .hni-badge.hni-badge-cyan {
        color: #13C2C2;
        background-color: #E6FFFB;
    }

    .hni-badge.hni-badge-blue {
        color: #0A58CA;
        background-color: #CCE5FF;
    }

    .hni-badge.hni-badge-red {
        color: #FF3F3F;
        background-color: #FFD9D9;
    }

    .hni-badge.hni-badge-coral {
        color: #FF6F61; 
        background-color: #FFE6E1;
    }



/*--------- End:: Custom Form badge ------------------------------------*/
/*--------- Begin:: Custom Form Group ------------------------------------*/
.form-group label:not(.form-check-label):not(.custom-file-label) {
    font-weight: 100;
}

form label {
    font-weight: 400 !important;
}

.form-group button, button, input[type=button] {
    background-color: var(--khcn-color-blue);
    border-radius: 5px;
}

.hni-button-template {
    text-align: center;
    vertical-align: middle;
    /*padding: 6px 14px 6px 14px;*/
    border-radius: 5px;
    font-weight: 400;
    /*font-size: 14px;*/
    line-height: 21px;
    border: 0px;
    white-space: nowrap;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    padding: calc(0.375rem + 1px) calc(2.5rem + 1px);
    /*    width: 93px;
    height: 34px;*/
}

.hni-button-template2 {
    text-align: center;
    vertical-align: middle;
    min-width: 130px;
}



.hni-button-solid {
    background-color: var(--khcn-color-blue) !important;
    color: white !important;
    border: solid 1px var(--khcn-color-blue);
    transition-duration: 0.5s
}

    .hni-button-solid:hover {
        opacity: 0.7
    }

.hni-button-dash {
    background-color: white !important;
    color: var(--khcn-color-blue) !important;
    border: dashed 1px var(--khcn-color-blue);
    transition-duration: 0.5s
}

    .hni-button-dash:hover {
        background-color: var(--khcn-color-blue) !important;
        color: white !important;
        border: solid 1px var(--khcn-color-blue);
    }



.hni-min-width-200px {
    min-width: 200px;
}

/*--------- End:: Custom Form Group ------------------------------------*/

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


/*--------- Begin:: Custom Bootstrap ------------------------------------*/
.hni-gap-1 {
    gap: 0.25rem !important;
}

.hni-gap-2 {
    gap: 0.5rem !important;
}

.hni-gap-3 {
    gap: 1rem !important;
}
/*--------- End:: Custom Bootstrap ------------------------------------*/


.title-website {
    font-family: inter-semibold;
    font-size: 14px;
    color: var(--khcn-color-white);
    line-height: 20px;
}

.content-wrapper {
    background-color: #F5F5F5;
    border-left: 1px solid #CED4DA;
}

.main-header {
    border-bottom: none;
    border-left: 1px solid #CED4DA;
    background-color: var(--khcn-color-blue);
}

.roll-back-button {
    background: #F1F5FD;
    color: #4676FB;
    border-radius: 5px;
}

.confirm-button {
    background: #4676FB;
    border-radius: 5px;
}

.action-button-edit {
    border: 1px dashed #4676FB;
    border-radius: 5px;
    padding: 3px;
}

.export-excel-button {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 10px;
    border: 1px solid #3B8E39;
    background-color: #F5F9FF;
    color: #3B8E39;
}

    .export-excel-button:hover {
        color: #3B8E39;
    }

.export-pdf-button {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 10px;
    border: 1px solid #EF3939;
    background-color: #F5F9FF;
    color: #EF3939;
}

    .export-pdf-button:hover {
        color: #EF3939;
    }


.user-image-custom {
    width: 38px;
    height: 38px;
}

.btn-app-sm {
    border-radius: 3px;
    position: relative;
    padding: 0px 0px;
    margin: 0 0 0px 5px;
    min-width: 25px;
    text-align: center;
    color: #3c8dbc;
    font-size: 15px;
    display: inline-block;
    cursor: pointer;
}

    .btn-app-sm i {
        font-size: 18px;
    }

.modal-body {
    /*min-height: 250px;*/
}

.btn {
    /*min-width: 80px;*/
}

.btn-show-map {
    background-color: #F4F5F7 !important;
    border-radius: 6px;
    padding: 4px;
    border: none;
}

.cssshowmessage {
    position: fixed;
    top: 10px;
    right: 5px;
    z-index: 1080;
    color: #fff;
    max-width: 600px;
    text-align: right;
}

.alert {
    margin-bottom: 5px;
}

    .alert .close {
        text-decoration: none;
    }

.form-textarea {
    height: auto !important;
}

/*fa-awesome*/
.fa.disabled,
.fa[disabled],
.disabled > .fa,
[disabled] > .fa {
    color: lightgrey;
    /*or*/
    -ms-opacity: 0.5;
    opacity: 0.5;
    color: gray;
    cursor: not-allowed;
}

.fa-add-new {
    color: #fff;
    background-color: #3c8dbc;
    border: 1px solid #367fa9;
    padding: 8px 10px 6px 10px;
    margin: 0;
    margin-top: 0px;
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0 3px 0 0;
}
/*end fa-awesome*/
.t-vertical-align-middle {
    vertical-align: middle !important;
}

.t-vertical-align-bottom {
    vertical-align: bottom !important;
}

.orderFilter {
    cursor: pointer;
    color: #428bca
}

@media (min-width: 768px) {
    .modal-max {
        width: 90%;
    }

    .modal-max {
        max-width: 1200px;
    }

    .modal-sm {
        width: 500px;
    }
}

.t-loading-container {
    position: fixed;
    z-index: 5000;
    width: 100%;
    height: 100%;
    background: rgba(96, 125, 139, 0.5);
    top: 0;
    left: 0;
}

    .t-loading-container img {
        position: fixed;
        top: 50%;
        left: 50%;
    }
/*TypeAhead*/
.typeahead,
.tt-query,
.tt-hint {
    display: block;
    /*width: 75%;
  height: 34px;
  padding: 6px 12px;
  font-size: 12px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
  -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
       -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
          transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  outline: none;*/
}

.typeahead {
    background-color: #fff;
}

    .typeahead:focus {
        /*border-color: #66afe9;*/
        outline: 0;
        /*-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);*/
    }

.tt-query {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
    color: #999
}

.tt-menu {
    width: 130%;
    margin: 5px 0;
    padding: 8px 0;
    background-color: rgba( 167, 198,226, .6);
    /*border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);*/
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-highlight {
    color: #fff;
}

.tt-suggestion {
    padding: 3px 20px;
    font-size: 12px;
    line-height: 24px;
}

    .tt-suggestion:hover {
        cursor: pointer;
        color: #fff;
        background-color: #0097cf;
    }

    .tt-suggestion.tt-cursor {
        color: #fff;
        background-color: #0097cf;
    }

    .tt-suggestion p {
        margin: 0;
    }

.gist {
    font-size: 12px;
}

/* example specific styles */
/* ----------------------- */

#custom-templates .empty-message {
    padding: 5px 10px;
    text-align: center;
}

#multiple-datasets .league-name {
    margin: 0 20px 5px 20px;
    padding: 3px 0;
    border-bottom: 1px solid #ccc;
}

#scrollable-dropdown-menu .tt-menu {
    max-height: 150px;
    overflow-y: auto;
}

#rtl-support .tt-menu {
    text-align: right;
}

.ajax {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: url("../img/loading.gif") no-repeat center center rgba(255, 255, 255, 0.2);
    z-index: 999999;
    -ms-background-size: 20px 20px;
    background-size: 20px 20px;
}

/*End TypeAhead*/

.pagination {
    margin: 5px 0;
}

    .pagination > .page-item.active > .page-link {
        background-color: var(--khcn-color-blue);
        z-index: 3;
        color: #fff;
        border-radius: 3px;
        border: 0;
    }

/*.pagination ul {
        display: inline-block;
        *display: inline;
        *zoom: 1;
        margin-left: 0;
        margin-bottom: 0;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
        -moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
        box-shadow: 0 1px 2px rgba(0,0,0,.05);
        -webkit-margin-before: 0;
        -webkit-margin-after: 0;
        -webkit-margin-start: 0;
        -webkit-margin-end: 0;
        -webkit-padding-start: 0;
    }

        .pagination ul > li {
            display: inline;
        }

            .pagination ul > li > a, .pagination ul > li > span {
                float: left;
                padding: 4px 12px;
                line-height: 20px;
                text-decoration: none;
                background-color: #fff;
                border: 1px solid #ddd;
                border-left-width: 0;
            }

                .pagination ul > li > a:hover, .pagination ul > li > a:focus, .pagination ul > .active > a, .pagination ul > .active > span {
                    background-color: #f5f5f5;
                }

        .pagination ul > .active > a, .pagination ul > .active > span {
            color: #999;
            cursor: default;
        }

        .pagination ul > .disabled > span, .pagination ul > .disabled > a, .pagination ul > .disabled > a:hover, .pagination ul > .disabled > a:focus {
            color: #999;
            background-color: transparent;
            cursor: default;
        }

        .pagination ul > li:first-child > a, .pagination ul > li:first-child > span {
            border-left-width: 1px;
            -webkit-border-top-left-radius: 4px;
            -moz-border-radius-topleft: 4px;
            border-top-left-radius: 4px;
            -webkit-border-bottom-left-radius: 4px;
            -moz-border-radius-bottomleft: 4px;
            border-bottom-left-radius: 4px;
        }

        .pagination ul > li:last-child > a, .pagination ul > li:last-child > span {
            -webkit-border-top-right-radius: 4px;
            -moz-border-radius-topright: 4px;
            border-top-right-radius: 4px;
            -webkit-border-bottom-right-radius: 4px;
            -moz-border-radius-bottomright: 4px;
            border-bottom-right-radius: 4px;
        }*/

.pagination-centered {
    text-align: center;
}

.pagination-right {
    text-align: right;
}

.pagination-large ul > li > a, .pagination-large ul > li > span {
    padding: 11px 19px;
    font-size: 17.5px;
}

.pagination-large ul > li:first-child > a, .pagination-large ul > li:first-child > span {
    -webkit-border-top-left-radius: 6px;
    -moz-border-radius-topleft: 6px;
    border-top-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -moz-border-radius-bottomleft: 6px;
    border-bottom-left-radius: 6px;
}

.pagination-large ul > li:last-child > a, .pagination-large ul > li:last-child > span {
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topright: 6px;
    border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    border-bottom-right-radius: 6px;
}

.pagination-mini ul > li:first-child > a, .pagination-small ul > li:first-child > a, .pagination-mini ul > li:first-child > span, .pagination-small ul > li:first-child > span {
    -webkit-border-top-left-radius: 3px;
    -moz-border-radius-topleft: 3px;
    border-top-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -moz-border-radius-bottomleft: 3px;
    border-bottom-left-radius: 3px;
}

.pagination-mini ul > li:last-child > a, .pagination-small ul > li:last-child > a, .pagination-mini ul > li:last-child > span, .pagination-small ul > li:last-child > span {
    -webkit-border-top-right-radius: 3px;
    -moz-border-radius-topright: 3px;
    border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -moz-border-radius-bottomright: 3px;
    border-bottom-right-radius: 3px;
}

.pagination-small ul > li > a, .pagination-small ul > li > span {
    padding: 2px 10px;
    font-size: 11.9px;
}

.pagination-mini ul > li > a, .pagination-mini ul > li > span {
    padding: 0 6px;
    font-size: 10.5px;
}

.profile-user-info {
    display: table;
    width: 98%;
    width: calc(100% - 24px);
    margin: 0 auto
}

.profile-info-row {
    display: table-row
}

.profile-info-name,
.profile-info-value {
    display: table-cell;
    border-top: 1px dotted #D5E4F1
}

.profile-info-name {
    text-align: right;
    padding: 6px 10px 6px 4px;
    font-weight: 400;
    color: #667E99;
    background-color: transparent;
    width: 110px;
    vertical-align: middle
}

.profile-info-value {
    padding: 6px 4px 6px 6px
}

    .profile-info-value > span + span:before {
        display: inline;
        content: ",";
        margin-left: 1px;
        margin-right: 3px;
        color: #666;
        border-bottom: 1px solid #FFF
    }

    .profile-info-value > span + span.editable-container:before {
        display: none
    }

.profile-info-row:first-child .profile-info-name,
.profile-info-row:first-child .profile-info-value {
    border-top: none
}

.profile-user-info-striped {
    border: 1px solid #DCEBF7
}

    .profile-user-info-striped .profile-info-name {
        color: #336199;
        background-color: #EDF3F4;
        border-top: 1px solid #F7FBFF
    }

    .profile-user-info-striped .profile-info-value {
        border-top: 1px dotted #DCEBF7;
        padding-left: 12px
    }

.profile-picture {
    border: 1px solid #CCC;
    background-color: #FFF;
    padding: 4px;
    display: inline-block;
    max-width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .15)
}

.dd-empty,
.dd-handle,
.dd-placeholder,
.dd2-content {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}

.profile-activity {
    padding: 10px 4px;
    border-bottom: 1px dotted #D0D8E0;
    position: relative;
    border-left: 1px dotted #FFF;
    border-right: 1px dotted #FFF
}

    .profile-activity:first-child {
        border-top: 1px dotted transparent
    }

        .profile-activity:first-child:hover {
            border-top-color: #D0D8E0
        }

    .profile-activity:hover {
        background-color: #F4F9FD;
        border-left: 1px dotted #D0D8E0;
        border-right: 1px dotted #D0D8E0
    }

    .profile-activity img {
        border: 2px solid #C9D6E5;
        border-radius: 100%;
        max-width: 40px;
        margin-right: 10px;
        margin-left: 0;
        box-shadow: none
    }

    .profile-activity .thumbicon {
        background-color: #74ABD7;
        display: inline-block;
        border-radius: 100%;
        width: 38px;
        height: 38px;
        color: #FFF;
        font-size: 18px;
        text-align: center;
        line-height: 38px;
        margin-right: 10px;
        margin-left: 0;
        text-shadow: none !important
    }

    .profile-activity .time {
        display: block;
        margin-top: 4px;
        color: #777
    }

    .profile-activity a.user {
        font-weight: 700;
        color: #9585BF
    }

    .profile-activity .tools {
        position: absolute;
        right: 12px;
        bottom: 8px;
        display: none
    }

    .profile-activity:hover .tools {
        display: block
    }

.user-profile .ace-thumbnails li {
    border: 1px solid #CCC;
    padding: 3px;
    margin: 6px
}

    .user-profile .ace-thumbnails li .tools {
        left: 3px;
        right: 3px
    }

    .user-profile .ace-thumbnails li:hover .tools {
        bottom: 3px
    }

.user-title-label:hover {
    text-decoration: none
}

.user-title-label + .dropdown-menu {
    margin-left: -12px
}

.profile-contact-links {
    padding: 4px 2px 5px;
    border: 1px solid #E0E2E5;
    background-color: #F8FAFC
}

.btn-link:hover .ace-icon {
    text-decoration: none !important
}

.profile-social-links > a:hover > .ace-icon,
.profile-users .memberdiv .name a:hover .ace-icon,
.profile-users .memberdiv .tools > a:hover {
    text-decoration: none
}

.profile-social-links > a {
    text-decoration: none;
    margin: 0 1px
}

.profile-skills .progress {
    height: 26px;
    margin-bottom: 2px;
    background-color: transparent
}

    .profile-skills .progress .progress-bar {
        line-height: 26px;
        font-size: 13px;
        font-weight: 700;
        font-family: "Roboto";
        padding: 0 8px
    }

.profile-users .user {
    display: block;
    position: static;
    text-align: center;
    width: auto
}

    .profile-users .user img {
        padding: 2px;
        border-radius: 100%;
        border: 1px solid #AAA;
        max-width: none;
        width: 64px;
        -webkit-transition: all .1s;
        -o-transition: all .1s;
        transition: all .1s
    }

        .profile-users .user img:hover {
            -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .33);
            box-shadow: 0 0 1px 1px rgba(0, 0, 0, .33)
        }

.profile-users .memberdiv {
    background-color: #FFF;
    width: 100px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    text-align: center;
    margin: 0 8px 24px
}

    .profile-users .memberdiv .body {
        display: inline-block;
        margin: 8px 0 0
    }

    .profile-users .memberdiv .popover {
        visibility: hidden;
        min-width: 0;
        max-height: 0;
        max-width: 0;
        margin-left: 0;
        margin-right: 0;
        top: -5%;
        left: auto;
        right: auto;
        opacity: 0;
        display: none;
        position: absolute;
        -webkit-transition: opacity .2s linear 0s, visibility 0s linear .2s, max-height 0s linear .2s, max-width 0s linear .2s, min-width 0s linear .2s;
        -o-transition: opacity .2s linear 0s, visibility 0s linear .2s, max-height 0s linear .2s, max-width 0s linear .2s, min-width 0s linear .2s;
        transition: opacity .2s linear 0s, visibility 0s linear .2s, max-height 0s linear .2s, max-width 0s linear .2s, min-width 0s linear .2s
    }

        .profile-users .memberdiv .popover.right {
            left: 100%;
            right: auto;
            display: block
        }

        .profile-users .memberdiv .popover.left {
            left: auto;
            right: 100%;
            display: block
        }

    .profile-users .memberdiv > :first-child:hover .popover {
        visibility: visible;
        opacity: 1;
        z-index: 1060;
        max-height: 250px;
        max-width: 250px;
        min-width: 150px;
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s
    }

    .profile-users .memberdiv .tools {
        position: static;
        display: block;
        width: 100%;
        margin-top: 2px
    }

        .profile-users .memberdiv .tools > a {
            margin: 0 2px
        }

.user-status {
    display: inline-block;
    width: 11px;
    height: 11px;
    background-color: #FFF;
    border: 3px solid #AAA;
    border-radius: 100%;
    vertical-align: middle;
    margin-right: 1px
}

    .user-status.status-online {
        border-color: #8AC16C
    }

    .user-status.status-busy {
        border-color: #E07F69
    }

    .user-status.status-idle {
        border-color: #FFB752
    }

.tab-content.profile-edit-tab-content {
    border: 1px solid #DDD;
    padding: 8px 32px 32px;
    -webkit-box-shadow: 1px 1px 0 0 rgba(0, 0, 0, .2);
    box-shadow: 1px 1px 0 0 rgba(0, 0, 0, .2);
    background-color: #FFF
}

@media only screen and (max-width:480px) {
    .profile-info-name {
        width: 80px
    }

    .profile-user-info-striped .profile-info-name {
        float: none;
        width: auto;
        text-align: left;
        padding: 6px 4px 6px 10px;
        display: block
    }

    .profile-user-info-striped .profile-info-value {
        margin-left: 10px;
        display: block
    }

    .user-profile .memberdiv {
        width: 50%;
        margin-left: 0;
        margin-right: 0
    }
}
/*End Common style*/

/* Beign PCCC Common style*/
.hni-text-toolbar {
    color: var(--custom-text-gray);
    font-size: 14px;
    line-height: 17px;
}

.hni-text-toolbar-active {
    color: var(--custom-text-dark);
    font-size: 14px;
    line-height: 17px;
}


/* End PCCC Common style*/

/* Begin Get from bootstrap 5.3 */

.m-0 {
    margin: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.m-auto {
    margin: auto !important;
}

.mx-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.mx-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
}

.mx-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
}

.mx-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
}

.mx-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
}

.mx-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
}

.mx-auto {
    margin-right: auto !important;
    margin-left: auto !important;
}

.my-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.my-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
}

.my-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

.my-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.my-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
}

.my-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
}

.my-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
}

.mt-0 {
    margin-top: 0 !important;
}

.mt-1 {
    margin-top: 0.25rem !important;
}

.mt-2 {
    margin-top: 0.5rem !important;
}

.mt-3 {
    margin-top: 1rem !important;
}

.mt-4 {
    margin-top: 1.5rem !important;
}

.mt-5 {
    margin-top: 3rem !important;
}

.mt-auto {
    margin-top: auto !important;
}

.me-0 {
    margin-right: 0 !important;
}

.me-1 {
    margin-right: 0.25rem !important;
}

.me-2 {
    margin-right: 0.5rem !important;
}

.me-3 {
    margin-right: 1rem !important;
}

.me-4 {
    margin-right: 1.5rem !important;
}

.me-5 {
    margin-right: 3rem !important;
}

.me-auto {
    margin-right: auto !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mb-1 {
    margin-bottom: 0.25rem !important;
}

.mb-2 {
    margin-bottom: 0.5rem !important;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}

.mb-5 {
    margin-bottom: 3rem !important;
}

.mb-auto {
    margin-bottom: auto !important;
}

.ms-0 {
    margin-left: 0 !important;
}

.ms-1 {
    margin-left: 0.25rem !important;
}

.ms-2 {
    margin-left: 0.5rem !important;
}

.ms-3 {
    margin-left: 1rem !important;
}

.ms-4 {
    margin-left: 1.5rem !important;
}

.ms-5 {
    margin-left: 3rem !important;
}

.ms-auto {
    margin-left: auto !important;
}
/* End Get from bootstrap 5.3*/


/*Begin::Pagination with number */
#pagination-size.pageination + span.select2.select2-container span.select2-selection {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid var(--khcn-color-blue);
    border-radius: 0;
}

    #pagination-size.pageination + span.select2.select2-container span.select2-selection .selection__arrow b {
        border-color: var(--khcn-color-blue);
    }

.page-content {
    padding: calc(70px + 1.5rem) calc(1.5rem * .5) 120px calc(1.5rem * .5);
}

.pagination-container {
    right: 0;
    /*position: fixed;*/
    bottom: calc(1.5rem * 2.5);
    left: var(--vz-vertical-menu-width);
}
/*End::Pagination with number */

/*Begin::Navbar avatar and username */
.dropdown-user-action {
    border-radius: 8px;
}

.username {
    color: #172B4D;
    font-size: 14px;
    font-weight: 600;
}

.user-action-text {
    font-size: 14px;
    font-weight: 400;
    color: #172B4D;
}
/*End::Navbar avatar and username */
.thead-dashed {
    border-top: 2px dashed #E2E2E2;
    border-bottom: 2px dashed #E2E2E2;
}

.searchCommonCss {
    width: 263px !important;
    height: 34px;
    border-radius: 5px;
    padding: 6px 7px;
}

.statusCommonCss {
    width: 175px !important;
}

.card-background-custom {
    background-color: #F5F5F5 !important;
    padding: 10px;
}

.text-chitiet {
    color: #172B4D;
    font-size: 14px !important;
    font-family: inter-regular;
}

.text-chitiet_medium {
    color: #172B4D;
    font-size: 14px !important;
    font-family: inter-medium;
}

.tab-down {
    border: 1px solid #F5F5F5 !important;
    cursor: pointer;
}

.biendong-card {
    border-radius: 5px;
}

.biendong-card-selected {
    background-color: #F4F4F4;
}

.separator {
    border-top: 1px dashed #CED4DA !important;
    margin-top: 5px 0 !important;
}

.name-blue-highlight {
    color: #4676FB;
}

.name-red-highlight {
    color: #D70000;
}

.title-blue-500 {
    font-family: inter-medium;
    color: #4676FB;
    font-size: 14px !important;
    line-height: 20px;
    font-weight: 500 !important;
}

.title-black-500 {
    font-family: inter-medium;
    color: #172B4D;
    font-size: 14px !important;
    line-height: 20px;
    font-weight: 500 !important;
}

.xoa-nguoi-kiem-tra-button {
    width: 76px;
    height: 32px;
    background-color: #FFDADA8F !important;
    padding: 7px 14px;
    color: #D70000 !important;
    border-radius: 5px;
}

.bien-dong {
    padding: 20px 15px 10px 15px;
    background: #F5F5F5;
    font-size: 14px;
    font-family: inter-regular;
    margin-bottom: 15px;
}

.bien-dong-label {
    padding-left: 8px;
    padding-bottom: 5px;
    font-size: 14px;
    font-family: inter-regular;
}

.text-sm {
    font-size: 1rem !important
}

.text-44 {
    font-size: 44px;
    line-height: 46px;
}

.flex-1 {
    flex: 1;
}

.clickable {
    cursor: pointer;
}

.dotkiemtra-status {
    display: inline-block;
    color: #fff;
    background: #00A725;
    padding: 6px 10px;
    font-family: inter-regular;
    font-size: 14px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.dotkiemtra-now {
    background: #00A725;
}

.dotkiemtra-complated {
    background: #F85900;
}

.dotkiemtra-notstarted {
    background: #1e27d4;
}

.selected-nav-item {
    color: #4676FB !important;
    background-color: #F3F6FF !important;
}

.button-rounded {
    border-radius: 5px;
}

.chitiet-coso-container {
    height: calc(100vh - 274px);
    display: flex;
    flex-direction: column;
}

.lichsu-container {
    height: calc(100vh - 274px);
}

.ten-bien-dong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

select.year + span .select2-selection__rendered {
    padding-left: 0 !important;
}

.d-flex.justify-evenly {
    justify-content: space-evenly;
}

.info-container {
    max-height: 694px;
    overflow-y: auto;
    margin-right: -8px;
}

    .info-container::-webkit-scrollbar {
        width: 6px;
    }

    .info-container::-webkit-scrollbar-track {
        border-radius: 3px;
        background: #E8E8E8;
    }

    .info-container::-webkit-scrollbar-thumb {
        border-radius: 3px;
        background: #D9D9D9;
    }

        .info-container::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

    /* Hide scrollbar arrows */
    .info-container::-webkit-scrollbar-button {
        display: none;
    }

.lichSuContainer {
    overflow-y: auto;
    margin-right: 2px;
}

    .lichSuContainer::-webkit-scrollbar {
        width: 6px;
    }

    .lichSuContainer::-webkit-scrollbar-track {
        border-radius: 3px;
        background: #E8E8E8;
    }

    .lichSuContainer::-webkit-scrollbar-thumb {
        border-radius: 3px;
        background: #D9D9D9;
    }

        .lichSuContainer::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

    /* Hide scrollbar arrows */
    .lichSuContainer::-webkit-scrollbar-button {
        display: none;
    }


.badge-button-back {
    width: 81px;
    height: 32px;
    font-size: 14px;
    font-weight: 400;
    border-radius: 5px;
}


.badge.badge-circle, .badge.badge-square {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 1.75rem;
    min-width: 1.75rem;
    padding: 0 0.1rem;
}

.badge.badge-circle {
    border-radius: 50%;
    padding: 0;
    min-width: unset;
    width: 1.75rem;
}

.badge.badge-sm {
    min-width: 1.5rem;
    font-size: 0.85rem;
}

    .badge.badge-sm.badge-circle {
        width: 1.5rem;
        height: 1.5rem;
    }

.badge.badge-lg {
    min-width: 2rem;
    font-size: 1rem;
}

    .badge.badge-lg.badge-circle {
        width: 2rem;
        height: 2rem;
    }

.badge-white {
    color: #7E8299;
    background-color: #ffffff;
}

.badge-light-white {
    color: #ffffff;
}

.badge-light {
    color: #7E8299;
    background-color: #F5F8FA;
}

.badge-light-light {
    color: #F5F8FA;
}

.badge-primary {
    color: #FFFFFF;
    background-color: #009EF7;
}

.badge-light-primary {
    color: #009EF7;
    background-color: #F1FAFF;
}

.badge-secondary {
    color: #3F4254;
    background-color: #E4E6EF;
}

.badge-light-secondary {
    color: #E4E6EF;
}

.badge-success {
    color: #FFFFFF;
    background-color: #50CD89;
}

.badge-light-success {
    color: #50CD89;
    background-color: #E8FFF3;
}

.badge-info {
    color: #FFFFFF;
    background-color: #7239EA;
}

.badge-light-info {
    color: #7239EA;
    background-color: #F8F5FF;
}

.badge-warning {
    color: #FFFFFF;
    background-color: #FFC700;
}

.badge-light-warning {
    color: #FFC700;
    background-color: #FFF8DD;
}

.badge-danger {
    color: #FFFFFF;
    background-color: #F1416C;
}

.badge-light-danger {
    color: #F1416C;
    background-color: #FFF5F8;
}

.badge-dark {
    color: #ffffff;
    background-color: #181C32;
}

.badge-light-dark {
    color: #181C32;
    background-color: #EFF2F5;
}

.badge-very-primary {
    color: #FFFFFF;
    background-color: #009EF7;
    font-size: 14px;
    font-weight: 400;
}

.badge-very-success {
    color: #FFFFFF;
    background-color: #00A725;
    font-size: 14px;
    font-weight: 400;
}

.badge-very-danger {
    color: #FFFFFF;
    background-color: #CC2200;
    font-size: 14px;
    font-weight: 400;
}

.content-header {
    display: none;
}

.content {
    /*background: #FFF;*/
}

.required:after {
    content: "*";
    position: relative;
    font-size: inherit;
    color: var(--bs-danger);
    padding-left: 0.25rem;
    font-weight: 600;
}

.bg-process {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.1);
    z-index: 1051;
}

.img-loadding {
    display: block;
    margin: 0 auto;
    margin-top: 30em;
}

.border-right-primary {
    border-right: 1px solid #4676FB;
}

.border-wrapper {
    position: relative;
    border: 1px solid #CED4DA; /* Adjust as needed */
    padding-top: 30px; /* Adjust as needed */
    border-radius: 4px
}

    .border-wrapper .region-header {
        position: absolute;
        top: 0;
        transform: translate(5%, -50%);
        background: #F5F5F5; /* Same as your page background */
        padding: 2px 10px; /* Adjust as needed */
        border-radius: 3px;
    }

.arrow-down {
    display: inline-block;
    margin-left: 5px;
    width: 8px;
    height: 8px;
    border-left: 1px solid #4676FB;
    border-bottom: 1px solid #4676FB;
    /* transform: rotate(-45deg); */
    /* vertical-align: top; */
    transition: transform 0.3s ease;
    /* position: absolute; */
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
}

    .arrow-down.up {
        transform: rotate(135deg);
        /* vertical-align: inherit; */
    }

.info {
    margin-top: -10px;
}

.active-facility {
    color: #3FA700;
}

.inactive-facility {
    color: #EF4920;
}

.background-hangmuc {
    background-color: #FFFFFF !important;
}

.card-custom-relative {
    position: relative;
    border: 1px solid #CED4DA;
    border-radius: 4px;
    padding: 10px;
}

.card-title-custom-absolute {
    position: absolute;
    top: -10px;
    left: 20px;
    background: white;
    padding: 0px 5px;
}

.button-upload-cms {
    width: 130px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    color: #172B4D;
    border: 1px dashed #CED4DA;
}

.text-upload-cms {
    color: #172B4D;
    font-size: 14px;
    font-weight: 400 !important;
    cursor: pointer;
}

.hni-disable {
    pointer-events: none;
    cursor: default;
    opacity: 0.4;
}

.white-space-nowrap {
    white-space: nowrap !important;
}

.action-button svg:hover path {
    /*stroke: #F85900;*/
    opacity: 0.7;
}

.toast-top-right {
    top: 12px;
    right: auto;
    left: auto;
}

/*profile-avatar*/
.col-right-avatar {
    border-left: 1px solid #efefef;
    padding-top: 20px;
    text-align: center;
}

.profile-avatar {
    width: 100px;
    height: 100px;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    border-radius: 100px;
    display: inline-block;
}

.css-gioitinh {
    float: left;
    display: inline-block;
    margin-right: 15px;
}

.profile-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    border: 1px solid #efefef;
}

@media (max-width: 576px) {
    .modal-dialog {
        max-width: 540px !important;
        margin-right: auto;
        margin-left: auto;
    }
}

/*Begin::login*/
.login-otp {
    text-align: center;
}
/*End::login*/
.comeback-button {
    background-color: aliceblue;
    color: #009EF7;
    padding: 8px 16px;
    border-radius: 4px;
}

.tagify {
    width: 635px;
    height: auto;
    max-height: 300px;
    overflow: auto;
}

#modalDefault {
    --bs-modal-width: 540px;
}

.color-button {
    color: #0b83bf!important;
}

#listFiles{ padding-top:10px!important;}

.dropzone-filename [data-dz-name] {
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-wrap: break-word !important;
    word-break: break-word !important;
    font-weight: bold;
}

.dropzone-item .dropzone-file {
    flex-grow: 1 !important;
}

.dropzone.dropzone-queue .dropzone-item-custom .dropzone-file .dropzone-filename {
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--bs-gray-600);
    text-overflow: ellipsis;
    margin-right: 0.5rem;
}

.modal-title-custom {
    color: #0B83BF;
    text-transform:uppercase;
    font-size:14px; 
    font-family:inter-medium;
}
.text-bold-custom{
    font-family:inter-bold;
}
.text-bold-custom2{ padding-left:0px!important;}


.td-limit-200 {
    max-width: 200px;
    overflow-wrap: break-word; /* Allows the words to break and wrap to the next line */
    word-wrap: break-word; /* Deprecated but useful for older browsers */
    word-break: break-word; /* Ensures break at overflow */
}

.btn-copy-link span {
    color: inherit;
    text-decoration: none;
    transition: color 0.3s, text-decoration 0.3s;
    color: blue;
}

.dropdown-custom-action {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

    .dropdown-custom-action .button-custom {
        font-size: 14px !important;
        background: #F7F7F9;
    }

    .dropdown-custom-action .button-custom:hover {
       
        background: #F7F7F9!important;
    }

.btn-check:checked + .btn.btn-secondary, .btn-check:active + .btn.btn-secondary, .btn.btn-secondary:focus:not(.btn-active), .btn.btn-secondary:hover:not(.btn-active), .btn.btn-secondary:active:not(.btn-active), .btn.btn-secondary.active, .btn.btn-secondary.show, .show > .btn.btn-secondary {
    color: var(--bs-secondary-inverse);
    background: #CED4DA !important;
}



.dropdown-custom-action .dropdown-item {
    line-height:30px;
}


    .dropdown-custom-action .dropdown-item svg {
        padding-right:0px!important;
    }



.table thead th {
    font-family: inter-medium;
}
.link {
    color: #0366d6;
}

    .link:hover {
        color: #035fc4!important;
    }

.container-file a{
    color: #007bff!important;
}


/*vanbanden*/
.table-container-vbden {
    width: 400px;
}
.div-content-vb{
    background:red;
}


.td-vbden {
    /*padding-left: 20px !important;*/
    /*cursor:pointer;*/
}

.vb-title {
    padding-top:4px;display:block;
    color: #0B83BF;
    font-family: inter-regular;
    
}

.vb-title-content {
    font-family: inter-regular;
    color: #172B4D;
    display: block;
    padding-top: 4px;
    line-height:20px;
}
.vb-title-date {
    font-family: inter-regular;
    color: #172B4D;
    float: right;
    display: block;
}
.vb-title-container-active span {
    font-family: inter-semibold;
}

.table-vbden tbody tr:hover,
.table-vbden tbody tr.active {
    background: #E2E2E2 !important;
}

    .table-vbden tbody tr.active td a, .table-vbden tbody tr.active td a span{
        font-family: inter-semibold !important;
    }

    .css-title-tochuc {
        font-family: inter-medium;
    }

    .css-title-tochuc:hover {
        color: #1890ff !important;
    }


table tbody tr:hover {
    background: #F3F6FF !important
}
.a-hover:hover {
    color: #1890ff!important;
}

table thead tr th {
    font-family:inter-medium!important;
}


.info-row-dashed label{font-family:inter-semibold;font-weight:initial!important;}

.line-height-18{ line-height:20px;}

.hni-button-no-border {
    background-color: var(--white, "#FFFFFF");
    color: #EF3939 !important;
    border: none;
    font-family: inter-medium !important;
    font-weight:initial!important;
}

.text-bold{ font-family:inter-bold!important;}




/*Hỗ trợ */

.text-color-primary {
    color: var(--color-primary, "#0368B2")
}

.text-color-primary-tint {
    color: var(--color-text-primary-tint, "#2FAEED")
}

.text-color-gray-dark {
    color: var(--color-gray-dark, "#3D3845") !important;
}

.text-color-gray-tint {
    color: var(--color-rga-gray-tint, "#979797") !important;
}

.text-small {
    font-size: 13px;
}

.text-medium {
    font-size: 14px;
}

.text-large {
    font-size: 16px;
}

.title-lien-he {
    font-size: 15px;
    line-height: 20px;
    color: #0B83BF;
}


.title-danh-ba {
    color: #0B90EF;
}

.container-component-danh-ba {
    max-height: 750px;
    overflow-y: auto;
    overflow-x: hidden;
}

.bg-moderate-blue {
    background: var(--color-moderate-blue, "#5357B6");
}

.dashboard-custom-title {
    font-size: 16px;
}
.question-container {
    min-width: 80%;
}

.search-note {
    color: #EFAF00;
}


@media (max-width: 767px) {
    * {
        font-size: 10px !important;
        line-height: 14px !important;
    }

    .cssshowmessage {
        max-width: 100%;
    }

    .cssshowmessage {
        left: 5px;
    }

    .main-header {
        flex-wrap: wrap !important;
    }
    .text-44 {
        font-size: 20px !important;
    }

    .select-doanh-nghiep {
        width: 200px;
        font-size: 10px !important;
    }

    .menu-item {
        padding: 5px 10px !important;
    }

    .hni-button-template {
        padding: 5px 10px !important;
    }
    table th {
        align-content: center;
    }
    table td {
        align-content: center;
    }
    .hni-badge {
        padding: 5px 10px;
    }
    .dropdown-custom-action .button-custom {
        font-size: 10px !important;
        padding: 5px 10px !important;
    }
    .searchCommonCss {
        width: 160px !important;
        height: 28px;
        padding: 3px 5px;
    }
    .card .card-header {
        padding: 5px 10px !important;
    }
    .card .card-body {
        padding: 5px 10px !important;
    }
    #btnSendContactUs {
        font-size: 10px !important;
    }


    /* Pagination */
    .select-pagination-css {
        margin-right: 10px !important;
    }
    .pagination-item {
        margin-right: 2px !important;
    }
    .page-item {
        margin: 0px !important;
    }
        .page-item .page-link {
            min-width: 20px;
            height: 20px;
        }

}


/* Sweet alert   */
.swal2-confirm-large {
    font-size: 1.25rem !important;
    width: 80px;
}

.nofi_label.noti_yellow .icon_noti {
    background-image: url(../images/noti_label/icon_noti_warning.svg);
}

.css-verify {
    margin-top: 1px;
    color: #bf7e00 !important;
    background-color: #FFF8E9 !important;
    padding: 6px 8px;
   border-width:0px!important;
}
.btn-close-verify {
    padding:.45rem 1.0rem !important;
}


.css-verify a {
    color: #0366d6;
    text-decoration: none;
    font-family:inter-bold;
}

.dropdown-action-tochuc {
    border: 1px solid #0366d6;
    border-radius: 8px;
}
.button-custom-tochuc {
    width: 100%;
    background: #fff !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    color: #0366d6 !important;
}
/*.button-custom-tochuc:hover {
    background:#fff!important;

}*/

    .button-custom-tochuc:checked + .btn.button-custom-tochuc, .button-custom-tochuc:active + .btn.button-custom-tochuc, .btn.button-custom-tochuc:focus:not(.btn-active), .btn.button-custom-tochuc:hover:not(.btn-active), .btn.button-custom-tochuc:active:not(.btn-active), .btn.button-custom-tochuc.active, .btn.button-custom-tochuc.show, .show > .btn.button-custom-tochuc {
        color: var(--bs-secondary-inverse);
        background: #fff !important;
    }

.btn.button-custom-tochuc.dropdown-toggle:after {
    color: #0366d6 !important;
}
.table td, .table th {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
}

.css-manager-tochuc {
    display: inline-block;
    margin-top: 4px;
    font-size: 11px !important;
    font-family: inter-semibold;
    background: #0068FF;
    color: #fff;
    padding: 1px 6px;
}