@media (max-width: 767px) {
    .main-header .navbar-custom-menu {
        float: none !important;
        display: flex;
        flex-wrap: wrap;
        justify-content: right;
        order:1;
        margin-left: auto;
    }
    .main-header .navbar-custom-menu .dropdown-menu {
        left: auto !important;
    }
    .skin-blue-light .main-header .navbar .dropdown-menu li a {
        color: #777;
    }
    .main-header .navbar {
        height: auto;
    }
    /* sidebar bottom mobile */
    .no-print.sidebar-bottom{
        display:block!important;
        position: fixed;
        bottom:0;
        z-index:4;
        width: 100%;
        height:55px;
    }
    .sidebar-bottom .navbar.navbar-default.bg-white.m-4{
        /* overflow-x:hidden; */
        overflow-y: hidden;
        margin:0px!important;
        height:55px;
    }
    .sidebar-bottom #bs-example-navbar-collapse-1-sidebar-horizontal{
        width: 100%;
       padding:0px;
       margin:0px;
    }
    .sidebar-bottom .row{
        width:100%;
        margin-left: 0px;
        margin-right: 0px;
    }
    .sidebar-bottom .col-md-2{
        display: flex;
        justify-items: center;
        /* justify-content: center; */
        justify-content: flex-start;
        text-align: center;
        /* width:20%; */
        width: 100%;
        /* padding-right: 7.5px; */
        margin-right: 125.5px;
    }
    .item-sidebar-bottom{
        /* position: fixed; */
        position: absolute;
        left: 0;
        display: flex;
        justify-items: center;
        justify-content: center;
        text-align: center;
    }
    .sidebar-bottom .item-sidebar-bottom.open ul.dropdown-menu{
        /* transform: translate(-50%, -100%); */
        transform: translate(0, -100%);
        position:absolute;
        top: 0;
        /* left:50%; */
        left: 0;
        z-index: 4;
        background: #fff;
        font-size: 12px;
        list-style: none;
        min-width: 0px;
        width: max-content;
        margin-top: 0;
    border-width: 0;
    border-radius: 5px!important;
    box-shadow: 0 50px 100px rgba(50,50,93,.1), 0 15px 35px rgba(50,50,93,.15), 0 5px 15px rgba(0,0,0,.1);
    }
    .sidebar-bottom .item-sidebar-bottom.open ul.dropdown-menu a{
        padding-left: 5px;
        padding-right: 5px;
        text-decoration: none;
        color: #777;
    }
    .sidebar-bottom .item-sidebar-bottom.open ul.dropdown-menu a i{
        display:inline-block;
        padding-left: 5px;
        padding-right: 5px;
        text-decoration: none;
        color: #777;
    }
    .sidebar-bottom .item-sidebar-bottom a span i{
        display:block;
    }
    .sidebar-bottom .item-sidebar-bottom a span{
        min-width: 125.5px;
    }
    .sidebar-bottom .item-sidebar-bottom.open ul.dropdown-menu li{
        display: block;
        box-sizing: content-box;
    }
    .sidebar-bottom .item-sidebar-bottom p{
        margin-bottom: 0px;
    }
    .sidebar-bottom .item-sidebar-bottom a{
        padding:0;
        text-decoration: none;
        color: #777;
        overflow: hidden;
        /* font-weight: bold; */
    }
    .sidebar-bottom .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        float: left;
    }
    .sidebar-bottom img{
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
    .sidebar-bottom .dropdown-toggle i{
        display:block;
        font-size: 25px;
    }
    .sidebar-bottom .nav>li>a{
        text-align: center;
    }
    .sidebar-bottom .nav>li>a>i{
        display:block;
        margin-left: auto;
        margin-right: auto;
    }

    /* Edit some existing mobile code */
    .scrolltop.no-print .scroll{
        bottom:40px;
    }
    .btn-group.menuBusinessMobile{
        display:none!important;
    }
    .sidebar .btn-group.menuBusinessMobile{
        display:flex!important;
        flex-wrap: wrap;
        
    }
   
    /* custom header */
    .navbar-custom-menu>.navbar-nav {
        justify-items: right;
        order: 1;
    }
    .info-box-new-style .info-box-icon{
        width:max-content!important;
    }
    .main-header .fas.fa-info-circle{
        margin-top: auto!important;
        margin-bottom: auto;
    }
    .navbar.navbar-static-top{
        display: flex;
        justify-items: center;
    }
    .nav.navbar-nav .dropdown.myuser{
        display:block!important;
    }
    .dropdown.myuser{
        display:none;
    }
    .dropdown-menu img{
        display:inline-block!important;
    }
    .pos .fa.fa-th-large{
        display:none;
    }  
    .dropdown.notifications-menu{
        display: flex;
        justify-items: center;
    }
    dropdown-toggle.load_notifications{
        width: 30px;
        height: 30px;
        padding: 0px !important;
    }
    .navbar-custom-menu>.navbar-nav{
        justify-content: right;
    }
    .navbar-custom-menu button, .navbar-custom-menu a{
        margin-top: auto;
        margin-bottom: auto;
    }
    #view_todays_profit{
        margin-right: 0!important;
    }
    .main-header .navbar-custom-menu .nav.navbar-nav li{
        text-align: center;
    }
    .dropdown.menuBusinessMobile button{
        padding:0!important;
        margin: 5px!important;
    }
    
    /* avatar mobile */
    .sidebar-collapse .myuser-mobile .info-box.info-box-new-style.avatar-mobile{
        margin: 10px 0 !important;
        padding: 10px 20px !important;
    }
    .sidebar-collapse .myuser-mobile .dropdown-menu.dropdown-avatar-mobile{
        left: auto !important;
    }
    .dropdown.myuser-mobile.open .dropdown-menu{
        position:absolute;
        margin-left: 0;
        margin-right: 0;
    }
    .dropdown.myuser-mobile.open .dropdown-menu a,.dropdown.myuser-mobile.open .dropdown-menu button{
        display: block;
        margin: 0 !important;
        width: 100%;
        background: #fff;
        float: left;
        text-align: left;
        color: #6a6c6f;
        border:none;
        font-size: 14px;
        padding: 13px 16px;
    }
    
    /* dropdown business */
    .myuser-mobile.open .dropdown-business.show .menu-switch-business,.sidebar-collapse .myuser-mobile.open .dropdown-business.show .menu-switch-business{
        display: block;
        left: 0!important;
        transform: translateX(-100%);
        z-index: 10;
        background: white;
        border: 1px solid #ccc;
        border: 1px solid rgba(0,0,0,.15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
        box-shadow: 0 6px 12px rgba(0,0,0,.175);
    }
    .dropdown-business.show{
        position: relative;
    }
    
}
@media (max-width: 1024px){
    .sidebar .btn-group.menuBusinessMobile{
       display: none!important;
        
    }
    .navbar-custom-menu{
        justify-content:left;
    }
   
}
@media (max-width: 991px){
    .navbar-custom-menu>.navbar-nav {
        float: none!important;
        display: flex;
        align-items: center;
    }
    .main-header .navbar-custom-menu{
        float: none!important;
    }
}

