﻿@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    /* --input-border-color: #1E1F21;*/
    --background-light-color: #fff;
    --text-light-color: #fff;
    --primary-small: #006FDD; /*#006FDD;*/
    --primary-bright: #0092FD; /*#008FF5;*/
    --light-grey-1: #C4C4C4;
    --light-grey-2: #e0e0e0; /*#E7E7E9;*/
    --light-grey-3: #F3F3F3;
    --light-grey-4: #F7F7F7;
    --light-grey-5: #E8E7E7;
    --light-grey-6: #D5D4D4;
    --purple-color: #7332cd; /* #6B22C5;*/
    --info-color: #0070E9;
    --success-color: #00B23C; /*#00AF4C;*/
    --warning-color: #F66600; /*#E56F22;*/
    --danger-color: #ED003D; /*#D92043;*/
    --dark-color: #000;
    --blue-color: #0000FF;
    --pink-color: #ff00e3;
    --primary-color: #0072F1; /*#7800ff;*/
    --secondary-color: #A3A3A3;
    --light-color: #e2e2e2;
    --black-1: #0D0C22; /*#1E1F21*/
    --black-2: #464646;
    --hyperlinks-color: #006FDD;
    --hyperlinks-actived-color: #0070E9;
    --dark-text-primary-color: var(--black-2);
    --dark-text-secondary-color: var(--black-1);
    --grey-1: #798189;
    --grey-2: #8F9292;
    --grey-3: #F2F2F2;
    --grey-4: #535658;
    --topbar-background-dark: #23282F;
    --secondary-text-color: var(--grey1-color);
    --secondary-small-text-color: var(--grey2-color);
    --table-border: var(--light-grey-2);
    --row-background: rgba(0,0,0,0.04);
    --font-family-sans-serif: 'Inter', Arial, Helvetica, sans-serif;
    --row-focused: #dee8fc; /*#e4ecfb;*/
}
/*Text color*/
.text-success {
    color: var(--success-color) !important;
}

.text-primary {
    color: var(--primary-color) !important;
}

.text-warning {
    color: var(--warning-color) !important;
}

.text-purple {
    color: var(--purple-color) !important;
}

.text-danger {
    color: var(--danger-color) !important;
}

.text-grey-1 {
    color: var(--light-grey-1) !important;
}
/*End text color*/
/*Background color*/
.bg-light-grey-3 {
    background: var(--light-grey-3);
}

.bg-light-grey-5 {
    background: var(--light-grey-3);
    border: 1px solid var(--light-grey-5);
}
/*End background color*/
body {
    font-family: var(--font-family-sans-serif);
    font-size: 0.8125rem;
    font-weight: 400;
    letter-spacing: 0.1px;
    line-height: 1.429;
    color: var(--dark-text-primary-color);
    /* background-color: var(--background-light-color); */
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: 'Inter', Arial, Helvetica, sans-serif;
    color: var(--black-1);
}

.h1, h1 {
    font-size: 1.25rem;
    letter-spacing: 0.4px;
    line-height: 1.3;
    font-weight: 600;
}

.h2, h2 {
    font-size: 1.1rem;
}

.h3, h3 {
    font-size: 0.9825rem; /*1.0625rem;*/
    letter-spacing: 0.3px;
    line-height: 1.412;
    font-weight: 600;
}

.h4, h4 {
    font-size: 0.8125rem;
    letter-spacing: 0.3px;
    line-height: 1.429;
}

.h5, h5 {
    font-size: 0.8125rem;
    letter-spacing: 0;
    line-height: 1.538;
}

a {
    color: var(--hyperlinks-color);
    /*letter-spacing: 0;*/
    /*font-weight: 500;*/
}

    a:hover,
    a:active,
    a.visited {
        color: var(--hyperlinks-actived-color);
    }

label, .label {
    font-size: 0.8125rem;
    letter-spacing: 0.1px;
    line-height: 1.429;
    color: var(--black-1);
}

.btn {
    font-size: 0.8125rem;
    line-height: 1.429;
    letter-spacing: 0.1px;
    font-weight: 400;
}

.text-display-sm {
    font-size: 0.5625rem;
    line-height: 1.222;
    letter-spacing: 0;
}

    .text-display-sm.bold {
        font-weight: 700;
        color: var(--dark-text-secondary-color);
    }

    .text-display-sm.light {
        color: var(--grey2-text-color);
    }

.mb-24 {
    margin-bottom: 24px;
}