.sidebar-menu li.active>a{
    font-weight: 600 !important;
}

.btn-big {
    padding: 10px 30px;
    font-size: 18px;
    line-height: 1.3333333;
}

.of-visible {
    overflow: visible !important;
}

#online_indicator {
    font-size: 8px;
    vertical-align: middle;
}

.pt-0 {
    padding-top: 0px;
}
.f-right {
    float: right;
}
.mb-10 {
    margin-bottom: 10px;
}
.discount-badge {
    position: absolute;
    top: 6px;
    right: 10px;
    font-size: 18px;
    padding: 7px;
}

.discount-badge-small {
    position: absolute;
    top: -2px;
    left: 10px;
    font-size: 12px;
    padding: 6px;
}
.product-info-table td, .product-info-table th {
    font-size: 12px;
}
.catalogue {
    max-height: 127px;
    margin: auto;
    margin-bottom: 18px;
}
.catalogue-title {
    display: inline-block;
    font-size: 18px;
    margin: 0;
    line-height: 1;
    margin-bottom: 10px;
}
.bg-light-gray {
    background-color: #f8f8f8 !important;
}
.p-5-5 {
    padding: 5px 5px !important;
}
.m-4 {
    margin: 4px;
}
.skin-black .main-header, .skin-black-light .main-header {
    color: #525f7f !important;
}
.skin-black .main-header .navbar .nav .open>a {
    color: #999 !important;
}
.skin-black .main-header .navbar .nav>li>a:hover{
    color: #999 !important;
}
.skin-black .main-header .navbar > .sidebar-toggle:hover {
    color: #999 !important;
}
.mt-0{
    margin-top: 0 !important;
}
.table-pdf thead tr{
    background-color: #357ca5 !important;
    color: #fff;
}
.table-pdf thead tr th {
    color: #fff !important;
}
.blue-heading {
    background-color: #357ca5;
    color: #fff;
}

.table-pdf .odd {
    background-color: #DCE6F1;
}
.p-4{
    padding: 4px;
}
.p-10{
    padding: 10px !important;
}
.jquery-top-scrollbar{
    height: 6px !important;
}
.jquery-top-scrollbar div {
    height: 6px !important;
}
.scroll-top-bottom {
    width: 100%;
    overflow: scroll;
}
.scroll-top-bottom::-webkit-scrollbar {
    height: 6px;
}

.scrolltop {
    display:none;
    width:100%;
    margin:0 auto;
    position:fixed;
    bottom:20px;
    right:10px;
}
.scroll {
    position:absolute;
    right:20px;
    bottom:20px;
    background:#b2b2b2;
    background:rgba(178,178,178,0.7);
    padding:7px;
    text-align: center;
    margin: 0 0 0 0;
    cursor:pointer;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
    border-radius: 6px;
}
.scroll:hover {
    background:rgba(178,178,178,1.0);
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
}
.scroll:hover .fas {
    padding-top:-10px;
}
.scroll .fas {
    font-size:25px;
    margin-top:-5px;
    margin-left:1px;
    transition: 0.5s;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    -o-transition: 0.5s;
}

.f-left {
    float: left;
}
.align-left {
    text-align: left;
}
.align-right {
    text-align: right;
}
.table-pdf {
    border-collapse: collapse;
    width: 100%;
    border-spacing: 8px 10px;
}
.td-border td, .td-border th{
    border-bottom: 1px solid lightgrey;
    padding: 8px 5px;
}

.ws-nowrap {
    white-space:nowrap;
}

.btn-app>.fas, .btn-app>.fab{
    font-size: 20px;
    display: block;
}
.dropdown-menu>li>a>.fas{
    margin-right: 6px;
}
.mt-5 {
    margin-top: 5px !important;
}
.pos-form-actions{
    height: auto;
    padding-top: 12px;
    padding-bottom: 20px;
    position: fixed;
    bottom: 0px;
    background-color: #D1D5DC;
    width: 100%;
    z-index: 1000;
}
.mb-12 {
    margin-bottom: 12px !important;
}
.pb-0{
    padding-bottom: 0px !important;
}
.pr-12{
    padding-right: 12px !important;
}
.main-header .sidebar-toggle:before {
    content: "" !important;
}
.ui-autocomplete {
    max-height: 300px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}
.margin-bottom-20 {
    margin-bottom: 20px !important;
}
.text-white {
    color: #fff;
}
.wizard > .steps > ul > li {
    width: 33.33% !important;
}
.wizard > .content {
    background: #445867 !important;
}
legend {
    color: #fff;
    margin-bottom: 6px;
    border-bottom: none;
}
.left-col {
    background: linear-gradient(0deg,rgba(0, 0, 0, 0.76),rgba(51, 51, 51, 0.32)),url(../img/home-bg.jpg);
    text-align: center;
    background-size: cover;
    background-position: center;
}
.left-col-content {
    color: #1A7BF9;
    width: 100%;
}
.login-header {
    font-size: 27px;
    font-weight: 600;
}
.login-header a {
    color: #fff;
}
.form-header {
    font-size: 18px;
    margin: 16px 0;
}
.btn-login {
    padding: 6px 52px !important;
}
.right-col {
    background-color: #243949;
    height: 100%;
    min-height: 100vh;
}

.right-col label {
    color: #fff;
}

.right-col a, .text-white a {
    color: #fff;
    font-weight: 600;
    font-size: 15px
}
.right-col a:hover, .text-white a:hover {
    color: #ccc;
}
.right-col-content {
    padding: 10% 16%;
    padding-bottom: 3%;
}
.right-col-content-register {
    padding: 2% 8%;
}

.input_inline {
    width: 100%;
    display: inline-flex;
}
.input_inline input, .input_inline span {
    width: 50%;
}
.bg-manufacturing {
    background-color: #ff851b;
}
.img-thumbnail {
    position: relative;
    width: 70px;
    height: 70px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 2px;
    transition: border .2s ease-in-out;
    padding: 4px;
    margin: 3px;
    text-align: center;
}
.img-thumbnail>.badge{
    position: absolute;
    top: -5px;
    right: -7px;
    font-size: 9px;
    font-weight: 400;
    cursor: pointer;
}
.navbar-nav>.notifications-menu>.dropdown-menu>li .menu {
    max-height: 350px;
}
.bg-aqua-lite {
    background-color: #7FFFD4;
}
.navbar-nav>.notifications-menu>.dropdown-menu>li .menu>li>a {
    white-space: normal;
}
.spacer {
    margin-top: 20px;
}
#product_list_body {
    max-height: 485px;
    overflow-y: scroll;
    overflow-x: hidden;
}
.div-overlay {
    cursor: not-allowed;
    background: #e9e9e9;
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0.5;
}