.single-line-truncation {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.badge-dot {
    position: relative;
    padding-left: 20px;
    display: inline-block;
    min-width: 80px;
}

    .badge-dot::after {
        content: '';
        position: absolute;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        top: 50%;
        transform: translateY(-50%);
        left: 2px;
    }

    .badge-dot.badge-dot-info::after {
        background-color: var(--info-color);
    }

    .badge-dot.badge-dot-success::after {
        background-color: var(--success-color);
    }

    .badge-dot.badge-dot-warning::after {
        background-color: var(--warning-color);
    }

    .badge-dot.badge-dot-danger::after {
        background-color: var(--danger-color);
    }

    .badge-dot.badge-dot-dark::after {
        background-color: var(--dark-color);
    }

    .badge-dot.badge-dot-blue::after {
        background-color: var(--blue-color);
    }

    .badge-dot.badge-dot-pink::after {
        background-color: var(--pink-color);
    }

    .badge-dot.badge-dot-primary::after {
        background-color: var(--primary-color);
    }

    .badge-dot.badge-dot-secondary::after {
        background-color: var(--secondary-color);
    }

    .badge-dot.badge-dot-light::after {
        background-color: var(--light-color);
    }

    .badge-dot.badge-dot-purple::after {
        background-color: var(--purple-color);
    }

/* Topbar */
.navbar-custom.navbar-custom-dark {
    background-color: var(--topbar-background-dark);
    box-shadow: none;
    height: 48px;
}

.navbar-custom-dark .logo-box {
    height: 48px;
    display: flex;
}

    .navbar-custom-dark .logo-box .logo {
        line-height: 48px;
    }

    .navbar-custom-dark .logo-box .logo-lg {
        display: inline-block;
        width: 24px;
    }

    .navbar-custom-dark .logo-box img {
        max-width: 100%;
        height: auto !important;
    }


.navbar-custom-dark .nav-user img {
    height: 24px;
    width: 24px;
}


.navbar-custom-dark .nav-user + .profile-dropdown {
    min-width: 180px;
    padding: 0;
    border-radius: 0;
}

.navbar-custom-dark .notification-list {
    cursor: pointer;
}
    /*.navbar-custom-dark .notification-list:first-child {
    margin-right: 60px;
}*/
    /* .navbar-custom-dark .notification-list:nth-child(4) {
        margin-left: 60px;
    } */

    .navbar-custom-dark .notification-list .dropdown-menu .notify-item {
        margin: 0;
        padding: 10px 16px 16px;
        color: #464646;
        font-size: 13px;
        line-height: 20px;
    }

        .navbar-custom-dark .notification-list .dropdown-menu .notify-item.noti-footer {
            box-shadow: 0 -2px 4px 0 rgba(223, 223, 223, 0.5);
        }

        .navbar-custom-dark .notification-list .dropdown-menu .notify-item:hover {
            background-color: #F7F7F7;
            color: #000;
        }

        .navbar-custom-dark .notification-list .dropdown-menu .notify-item > img {
            margin-right: 10px;
        }

        .navbar-custom-dark .notification-list .dropdown-menu .notify-item.notification-msg-new {
            color: #000;
        }

.navbar-custom-dark .topnav-menu .nav-link {
    color: #ABB0B5;
    font-weight: 400;
    line-height: 48px;
    height: 48px;
    padding: 0 12px;
    pointer-events: none;
    display: flex;
    align-items: center;
}

    .navbar-custom-dark .topnav-menu .nav-link.nav-branch {
        background-color: #131E2A;
        padding: 0 16px;
        color: var(--grey-1);
        font-weight: 500;
    }

    .navbar-custom-dark .topnav-menu .nav-link .pro-user-name {
        line-height: 46px;
    }

.navbar-custom-dark .button-menu-mobile {
    height: 48px;
    line-height: 48px;
    display: flex;
    float: left;
}

    .navbar-custom-dark .button-menu-mobile > img {
        margin: auto;
    }

.navbar-custom-dark .notification-list:not(.show):hover .dropdown-menu {
    display: block;
    top: 100% !important;
    max-height: calc(100vh - 50px);
    /*padding: 0;*/
}

.dropdown-menu {
    animation-duration: .1s;
}

.navbar-custom-dark .notification-list [title="Thông báo"] + .dropdown-menu {
    padding: 0;
    border-radius: 8px;
    overflow: hidden;
}

.navbar-custom-dark .notification-list .nav-link img {
    margin-right: 10px;
}

.navbar-custom-dark .notification-list .noti-icon-badge {
    border-radius: 7.5px !important;
    font-size: 10px !important;
    background-color: #D4576C;
    padding: 0 4px;
    letter-spacing: -0.3px;
    line-height: 15px;
    min-height: 15px;
    font-weight: 600;
    vertical-align: middle;
    right: auto;
    right: 0;
    top: 10.5px;
    min-width: 0;
    min-height: 0;
    width: 15px;
    height: 15px;
}

.recent-result .domain-title {
    color: var(--light-grey-1);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.538;
    margin-bottom: 2px;
    padding: 0 16px;
}

.recent-result .list {
    list-style: none;
    padding-left: 0;
    line-height: 1.5;
}

.recent-result .item:last-child {
    margin-bottom: 0;
}


.recent-result .item > a {
    padding: 2px 16px 4px;
    display: flex;
    align-items: center;
    font-size: 0.75rem;
    color: var(--grey-2);
    font-weight: 400;
}

    .recent-result .item > a:hover {
        background-color: var(--light-grey-3);
    }

    .recent-result .item > a > img {
        margin-right: 12px;
    }

.recent-result .content-w .t {
    color: var(--black-1);
    font-size: 0.8125rem;
    line-height: 1.538;
    display: block;
}

.recent-result .content-w .sub-t {
    display: block;
}

.navbar-custom-dark .app-search {
    max-width: 100%;
    width: 100%;
    height: auto;
    margin-bottom: 16px;
}

.navbar-custom-dark .dropdown-menu-grid {
    min-width: 568px;
    border-radius: 9px;
    border-color: #F2F2F2;
    box-shadow: 0 10px 70px 0 rgba(0,0,0, 0.15);
    padding: 16px 24px 6px;
}

.navbar-custom-dark .topbar-search .form-control.select-ctrl {
    background-position: calc(100% - 12px) 15px;
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
    min-width: 126px;
    padding-left: 16px;
    padding-right: 12px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 16 16\'><g fill=\'grey\'><path d=\'M8,12c-0.232,0-0.463-0.08-0.651-0.241l-7.759-6.65L0.892,3.59L8,9.683l7.108-6.093l1.302,1.519l-7.759,6.65 C8.463,11.92,8.232,12,8,12z\'></path></g></svg>');
    background-repeat: no-repeat;
    background-size: 8px 8px;
    cursor: pointer;
}

    .navbar-custom-dark .topbar-search .form-control.select-ctrl:focus {
        color: #fff;
    }

    .navbar-custom-dark .topbar-search .form-control.select-ctrl:hover {
        color: #c4c4c4;
    }

.navbar-custom-dark .topbar-search .label-ctrl {
    position: relative;
    max-width: 196px;
}

.navbar-custom-dark .topbar-search .form-control {
    border: 0;
    border-radius: 0;
    font-size: 13px;
    line-height: 16px;
    color: #AAB4BB;
    background-color: #0F1F2B;
}