.d-inline-table {
    display: inline-table;
}

.label-round{
    font-size: 8px;
    border-radius: 44%;
}
.table>tbody+tbody{
    border-top: 0;
}
.table-pl-12 td, .table-pl-12 th{
    padding-left: 12px !important;
}
table tbody td.pl-20-td{
    padding-left: 20px !important;
}
table.table-border-center > tbody > tr > td:first-child,
table.table-border-center > thead > tr > th:first-child,
table.table-border-center > tfoot > tr > td:first-child
{
    border-right: 1px solid darkgray;
}
table.table-border-center-col > tbody > tr > td:nth-child(2),
table.table-border-center-col > thead > tr > th:nth-child(2),
table.table-border-center-col > tfoot > tr > td:nth-child(2)
{
    border-right: 1px solid darkgray;
    border-left: 1px solid darkgray;
}
.bg-transparent{
    background-color: transparent !important;
}
.mb-0{
    margin-bottom: 0;
}

.nav-tabs>li>a{
    font-size: 18px;
    /* font-weight: 600; */
}
.table-transparent, .table-transparent th {
    background-color: transparent !important;
    color: #000 !important;
}
.td-full-width {
    white-space:nowrap;
}
.font-17{
    font-size: 17px !important;
}
table.dataTable tbody>tr.selected{
    background-color: #B0BED9;
}
tr.footer-total > td {
    vertical-align: middle !important;
}
.error{
    color: red !important;
}
/*  pos tab */
div.pos-tab-container{
    z-index: 10;
    background-color: #ffffff;
    padding: 0 !important;
    border-radius: 4px;
    -moz-border-radius: 4px;
    border:1px solid #ddd;
    margin-bottom: 28px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    -moz-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    background-clip: padding-box;
}
div.pos-tab-menu{
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 0;
}
div.pos-tab-menu div.list-group{
    margin-bottom: 0;
}
div.pos-tab-menu div.list-group>a{
    margin-bottom: 0;
}
div.pos-tab-menu div.list-group>a .glyphicon,
div.pos-tab-menu div.list-group>a .fa {
    color: #5A55A3;
}
div.pos-tab-menu div.list-group>a:first-child{
    border-top-right-radius: 0;
    -moz-border-top-right-radius: 0;
}
div.pos-tab-menu div.list-group>a:last-child{
    border-bottom-right-radius: 0;
    -moz-border-bottom-right-radius: 0;
}
div.pos-tab-menu div.list-group>a.active,
div.pos-tab-menu div.list-group>a.active .glyphicon,
div.pos-tab-menu div.list-group>a.active .fa{
    background-color: #3c8dbc;
    color: #ffffff;
    border-color: #3c8dbc;
}
div.pos-tab-menu div.list-group>a.active:after{
    content: '';
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -13px;
    border-left: 0;
    border-bottom: 13px solid transparent;
    border-top: 13px solid transparent;
    border-left: 10px solid #3c8dbc;
}

div.pos-tab-content{
    background-color: #ffffff;
    /* border: 1px solid #eeeeee; */
    padding-left: 20px;
    padding-top: 20px;
}

div.pos-tab div.pos-tab-content:not(.active){
    display: none;
}

.add-product-price-table th{
    background-color: #5cb85c;
    color: white;
}
.blue-header th {
    background-color: #3c8dbc;
    color: white;
}
.table-th-green th{
    background-color: #5cb85c;
    color: white;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0;
}
.active-cell {
    border: 2px dotted #3c8dbc !important;
}
.cursor-pointer{
    cursor: pointer !important;
}
.pos_product_div{
    min-height: 47vh;
    max-height: 57vh;
    overflow-y: auto;
    margin-bottom: 20px;
}
.bg-lightgray{
    background-color: #F0EDED !important;
}
.balance_due_box >li{
    padding: 11px 5px 0px 5px;
}
.option-div {
    padding: 15px;
    background-color: #d2d6de;
    color: #333;
    border:1px solid #d2d6de;
    cursor: pointer;
}
.option-div input[type="radio"]{
    display: none;
}
.option-div-group .icon {
    color: #d33724;
    display: none;
}
.option-div-group .option-div:hover{
    border:1px solid gray;
}
.option-div-group .active .icon{
    display: block;
}
.margin-left-10 {
    margin-left: 10px;
}
.margin-bottom-12{
    margin-bottom: 12px;
}
.bg-info{
    background-color: #00c0ef !important;
}
.bg-info > a{
    color: #FFFFFF !important;
}
.bg-info>a:hover{
    background-color: #337ab7 !important;
}
ul.dt-button-collection{
    background-color: #00c0ef;
}
td.details-control {
    background: url('/img/details_open.png') no-repeat center center;
    cursor: pointer;
}
tr.details td.details-control {
    background: url('/img/details_close.png') no-repeat center center;
}
.icheckbox_square-blue, .iradio_square-blue{
    margin-right: 10px;
}
.header-right-div{
    right: 10px;
    float: right;
    position: absolute;
    top: 15px;
}
.header-left-div{
    margin-top: 15px;
    display: inline-flex;
}
.m-8 {
    margin: 8px;
}
.mt-10{
    margin-top: 10px;
}
.mt-15{
    margin-top: 15px;
}
.m-5 {
    margin: 5px;
}
.icon-link{
    text-align:center;
    display:block;
    margin-bottom: 18px;
}
.icon-link > a {
    display:grid;
}
.icon-link > .badge{
    position: absolute;
    top: 20px;
    right: 67px;
}
.link-des {
    display: inline-block;
    text-align: left;
}

.navbar-nav>.user-menu>.dropdown-menu>li.user-header>img {
    border: none;
    height: auto;
    width: 100%;
    max-height: 120px;
}
.bg-light-green{
    background-color: #98D973 !important;
    color: #fff !important
}
.hover-q {
    font-size: 16px;
    margin-left: 3px;
    cursor: help;
}
.input-group-addon .hover-q{
    margin-left: 0px;
}
.text-bold{
    font-weight: bold;
}
.tour .popover-content{
    padding: 18px 14px;
}
.table-slim>tbody>tr>td, .table-slim>tbody>tr>th, .table-slim>tfoot>tr>td, .table-slim>tfoot>tr>th, .table-slim>thead>tr>td, .table-slim>thead>tr>th{
    padding: 1px;
}

/* Custom scroll bar start*/

/* width */
::-webkit-scrollbar {
    width: 7px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Custom scroll bar end*/

.product_cell{
    height: 100px;
    padding: 1%;
}
.product_cell_div{
    height: 100% !important;
    width: 100% !important;
    text-align: center;
    vertical-align: middle;
    padding-top: 5px;
    cursor: pointer;
    overflow: hidden;
}

/*CSS to print receipts*/
.print_section{
    display: none;
}
/* custom scroll navbar default */
.navbar.navbar-default.bg-white.m-4{
    overflow-x: scroll;
}
.navbar.navbar-default.bg-white.m-4::-webkit-scrollbar{
    height: 0px;
}
.navbar-collapse.collapse {
    display: block!important;
    height: auto!important;
    padding-bottom: 0;
    overflow: visible!important;
    overflow-x: auto;
    width: 100%;
    min-width: max-content;
}
.nav.navbar-scroll{
    display:flex;
}
.navbar-nav.navbar-scroll .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

@media print{
    .print_section{
        display: inline !important;
    }
    .modal-xl{
        width: 100% !important;
    }
    ::-webkit-scrollbar{
        display: none !important;
    }
    #toast-container {
        display: none;
    }
}

.input-number .btn-default{
    background-color: white;
    padding: 6px 9px;
}

.width-50{
    width: 50% !important;
}
.width-40{
    width: 40% !important;
}
.width-60{
    width: 60% !important;
}
.width-100{
    width: 100% !important;
}

.font-30{
    font-size: 30px !important;
}

.font-23{
    font-size: 23px !important;
}
.padding-5{
    padding: 5px !important;
}
.padding-10{
    padding: 10px !important;
}
/* .padding-side-15{
    padding-left: 15px !important;
    padding-right: 15px !important;
} */
.text-muted-imp{
    color: #A3A3A3 !important;
}

.table-no-top-cell-border td{
    border-top: 0px !important;
    border-bottom: 0px !important;
}
.table-no-top-cell-border th{
    border-top: 0px !important;
    border-bottom: 0px !important;
}

.table-no-side-cell-border td{
    border-left: 0px !important;
    border-right: 0px !important;
}
.table-no-side-cell-border th{
    border-left: 0px !important;
    border-right: 0px !important;
}

.color-555 {
    color: #555555 !important;
}
.color-555 *{
    color: #555555 !important;
}
.color-white {
    color: white !important;
}
.col-no-padding{
    padding-left: 0px;
    padding-right: 0px;
}
.col-2px-padding{
    padding: 2px;
}