.navbar-custom-dark .topbar-search .label-ctrl .img-wrapp {
    position: absolute;
    top: 6px;
    bottom: 6px;
    /*border-left: 1px solid #d8d8d847;*/
    padding-left: 12px;
    display: flex;
}

.navbar-custom-dark .topbar-search .label-ctrl .input-ctrl {
    border-top-right-radius: 16px;
    border-bottom-right-radius: 16px;
    padding-left: 33px;
    width: 226px;
    color: #fff;
    border-top-left-radius: 16px;
    border-bottom-left-radius: 16px;
}

.shortcuts .shortcut-title {
    margin-top: 0;
    margin-bottom: 8px;
    color: var(--grey-1);
    font-weight: 500;
}

    .shortcuts .shortcut-title.autosuggest-title {
        color: var(--black-1);
    }

.shortcut-item {
    border: none;
    padding: 6px 5px;
    border-radius: 4px;
}

    .shortcut-item img {
        width: 36px;
        height: 36px;
        margin-top: 12px;
        margin-bottom: 8px;
    }

    .shortcut-item:hover {
        border: none;
        background-color: var(--light-grey-4);
    }

        .shortcut-item:hover small {
            color: var(--black-1);
            font-weight: 700;
        }

    .shortcut-item small {
        color: var(--black-1);
        font-weight: 500;
        font-size: 12px;
        letter-spacing: 0.1px;
        line-height: 1.5;
        margin-bottom: 8px;
    }

.row-custom-margin {
    margin-right: -4px;
    margin-left: -4px;
}

.navbar-custom-dark .app-search .select-ctrl {
    border-radius: 19px 0 0 19px;
    background-color: var(--light-grey-2);
    font-weight: 500;
    color: #42474C;
    width: auto;
    height: 36px;
    flex: 0;
}

.navbar-custom-dark .label-ctrl {
    position: relative;
    margin-bottom: 0;
    flex: 1;
}

.navbar-custom-dark .app-search .label-ctrl .img-wrapp {
    position: absolute;
    left: 0;
    top: 4px;
    bottom: 4px;
    display: flex;
    border-left: 1px solid var(--light-grey-1);
    background: transparent;
    width: 32px;
}

.navbar-custom-dark .label-ctrl .img-wrapp .marker-icon {
    width: 12px;
    margin: auto;
}

.navbar-custom-dark .app-search .input-ctrl {
    background-color: var(--light-grey-2);
    border-radius: 0 19px 19px 0;
    padding: 8px 8px 8px 32px;
    /*    width: auto;*/
    height: 36px;
    color: #A3A3A3;
    font-size: 14px;
    margin-left: 0;
    margin-bottom: 0;
}


.input-ctrl::placeholder {
    color: #A3A3A3 !important;
}
/* End Topbar */
.left-side-menu {
    padding: 12px 0;
}

.card-header {
    background-color: transparent;
    padding: 0 10px;
    margin-bottom: 12px;
}

    .card-header .icon-heading {
        margin-right: 9px;
    }

.metismenu > li {
    padding: 0 12px 0 10px;
}

.metismenu .nav-second-level {
    position: relative;
    padding-left: 14px;
}

    .metismenu .nav-second-level:after {
        content: '';
        display: inline-block;
        position: absolute;
        width: 1px;
        top: -8px;
        bottom: 19.5px;
        left: 14px;
        background: var(--light-grey-2);
    }

    .metismenu .nav-second-level li {
        padding-left: 16px;
        position: relative;
    }

        .metismenu .nav-second-level li:after {
            content: '';
            display: inline-block;
            position: absolute;
            height: 1px;
            width: 16px;
            background: var(--light-grey-2);
            top: 50%;
            left: 0;
            transform: translateY(-50%);
        }

        .metismenu .nav-second-level li .text-blue {
            background-color: #E5E7EB;
            color: var(--hyperlinks-actived-color) !important;
            border-radius: 4px;
        }

a.text-blue:focus,
a.text-blue:hover {
    color: var(--info-color);
}


.metismenu li {
    border: none;
}

    .metismenu li.active {
        border-left: none;
    }

        .metismenu li.active > a {
            letter-spacing: 0.1px;
            font-weight: 500;
        }

.metismenu .nav-second-level li .fe-chevron-right {
    display: none;
}

#sidebar-menu ul {
    line-height: 1.429;
}

#sidebar-menu .accordion-box {
    border: none;
}

#sidebar-menu ul li a, .hot-feature-menu li a {
    color: var(--black-1);
    font-size: 13.5px;
    padding: 8px 3px;
}
/*#sidebar-menu ul li a, .hot-feature-menu li a {
    color: var(--black-1);
    padding-left: 10px;
    font-size: 14px;
    padding: 8px 10px;
}*/

.hot-feature-menu li a {
    padding: 6px 8px;
    display: flex;
    align-items: center;
}

.hot-feature-menu li.active a {
    background: #E5E7EB;
}

#sidebar-menu ul li a:hover, .hot-feature-menu li a:hover {
    background-color: #EEEFF2;
}

.hot-feature-menu {
    padding-top: 8px;
}

#sidebar-menu .nav-second-level li a, #sidebar-menu .nav-thrid-level li a {
    color: var(--grey-4);
}

#sidebar-menu .metismenu > li > a {
    display: flex;
    align-items: center;
    height: 40px;
}

    #sidebar-menu .metismenu > li > a > svg {
        margin-left: auto;
        fill: var(--grey-4);
    }

#sidebar-menu .metismenu > li.active > a > svg {
    fill: #000;
}

#sidebar-menu .metismenu > li.mm-active > a > svg {
    transform: rotate(90deg);
}