.pos-express-btn{
    font-size: 23px !important;
    overflow: hidden !important;
    height: 73px !important;
    white-space: normal;
}
.word-wrap{
    word-wrap: break-word !important;
}

.modal-xl{
    width: 90%; /* respsonsive width */
    margin-left: auto !important;
    margin-right: auto !important;
}
table.ajax_view tbody tr{
    cursor: pointer;
}
.bg-white{
    background-color: #fff;
}

.product-thumbnail-small{
    height: 50px;
    width: 50px;
}

.img-introduction{
    height: 200px;
    width: 200px;
}

table.table-text-center td, table.table-text-center th{
    vertical-align: middle !important;
}
.product_list{
    padding-left: 8px;
    padding-right: 8px;
}
.product_box{
    width: 100%;
    /*padding-top: 5px;
    padding-bottom: 2px;*/
    margin-bottom: 10px;
    text-align: center;
    cursor: pointer;
    /*border: 1px solid darkgray;*/
    font-weight: 600;
    background-color: #fff;
    border-radius: 2px;
    padding-top: 3px;
}
.product_box .image-container{
    /*width: 95%;*/
    height: 55px;
    margin: auto;
    /*padding-top: 5px;*/

}
.product_box .image-container img{
    height: 45px;
    /*width: 45px*/
}
.eq-height-row{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:flex;
    flex-wrap: wrap;
}
.eq-height-col{
    display: flex;
}

.product_box .text_div{
    margin-top: 3px;
}
.product_box .text{
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1; /* number of lines to show */
    line-height: 14px;        /* fallback */
    max-height: 14px;       /* fallback */
}
.small-box.bg-gray:hover{
    color: #000;
    text-decoration: none;
}

#calendar table tbody td {
    cursor: pointer;
}

.min-height-90hv{
    min-height: 90vh !important;
}

/* Grow Shadow */
.hvr-grow-shadow {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: box-shadow, transform;
    transition-property: box-shadow, transform;
}
.hvr-grow-shadow:hover, .hvr-grow-shadow:focus, .hvr-grow-shadow:active {
    box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5);
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.text-link{
    cursor: pointer;
}

.text-link:hover{
    text-decoration: underline;
}

.v-center{
    vertical-align: middle !important;
}

.bg-woocommerce{
    background-color: #9E458B !important;
}

/*.box, .info-box, .nav-tabs-custom, .external-event{
  box-shadow: 0 4px 6px 0 hsla(0, 0%, 0%, 0.2) !important;
}*/

.user_avatar {
    border-radius: 50%;
    width: 25px;
    height: 25px;
    margin: 1px;
}

.fs-10 {
    font-size: 10px;
}

.timeline-lode-more-btn {
    margin-left: 50px;
    margin-top: 25px;
    padding-right: 12px;
    padding-left: 12px;
}

.pa-0 {
    padding: 0px !important;
}

.mt-56{
    margin-top: 56px !important;
}

.m-2{
    margin: 2px !important;
}

.treeview-menu i{
    display: none !important;
}
.treeview-menu a{
    padding-left: 25px !important;
    font-size: 95% !important;
}
.treeview-menu a::before{
    content: "\2192 ";
}

@media only screen and (max-width: 600px) {
    .pos-form-actions{
        position: absolute;
    }
}
.mr-8 {
    margin-right: 8px !important;
}

@media (max-width: 1024px) {
    .pos_form_totals{
        margin-bottom: 40px;
    }
}

.swal-modal .swal-text {
    text-align: center;
}

.pos-total {
    display: inline-block;
    padding: 8px 10px;
    vertical-align: middle;
    margin-left: 5px;
    margin-right: 5px;
}
.pos-total span.number{
    font-size: 26px;
    vertical-align: middle;
    font-weight: bolder;
}

.pos-total span.text{
    font-weight: bolder;
    display: inline-block;
    width: 60px;
    vertical-align: middle;
}
.mb-40 {
    margin-bottom: 40px !important;
}