.box-lise {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-height: 50px;
    margin: auto 12px;
    margin-right: 105px;
    line-height: 1.3;
    color: var(--text-light-color);
    opacity: 0.98;
}

    .box-lise span.name-product {
        color: #fff;
        font-size: 11px;
        line-height: 1.273;
        letter-spacing: 0;
        font-weight: 600;
        margin-bottom: 2px;
    }

    .box-lise span.version-product {
        font-size: 9px;
        line-height: 1.25;
        color: #fff;
    }

/*#ContentPlaceHolder1_ModuleContainer_divLoadControl {
    padding-left: 12px;
    padding-right: 12px;
}*/

*[class^="dxflCaption"] {
    font-weight: 500;
}
/*.span.dxp-comboBox input {
    font-family: var(--font-family-sans-serif);
}*/
.dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-tab:hover {
    background-color: var(--light-grey-2);
}

/* .dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-activeTab a:hover {
    color: var(--text-light-color);
} */


.dxbButton_Office365AnSinh.first-primary {
    background-color: var(--info-color) !important;
    color: var(--text-light-color);
}

.dxbButtonHover_Office365AnSinh.first-primary {
    background-color: #0069DB;
    color: var(--text-light-color);
}

.dxbDisabled_Office365AnSinh.first-primary {
    opacity: 1;
    background-color: var(--light-grey-1);
}

.dxbButtonPressed_Office365AnSinh.first-primary {
    background-color: #0062CC;
}

.dxmLite_Office365AnSinh .dxctToolbar_Office365AnSinh.dxmtb .dxm-item.first-primary .dxm-content {
    color: var(--info-color);
    font-weight: 500;
}

.dxWeb_pcCloseButton_Office365AnSinh {
    background-image: url("../images/Close.svg");
    background-position: center;
}

.dxWeb_pcCloseButton_Office365AnSinh {
    background-image: url("../images/Close.svg");
    background-position: center;
}

.dxpcLite_Office365AnSinh .dxpc-closeBtn {
    padding: 4px;
}

.dxpcLite_Office365AnSinh .dxpc-closeBtnHover {
    background-color: var(--light-grey-4);
}

.dxmLite_Office365AnSinh.dxm-ltr .dxctToolbar_Office365AnSinh.dxmtb .dxm-item.first-primary {
    color: var(--info-color);
}

.dxp-pageSizeItem label {
    display: none;
}

.dxWeb_pPopOut_Office365AnSinh,
.dxp-hoverDropDownButton .dxWeb_pPopOut_Office365AnSinh,
.dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonHover_Office365AnSinh .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonPressed_Office365AnSinh .dxEditors_edtDropDown_Office365AnSinh {
    background-image: url("../images/chevron_12px.svg");
    background-position: center;
}

.calendar-edt-add .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonHover_Office365AnSinh.calendar-edt-add .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonPressed_Office365AnSinh.calendar-edt-add .dxEditors_edtDropDown_Office365AnSinh {
    background-image: url("../images/Calendar_add.svg");
    background-position: center;
    width: 16px;
    height: 16px;
}

.calendar-edt-finish .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonHover_Office365AnSinh.calendar-edt-finish .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonPressed_Office365AnSinh.calendar-edt-finish .dxEditors_edtDropDown_Office365AnSinh {
    background-image: url("../images/Calendar_finish.svg");
    background-position: center;
    width: 16px;
    height: 16px;
}

/*.group-edt-info .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonHover_Office365AnSinh.group-edt-info .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonPressed_Office365AnSinh.group-edt-info .dxEditors_edtDropDown_Office365AnSinh {
    background-image: url("../images/Info_16px.svg");
    background-position: center;
    width: 16px;
    height: 16px;
}*/

.dxeDisabled_Office365AnSinh.group-edt-info .dxEditors_edtDropDown_Office365AnSinh {
    background-image: url("../images/Info_16px.svg");
    background-position: center;
    width: 16px;
    height: 16px;
}

.reference-edt .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonHover_Office365AnSinh.reference-edt .dxEditors_edtDropDown_Office365AnSinh,
.dxeButtonEditButtonPressed_Office365AnSinh.reference-edt .dxEditors_edtDropDown_Office365AnSinh {
    background-image: url("../images/Reference.svg");
    background-position: center;
    width: 16px;
    height: 16px;
}

.search-edt > tbody > tr {
    display: flex;
}

.search-edt .dxeButtonEditButton_Office365AnSinh {
    padding: 0.4em 0 0.4em 12px;
    order: -1;
    display: flex;
    align-items: center;
}

.search-edt {
    background-color: var(--background-light-color);
    border-color: var(--light-grey-3);
    height: 36px;
}

/*.search-edt:hover {
        background: #fff;
    }*/

.dxeButtonEdit_Office365AnSinh.reference-edt, .dxflItem_Office365AnSinh .reference-edt {
    border: 1px dashed var(--purple-color) !important;
}

.dxeDisabled_Office365AnSinh.reference-edt, .dxflItem_Office365AnSinh .reference-edt {
    background-color: #F1F1F1;
}

.dxeTextBox_Office365AnSinh:not(.dxeReadOnly_Office365AnSinh):not(.dxeDisabled_Office365AnSinh):hover,
.dxeButtonEdit_Office365AnSinh:not(.dxeDisabled_Office365AnSinh):not(.dxeReadOnly_Office365AnSinh):hover {
    border-color: var(--light-grey-1);
}

.extra-menu-wrapp > .dxbButtonSys {
    display: flex;
}

    .extra-menu-wrapp > .dxbButtonSys > img {
        margin: auto;
    }

.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-rightIndent, .dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-leftIndent {
    border: none;
}

a.sign-flow-header {
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    color: #161616;
    height: auto;
}

.sign-flow-header .badge {
    display: none;
}