@media print {
    a:after { content:''; }
    a[href]:after { content: none !important; }
}
.myuser .info-box{
    min-height: auto;
    box-shadow: none !important;
    margin: 10px 0;
    padding: 10px 20px !important;
}
.nav.navbar-nav .dropdown.myuser{
    display:none;
}
.myuser .info-box-text{
    color: #333;
}
.myuser .info-box-content{
    margin-left: 50px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.myuser .info-box-icon{
    height: 50px;
    width: 50px
}
.myuser .info-box-content i{
    margin-left: 3px;
    font-size: 11px;
}
.myuser img{
    height: 50px;
    width: 50px;
    object-fit: cover;
    border-radius: 50%;
}
.myuser .dropdown-menu{
    right: 0;
    left: auto;
    margin: 0;
    padding: 0;
}
.myuser .dropdown-menu li a{
    padding: 6px 15px;
}
.myuser .dropdown-menu li a i{
    margin: 0px 5px 0px 0 !important;
    font-size: 13px;
    display: inline-block;
    color: #6a6c6f;
}
.myuser .dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5;
}
.sidebar-collapse .myuser .info-box-content{
    display: none;
}
.sidebar-collapse .myuser .dropdown-menu{
    left: 20px !important;
}
.sidebar-collapse .myuser .info-box{
    padding: 0 !important;
    margin: 0;
}
.sidebar-collapse .myuser .info-box-icon {
    background-color: #fff !important;
    box-shadow: none !important;
}
.sidebar-collapse .myuser img{
    height: 30px;
    width: 30px;
}

/* FLOAT MENU */
:root{
    --flyout_menu_font: sans-serif;
    --arrow_menu_left_side_color:#fff;
    --triangle_color: black;
    --main_menu_right_side_color:#fff;
    --flyout_menu_font_color: var(--arrow_menu_left_side_color);
    --image_flyout_width:100px;
    --image_flyout_scaling_mobile:0.75;
    --flyout_menu_font_size: 16px;
    --main_menu_right_side_padding:10px;
    --social_media_icon_flyout_margin: 10px;
    --text_flyout_margin: var(--social_media_icon_flyout_margin);
    --round_border_radius: 7px;
    --arrow_padding: var(--main_menu_right_side_padding);
    --arrow_size: 8px;
    --opacity-transition-duration: 0.1s;
}

#flyout_menu{
    position: fixed;
    display: flex;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999!important;
    max-height: 100%;
}

.flyout_menu_right{
    right:0;
}

.flyout_menu_left{
    left:0;
}

.arrow_menu{
    background: var(--arrow_menu_left_side_color);
    padding:var(--arrow_padding);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    box-shadow: 1px 2px 3px #999;
}

.arrow_menu_right{
    border-top-left-radius: var(--round_border_radius);
    border-bottom-left-radius: var(--round_border_radius);
}

.arrow_menu_left{
    border-top-right-radius: var(--round_border_radius);
    border-bottom-right-radius: var(--round_border_radius);
}

.social_media_icon_flyout{
    padding: var(--social_media_icon_flyout_margin);
    width:var(--image_flyout_width);
    height: auto;
    display: flex;
    transition: opacity var(--opacity-transition-duration) ease-in-out;
}

.social_media_icon_flyout:hover, .social_media_icon_flyout:focus, .mouseover_opacity, .text_flyout a:hover, .text_flyout a:focus{
    opacity: 0.7;
}

.social_media_icon_flyout_img{
    width:100%;
    height:100%;
    object-fit: contain;
}

.text_flyout{
    padding: var(--text_flyout_margin);
    display: flex;
    font-family: var(--flyout_menu_font);
    font-size: var(--flyout_menu_font-size);
    color: var(--flyout_menu_font_color);
}

.text_flyout a{
    text-decoration: none;
    color: var(--flyout_menu_font_color);
    transition: opacity var(--opacity-transition-duration) ease-in-out;
}

.pointer{
    cursor: pointer!important;
}

.arrow_menu_triangle{
    border-top: var(--arrow_size) solid transparent;
    border-bottom: var(--arrow_size) solid transparent;
    transition: opacity var(--opacity-transition-duration) ease-in-out;
}

.triangle_left{
    border-right: var(--arrow_size) solid var(--triangle_color)!important;
}

.triangle_right{
    border-left: var(--arrow_size) solid var(--triangle_color)!important;
}

#social_media_icon_flyout_parent{
    display: flex;
    padding: var(--main_menu_right_side_padding);
    background:var(--main_menu_right_side_color);
    flex-direction:column;
    overflow-y: auto;
    overflow-x: auto;
    box-shadow: 1px 2px 3px #999;
    border-radius: 0px 0px 0px 5px;
}

#social_media_icon_flyout_parent ul{
    list-style: none;
    padding: 0;
    margin: 0;
}

#social_media_icon_flyout_parent ul li {
    padding: 10px;
}

#social_media_icon_flyout_parent ul li a{
    font-size: 15px;
    color: #333;
}