.sign-info {
    background-color: transparent;
    border: none;
    padding: 0;
}

    .sign-info input[type="text"].dxeEditArea_Office365AnSinh, span.sign-info {
        font-size: 11px;
        letter-spacing: -0.02px;
        line-height: 14px;
        font-weight: 600;
        color: #070606;
        height: auto;
    }

    .sign-info.dxeTextBox_Office365AnSinh td.dxic {
        padding: 0 4px;
        height: 0px;
    }

.responsive-table-td img.sign-image, .responsive-table-td .sign-img-wrapp img {
    height: 67px;
    max-width: 155px;
    width: 100%;
    object-fit: contain;
    border: 1px dashed #B6B6B6;
    padding: 5px;
    border-radius: 3px;
    margin-bottom: 8px;
}

    .responsive-table-td img.sign-image:hover, .responsive-table-td .sign-img-wrapp img:hover {
        border-color: var(--primary-small);
        box-shadow: 0 2px 33px 0 rgba(105, 105, 105, 0.31);
    }

.sign-img-wrapp {
    /*border: 1px dashed #B6B6B6;*/
    background-color: #fff;
    width: 100%;
    /*max-width: 155px;*/
}

    .sign-img-wrapp.dxbButton_Office365AnSinh div.dxb {
        padding: 0;
        background-color: #fff;
    }
/*.sign-img-wrapp:hover {
        border-color: var(--primary-small);
        box-shadow: 0 2px 33px 0 rgba(105, 105, 105, 0.31);
    }
    .sign-img-wrapp > div {
        position: relative;
        padding-top: 43%;
    }
        .sign-img-wrapp > div > img {
            max-width: 100%;
            max-height: 100%;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
        }*/
.sign-date {
    font-size: 11px;
    line-height: 14px;
    letter-spacing: -0.02px;
    color: #ACABAB;
}

.responsive-table {
    margin-top: 14px;
}

    .responsive-table tbody tr {
        vertical-align: top;
    }
/*Modal Title*/
.modal-title {
    text-transform: uppercase;
    margin-top: 0;
    padding-top: 5px;
    margin-right: 12px;
}

/* width */
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

/* Track */
::-webkit-scrollbar-track {
    background: transparent;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #d9d9d9;
    border-radius: 7px;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #d1d1d1;
        cursor: pointer
    }

/* Button Border */
.btn-border {
    border: 1px solid var(--light-grey-6);
}

.btn-box {
    padding: 2px 4px;
    border-radius: 4px;
}

    .btn-box:hover {
        cursor: pointer;
    }

span.sign-info img {
    height: 10px;
    width: 10px;
}

.btn-sign-flow div.dxb {
    border-radius: 4px;
    height: 28px;
    width: 53px;
}
/* Procesing */
.btn-spin img {
    -webkit-animation: icon-spin 2s infinite linear;
}

@-webkit-keyframes icon-spin {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(359deg);
    }
}

/*.dxgvHeader_Office365AnSinh .dx-vam {
    display: none !important;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-43%);
    right: -14px;
}

    .dxgvHeader_Office365AnSinh .dx-vam:last-child {
        display: inline-block !important;
        background-image: url('../images/sort_table_arrow.svg');
        background-position: center;
        background-repeat: no-repeat;
        width: 12px;
        height: 12px;
        margin-left: 5px !important;
    }*/

.dxgvHeader_Office365AnSinh:hover {
    color: var(--grey-1);
}

/*.dxgvHeader_Office365AnSinh .dx-vam[class^="dxGridView_gvHeader"],
    .dxgvHeader_Office365AnSinh:hover .dx-vam {
        background-image: url('../images/sort_table_arrow_hover.svg');
    }*/

.dxgvHeader_Office365AnSinh > table {
    width: auto !important;
    margin: 0 auto;
}

.dxgvHeader_Office365AnSinh .dxgvHCEC {
    width: auto;
}

.dxgvHeader_Office365AnSinh td {
    position: relative;
}

.dxpnlControl_Office365AnSinh .dxbButton_Office365AnSinh.first-primary {
    /*margin-right: 25px;*/
}

.dxeTextBoxDefaultWidthSys, .dxeButtonEditSys {
    width: 100% !important;
}

.box-height-300 {
    height: 300px;
}

.box-height-220 {
    height: 220px;
}
.box-height-184 {
    height: 184px;
}
.box-height-360 {
    height: 360px;
}

.box-height-266 {
       height: 266px;
}
.box-height-278 {
    height: 278px;
}
.box-height-287 {
    height: 287px;
}
.box-height-246 {
    height: 246px;
}
.box-height-200 {
    height: 200px;
}
.box-height-203 {
    height: 203px;
}
.box-height-210 {
    height: 210px;
}
.box-height-185 {
    height: 185px;
}
.box-height-217 {
    height: 217px;
}
.summary-wrapp {
    /* -webkit-filter: drop-shadow(0px 2px 15px rgba(159, 165, 166, 0.5));
    filter: drop-shadow(0px 2px 15px rgba(159, 165, 166, 0.5)); */
    display: flex;
    flex-flow: column nowrap;
    margin-top: 7px;
    border: 1px solid #D2D2D2;
    padding: 10px;
    border-radius: 6px;
}
/*.summary-wrapp {
    -webkit-filter: drop-shadow(0px 2px 15px rgba(159, 165, 166, 0.18));
    filter: drop-shadow(0px 2px 15px rgba(159, 165, 166, 0.18));
    display: flex;
    flex-flow: column nowrap;
    margin-top: 13px;
}*/

.summary-wrapp-2 {
    -webkit-filter: drop-shadow(0px 2px 15px rgba(159, 165, 166, 0.5));
    filter: drop-shadow(0px 2px 6px rgba(159, 165, 166, 0.25));
    display: flex;
    flex-flow: column nowrap;
}
/* Handle */
.summary-header::-webkit-scrollbar-thumb {
    background: transparent;
}

.summary-header:hover::-webkit-scrollbar-thumb {
    background: #E9E9E9;
}

.summary-title {
    background-color: #fff;
    border-bottom: 1px dashed var(--grey-3);
    padding: 0 10px;
}

    .summary-title h5 {
        font-size: 14px;
    }

.summary-header {
    flex: 1;
    min-height: 15px;
    width: 100%;
    -webkit-clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 6px));
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 6px));
    /* background: #fff; */
    /*padding: 12px 20px 15px;*/
    padding: 10px 12px;
    /*border-radius: 4px;*/
    box-sizing: border-box;
    overflow: auto;
}

.summary-footer {
    width: 100%;
    background-image: linear-gradient(to right, #d4d4d4 70%, rgba(255,255,255,0) 0%);
    background-position: top;
    background-size: 12px 1px;
    background-repeat: repeat-x;
    background-color: #fff;
    -webkit-clip-path: polygon(5px 0%, calc(100% - 5px) 0%, 100% 6px, 100% 100%, 0 100%, 0 6px);
    clip-path: polygon(5px 0%, calc(100% - 5px) 0%, 100% 6px, 100% 100%, 0 100%, 0 6px);
    border-radius: 4px;
    /*padding: 15px 16px 12px;*/
    padding: 10px;
    box-sizing: border-box;
}

.price {
    text-align: right;
}

.total {
    color: #2DAF55;
}
.summary-detail{
    height: 100%;
}
.summary-detail,
.summary-total {
    width: 100%;
    border-spacing: 0;
}

    .summary-detail td {
        /* padding: 6px 0; */
        line-height: 20px;
        white-space: nowrap;
    }

    .summary-total td {
        /*font-size: 17px;*/
        font-size: 15px;
        line-height: 24px;
        letter-spacing: 0.3px;
        font-weight: 600;
        padding: 0;
        white-space: nowrap;
    }

.summary-detail-item {
    background: #fff;
    border: none !important;
    color: #ff0000;
}

    .summary-detail-item td.dxic {
        padding: 0;
    }

.toolbar-item-first {
    color: #0070E9;
    background: #F3F3F3;
}

.dxctToolbar_Office365AnSinh div.dxm-content:not(.dxm-disabled) {
    background-color: #f7f7f7;
}

.dxctToolbar_Office365AnSinh .toolbar-item-first .dxm-content {
    background: inherit !important;
}

.dxmLite_Office365AnSinh .dxctToolbar_Office365AnSinh.dxmtb .dxm-content {
    border-radius: 4px;
}

.dxmLite_Office365AnSinh .dxctToolbar_Office365AnSinh.dxm-main .dxm-item.dxm-hovered {
    background-color: var(--light-grey-4);
}

.comments-container {
    padding: 12px;
}

/* .page-control-detail-1 .dxtc-stripContainer li:nth-child(10) {
    border-left: 2px solid #F3F3F3;
    border-radius: 0;
    margin: 5px 15px 0px 25px;
    height: 30px;
}

.page-control-detail-2 .dxtc-stripContainer li:nth-child(7) {
    border-left: 2px solid #F3F3F3;
    border-radius: 0;
    margin: 5px 15px 0px 25px;
    height: 30px;
} */

/* .page-control-detail-3 .dxtc-stripContainer li:nth-child(4) {
    border-left: 2px solid #F3F3F3;
    border-radius: 0;
    margin: 5px 15px 0px 25px;
    height: 30px;
} */

/* .page-control-detail-4 .dxtc-stripContainer li:nth-child(13) {
    border-left: 2px solid #F3F3F3;
    border-radius: 0;
    margin: 5px 15px 0px 25px;
    height: 30px;
} */

/* .page-control-detail-5 .dxtc-stripContainer li:nth-child(16) {
    border-left: 2px solid #F3F3F3;
    border-radius: 0;
    margin: 5px 15px 0px 25px;
    height: 30px;
} */

.item-header-icon {
    padding: 8px 8px;
    background: #e6e6e6;
    display: inline-block;
    border-radius: 4px;
    height: 42px;
    width: 42px;
    margin-right: 6px;
}

    .item-header-icon img {
        width: 25px;
        height: 25px;
    }

.dxeEditArea_Office365AnSinh, body input.dxeEditArea_Office365AnSinh {
    color: #0d0c23;
}

.container-fluid {
    padding-left: 24px;
    padding-right: 24px;
}

.layout-search-list .dxflGroupCell_Office365AnSinh:first-child {
    padding-left: 0;
}

.pt-4px {
    padding-top: 6px;
}

.dxgvControl_Office365AnSinh a:hover {
    text-decoration: underline;
}

.dxgvControl_Office365AnSinh a {
    font-weight: 500;
    font-size: 12px;
}

.dxgvControl_Office365AnSinh img.sync-error {
    width: 18px;
    height: 18px;
}

.svg-fill-white img, .first-primary img, .dxtc-customTabIcon img, .first-danger img {
    filter: invert(100%) sepia(0%) saturate(200%) hue-rotate( 0deg ) brightness(200%) contrast(200%);
}

.dxflGroupBox_Office365AnSinh > div.dxflGroup_Office365AnSinh:first-child, .dxflGroupBox_Office365AnSinh > table.dxflGroup_Office365AnSinh:first-child {
    padding-left: 0px;
    padding-top: 0px;
}

.toolbar-item-first img {
    filter: invert(32%) sepia(91%) saturate(4344%) hue-rotate(200deg) brightness(96%) contrast(101%);
}

.sign-img-wrapp span.dx-vam {
    height: 67px;
    max-width: 155px;
    width: 100%;
    object-fit: contain;
    border: 1px dashed #B6B6B6;
    padding: 10px;
    border-radius: 3px;
    align-items: center;
    background: #f8f8f8;
    white-space: pre-wrap;
    display: flex !important;
    margin: 0 auto;
    margin-bottom: 8px;
    justify-content: space-evenly;
}

.sign-img-wrapp.dxbDisabled_Office365AnSinh {
    opacity: unset !important;
}

.dxgvHeader_Office365AnSinh tr td, .dxtcLite_Office365AnSinh ul li a span.dx-vam {
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
}

.dxeTrackBar_Office365AnSinh, .dxeButtonEdit_Office365AnSinh, .dxeTextBox_Office365AnSinh:not(.search-edt):not(.sign-info), .dxeRadioButtonList_Office365AnSinh, .dxeCheckBoxList_Office365AnSinh, .dxeMemo_Office365AnSinh, .dxeListBox_Office365AnSinh, .dxeCalendar_Office365AnSinh, .dxeColorTable_Office365AnSinh {
    border: 1px solid #DFDFDF;
    height: 36px;
    /*.dxeIRadioButton_Office365AnSinh,*/
}

.dxflGroupBox_Office365AnSinh > .dxflGroup_Office365AnSinh > tbody > tr:first-child > .dxflGroupCell_Office365AnSinh > .dxflItem_Office365AnSinh, .dxflGroupBox_Office365AnSinh > .dxflGroup_Office365AnSinh > tbody > tr.dxflFVRSys > .dxflGroupCell_Office365AnSinh > .dxflItem_Office365AnSinh, .dxflGroupBox_Office365AnSinh > .dxflGroup_Office365AnSinh > .dxflChildInFirstRowSys > .dxflGroupCell_Office365AnSinh > .dxflItem_Office365AnSinh {
    padding-top: 0;
}

.dxflItem_Office365AnSinh, .dxflViewFormLayoutSys .dxflEditFormItemSys.dxflItem_Office365AnSinh {
    padding: 7px 0;
}

.layout-search-list .dxflGroupCell_Office365AnSinh {
    padding: 0 6px;
}

.item-header img {
    width: 16px;
    height: 16px;
    margin-right: 12px;
    filter: brightness(5) saturate(100%) invert(100%) sepia(5%) saturate(13%) hue-rotate(205deg) brightness(113%) contrast(89%);
}

.item-header-home {
    text-transform: uppercase;
    font-weight: 500
}

    .item-header-home img {
        width: 16px;
        height: 16px;
        margin-right: 12px;
    }

.noti-title:hover {
    background: none !important;
}

    .noti-title:hover a {
        text-decoration: underline;
        color: #0071E5 !important;
    }

.dxtc-customTab {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    color: var(--text-light-color);
    /*display: flex;*/
    /*align-items: center;*/
}

.dxtc-customTabIcon {
    float: right;
    padding-left: 10px;
}
/*.dxflGroupCell_Office365AnSinh {
    padding: 0 9px;
}*/
/*Screen*/
@media only screen and (max-width:1440px) {
    .small-card-icon {
        display: none !important;
    }
}

@media only screen and (max-width:1280px) {
}
/*End Screen*/

/* Custom tabs */
.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-tab {
    border-radius: 0;
    color: #525252;
    background-color: transparent;
    border-bottom: 2px solid transparent;
}

.dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-tab a {
    padding-left: 0;
    padding-right: 0;
    color: #525252;
}

    .dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-tab a:hover {
        color: #1E1F21;
    }

.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-activeTab {
    background-color: transparent;
    border-radius: 0;
}

    .dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-activeTab .dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-activeTab,
    .dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-activeTab a {
        color: #525252;
        padding-left: 0;
        padding-right: 0;
        border-bottom: 2px solid #0072F1;
    }

.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-spacer,
.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer .dxtc-sbSpacer {
    width: 32px;
}

.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer {
    border-bottom: 1px solid #ddd;
    margin-bottom: 16px;
    background: transparent;
}

#search-images.card {
    box-shadow: none !important;
    background: transparent;
}