#social_media_icon_flyout_parent ul li img{
    margin-right: 8px;
}

#social_media_icon_flyout_parent_parent{
    display: flex;
    overflow: hidden;
}

.flyout_menu_row{
    display:flex;
}

.social_media_icon_flyout_mobile_width{
    width:calc(var(--image_flyout_scaling_mobile)*var(--image_flyout_width))!important;
}

.flyout_hide{
    display:none;
}

.hide_flyout_menu_onload{
    visibility: hidden;
}
/* END FLOAT MENU */
/* Responsive crm dashboard */
@media (max-width: 767px) and (min-width: 421px) {
    .col-custom {
        width: 50%;
        float: left;
    }

    .info-box-new-style .info-box-icon {
        height: 25px;
        width: 25px;
    }

    .info-box-new-style .info-box-icon i {
        font-size: 100%;
    }

    .info-box-new-style .info-box-content {
        margin-left: 15%;
    }
    .myuser img{
        display: block;
        height: 30px;
        width: 30px;
        /* margin-top: auto !important; 
        margin-bottom: auto !important; */
    }
}

@media (max-width: 420px) {
    .col-custom {
        width: 50%;
        float: left;
    }
    .info-box-new-style .info-box-icon {
        height: 25px;
        width: 25px;
    }

    .info-box-new-style .info-box-icon i {
        font-size: 100%;
    }

    .info-box-new-style .info-box-content {
        margin-left: 15%;
    }
    .myuser img{
        height: 30px;
        width: 30px;
        /* Đặt margin-top thành auto để căn giữa theo chiều dọc */
        /* margin-top: auto !important; 
        margin-bottom: auto !important; */
    }
    .pos{
        display:none;
    }
   
}
ul.dropdown-menu.menu-switch-business li {
    padding: 10px;
}
ul.dropdown-menu.menu-switch-business li.active,ul.dropdown-menu.menu-switch-business li:hover{
    background: #e7e7e7;
}
ul.dropdown-menu.menu-switch-business li label {
    display: block;
    margin: 0;
}
ul.dropdown-menu.menu-switch-business li h4 {
    margin: 0;
}
@media (max-width: 360px){
    .fas.fa-info-circle.pull-left.mt-10.cursor-pointer{
        display:none
    }
    .sidebar-toggle{
        padding-left: 10px!important;
        padding-right: 10px!important;
    }
}

/* Tùy chỉnh cho giao diện mobile đào tạo */
@media (max-width: 767px) {
    #students_table_wrapper .table-responsive {
        display: block;
    }
    .custom-students-table.table thead {
        display: none;
    }
    #students_table_wrapper .table tbody {
        display: block;
        padding: 5px;
    }
    #students_table_wrapper .table tbody tr {
        margin-bottom: 10px;
        display: block;
        padding: 10px;
        background-color: #f8f9fa;
    }
    #students_table_wrapper .table tbody tr td {
        display: flex; /* Để các tiêu đề và dữ liệu nằm ngang */
        text-align: left;
        font-weight: bold;
        border: none;
        padding: 5px;
        color: black;
        font-weight: bold;
    }
    #students_table_wrapper table tbody tr td:before {
        content: attr(data-title);
        font-weight: bold;
        display: inline-block; /* Hiển thị tiêu đề và dữ liệu trong cùng một dòng */
        margin-right: 10px;
    }
    #students_table_wrapper table tbody tr td.action:before {
        display: none;
    }
    #students_table_wrapper table tbody tr td.action {
        justify-content: center;
        border-bottom: solid 1px rgb(88, 88, 88) !important;
    }
    #students_table_wrapper table tbody tr td.action .action-buttons {
        gap: 20px; 
    }
    #students_table_wrapper table tbody tr td.action-orther:before {
        display: none;
    }
    #students_table_wrapper table tbody tr td.action-orther {
        display: table-cell;
        width: 100vw;
        border-top: solid 1px rgb(88, 88, 88) !important;
    }
    #students_table_wrapper table tbody tr td.action-orther .additional-buttons {
        margin-top: 10px;
    }
    #students_table tbody tr.odd {
        background-color: #ffffff; /* Màu trắng */
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
        border-radius: 20px;
   
    }

    /* Đặt màu trắng cho các hàng chẵn */
    #students_table tbody tr.even {
        background-color: #ffffff !important; /* Màu trắng */
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
        border-radius: 20px;
    }
    #students_table_wrapper .table-responsive{
        border: none;
    }
    .custom-search-wrapper .custom-search-input {
        width: 100% !important;
    }
}