.modal-title .title-icon {
    width: 16px;
    height: 16px;
    filter: invert(32%) sepia(91%) saturate(4344%) hue-rotate( 200deg ) brightness(96%) contrast(101%);
}

.search-tab .dxtc-stripContainer {
    background: #f7f7f7;
}

.search-tab ul li a span.dx-vam {
    text-transform: none;
    font-weight: 600;
}

figure {
    background: #fff;
}

.dxtcLite_Office365AnSinh > .dxtc-stripContainer .dxtc-sbWrapper .dxtc-sb {
    padding: 6px;
}

.dxsplHSeparatorButtonHover_Office365AnSinh {
    background-color: #c3c3c3;
}

.dxsplHSeparatorButton_Office365AnSinh {
    padding: 5px 10px;
}

.radio-list-custom td span {
    display: inline-block !important;
}

.layout-group-custom {
    margin-top: 12px;
}

.dxgvControl_Office365AnSinh .dxgvTable_Office365AnSinh .dxgvFocusedRow_Office365AnSinh td.dxgvIndentCell, .dxgvControl_Office365AnSinh .dxgvTable_Office365AnSinh .dxgvFocusedRow_Office365AnSinh.dxgvDataRowHover_Office365AnSinh td.dxgvIndentCell {
    background-color: var(--row-focused);
}

.dxgvFocusedGroupRow_Office365AnSinh {
    background-color: var(--row-focused);
    color: var(--black-1);
}

.posted-date img {
    filter: invert(100%) sepia(0%) saturate(100%) hue-rotate( 0deg ) brightness(100%) contrast(100%);
    width: 18px !important;
    height: 18px !important;
}

.posted-date:hover img {
    filter: invert(69%) sepia(0%) saturate(200%) hue-rotate( 0deg ) brightness(200%) contrast(200%);
}

.header-nobg {
    color: #c3c3c3
}

    .header-nobg svg {
        margin-right: 10px;
    }

    .header-nobg:hover {
        color: #d4d4d4
    }

.radio-list-custom td span {
    display: inline-block !important;
}

.toolbar-item-second {
    color: #f66600;
    background: #ffebdb;
}

.dxctToolbar_Office365AnSinh .toolbar-item-second .dxm-content {
    background: inherit !important;
}

.toolbar-item-second img {
    filter: invert(32%) sepia(91%) saturate(4344%) hue-rotate(5deg) brightness(96%) contrast(101%);
}

.dxflItemSys.dxflCheckBoxItemSys .dxichCellSys, .dxflItemSys.dxflCheckBoxWithTextItemSys .dxichCellSys {
    padding-left: 8px !important;
    padding: 7px 0;
}

.toast {
    max-width: 420px !important;
}

.toast-container > div {
    width: 100% !important;
}

.dxbButton_Office365AnSinh.first-danger {
    background-color: var(--danger-color);
    color: var(--text-light-color);
}

.link-disabled {
    color: #b1b1b1 !important;
    cursor: not-allowed !important;
}

.html-editor-custom-statusbar {
    display: none;
}

.html-editor-custom .dxheViewArea_Office365AnSinh, .html-editor-custom .dxheControl_Office365AnSinh {
    border-bottom: none;
}

.docs-button-action {
    border: 1px solid transparent;
    border-radius: 100px;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    height: 36px;
    line-height: 16px;
    padding: 6px 12px;
    background: #0b57d0 !important;
    color: #fff;
}

.docs-button-standard {
    border-radius: 100px;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    color: #0b57d0;
    padding: 6px 12px;
    background: transparent;
    border: 1px solid transparent !important;
    height: 36px;
    line-height: 18px;
}

    .docs-button-standard:hover {
        color: #0b57d0;
        padding: 6px 12px;
        background-color: rgba(11,87,208,.08);
    }

.docs-button-action:hover {
    height: 36px;
    line-height: 16px;
    padding: 6px 12px;
    background-color: rgba(11,87,208,.08);
    box-shadow: 0 1px 2px rgba(0,0,0,.3),0 2px 6px 2px rgba(0,0,0,.15);
    background: #1e64d4;
    color: #fff;
}

.width-190 {
    width: 190px !important
}
/*GridView Pager*/
/*.gridview_pager .dxp-button.dxp-bi {
    padding: 0 0.5rem;
    height: 27px !important;
    color: var(--grey-2);
    border-radius: 111px;
    border: 1px solid var(--light-grey-2);
    margin-right: 0.5rem;
    display: flex;
    align-items: center;
}

.gridview_pager .dxp-num {
    min-width: 12px;
    height: 27px;
    line-height: 30px;
    padding: 0 0.5rem;
    font-weight: normal;
    font-size: 0.75rem;
    letter-spacing: -0.21px;
    border-radius: 30px;
    border: 1px solid var(--light-grey-2);
    margin-right: 0.5rem;
    text-align: center;
}*/
/*.cusom_btn {
    min-width: 12px;
    height: 27px;
    line-height: 30px;
    padding: 0 0.5rem;
    font-weight: normal;
    font-size: 0.75rem;
    letter-spacing: -0.21px;
    border-radius: 30px;
    border: 1px solid var(--light-grey-2);
    margin-right: 0.5rem;
    text-align: center;
}*/

/*.gridview_pager #ContentPlaceHolder1_ModuleContainer_WebUserControlID_splitterVoucherList_gvDanhSachPhieuNhapHang_DXPagerBottom_PBN {
    float: right !important;
    position: absolute;
    right: 125px;
}*/
/*.gridview_pager #ContentPlaceHolder1_ModuleContainer_WebUserControlID_splitterVoucherList_gvDanhSachPhieuNhapHang_DXPagerBottom_PBP {
    float: right !important;
    position: absolute;
    right: 200px;
}*/
.gridview_pager dxWeb_pNextDisabled_Office365AnSinh {
    float: right !important;
    position: absolute;
    right: 125px;
}

/*.gridview_pager dxp-button dxp-bi dxp-disabledButton {
    float: right !important;
    position: absolute;
    right: 200px;
}
*/
.gridview_pager .dxp-current {
    float: right !important;
    position: absolute;
    right: 165px;
}

.gridview_pager .dxpLite_Office365AnSinh .dxp-current {
    background-color: #0071E3;
    color: var(--text-light-color);
    border-color: #0071E3;
}

    .gridview_pager .dxpLite_Office365AnSinh .dxp-current:hover {
        color: var(--dark-color);
    }
/*
.dxtcLite_Office365AnSinh.dxtc-top > .dxtc-stripContainer {
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
    background-color: #ffffff;
    margin: 0px 16px;
}
.panel_custom {
    padding:0px 16px
}
*/
.custom-layout-item {
    margin-left: -20px !important;
    padding-left: 0px;
}

.custom-layout-item1 {
    margin-left: -39px !important;
    padding-left: 0px !important;
}
.btn_bg_transparent {
    background-color: transparent !important;
}
/*.custom-pager .dxpLite_Office365AnSinh .dxp-button {
    height:30px;
    border-radius:30px
}*/
.custom_btn {
    height: 30px !important;
    border-radius: 30px !important
}
.custom_pageNum {
    height: 30px !important;
    border-radius: 30px !important;
    width: 15px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
.current_PageNum {
    background-color: #0071E3 !important;
    color:white !important;
    border:1px solid #E7E7E9 !important;
    height:30px !important;
}
.modal__container-header-top{
    background-color: #f5f5f5;
    padding: 15px !important;
}
.dxmLite_Office365AnSinh .dxctToolbar_Office365AnSinh.dxm-main.dxmtb {
    background-color: transparent !important;
}
.dxmLite_Office365AnSinh .dxctToolbar_Office365AnSinh.dxmtb .dxm-item {
    background-color: var(--light-grey-4);
}
.dxtlHeader_Office365AnSinh {
    height: 40px;
}
.dxctToolbar_Office365AnSinh div.dxm-content:not(.dxm-disabled) {
    background-color: var(--light-grey-4) !important;
}