﻿/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
	Custom font family
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@font-face {
    font-family: 'Cairo-Regular';
    src: url('../fonts/Cairo-Regular.eot');
    src: url('../fonts/Cairo-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Cairo-Regular.woff2') format('woff2'), url('../fonts/Cairo-Regular.woff') format('woff'), url('../fonts/Cairo-Regular.ttf') format('truetype'), url('../fonts/Cairo-Regular.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}


/*=============================
    Root variable
=============================*/
:root {
    --default-font-family: 'Cairo-Regular', -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    --color-white: #fff;
    --theme-darkbg: #222a45;
    --theme-lightbg: #303956;
    --theme-leftbar-links: #8a9199;
    --theme-leftbar-links-hover: #fff;
    --td-links: #272c33;
    --theme-darkColor: #272c33;
    --theme-darkColor-rgb: 39, 44, 51;
}
/*========================================
    themes
=========================================*/
.bg-sidebarpurple {
    --theme-darkbg: #56368e;
    --theme-lightbg: #824ee1;
    --theme-leftbar-links: #bf9df2;
    --theme-leftbar-links-hover: #fff;
    --theme-darkColor: #56368e;
    --theme-darkColor-rgb: 86, 54, 142;
}

.bg-sidebardarkgray {
    --theme-darkbg: #272c33;
    --theme-lightbg: #303840;
    --theme-leftbar-links: #b8c7ce;
    --theme-leftbar-links-hover: #fff;
    --theme-darkColor: #272c33;
    --theme-darkColor-rgb: 39, 44, 51;
}

.bg-sidebarlight {
    --theme-darkbg: #edf0f2;
    --theme-lightbg: #fff;
    --theme-leftbar-links: rgba(47,55,64,.4);
    --theme-leftbar-links-hover: #8a9199;
    --theme-darkColor: #272c33;
    --theme-darkColor-rgb: 39, 44, 51;
}
 
.bg-sidebargreen {
    --theme-darkbg: rgb(20 90 51);
    --theme-lightbg: #1F7245;
    --theme-leftbar-links: rgb(62 197 134);
    --theme-leftbar-links-hover: #8de8b6;
    --theme-darkColor: rgb(20 90 51);
    --theme-darkColor-rgb: 20, 90, 51;
}

.bg-sidebargreen2 {
    --theme-darkbg: rgb(20 90 51);
    --theme-lightbg: #1F7245;
    --theme-leftbar-links: rgb(216 177 71 / 84%);
    --theme-leftbar-links-hover: #d8b147;
    --theme-darkColor: rgb(216 177 71 / 84%);
    --theme-darkColor-rgb: 216, 177, 71;
}

.bg-sidebargreen3 {
    --theme-darkbg: rgb(20 90 51);
    --theme-lightbg: #d8b147;
    --theme-leftbar-links: #217245;
    --theme-leftbar-links-hover: #217245;
    --theme-darkColor: rgb(20 90 51);
    --theme-darkColor-rgb: 20, 90, 51;
}
.bg-navyblue {
    --theme-darkbg: #00296b;
    --theme-lightbg: #003f88;
    --theme-leftbar-links: #fdc500;
    --theme-leftbar-links-hover: #fdc500;
    --theme-darkColor: rgb(0 41 107 / 84%);
    --theme-darkColor-rgb: 0 41 107;
}
body {
    font-family: var(--default-font-family);
    background: #f5f7fa;
    color: #272c33 !important;
    overflow: hidden;
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
     Utility classes
 \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/

.mt-auto {
    margin-block-start:auto !important
}
.m-0 {
    margin: 0;
}

.mt-0 {
    margin-block-start: 0 !important
}

.mt-1 {
    margin-block-start: 1rem !important;
}

.mt-2 {
    margin-block-start: 2rem !important;
}

.mt-3 {
    margin-block-start: 3rem !important;
}

.mt2-3 {
    margin-block-start: 2.5rem !important;
}
.mt3-3 {
    margin-block-start: 2.65rem !important;
}
.mt-4 {
    margin-block-start: 4rem !important;
}
.mb-auto {
    margin-block-end: auto !important
}
.mb-0 {
    margin-block-end: 0 !important
}

.mb-1 {
    margin-block-end: 1rem !important;
}
.mb1-1 {
    margin-block-end: 0.5rem !important;
}
.mb-2 {
    margin-block-end: 2rem !important;
}

.mb-3 {
    margin-block-end: 3rem !important;
}

.mb-4 {
    margin-block-end: 4rem !important;
}


.m-auto {
    margin-inline: auto !important;
}
.ms-05 {
    margin-inline-start:0.5rem !important;
}
.me-05 {
    margin-inline-end: 0.5rem !important;
}
.mr-1 {
    margin-inline-end: 1rem !important;
}

.mr-2 {
    margin-inline-end: 2rem !important;
}
.ml-0 {
    margin-inline-start: 0 !important;
}
.ml-1 {
    margin-inline-start: 1rem !important;
}

.ml-2 {
    margin-inline-start: 2rem !important;
}
.my-0 {
    margin-block:0 !important
}
.my-1 {
    margin-block: 1rem !important;
}

.my-2 {
    margin-block: 2rem !important;
}
.mx-1 {
    margin-inline: 1rem !important;
}
.ml-auto {
    margin-inline-start: auto !important;
}

.p-0 {
    padding: 0 !important
}
.margin-r-5 {
    margin-inline:auto 5px;
}
.ms-auto {
    margin-inline-start:auto !important
}
.pt-0 {
    padding-block-start: 0 !important
}

.pt-1 {
    padding-block-start: 1rem !important;
}

.pt-2 {
    padding-block-start: 2rem !important;
}

.pt-3 {
    padding-block-start: 3rem !important;
}

.pt-4 {
    padding-block-start: 4rem !important;
}



.pb-0 {
    padding-block-end: 0 !important
}

.pb-1 {
    padding-block-end: 1rem !important;
}

.pb-2 {
    padding-block-end: 2rem !important;
}

.pb-3 {
    padding-block-end: 3rem !important;
}

.pb-4 {
    padding-block-end: 4rem !important;
}

.pl-0 {
    padding-inline-start: 0 !important
}
.pl-1 {
    padding-inline-start: 1rem !important
}
.pl-2 {
    padding-inline-start: 2rem !important
}
.pr-0 {
    padding-inline-end: 0 !important
}
.pr-1 {
    padding-inline-end:1rem !important;
}
.px-0 {
    padding-inline: 0 !important;
}
.px-1 {
    padding-inline: 1rem !important;
}

.px-2 {
    padding-inline: 2rem !important;
}

.px-3 {
    padding-inline: 3rem !important;
}

.py-05 {
    padding-block: 0.5rem !IMPORTANT;
}

.py-0 {
    padding-block: 0 !important;
}

.py-1 {
    padding-block: 1rem !important;
}

.py-2 {
    padding-block: 1.5rem !important;
}

.lh-1 {
    line-height: 1.2 !important
}

.valign-top, .table .valign-top {
    vertical-align: top !important
}
.valign-super {
    vertical-align: super !important
}
.valign-middle {
    vertical-align: middle !important
}

.d-block {
    display: block;
}

.d-inlineblock {
    display: inline-block !important;
}

.d-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}
.flex-wrap {
    flex-wrap:wrap;
}
.flexdirection-column {
    flex-direction: column
}

.justify-content-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.justify-content-center {
    justify-content: center !important;
}

.justify-content-end {
    justify-content: flex-end !important;
}

.justify-content-start {
    justify-content: flex-start !important;
}

.align-items-center {
    align-items: center !important
}
.align-self-center {
    align-self:center !important
}
.align-contet-center {
    align-content: center !important
}
.flex-grow-100 {
flex:0 0 100%
}
.flex-grow-1 {
    flex: 1
}
.gx-3 {
    column-gap:1rem !important;
}
.border-1 {
    border: 1px solid #d2d6de !important;
}

.border-0 {
    border: 0 !important;
}

.border-end {
    border-inline-end: 1px solid #d2d6de
}

.border-st {
    border-inline-start: 1px solid #d2d6de
}

.border-bottom {
    border-block-end: 1px solid #d2d6de
}
.border-bottom-0 {
    border-block-end: 0 !important;
}
    .border-top {
        border-block-start: 1px solid #d2d6de
    }
.border-top-0 {
    border-block-start: 0 !important;
}

.border-radious-0 {
    border-radius: 0 !important;
}

.border-radious-1 {
    border-radius: 4px !important;
}
.border-radious-20 {
    border-radius: 20px !important;
}
.border-radious-50 {
    border-radius: 50% !important;
}

.text-nowrap {
    white-space: nowrap
}
.text-normal {
    white-space: normal !important
}
.text-right {
    text-align: end !important;
}

.current-color {
    color:currentColor;
}
.fs-3 {
    font-size: 16px
}
.fs-4 {
    font-size: 21px
}
.mw-auto {
    min-inline-size: auto !important;
}
.w-auto {
    inline-size: auto !important;
}
.w-10 {
    inline-size: 10% !important;
}
.w-25 {
    inline-size: 25% !important;
}
.w-50 {
    inline-size: 50% !important;
}
.w-100 {
    inline-size: 100% !important;
}
.h-100 {
    block-size:100%;
}
.position-relative {
position:relative;
}
.overflow-hidden {
overflow:hidden
}
.cursor-pointer {
cursor:pointer;
}
.rotate-45 {
    transform: rotate(45deg);
}
body .pull-right {
    float: inline-end !important
}
/*=========================
    col border
============================*/
.row-cols2-border > [class^="col-"][class*="-2"]:not(:nth-child(6n)) {
    border-inline-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols2-border > [class^="col-"][class*="-2"]:not(:nth-last-child(-n+6)) {
    border-block-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols3-border > [class^="col-"][class*="-3"]:not(:nth-child(4n)) {
    border-inline-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols3-border > [class^="col-"][class*="-3"]:not(:nth-last-child(-n+4)) {
    border-block-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols4-border > [class^="col-"][class*="-4"]:not(:nth-child(3n)) {
    border-inline-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols4-border > [class^="col-"][class*="-4"]:not(:nth-last-child(-n+3)) {
    border-block-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols6-border > [class^="col-"][class*="-6"]:not(:nth-child(2n)) {
    border-inline-end: 1px solid rgb(0 0 0 / 12%);
}
.row-cols6-border > [class^="col-"][class*="-6"]:not(:nth-last-child(-n+2)) {
    border-block-end: 1px solid rgb(0 0 0 / 12%);
}
/*=====================================================
    Color
=======================================================*/
.bg-transparent {
    background-color: transparent !important;
}

.text-success {
    color: #217245 !important
}

.text-danger {
    color: #dd4b39 !important
}
/*=====================================================
    001 Border
=======================================================*/
.BorderLeftStyle {
    border-inline-start: 1px solid #ccc;
}

/*===============================================================
    Grid
================================================================*/
.gutters-0 {
    margin-inline: 0;
}

    .gutters-0 > [class^=col-] {
        padding-inline: 0;
    }

.gutters-5 {
    margin-inline: -5px;
}

    .gutters-5 > [class^=col-] {
        padding-inline: 5px;
    }

.gutters-10 {
    margin-inline: -10px;
}

    .gutters-10 > [class^=col-] {
        padding-inline: 10px;
    }

/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Typography
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.font-family {
    font-family:var(--default-font-family) 
}

.font-bold {
    font-weight: bold !important;
}
.font-light {
    font-weight: 300 !important;
}
/*====================================
    Heading
=======================================*/
:is(.content-header,.content-header2) > h1 {
    font-size: 26px;
    font-weight: bold;
}

h1, h2, h3, h4, h6, p, span, a {
    font-family: var(--default-font-family);
}

h1, h2, h3, h4, h6 {
    color: var(--theme-darkColor);
    z-index: initial;
}

.h3, h3 {
    font-size: 22px !IMPORTANT;
    font-weight: bold !important;
    margin-block: 0px 15px !important;
    margin-inline: 0 !important;
    color: var(--theme-darkColor) !important;
}


.control-sidebar h3, .control-sidebar .h3, .control-sidebar h4, .control-sidebar .h4 {
    color: #b8c7ce !important;
}

.heading-seprator {
    position: relative;
    margin-block-end: 0;
    line-height: 1;
    text-align: center;
}

    .heading-seprator h3 {
        display: inline-block;
        background: #ffffff;
        padding-block:0;
        padding-inline:6px;
        position: relative;
        margin: 0 !important;
        z-index: 0;
        font-size: 20px !important;
        font-weight: 100 !important;
    }

    .heading-seprator:before {
        content: '';
        position: absolute;
       inline-size: 60%;
       block-size: 1px;
        background-color: rgb(226 229 232 / 65%);
        background-image: linear-gradient(to right,transparent,rgb(68 68 68),transparent);
        z-index: 0;
        /*inset-inline-start: 50%;
        inset-block-start: 50%;*/
        top:50%;
        left:50%;
        transform: translate(-50%,-50%) translateY(3px);
    }

.content-header h1 {
    position: relative;
}

.content-header .header-back:before {
    content: '\f060';
    font-family: FontAwesome;
    font-size: 20px;
    padding-inline-end: 7px;
    vertical-align: top;
    cursor: pointer;
    display: inline-block;
    line-height: 1.4;
}

.content-header2 .header-back:before {
    content: normal;
    padding-inline-end: 0px;
}

.detail-edit {
    vertical-align: middle;
    font-size: 19px;
    color: inherit;
    visibility: hidden;
}

.content-header h1:hover .detail-edit {
    visibility: visible;
    color: inherit;
}

.HeadingParentDetail {
    list-style: none;
    padding: 0;
    display: flex;
}
    .HeadingParentDetail li {
        margin-inline-start: 0.85rem;
    }
    .HeadingParentDetail li b{
        font-style: italic;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
        header
    \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
    /**Navbar toggle***/
    .btn-navbartoggle {
    display: none;
    position: absolute;
    inset-inline-end: 20px;
    inset-block-start: 12px;
   inline-size: 26px;
    z-index: 10;
}

.control-rightbar {
    position: relative;
    inset-inline-end: 0;
    inline-size: 20px;
    inset-block-start: 12px;
    z-index: 10;
    color: var(--theme-darkColor);
    font-size: 18px;
}
/********************/
.main-header .sidebar-toggle:before {
    font-family: 'FontAwesome';
}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a {
    color:var(--theme-darkColor);
}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li:last-child > a, .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li:last-child > a, .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li:last-child > a {
    border: 0;
}

.skin-blue .main-header .navbar .nav :is(> li > a:is(:hover,:active,:focus),.open > :is(a,a:hover,a:focus),> .active > a ) {
    background: #f5f7fa !important;
    color: var(--theme-darkColor);
}

.skin-blue .main-header .navbar {
    background-color: #f5f7fa;
    box-shadow: 0 6px 6px -3px rgba(39,44,51,.1), 0 10px 14px 1px rgba(39,44,51,.04), 0 4px 18px 3px rgba(39,44,51,.02);
}

    .skin-blue .main-header .navbar .nav > li > a {
        color: var(--theme-darkColor) !important;
        font-weight: 400;
        background: #f5f7fa !important;
    }

.dropdown-menu {
    border: none !important;
    border-radius: 7px !important;
    padding-block: 3px 10px !important;
    padding-inline:13px !important;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.175);
}

.navbar-nav li a .fa.fa-plus, .navbar-nav li a .fa.fa-power-off, .navbar-nav li a .fa.fa-search {
    font-size: 18px;
}

.navbar-nav .dropdown-menu {
    transition: transform 0.1s;
    transform-style: preserve-3d;
    perspective: 600px;
    transform-origin: top right;
    display: block;
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0px) scale(0);
}

.open > .dropdown-menu {
    display: block;
    transform: translate3d(0, 0, 0px) scale(1);
    transition: transform 0.3s;
}

.navbar-nav .dropdown-menu:before {
    inset-inline-end: 13px;
}

.dropdown-menu:before, .dropdown-menu-right:before {
    content: '';
   inline-size: 20px;
   block-size: 20px;
    background: white;
    position: absolute;
    inset-block-start: -8px;
    inset-inline-end: 12px;
    border-start-start-radius: 4px;
    border-start-end-radius: 0;
    border-end-start-radius: 0;
    border-end-end-radius: 0;
    transform: rotate(45deg) !important;
    border: 1px solid #e4e7ea;
    border-style: solid none none solid;
    z-index: -1;
}

.dropdown-menu-right:before {
    z-index: 2;
}
.dropdown .dropdown-menu {
    inset-inline: auto 0;
}
.dropdown:has(.fa-ellipsis-h) .btn {
    font-size: 26px;
    background-color: transparent;
    /* padding: 0rem 1rem !important;*/
    padding-block: 0rem !important;
    padding-inline:1rem !important;
    border-color: currentColor;
    line-height: 1.3;
    border-color: var(--theme-darkColor);
    color: var(--theme-darkColor);
}
    .dropdown:has(.fa-ellipsis-h) .btn:is(:hover,:focus,:active,:active:focus) {
        background-color: transparent !important;
        box-shadow:none;
    }
    .skin-blue .main-header .navbar .sidebar-toggle {
        color: var(--theme-darkColor);
    }

.skin-blue .main-header .navbar .nav > li > a.dropdown-toggle:after {
    content: '';
    background: url(../Images/arrow-downW.png) no-repeat right center;
    background-size: 18px;
    position: absolute;
   inline-size: 20px;
   block-size: 20px;
    transition: transform 0.3s;
}

.skin-blue .main-header .navbar .nav > li.tasks-menu > a.dropdown-toggle:after {
    background: none;
}

.skin-blue .main-header .navbar .nav > .dropdown.open > a.dropdown-toggle:after {
    transform: rotate(-180deg);
    transition: transform 0.3s;
}

.skin-blue .main-header .navbar .sidebar-toggle:hover {
    background-color: transparent;
    text-decoration: none;
    opacity: 0.8;
    color: #272c33;
}

.user-dropdown .dropdown-menu {
    min-inline-size: 302px;
    padding: 20px !important;
    min-inline-size: 330px;
}

.user-dropdown .img-circle {
    inline-size: 32px;
    block-size: 32px;
    object-fit: cover;
    box-shadow: 0px 2px 4px rgb(0 0 0 / 12%);
}

.user-dropdown .dropdown-menu .img-circle {
    inline-size: 45px;
    block-size: 45px;
    object-fit: cover;
    object-position: center;
    box-shadow: 0px 2px 4px rgb(0 0 0 / 12%);
}

.alloversearch-menu > .dropdown-menu {
    min-inline-size: 320px;
}

    .alloversearch-menu > .dropdown-menu .input-group {
        margin-block-start: 7px;
    }

.dropdown-menu-right {
    position: relative;
    /*box-shadow: 0 0 3px rgb(218 218 218);*/
    border-start-start-radius: 0;
    border-start-end-radius: 0;
    border-end-start-radius: 4px;
    border-end-end-radius: 4px;
    padding-block: 5px 10px;
    padding-inline: 10px;
    list-style: none;
}

    .dropdown-menu-right a, .dropdown-menu-right a:hover {
        color: #272c33;
        text-decoration: none;
    }

.dropdown-menu .slimScrollDiv, .dropdown-menu .slimScrollDiv .menu {
   block-size: auto !important
}

.alloversearch-menu .btn-default {
    background-color: var(--theme-darkColor);
    border-color: var(--theme-darkColor);
    color: #fff !important;
}

.HeaderCompanyName {
    margin: 0 auto;
    text-align: center;
    display: flex;
    justify-content: center;
    margin-block-start: -12px;
    font-size: 16px;
    font-weight: bold;
    color: var(--theme-darkColor);
    display: none;
    background-image: linear-gradient(to right, #222a45,var(--theme-darkColor),#fff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: none;
}

.navbar-nav > .user-menu > .dropdown-menu {
    min-inline-size: 280px;
    inline-size: auto;
}

.dropdown-menu > li > a > .glyphicon, .dropdown-menu > li > a > .fa, .dropdown-menu > li > a > .ion {
    margin-inline: auto 10px;
}

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 {
    margin-block: 0 0;
    margin-inline: 0 45px;
}

    .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 > small {
        inset-inline: auto 0;
    }

.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > p {
    margin-block: 0 0;
    margin-inline: 0 45px;
}

.navbar-nav > .user-menu .user-image {
    float: inline-start;
    margin-inline: auto 10px;
}
.navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
    inset-inline:auto 0;
    text-align:start;
}




.layout-top-nav .main-header .navbar {
    margin-inline: auto 0;
}

.main-header .sidebar-toggle {
    float: inline-start;
}
.main-header .navbar .nav > li.user > a > .fa, .main-header .navbar .nav > li.user > a > .glyphicon, .main-header .navbar .nav > li.user > a > .ion {
    margin-inline:auto 5px;
}
.main-header .navbar .nav > li > a > .label {
    inset-inline: auto 7px;
}
.main-header .logo {
    float: inline-end;
}
.content-header > .breadcrumb {
    float: inline-end;
    inset-inline:auto 10px;
}
    .content-header > .breadcrumb > li > a > :is(.fa,.glyphicon,.ion) {
        margin-inline-end: 5px;
    }
    .main-header .logo {
        float: inline-start;
        right: 0;
        inset-inline: 0 auto;
    }

.main-header .navbar {
    -webkit-transition: margin-inline-start .3s ease-in-out;
    -o-transition: margin-inline-start .3s ease-in-out;
    transition: margin-inline-start .3s ease-in-out;
    margin-left: initial;
    margin-right: 280px;
    margin-inline: 280px auto;
}

.navbar-custom-menu > .navbar-nav > li {
    float: inline-start;;
}

.dropdown-menu .slimScrollDiv .slimScrollBar {
    inset-inline:auto 1px !important;
}
.nav-tabs-custom > .nav-tabs > li {
    float: inline-start !important;
}
.main-header .navbar-custom-menu, .main-header .navbar-right {
    float: inline-end;
}
.totalreminder-menu  li a{
    position:relative;
    display:flex !important;
}
    .totalreminder-menu li a:before {
        content:"\f12a";
        font-family: 'FontAwesome';
        font-size: 17px;
        display: inline-block;
        margin-inline-end: 1rem;
        
    }
    .totalreminder-menu li a.UrgentSign:before {
        color: #dd4b39;
    }
    .totalreminder-menu li a.NormalSign:before {
        color: rgb(20 90 51);
    }
    .totalreminder-menu li a.InfoSign:before {
        color: #d8b147;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Main content
//////////////////////////////////////////*/
    .content-wrapper {
        background: #f5f7fa;
        min-block-size: auto !important;
        margin-block: -1px;
    }

.content {
    padding-block: 3px 15px;
    padding-inline:15px;
}
.layout-top-nav .content-wrapper, .layout-top-nav .right-side, .layout-top-nav .main-footer {
    margin-left: 0;
    margin-inline:0 auto;
}
.control-sidebar-bg, .control-sidebar {
    transition: inset-inline-end .3s ease-in-out
}
    .control-sidebar.control-sidebar-open, .control-sidebar.control-sidebar-open + .control-sidebar-bg {
        inset-inline:auto 0;
    }
.progress.xxs, .progress-xxs {
    height: 3px !IMPORTANT;
}
.progress.vertical {
    margin-inline: auto 10px;
}
.progress-group .progress-number {
    float: inline-end;
}


.user-panel > .info {
    inset-inline:55px auto;
}
    .user-panel > .info > a {
        padding-inline:auto 5px;
    }

        .user-panel > .info > a > .fa, .user-panel > .info > a > .ion, .user-panel > .info > a > .glyphicon {
            margin-inline: auto 3px;
        }


.sidebar-menu > li .label, .sidebar-menu > li .badge {
    margin-inline: auto 5px;
}
.sidebar-menu li > a > .fa-angle-left, .sidebar-menu li > a > .pull-right-container > .fa-angle-left {
    margin-inline: auto 10px;
}
.sidebar-menu li > a > .fa-angle-left {
    inset-inline:auto 10px;
}
.sidebar-menu .treeview-menu {
    padding-inline: 1rem 0.5rem;
    padding-block: 1.3rem 0.2rem;
}

    .sidebar-menu .treeview-menu .treeview-menu {
        padding-inline: auto 20px;
    }


.sidebar-menu li > a > .pull-right-container {
    inset-inline: auto 10px;
}

.control-sidebar-bg, .control-sidebar {
    inset-inline: auto -230px;
}

    /*.control-sidebar.control-sidebar-open, .control-sidebar.control-sidebar-open + .control-sidebar-bg {
        inset-inline: 0 auto;
    }
*/
.control-sidebar-open .control-sidebar-bg, .control-sidebar-open .control-sidebar {
    right: auto;
    left: 0;
    inset-inline:auto 0;
}



    /**/
.small-box {
    background-clip: border-box;
    border: 1px solid #dfe2e6;
    border-radius: .5rem;
    box-shadow: 0 3px 3px -2px rgba(39,44,51,.1), 0 3px 4px 0 rgba(39,44,51,.04), 0 1px 8px 0 rgba(39,44,51,.02);
    /*text-align: center;*/
    color: #272c33;
    display: block;
    background: #fff;
    margin-block-end: 13px;
}
    .small-box .icon {
        inset-inline:auto 10px;
    }

    .small-box .ion {
        color: rgb(39 44 51 / 31%);
        font-size: 29px;
        padding-block: 5px;
        padding-inline: 0;
    }

.features-grid {
    margin-block-start: 15px;
}

    .features-grid .small-box .ion, .featrued-icons {
        color: rgb(39 44 51 / 31%);
        font-size: 25px;
        padding: 5px 0;
        position: absolute;
        inset-inline-end: 0;
        inset-block-start: 0;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding-block-start: 17px;
        background: #fff;
        color: var(--theme-darkbg);
        border-start-start-radius: 4px;
        border-start-end-radius: 4px;
        border-end-start-radius: 0;
        border-end-end-radius: 0;
    }

        .featrued-icons .fa-stack-2x {
            font-size: 1em;
        }

        .featrued-icons .fa-stack-1x {
            line-height: inherit;
            font-size: 0.6em;
           inset-block-start: 7px;
           inset-inline-start: 10px;
        }

            .featrued-icons .fa-stack-1x.fa-usd, .featrued-icons .fa-stack-1x.fa-shopping-cart {
               inset-inline-start: 0;
            }
/*-----------Today Transactions-------------*/
.today-trasactions {
    display:flex;
    align-items:center
}
    .today-trasactions h3 {
        /*border-inline-end: 1px solid var(--theme-leftbar-links);*/
        padding-inline-end: 2rem;
    }
    .today-trasactions .transactions-links {
        list-style: none;
        flex: 1;
        margin: 0;
        padding: 0;
        display: flex;
        column-gap: 3rem;
        text-align: center;
    }
        .today-trasactions .transactions-links > li {
            position: relative;
            padding: 0.6rem 1rem;
            flex: 1;
            background-color: #fff;
            border-radius: 0.5rem;
            line-height: 1.1;
            border: 1px solid var(--theme-darkColor);
            cursor: pointer;
        }
            .today-trasactions .transactions-links > li .fa {
                font-size: 17px;
                color: var(--theme-darkColor);
            }
            .today-trasactions .transactions-links > li span {
                font-size: 16px;
                display: block;
                color: var(--theme-darkColor);
            }
            .today-trasactions .transactions-links > li:is(.active,:hover) {
                /*border-block: 1px solid var(--theme-darkColor);*/
                box-shadow: 4px 6px 4px 1px rgba(var(--theme-darkColor-rgb), 0.1);
                transition: all 0.3s;
            }
                .today-trasactions .transactions-links > li:is(.active,:hover):before {
                    content: '';
                    position: absolute;
                    inset-block: -4.5px;
                    inset-inline-start: 50%;
                    margin-inline-start: -4.5px;
                    border: 5px solid transparent;
                    border-block-start: 7px solid var(--theme-darkColor);
                }
.transactions-links > li .dropup-menu {
    position: absolute;
    background-color: #fff;
    min-width: 250px;
    min-height: 90px;
    padding: 15px;
    border-radius: 0.9rem;
    box-shadow: 5px 5px 7px 4px rgba(0, 0, 0, 0.2);
    z-index: 3;
    bottom: calc(100% + 5px);
    inset-inline-start: 50%;
    text-align: initial;
    transform: translateX(-50%) scaleY(0);
    transition: transform 0.3s;
    transform-origin: bottom;
}
.transactions-links > li:last-child .dropup-menu {
    inset-inline: auto 0;
    transform: translateX(0) scaleY(0);
}
    .transactions-links > li .toggle-dropup-menu {
    transform: translateX(-50%) scaleY(1);
    transition: transform 0.3s;
}
.transactions-links > li:last-child .toggle-dropup-menu {
    transform: translateX(0) scaleY(1);
    transition: transform 0.3s;
}
/*-----------------------------------------*/
.nav-tabs.control-sidebar-tabs > li:first-of-type > a, .nav-tabs.control-sidebar-tabs > li:first-of-type > a:hover, .nav-tabs.control-sidebar-tabs > li:first-of-type > a:focus {
    border-inline-start-width: 0;
}

.nav-tabs.control-sidebar-tabs > li > a, .nav-tabs.control-sidebar-tabs > li > a:hover {
    border-inline-start: 1px solid transparent;
}

.control-sidebar-menu .menu-icon {
    float: inline-start;
}

.control-sidebar-menu .menu-info {
    margin-inline: 45px auto
}


.control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a, .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:hover, .control-sidebar-dark .nav-tabs.control-sidebar-tabs > li > a:focus {
    border-inline-start-color: #141a1d
}


.control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a, .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:hover, .control-sidebar-light .nav-tabs.control-sidebar-tabs > li > a:focus {
  
    border-inline-start-color: #d2d6de
}


.control-sidebar-light .control-sidebar-menu {
    margin-inline: -14px auto;
}



/**/
.debitcredit .fa-usd {
   inset-inline-start: -2px;
   inset-block-start: -6px;
    font-size: 0.5em;
}

.small-box h3 {
    font-weight: initial !IMPORTANT;
    font-size: 28px !important;
}

.small-box p {
    font-size: 15px;
    font-weight: 500;
    color: #37465a;
}

.features-grid .small-box h3 {
    font-weight: lighter !IMPORTANT;
    font-size: 19px !important;
    margin-block-end: 0 !IMPORTANT;
}

.features-grid .small-box p {
    font-size: 15px;
    color: #37465a;
    margin-block-end: 0;
    font-weight: normal;
}

.box {
    background-clip: border-box;
    border: 1px solid #dfe2e6;
    border-radius: .5rem;
    box-shadow: 0 3px 3px -2px rgba(39,44,51,.1), 0 3px 4px 0 rgba(39,44,51,.04), 0 1px 8px 0 rgba(39,44,51,.02);
    color: #272c33;
    padding-block: 25px 15px;
    padding-inline: 0;
    /* padding: 15px 0 15px;*/
}

    .box:only-child {
        margin-block-end: 10px;
        /*padding: 15px 0 15px;*/
        padding-block: 15px;
        padding-inline:0;
    }

    .box .border-right {
        border-inline-end: 1px solid #f4f4f4
    }

    .box .border-left {
        border-inline-start: 1px solid #f4f4f4
    }

    .box > .overlay, .overlay-wrapper > .overlay, .box > .loading-img, .overlay-wrapper > .loading-img {
        inset-inline:0 auto;
    }


    .box .overlay > .fa, .overlay-wrapper .overlay > .fa {
        inset-inline: 50% auto;
        margin-inline: -15px auto;
    }



.box-header > .fa, .box-header > .glyphicon, .box-header > .ion {
    margin-inline: auto 5px;
}

.box-header > .box-tools {
    inset-inline: auto 10px;
}

    .box-header > .box-tools.pull-right .dropdown-menu {
        inset-inline: auto 0;
    }


.todo-list > li {
    border-inline-start: 2px solid #e6e7e8
}

    .todo-list > li:last-of-type {
        margin-bottom: 0
    }

    .todo-list > li > input[type='checkbox'] {
        margin-block:0;
        margin-inline:10px 5px;
    }

    .todo-list > li .label {
        margin-inline:10px auto;
    }

    .todo-list > li .tools {
        float: inline-end;
    }

        .todo-list > li .tools > .fa, .todo-list > li .tools > .glyphicon, .todo-list > li .tools > .ion {
            margin-inline: auto 5px;
        }


.todo-list .danger {
    border-inline-start-color: #dd4b39
}

.todo-list .warning {
    border-inline-start-color: #f39c12
}

.todo-list .info {
    border-inline-start-color: #00c0ef
}

.todo-list .success {
    border-inline-start-color: #00a65a
}

.todo-list .primary {
    border-inline-start-color: #3c8dbc
}

.chat {
    padding-block: 5px 5px;
    padding-inline: 20px 10px;
}

.info-box-icon {
    border-start-start-radius: 2px;
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-end-start-radius: 2px;
    float: inline-start;
}


.info-box-content {
    margin-inline: 90px auto
}


.timeline:before {
    inset-inline:31px auto;
}

.timeline > li {
    margin-inline:auto 10px;
}


.btn.btn-file > input[type='file'] {
    text-align: end;
}

.nav-pills > li > a > .fa, .nav-pills > li > a > .glyphicon, .nav-pills > li > a > .ion {
    margin-inline: auto 5px;
}

.nav-stacked > li > a {
    border-inline-start: 3px solid transparent;
}

.nav-stacked > li.active > a, .nav-stacked > li.active > a:hover {
    border-inline-start-color: #3c8dbc
}

.nav-tabs-custom > .nav-tabs > li {
    margin-inline:auto 5px;
}


    .nav-tabs-custom > .nav-tabs > li:first-of-type {
        margin-inline:0  auto;
    }

        .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
            border-inline-start-color: transparent
        }


.nav-tabs-custom > .nav-tabs.pull-right > li {
    float: inline-end
}

    .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type {
     
        margin-inline:auto 0;
    }

        .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type > a {
          
            border-inline-start-width:1px;
        }

        .nav-tabs-custom > .nav-tabs.pull-right > li:first-of-type.active > a {
           
            border-inline-start-color: #f4f4f4;
        }


.nav-tabs-custom > .nav-tabs > li.header > .fa, .nav-tabs-custom > .nav-tabs > li.header > .glyphicon, .nav-tabs-custom > .nav-tabs > li.header > .ion {
 
    margin-inline:auto 5px;
}
.products-list .product-img {
    float: inline-start
}

.products-list .product-info {
    margin-inline:60px auto;
}
.table.align th {
    text-align: end
}

.table.align td {
    text-align: end
}

.right .direct-chat-img {
    float: inline-end
}

.contacts-list-img {
    float: inline-start;
}

.contacts-list-info {
    margin-inline: 45px auto
}

.direct-chat-danger .right > .direct-chat-text:after, .direct-chat-danger .right > .direct-chat-text:before {
    border-inline-start-color: #dd4b39
}

.users-list > li {
    float: inline-end;
}

.mailbox-attachments li {
    float: inline-end;
    margin-inline:auto 10px;
}

.error-page > .headline {
    float: inline-start;
}

.error-page > .error-content {
    margin-inline: 190px auto;
}
#MessageBox {
    inset-inline:auto 1%;
}
    /**/
section .content .fa {
    color: #222a45;
}

section.content .featrued-icons .fa {
    color: var(--theme-darkColor) !important;
}

.content-header {
    position: relative;
    /*  min-block-size: 48px;*/
    /*padding: 0px 15px 0 15px;*/
}

    .content-header:after {
        content: '';
        display: block;
        clear: both
    }

    .content-header > .breadcrumb > li > a {
        color: var(--theme-darkColor);
        font-size: 14px;
    }

    .content-header > .breadcrumb > li + li:before {
        content: '\f105';
        font-family: FontAwesome;
        color: var(--theme-darkColor);
    }

.box-body {
    /*padding: 10px 25px;*/
    padding-block: 10px;
    padding-inline: 25px;
}

.sterick:after {
    content: '*';
    display: inline-block;
    color: #CC0000;
   margin-inline-start: 2px;
}

.tree {
    position: relative;
}
    .tree ul {
        margin-inline:1em auto;
    }
    .tree:before {
        content: "";
        display: block;
        inline-size: 0;
        position: absolute;
        inset-block: 0;
        inset-inline-start: 0px !important;
        border-inline-start: 1px dotted !important;
        border-inline-end:0;
    }
    .tree li {
        color: var(--theme-darkColor) !important;
        font-weight: normal !important
    }
    .tree li a {
        margin-inline-start: 0 !important;
        color: #313956 !important;
    }
        .tree li i.text-info {
            color: currentColor;
            font-weight: bold;
        }

ul > li.branch:before {
    content: "";
    display: block;
    inline-size: 1em;
    block-size: 0;
    border-block-start: 1px dotted;
    margin-block-start: -1px;
    position: absolute;
    inset-block-start: 1em;
    inset-inline-start: 0;
}
.tree:before, .tree ul:before {
    inset-inline-start: -1px !important;
}
.tree ul:before {
    border-inline-start: 1px dotted !important;
    border-inline-end: 0 !important;
}

.tree ul li:before {
    border-block-start: 1px dotted !important;
    inset-inline-start: 0 !important;
}
.tree ul li:last-child:before {
    background-color: inherit;
}
.tree-link-icon .tree ul:before {
    inset-inline-start: -7px;
}
.tree-link-icon .tree ul li:before {
   inset-block-start: 1.1em;
    inset-inline-start: -6px;
   inline-size: 20px;
}
.tree-link-icon .link-icon {
    border: 1px solid currentColor;
    position: relative;
    margin-inline-end: 7px;
    padding-inline: 4px;
}
    .tree-link-icon .link-icon:after {
        content: '';
        position: absolute;
        inline-size: 11px;
        block-size: 1.6px;
        inset-inline-end: -12px;
        inset-block-start: 6px;
        background-color: currentColor;
    }
.tree-link-icon .indicator {
    margin-inline-end: 5px;
}
.branch .glyphicon-folder-open {
    /*color: #00a65a;*/
    color: currentColor;
}
.tree .indicator {
    margin-inline: 0 5px !important;
}
.indicator.glyphicon-folder-close, .indicator.glyphicon-folder-open {
    font: normal normal normal 20px / 1 FontAwesome !important;
}
.indicator.glyphicon-folder-close:before {
    content: "\f114";
}
    .indicator.glyphicon-folder-open:before {
        content: "\f115";
    }
li.branch > i.fa {
    border: 1px solid;
   inline-size: 18px;
   block-size: 16px;
    text-align: center;
    font-size: 11.3px;
    line-height: 1.3;
    border-radius: 1.7px;
}

.tree-code, .btn-addtreecode {
    color: var(--theme-darkColor);
}

.nav-tabs-custom {
    background: transparent;
    box-shadow: none;
}

    .nav-tabs-custom > .nav-tabs > li > a {
        color: #444;
        border-start-start-radius: 6px;
        border-start-end-radius: 6px;
        border-end-start-radius: 0;
        border-end-end-radius: 0;
    }

    .nav-tabs-custom > .nav-tabs > li.active {
        border-block-start-color: transparent;
    }

.nav-tabs:not(.control-sidebar-tabs) > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs:not(.control-sidebar-tabs) > li.active > a:hover {
    border: 1px solid #ddd !important;
    border-block-end-color: transparent !IMPORTANT;
}

.nav-tabs-custom > .tab-content {
    border: 1px solid #dfe2e6;
    border-start-start-radius: 0;
    border-start-end-radius: 0;
    border-end-start-radius:.5rem;
    border-end-end-radius: 0.5rem;
    box-shadow: 0 3px 3px -2px rgba(39,44,51,.1), 0 3px 4px 0 rgba(39,44,51,.04), 0 1px 8px 0 rgba(39,44,51,.02);
}

.features-grid .col-lg-2 {
   inline-size: 12.3333%;
}

.modal-title {
    font-size: 16px !important;
    font-weight: bold !important;
}
.modal-footer {
    text-align: end !important;
}
.modal-header, .modal-body, .modal-footer {
    padding: 25px !important;
    border: none !important;
}

.main-footer, .main-footer1 {
    color: var(--theme-darkColor);
    position: relative !important;
}
.content-wrapper, .right-side, .main-footer, .main-header .navbar {
    margin-inline: 280px auto;
}

.main-sidebar, .left-side, .main-header .logo {
   inline-size: 280px;
}
.label-danger {
    border: 1px solid #dd4b39 !important;
    background-color: #fff !IMPORTANT;
    color: #dd4b39 !important;
}
.label-success {
    border: 1px solid #00a65a !important;
    background-color: #fff !IMPORTANT;
    color: #00a65a !important;
}
iframe {
    border: 0;
}

.widget-user-2 .widget-user-username, .widget-user-2 .widget-user-desc {
   margin-inline-start: 0;
}

.box-profile .list-group .list-group-item {
    padding-block: 4px;
    padding-inline: 15px;
    border: 0;
}

.widget-user-2 .widget-user-header {
    color: #404852 !important;
    background-color: #fff !important;
}

section.content .input-group-addon .fa {
    color: var(--theme-darkColor);
}

.label-ellipsis {
    cursor: pointer;
    display: inline-block;
    padding: 5px;
    float: inline-end;
}

    .label-ellipsis .fa {
        font-size: 20px;
        margin-block: 0;
        margin-inline: 0 6px;
        vertical-align: middle;
    }

.statement-imgs {
    display: inline-block;
}

    .statement-imgs img {
        object-fit: contain;
       inline-size: 40px;
       block-size: 30px;
        cursor: pointer;
    }

.BreakevenRateManageAll [class^=col-md-] .form-group {
    margin-block-end: 8px;
}

    .BreakevenRateManageAll [class^=col-md-] .form-group label {
        margin-block-end: 0px;
    }

    .BreakevenRateManageAll [class^=col-md-] .form-group .form-control {
       block-size: 33px;
    }

.BreakevenRateManageAllbox {
    /*box-shadow: 1px 1px 1px rgb(0 0 0 / 12%);*/
   padding-block: .5rem !important;
    border-block-end: 1px solid rgb(0 0 0 / 12%);
    border-inline-end: 1px solid rgb(0 0 0 / 12%);
}
    .BreakevenRateManageAllbox:nth-child(3n) {
        border-inline-end: none;
    }
.icheckbox_minimal, .iradio_minimal {
    margin-inline: 0.6rem !important;
    vertical-align: sub;
}

    .icheckbox_minimal:first-child, .iradio_minimal:first-child {
        margin-inline-start: 0 !important;
    }
.icheck > label {
    padding-inline-start:0;
}

:is(#divSearchFilter, #searchedIncomeCriteria) [class^=col-md-] .fa:has(~b) {
    margin-inline-end: 0.4rem
}
#searchCriteriaRow, #searchIncomeCriteriaRow {
    box-shadow: 0px 2px 3px 2px rgb(52 57 86 / 14%);
    background-color: #f6f7fa;
    padding-block: 0.3rem;
    margin-block-start: 1rem;
}
:is(#searchCriteriaRow, #searchIncomeCriteriaRow) > [class^=col-md-] {
    border-block-end: 1px solid #d2d6de;
}
/*:is(#searchCriteriaRow,#searchIncomeCriteriaRow) > [class^=col-md-]:nth-child(odd):not(:last-child) {
    border-inline-end: 1px solid #d2d6de;
}*/
#btnGeneralStatementSearch {
    position: absolute;
    inset-block-start: -1rem;
    inset-inline-end: 0.4rem;
    padding-block: 4px !important;
    padding-inline: 10px !important;
}
.btn-paneltogglefa {
    margin-inline-end: 2.6rem;
    font-size: 40px;
    color: currentColor;
    cursor: pointer;
    vertical-align: middle;
}

.btn.btn-paneltoggle {
    margin-inline-end: 0.6rem;
    color: currentColor;
    cursor: pointer;
    vertical-align: middle;
    font-size: 16px;
    background-color: transparent;
    border: 1px solid;
}
.btn .btn-paneltoggle {
    font-size: 18px;
}
    .btn.btn-paneltoggle:hover .fa, .btn-paneltogglefa:hover {
        animation: moveupdown 2s infinite alternate;
    }
@keyframes moveupdown {
    from {
        transform: translateY(0)
    }

    to {
        transform: translateY(20px)
    }
}

.clipboard-message {
    max-width: 500px;
   inline-size: 500px;
    margin-inline: auto;
    background-color: #fff;
    position: fixed;
    inset-block-end: 30px;
    inset-inline: 0;
    border: 1px solid #dfe2e6;
    border-radius: 0.5rem;
    box-shadow: 0 3px 3px -2px rgba(39,44,51,.1), 0 3px 4px 0 rgba(39,44,51,.04), 0 1px 8px 0 rgba(39,44,51,.02);
    z-index: 2;
    transition: all 0.3s;
    transform: translateY(165%);
}

.showClipboardMessage {
    transform: translateY(0);
    transition: all 0.3s;
}

.NewMessageAlert {
    min-block-size: 97px;
   block-size: 22vh;
    overflow: hidden;
    inset-inline: 56vw 1vw !important;
    border: 1.9px solid var(--theme-darkbg);
    margin-inline: auto;
    background-color: #fff;
    position: fixed;
    inset-block-end: 30px;
    inset-inline: 0;
    border-radius: 0.5rem;
    padding: 0;
    padding-block-end: 15px !IMPORTANT;
    box-shadow: 0 3px 3px -2px rgba(39, 44, 51, .1), 0 3px 4px 0 rgba(39, 44, 51, .04), 0 1px 8px 0 rgba(39, 44, 51, .02);
    transition: all 0.3s;
   inset-block-start: 100%;
    z-index: 860;
}
    .NewMessageAlert > :is(h4,p) {
        padding-inline: 15px
    }

    .NewMessageAlert > :is(p) {
        overflow-y: auto;
        min-block-size: 14vh;
        max-height: 112px;
    }

    .NewMessageAlert :is(h4) {
        /*background-color: #f3f3f3;*/
        padding-block: 0.9rem;
        border-radius: 4.2px 4.2px 0 0;
    }
.NewMessageAlertToggle {
   inset-block-start: 13%;
    transform: translateY(-22%);
    transition: all 0.3s;
}
.NewMessageAlert .close {
    margin-block-start: 0.3rem;
    margin-inline-end: 1rem;
    font-size: 25px;
}
#tblMajorList :is(.spanlablGroupHeader,.spanlablGroupAmount) {
    text-transform: uppercase;
    color: currentColor;
}

#tblMajorList tbody tr:has(.spanlablGroupHeader,.spanlablGroupHeader) {
    background: rgba(var(--theme-darkColor-rgb), 0.1);
}
#tblMajorList tbody tr:has(.spanlablGroupHeaderCalculated,.spanlablGroupAmountCalculated) td {
    background: rgba(var(--theme-darkColor-rgb) , 0.35);
}
#toTop {
    padding: 5px;
    color: #000;
    font-size: 2.5rem;
    cursor:pointer;
    position: fixed;
    inset-block-end: 4.2rem;
    inset-inline-end: 5px;
    display: none;
}
.attach-fileupload .form-control {
    border-start-start-radius: 0;
    border-start-end-radius: 20px;
    border-end-end-radius: 20px;
    border-end-start-radius: 0px;
    line-height: 1.8;
   block-size: 42px;
}
.btn-compressdiv {
    /* position: sticky;*/
    cursor: pointer;
    margin-inline-start: 0.5rem;
    z-index: 5;
    display: none;
}
    .btn-compressdiv .fa-compress {
        transform: rotate(140deg);
        font-size: 24px;
    }
.detail-box .row{
    display:flex;
    flex-wrap:wrap;
}
.scrollh-arrows {
    z-index: 5;
    inset-inline-start: 50%;
    margin-inline-start: -35px;
    font-size: 0;
    color: currentColor;
   block-size: 40px;
   inline-size: 70px;
    overflow: hidden;
    display: none;
}
:is(.scrollh-arrows,.scroll-start,.scroll-end)::selection {
    background: transparent;
}
.scrollh-arrows :is(.scroll-start,.scroll-end) {
    cursor: pointer;
    opacity: 0.4;
    display: inline-block;
    font-size: 90px !IMPORTANT;
    line-height: 0.3;
   inline-size: 50%;
   block-size: 100%;
    text-align: center;
}
        .scrollh-arrows :is(.scroll-start,.scroll-end):hover {
            opacity: 1
        }

.content-wrapper-shortkeys, .content-wrapper-quickReminder {
    position: fixed;
    inset-block: 53px 50px;
    inset-inline: 280px 0;
    background: rgb(255 255 255 / 15%);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    z-index: 20;
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform 0.3s,inset-inline 0.3s ease-in-out;
}

.sidebar-collapse .content-wrapper-shortkeys {
    inset-inline: 50px 0;
    inset-block: 50px 48px;
}

.sidebar-collapse .content-wrapper-quickReminder {
    inset-inline: 50px 0;
    inset-block: 50px 48px;
}

.toggleShortKeys,.toggleQuickReminder {
    transform: scaleY(1);
    transform-origin: top;
    transition: transform 0.3s,inset-inline 0.3s ease-in-out;
}

.content-wrapper-shortkeys :is(.content,.box,.box-body) {
    block-size: 95%;
}

.content-wrapper-quickReminder :is(.content,.box,.box-body) {
    block-size: 95%;
}

.content-wrapper-shortkeys .content .table-responsive {
    max-block-size: 98%;
    /*overflow-y:auto;*/
}

.content-wrapper-quickReminder .content .table-responsive {
    max-block-size: 98%;
    /*overflow-y:auto;*/
}

.content-wrapper-shortkeys .table thead tr th {
    text-align: center !important
}

.content-wrapper-quickReminder .table thead tr th {
    text-align: center !important
}

.content-wrapper-shortkeys .table tbody tr td:first-child {
    text-align: start !important
}

.content-wrapper-quickReminder .table tbody tr td:first-child {
    text-align: start !important
}

.trborder-block-start {
    border-block-start: 1.2px solid #c7254e;
}

.trborder-block-end {
    border-block-end: 1.2px solid #c7254e;
}
.trborder-inline {
    border-inline: 1.2px solid #c7254e;
}
body:has(.content-wrapper-shortkeys.toggleShortKeys.content-wrapper-quickReminder.toggleQuickReminder) :is(.main-header, .main-sidebar ) {
    pointer-events: none;
    opacity: 0.8
}
/*==================================
    Status Steps
=================================*/
.status-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 111px;
    max-width: 1000px;
    margin: 0 auto;
}

.status-steps li {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: inherit;
    align-self: stretch;
    text-align: center;
}

    .status-steps li:after {
        content: '';
        position: absolute;
        inline-size: 100%;
        background-color: var(--theme-lightbg);
        block-size: 1.6px;
        inset-block-start: 77px;
    }

    .status-steps li:last-child:after {
        inline-size: 50%;
    }

    .status-steps li:first-child:after {
        inline-size: 50%;
        inset-inline-start: 50%;
    }

    .status-steps li:first-child:last-child:after {
        content: normal;
    }


    .status-steps .process-img {
        position: absolute;
        top: 10px;
        width: 35px;
        height: 35px;
        font-size: 20px;
        line-height: 1;
        text-align: center;
        object-fit: contain;
        border: 2px solid var(--theme-lightbg);
        box-shadow: 0px 0px 0 2px #ffffff, 0 0 0 4px var(--theme-lightbg);
        padding: 5px;
        display: block;
        margin: 0 auto;
        background-color: #fff;
        background-image: linear-gradient(-45deg, #fff 50%, #f5f7fa 50%);
        inset-inline-start: 50%;
        transform: translateX(-50%);
    }

    .status-steps .process-name {
        z-index: 2;
        position: absolute;
        bottom: 10px;
        left: 50%;
        transform: translateX(-50%);
        border: 2px solid var(--theme-lightbg);
        padding: 3px 10px;
        font-size: 12px;
        background-color: #fff;
        min-width: 100px;
        white-space: nowrap;
        font-weight: 600;
        line-height: 1.2;
        cursor: pointer;
    }

        .status-steps .process-name i {
            font-weight: 400;
        }

        .status-steps .process-name:hover {
            background-color: var(--theme-lightbg);
            box-shadow: inset 0 0 0 2px #ffffff;
            color: #fff;
        }

.status-steps li:last-child .process-name {
    background-color: var(--theme-lightbg);
    color: #fff;
    box-shadow: inset 0 0 0 2px #ffffff;
}

.status-steps span.process-name:after {
    content: '';
    position: absolute;
    inline-size: 14px;
    block-size: 14px;
    border-inline-start: 1px solid var(--theme-lightbg);
    inset-inline-start: 50%;
    inset-block-start: -16px;
    margin-inline-start: 6px;
    transform: translateX(-50%);
}
/*==================================
    Status Steps vertical
=================================*/

.status-steps-v {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-inline: 0.8rem;
    padding-block: 0.2rem 0.7rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    row-gap: 16px;
    height: 59vh;
    position: relative;
    overflow-y: auto;
}
    .status-steps-v:after {
        content: '';
        position: absolute;
        background-color: var(--theme-darkColor);
        inline-size: 1.6px;
        inset-block: 0;
        inset-inline-start: 23px;
    }
    .status-steps-v li {
        position: relative;
        display: flex;
        text-align: center;
        column-gap: 22px;
        align-items: center;
    }

        .status-steps-v li:after {
            content: '';
            position: absolute;
            inline-size: 73%;
            background-color: var(--theme-darkColor);
            block-size: 1.6px;
        }

        .status-steps-v li:last-child:after {
            inline-size: 50%;
        }


        .status-steps-v li:first-child:last-child:after {
            content: normal;
        }


    .status-steps-v .process-img {
        width: 35px;
        height: 35px;
        position: relative;
        font-size: 20px;
        z-index: 2;
        line-height: 1;
        text-align: center;
        object-fit: contain;
        border: 2px solid var(--theme-darkColor);
        box-shadow: 0px 0px 0 2px #ffffff, 0 0 0 4px var(--theme-darkColor);
        padding: 5px;
        display: block;
        background-color: #fff;
        background-image: linear-gradient(-45deg, #fff 50%, #f5f7fa 50%);
    }

    .status-steps-v .process-name {
        z-index: 2;
        border: 2px solid var(--theme-darkColor);
        padding: 3px 10px;
        font-size: 12px;
        background-color: #fff;
        min-width: 100px;
        height: 39px;
        white-space: nowrap;
        font-weight: 600;
        line-height: 1.2;
        cursor: pointer;
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

        .status-steps-v .process-name i {
            font-weight: 400;
        }

        .status-steps-v .process-name:hover {
            background-color: var(--theme-darkColor);
            box-shadow: inset 0 0 0 2px #ffffff;
            color: #fff;
        }

    .status-steps-v li .active-step-v {
        background-color: var(--theme-darkColor);
        color: #fff;
        box-shadow: inset 0 0 0 2px #ffffff;
    }
   
/*-----------------------
    Timeline Steps
----------------------*/
#stepsTimeline {
    height: 74vh;
    overflow-y: auto;
}

    #stepsTimeline .wrapper {
        font-weight: 300;
        color: #fff;
        position: relative;
    }

    #stepsTimeline section {
        height: 74vh;
        font-size: 18px;
        padding-inline: 220px 35px;
        padding-block-start: 5rem;
        background-color: #22A7F0;
    }

        #stepsTimeline section h2 {
            margin-block-start: 0;
            font-weight: 600 !important;
        }

        #stepsTimeline section:nth-child(1) {
            background: white;
        }

        #stepsTimeline section:nth-child(2) {
            background: #F64747;
        }

        #stepsTimeline section:nth-child(3) {
            background: #22A7F0;
        }

        #stepsTimeline section:nth-child(4) {
            background: #F9690E;
        }

        #stepsTimeline section:nth-child(5) {
            background: #9B59B6;
        }

        #stepsTimeline section:nth-child(6) {
            background: #03C9A9;
        }

        #stepsTimeline section:nth-child(7) {
            background: #ffcc00;
        }

    #stepsTimeline .nav__wrapper {
        position: fixed;
        padding-inline: 30px;
        display: flex;
        flex-flow: column nowrap;
        justify-content: flex-end;
        top: auto;
    }

    #stepsTimeline .nav {
        /*margin: 0 0 50px 30px;*/
        margin-block: 0 50px;
        margin-inline: 30px 0;
    }

    #stepsTimeline .nav__counter {
        font-size: 24px;
        transition: all 0.15s ease-out;
    }

    #stepsTimeline .nav__title {
        font-size: 32px;
        font-weight: 300;
        margin: 0 0 0.25em;
        height: 0;
        overflow: hidden;
        opacity: 0;
        transition: height 0.3s ease-out, opacity 0.2s ease-out;
    }

    #stepsTimeline .nav__body {
        font-weight: 100;
        font-size: 18px;
        font-size: 18px;
        /* width: 300px;*/
        height: 0;
        overflow: hidden;
        opacity: 0;
        transition: height 0.3s ease-out, opacity 0.2s ease-out;
    }

    #stepsTimeline .nav li {
        position: relative;
        transition: all 0.3s ease-out;
        margin-bottom: 0;
    }

        #stepsTimeline .nav li:after {
            content: "";
            display: block;
            border-inline-start: 2px solid white;
            border-block-start: 2px solid white;
            /*height: 250px;*/
            height: calc(100% + 10px);
            width: 20px;
            position: absolute;
            inset-inline-start: -30px;
            inset-block-start: 15px;
        }

        #stepsTimeline .nav li a {
            display: block;
            padding: 0;
            color: #fff;
            transition: all 0.15s ease-out;
        }

            #stepsTimeline .nav li a:hover {
                background-color: transparent;
                padding-inline-start: 1em;
            }

            #stepsTimeline .nav li a:focus {
                background-color: transparent;
            }

        #stepsTimeline .nav li.active {
            pointer-events: none;
            padding-inline-start: 1em;
        }

            #stepsTimeline .nav li.active:after {
                width: 35px;
                /*height: 400px;*/
                height: calc(100% + 10px);
                top: 35px;
            }

            #stepsTimeline .nav li.active .nav__counter {
                font-size: 44px;
                line-height: 1.4;
            }

            #stepsTimeline .nav li.active .nav__title {
                height: 23px;
                margin-block: 0px 8px !important;
                opacity: 1;
                overflow: visible;
            }

            #stepsTimeline .nav li.active .nav__body {
                height: auto;
                opacity: 1;
                overflow: visible;
                line-height: 1.2;
            }
/*----------Track Detail view-------*/
.trackbox {
    margin-block-end: 3rem;
}
    .trackbox h2 {
        position: relative;
        display: inline-block;
        border: 1px solid var(--theme-darkColor);
        border-radius: 30px;
        margin: 0;
        padding: 4px;
        margin-block-end: -1px;
    }
        .trackbox h2 .heading {
            background-color: var(--theme-darkColor);
            border-radius: 30px;
            display: inline-block;
            padding: 14px 20px;
            height: 43px;
            min-width: 174px;
            font-size: 16px;
            color: #fff;
            position: relative;
            z-index: 2;
        }
    .trackbox .layer1 {
        position: absolute;
        width: 24px;
        height: 25px;
        background-color: #fff;
        inset-block-start: 26px;
        inset-inline-end: -2px;
        z-index: 0;
    }

.trackbox span.layer1:before {
    content: '';
    position: absolute;
    width: 7px;
    height: 7px;
    background-color: var(--theme-darkColor);
    inset-inline-end: -1px;
    inset-block-start: 0;
    border-radius: 50%;
}
.trackbox .detail {
    position: relative;
    border: 1px solid var(--theme-darkColor);
    border-radius: 3.5rem;
    padding: 2.5rem 2.3rem;
    min-height: 100px;
    position: relative;
}
    .trackbox .layer2 {
        position: absolute;
        width: 29px;
        height: 29px;
        background-color: #fff;
        inset-block-start: 0;
        inset-inline-start: 0;
        z-index: 0;
    }
        .trackbox .layer2:before {
            content: '';
            position: absolute;
            width: 7px;
            height: 7px;
            background-color: var(--theme-darkColor);
            inset-inline-start: -2.6px;
            inset-block-end: 0;
            border-radius: 50%;
        }    
/*=======================
    Calculator
========================*/
.calc {
    background-color: #ededed;
    margin: 0px auto;
    inline-size: 27.9vw;
    block-size: auto;
    padding: 1.5vw;
    border-radius: 0.8rem;
    box-shadow: 2px 2px 14px 6px rgb(128 128 128 / 25%);
    position: fixed;
    inset-block-start: 60px;
    z-index: 1050;
    inset-inline-start: 296px;
    transition: transform .3s ease-in-out, width .3s ease-in-out,left .3s,right .3s;
    display: none;
    /*cursor: move;*/
}

.sidebar-mini.sidebar-collapse .calc {
    inset-block-start: 60px;
    inset-inline-start: 63px;
    transition: transform .3s ease-in-out, width .3s ease-in-out,left .3s,right .3s;
}

.calc button {
    background-color: #d6d6d6;
    position: relative;
    font-size: 1.5vw;
    border: none;
   block-size: 3.25vw;
    inline-size: 5.95vw;
    margin: 0.33vw;
    box-shadow: 2px 2px 5px gray;
    flex:1;
    transition: 0.2s;
}
    .calc button:is(:hover) {
        transform: translate(1px,1.5px);
        box-shadow: 1.5px 1.5px 5px rgb(128 128 128 / 52%);
        transition: 0.2s;
    }
    
        .calc button:is(:nth-child(4n),:nth-child(1n)) {
        margin-inline: 0;
    }
    .calc button:hover {
        background-color: #e5e5e5;
    }
    .calc button:active {
        background-color: blue;
        color: #fff;
        transition: 0.2s;
    }
    .calc button:focus {
        outline: none;
    }

.calc #txtCalInput {
    margin-block: 0 0.7rem;
    margin-inline: auto;
    padding-inline: 1rem;
    font-size: 1.4vw;
    inline-size: 100%;
    block-size: 58px;
    border: none;
    text-align: end;
    border-radius: 0.4rem;
    background-color: #d6d6d6;
    box-shadow: inset 1px 1px 2px gray;
}


.calc-close {
    position: absolute;
    inset-inline-end: -0.4vw;
    inset-block-start: -0.8vw;
    font-size: 20px;
    background-color: #ededed;
    box-shadow: 1px 2px 3px 1px rgb(128 128 128 / 25%);
    padding: 4px;
    border-radius: 50%;
    cursor:pointer;
}
.calc-sidebar {
    position: absolute;
    inset-inline-start: 100.9%;
    inset-block: 1.2vw 0;
    inline-size: 16vw;
    padding: 1vw;
    border-radius: 2rem;
    color: #272c33;
    /*border: 1px solid currentColor;*/
    box-shadow: 2px 2px 14px 6px rgb(128 128 128 / 25%);
    background-color: #ededed;
    z-index: -1;
    display: none;
    cursor: default;
}
    .calc-sidebar .table td {
       inline-size: 100%;
        text-align: end !important;
        color: var(--theme-darkbg) !important;
        font-size: 1.4rem !important;
        padding-inline: 0 !important;
    }
    /*=====================
        Layout overlay
 ======================*/
    .layoutoverlay-wrapper {
        position: absolute;
       inset-block-start: 0;
       inset-inline: 0;
    }

.overlay-line {
    position: fixed;
    background-color: #f5f7fa;
   inline-size: 120px;
   block-size: 6px;
   inset-inline-start: 50%;
   inset-block-start: -6px;
    transform: translateX(-50%);
    z-index: 1032;
}

    .overlay-line:after {
        content: '';
        position: absolute;
       block-size: 13px;
       inline-size: 100%;
        background: transparent;
       inset-inline-start: 0;
       inset-block-start: 6px;
    }

@keyframes blinkoverlayline {
    from {
        background-color: #222a45;
    }

    to {
        /*background-color: #fff;*/
        background-color: #9c9c9c;
    }
}

.btn-layoutoverlaytop, .btn-layoutoverlaybottom {
    position: absolute;
   inset-inline-start: 50%;
   inset-block-start: -4px;
    transform: translate(-50%,-100%);
    font-size: 30px;
    z-index: 1032;
    transition: transform 0.2s
}

.btn-layoutoverlaybottom {
    inset-block: auto 0px;
    transform: translate(-50%,0);
}

.main-header:hover ~ .layoutoverlay-wrapper .overlay-line, .overlay-line:hover {
    background-color: #222a45;
   inset-block-start: 0;
    animation-name: blinkoverlayline;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

    .overlay-line:hover .btn-layoutoverlaytop {
        transform: translate(-50%,0);
        transition: transform 0.2s
    }

.layoutoverlay, .imgoverlay {
   inset-block-start: 0;
   inset-inline-start: 0;
    position: fixed;
   inline-size: 100%;
   block-size: 100%;
    background: rgb(255 255 255 / 94%);
    display: none;
    z-index: 1033;
   padding-block-start: 20px;
}

    .layoutoverlay hr {
        border-color: #d2d6de;
    }

.layoutoverlay-notifications {
    list-style: none;
    padding: 0;
}

    .layoutoverlay-notifications li + li {
        margin-block-start: 5px;
    }

.notification-img {
   inline-size: 28px;
   block-size: 28px;
    background-color: red;
    text-align: center;
    line-height: 1.7;
    font-size: 16px;
    border-radius: 50%;
    color: #fff;
}

.layoutoverlay-notifications .media-body {
    border-block-end: 1px solid #d2d6de;
}

.layoutoverlay-notifications .media-heading {
    font-size: 1.5rem;
}

.layoutoverlay-notifications .media-body p {
    margin-block: 0 5px;
    margin-inline: 0;
}

.layoutoverlay .quick-links ul li {
    display: inline-block;
    position: relative;
   /* margin: 0 10px;*/
    margin-block: 0;
    margin-inline: 10px;
}

    .layoutoverlay .quick-links ul li:not(:last-child):before {
        content: '';
        display: inline-block;
        position: absolute;
       block-size: 10px;
       inline-size: 2px;
       inset-block-start: 6px;
       inset-inline-end: -12px;
        background-color: #d2d6de;
    }
/*=================*/
.stack-icons .fa {
    font-size: 16px !important;
}
/*=================*/
.hubdashboard-detail .form-group > span {
    font-size: 22px;
    font-weight: bold;
    display: block;
}

    .hubdashboard-detail .form-group > span > span {
       margin-inline-start: 0.4rem
    }

    .hubdashboard-detail .form-group > span + label {
        text-transform: uppercase;
    }

.itermediat-table {
    box-shadow: 0px 2px 3px 2px rgb(52 57 86 / 14%);
    background-color: #f6f7fa;
   block-size: 113px;
}

.table-receivepay tbody tr:nth-child(odd) {
    background-color: rgb(245 246 250 / 39%);
}

.table-receivepay tbody tr th, .table-receivepay tbody tr td {
}
/*======================================*/

   /* .file-images,*/ .file-images:before {
    background-repeat: no-repeat;
    background-position: center;
    background-size: 22px;
   inline-size: 22px;
   block-size: 20px;
    display: inline-block;
}

.img-PNG {
    background-image: url('Images/png1.png');
}

.img-JPG, .img-JPEG {
    background-image: url('Images/jpg1.png');
}

.img-DOCX {
    background-image: url('Images/docx1.png');
}

.img-XLS {
    background-image: url('Images/xls1.png');
}

.img-CSV {
    background-image: url('Images/csv1.png');
}

.img-PDF {
    background-image: url('Images/pdf1.png');
}

.img-TXT {
    background-image: url('Images/text1.png');
}

.img-XLSX {
    background-image: url('Images/xlxs1.png');
}

.img-ZIP {
    background-image: url('Images/zip1.png');
}

.img-empty {
    background-image: url('Images/empty1.png');
}
:is(#tblList tbody) :is(td):has(:is([data-extention="PNG"],[data-extention="JPG"],[data-extention="JPEG"])) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="PNG"],[data-extention="JPG"],[data-extention="JPEG"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/png1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="DOCX"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="DOCX"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/docx1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="XLS"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="XLS"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/xls1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="CSV"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="CSV"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/csv1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="PDF"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="PDF"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/pdf1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="TXT"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="TXT"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/text1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="XLSX"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="XLSX"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/xlxs1.png');
}
:is(#tblList tbody) :is(td):has([data-extention="ZIP"]) :is(.fa-paperclip,.file-images):before,
:is(.quickdoc-list) li:is([data-extention="ZIP"]) :is(.fa-paperclip,.file-images):before {
    content: '';
    font-family: none !important;
    background-image: url('Images/zip1.png');
}
        

/*========================================
    Form
==========================================*/
    label {
        font-weight: normal !important;
    }

    .form-group label {
        /*  display:block;*/
    }

    input [type=text], input[type=email], input[type=search], input[type=password], textarea, select {
        -webkit-appearance: none !important;
        -moz-appearance: none !important;
        appearance: none;
    }

        input:focus, select:focus, textarea:focus, button:focus {
            outline: none !important;
        }

    select {
        background: #fff url(/Images/arrow-downW.png) center right 9px no-repeat !important;
        background-size: 24px !important;
       padding-inline-start: 10px;
    }

    .form-control {
       block-size: 44px;
        border-radius: 4px;
        background-color: #fff;
        box-shadow: none;
    }

        .form-control:focus, .form-control:focus ~ .input-group-addon {
            border-color: var(--theme-darkColor) !important;
            outline: none !IMPORTANT;
            box-shadow: none;
        }
.input-group-addon:first-child {
    border-inline-start-style: solid;
}

.input-group-addon:last-child {
    border-inline-end: 1px solid #ccc;
}

.input-group-addon:first-child {
    border-inline-start: 1px solid #ccc;
}

.input-group .form-control:last-child {
    border-start-end-radius: 4px;
    border-end-end-radius: 4px;
}

.input-group .form-control:first-child {
    border-start-start-radius: 4px;
    border-start-end-radius: 0;
    border-end-start-radius: 0;
    border-end-end-radius: 4px;
}
.input-group .input-group-addon:first-child {
    border-start-start-radius: 4px;
    border-start-end-radius: 0;
    border-end-start-radius:0;
    border-end-end-radius: 4px;
}

.input-group .input-group-addon:last-child {
    border-start-start-radius: 0;
    border-start-end-radius: 4px;
    border-end-start-radius: 4px;
    border-end-end-radius: 0;
}

    .input-group .input-group-addon {
        min-width: 50px;
        font-weight: bold;
        font-size: 16px;
        color:var(--theme-darkColor);
    }

        .input-group .input-group-addon .fa-calendar:before {
            content: "\f133";
        }

    .input-group .form-control {
        z-index: 0;
    }

        .input-group .form-control ~ .input-group-addon {
            min-width: 50px !important;
            /* border: 1px solid #ccc;*/
            padding-block: 0;
            padding-inline: 7px;
        }

            .input-group .form-control ~ .input-group-addon select {
               block-size: 42px;
                border: 0;
                background-color: transparent !important;
                min-width: 80px;
            }

    .input-group .input-group-btn .btn:not([name=search]) {
        /*border-radius: 0 20px 20px 0 !important;*/
       block-size: 44px;
        min-width: 67px;
    }

    textarea.form-control {
        resize: none;
    }
.input-group.input-group-sm .form-control ~ .input-group-addon {
    min-width: 40px !important;
}
.input-group.input-group-sm .input-group-addon .fa {
    font-size:16px;
}
.input-group .input-group-addon .fa {
    font-size: 19px;
}

    .checkbox-inline, .radio-inline {
       padding-inline-start: 0 !important;
    }

    .form-group label:only-child {
        display: block;
        font-weight: 700 !important;
    }

    .checkbox.icheck {
        margin-block-start: 32px;
    }
        .checkbox.icheck .icheckbox_square-blue, .iradio_square-blue {
            margin-inline-end: 0.5rem !important
        }

.configcheck-row .form-group {
    display: inline-block;
}

    .configcheck-row .form-group .icheckbox_square-blue {
        margin-block: 0 ;
        margin-inline:10px 5px;
    }

    .configcheck-row label:last-child {
       margin-inline-start: 3px;
    }

    .configcheck-row .form-group {
        margin-block-end: 5px;
    }
    /*info tooltip*/
    .required .info-tooltip {
    }

    .info-tooltip {
        position: absolute;
        display: inline-block;
       padding-inline-start: 10px;
        opacity: 0;
       block-size: 10px;
        transition: opacity 0.4s;
    }

    .required:hover .info-tooltip, .heading-tootip .info-tooltip {
        opacity: 1;
        transition: opacity 0.4s;
    }

    .heading-tootip .info-tooltip {
        z-index: 1050;
        font-size: 16px !important;
    }

        .heading-tootip .info-tooltip .info-icon {
            vertical-align: text-bottom;
        }

.tooltip-dropdown {
    margin: 0;
    display: flex;
    min-width: 116px;
    min-block-size: 32px;
    justify-content: space-between;
    align-items: center;
    border: 3px solid var(--theme-darkColor);
    border-radius: 9px;
    padding: 1px 11px;
    background-color: var(--theme-darkColor);
    list-style: none;
    transform-style: preserve-3d;
    perspective: 600px;
    transform-origin: top left;
    transform: translate3d(-2%, -38px, 0px) scale3d(0,0,0);
    transition: transform 0.4s;
    color: var(--theme-leftbar-links-hover);
}

        .tooltip-dropdown:before {
            display: inline-block;
            vertical-align: .255em;
            content: "";
           inline-size: 0;
           block-size: 0;
            border-block-start: 9px solid var(--theme-darkColor);
            border-inline-start: 8px solid transparent;
            border-inline-end: 8px solid transparent;
            position: absolute;
           inset-block-end: -10px;
           inset-inline-start: 0px;
        }

        .tooltip-dropdown a {
            color: #fff;
            font-size: 12px;
        }

            .tooltip-dropdown a .fa {
                font-size: 12px;
            }

            .tooltip-dropdown a .fa-link {
                font-size: 10px;
            }

            .tooltip-dropdown a .fa-info {
                padding: 0 3px;
            }

    .info-tooltip:hover .tooltip-dropdown {
        transform: translate3d(0, -56px, 0px) scale3d(1,1,2);
        transition: transform 0.4s;
        z-index: 2;
    }
    /**/
    /*Date picker*/


    .datepicker.dropdown-menu {
        box-shadow: 0px 7px 10px rgb(0 0 0 / 10%);
        z-index: 1050 !important;
    }

        .datepicker.dropdown-menu thead tr:first-child th:nth-child(2) {
            text-transform: uppercase;
            font-size: 12px;
        }

        .datepicker.dropdown-menu thead tr:last-child th {
            text-transform: uppercase;
            font-size: 12px;
            border-block-start: 0;
            border-block-end: 1px solid #ccc !important;
        }

.datepicker table tr td, .datepicker table tr th {
    padding-block: 10px !important;
    padding-inline:10px !important;
    border: 0 !important;
}

    .datepicker table tr td {
        border-radius: 50%;
    }

        .datepicker table tr td.day:hover, .datepicker table tr td.day.focused {
            background: rgb(0 0 0 / 9%);
        }

        .datepicker table tr td.active, .datepicker table tr td.active:hover, .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover {
            background-color: var(--theme-darkColor) !important;
        }

    .datepicker-dropdown.datepicker-orient-bottom:before {
        border-block-start: 1px solid #999 !important;
    }
    /*==============================
    Custom Search
===============================*/
    .chartaccount-btns {
        display: flex;
        justify-content: end;
        align-items: center;
    }

        .chartaccount-btns .form-control {
           block-size: 33px;
        }

    /* .chartaccount-btns .input-group :is(.form-control,.btn) {
        border-color: transparent;
        background-color: #fff;
    }

    .chartaccount-btns .input-group :is(.form-control:focus,.btn:focus) {
        border-color: transparent !important;
        outline: none;
        box-shadow: none;
    }

    .chartaccount-btns .input-group {
        border: 1px solid #d2d6de;
        overflow: hidden;
        border-radius: 20px;
    }

        .chartaccount-btns .input-group:focus-within {
            border-color: #d8b147
        }

            .chartaccount-btns .input-group:focus-within .fa {
                color: #d8b147
            }
*/
    /*===================================================
    Removing input autofill colour for Chrome
======================================================*/
    /* Change the white to any color ;) */
    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    input:-webkit-autofill:active {
        -webkit-box-shadow: 0 0 0 30px white inset !important;
        transition: background-color 5000s ease-in-out 0s;
    }
  /*---------------------------
      Input Searchbar
  -----------------------------*/
.inputsearchbar {
    block-size: 25px;
    border-radius: 20px !important;
    background-color: #fff;
    color: #555;
    overflow: hidden !important;
    border: 1px solid #d2d6de;
    box-shadow: none !important;
    position: relative;
    box-sizing: border-box;
    margin-block: 1rem;
}
    .inputsearchbar :is(.form-control, .input-group-addon) {
    border-color:transparent !important;
    background-color:#fff;
    height:100%;
    }

        .inputsearchbar .input-group-addon .fa {
            font-size: 17px;
        }
    .inputsearchbar:focus-within {
        border-color: var(--theme-darkColor)
    }
    /*=============================================
    Buttons
==============================================*/
    .btn:hover, .btn:focus {
        box-shadow: inset 0 0 0 1px rgb(255 255 255);
    }

    .btn > :is(.fa,.fa-stack) {
        margin-inline-end: 0.4rem;
    }

    button.dt-button, div.dt-button, a.dt-button {
        text-align: center;
    }

    .dt-buttons .dt-button {
        border-radius: 20px !important;
        min-width: 90px;
    }

.btn:not(#search-btn):not(.btn-flat):not(.btn-overallsearch) {
    border-radius: 20px;
    min-width: 90px;
    padding-block: 6px;
    padding-inline: 17px;
}

    .input-group:has(.breakEvenFilterAll ~ .input-group-btn) {
        border-radius: 20px !important
    }

    .input-group:has(.breakEvenFilterAll) > .input-group-btn > .btn {
        border-radius: 0 !important
    }

    .wysihtml5-toolbar .btn.btn-default {
        min-width: auto !important;
    }

    .wysihtml5-toolbar .btn + .btn {
       margin-inline-start: 5px !important;
    }
ul.wysihtml5-toolbar > li {
    float: inline-start;
    margin-block:0 10px;
    margin-inline:5px 0;
}

.wysihtml5-toolbar .btn {
    min-width: initial !important;
}

.widget-user-2 .widget-user-image > img {
    float: right;
}




    .glyphicon {
        font-family: 'Glyphicons Halflings' !IMPORTANT;
    }
.user-dropdown .btn-flat {
    padding-inline: inherit auto !important;
    margin-inline:inherit auto !important
}

.user-dropdown .btn {
    padding-block: 6px !important;
    padding-inline: 12px !important;
}

    .dt-buttons .dt-button {
        background-image: none;
        background-color: #fff;
    }

        .dt-buttons .dt-button .fa {
            margin-inline-end: 0.3rem;
        }

        .dt-buttons .dt-button + .dt-button, .btn + .btn {
           margin-inline-start: 6px;
        }

.skin-blue .btn-primary, .login-page .btn-primary {
    background-color: var(--theme-darkColor);
    border-color: var(--theme-darkColor);
}

    .skin-blue .btn-primary:hover, .skin-blue .btn-primary:active, .skin-blue .btn-primary.active, .skin-blue .btn-primary.focus, .skin-blue .btn-primary:focus:active {
        background-color: var(--theme-darkColor);
        border-color: var(--theme-darkColor);
    }

    .login-page .btn-primary:hover, .login-page .btn-primary:active, .login-page .btn-primary.active, .login-page .btn-primary.focus, .login-page .btn-primary:focus:active {
        background-color: var(--theme-darkColor);
        border-color: var(--theme-darkColor);
    }

.btn-info, .tree li .btn-info {
    background-color: var(--theme-darkColor);
    border-color: var(--theme-darkColor);
    background-image: none;
}

    .btn-info:hover, .btn-info:active, .btn-info.active, .btn-info.focus, .btn-info:focus, .btn-info:focus:active {
        background-color: var(--theme-darkColor);
        border-color: var(--theme-darkColor);
        background-image: none;
    }

.btn-excel {
    display: flex;
    align-items: center;
    padding-block: 6px !important;
    padding-inline: 13px !important;
    margin-inline-start: auto;
    inline-size: 142px;
    min-width: auto !IMPORTANT;
}

    .excel-img {
       inline-size: 30px;
       block-size: 30px;
        border: 2px solid rgb(255 255 255 / 69%);
        /*background-color: #548f14;*/
        border-radius: 50%;
        text-align: center;
        margin-inline-end: 0.9rem;
        padding: 2.4px;
        overflow: hidden;
    }

        .excel-img > .fa {
            border-radius: 6px;
            background-color: #639d27;
            background-image: linear-gradient(to right, #365a35, #639d27, #365a35);
            font-size: 18.5px;
            line-height: 1.4;
            font-weight: 700;
            padding: 1.1px;
        }

    .btn-excel .excel-body {
        flex: 1;
        display: flex;
        flex-wrap: wrap;
        text-align: justify;
        line-height: 1;
    }

        .btn-excel .excel-body > b {
            flex: 0 0 100%;
        }
    /*BUttons evaluation*/
.btns-evaluation {
    border: 1px solid #272c33;
    padding-block: 12px;
    padding-inline: 8px;
    border-radius: 4px;
}

        .btns-evaluation .btn {
            padding: 0px 17px !important;
            border-radius: 4px !important;
            font-size: 14px;
            color: #272c33;
            text-transform: uppercase;
            font-weight: bold;
            position: relative;
            background: transparent;
        }

            .btns-evaluation .btn + .btn {
               margin-inline-start: 13px;
            }

                .btns-evaluation .btn + .btn:after {
                    content: '';
                    position: absolute;
                    block-size: 100%;
                    margin-block: 0;
                    margin-inline: -9px;
                    border-inline-start: 1px solid #272c33;
                    inset-inline-start: 0px;
                    inset-block-start: 0;
                }

    .tooltip {
        font-family: inherit;
    }

    .tooltip-inner {
        min-width: 100px;
        background-color: var(--theme-darkColor);
    }

.tooltip.top .tooltip-arrow {
    border-block-start-color: var(--theme-darkColor);
}

.tooltip.bottom .tooltip-arrow {
    border-block-end-color: var(--theme-darkColor);
}
    /*========================================
    Autocomplete
====================================*/
    .btn-overallsearch:after {
        content: '';
        display: inline-block;
       inline-size: 0;
       block-size: 0;
       margin-inline-start: 2px;
        vertical-align: middle;
        border-block-start: 4px dashed;
        border-block-start: 4px solid\9;
        border-inline-end: 4px solid transparent;
        border-inline-start: 4px solid transparent;
    }

    .autocomplete-items {
        position: relative;
        overflow-y: auto;
        max-height: 204px;
    }

        .autocomplete-items div {
            padding: 10px;
            cursor: pointer;
            background-color: #fff;
            border-block-end: 1px solid #d4d4d4;
        }


            .autocomplete-items div:hover {
                background-color: #e9e9e9;
            }


    .autocomplete-active {
        background-color: DodgerBlue !important;
        color: #ffffff;
    }

    /*==========================================
    Select2
=============================================*/
    .ProductItemDDL ~ .select2-container {
       inline-size: 15em !IMPORTANT;
    }

.select2-container {
    inline-size: 100% !IMPORTANT;
}

.select2-container--default .select2-selection--multiple,
.select2-container--default .select2-selection--single, .select2-selection .select2-selection--single {
    block-size: auto;
    min-block-size: 44px;
    border-radius: 4px;
}
.select2-container--default .select2-selection--single, .select2-selection .select2-selection--single {
    padding-block: 6px 6px;
    padding-inline: 12px 28px
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #303956 !important;
}
.select2-container--open .select2-selection--single, .select2-container--default .select2-search--dropdown .select2-search__field {
    border-color: var(--theme-darkColor) !important
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    inset-block-start: -6px;
    inset-inline: auto 3px;
    width: 35px;
}

        .select2-container--default .select2-selection--single .select2-selection__arrow b {
            border: none !important;
            background: url(/Images/arrow-downW.png) center right 28px no-repeat !important;
            background-size: 24px !important;
            inline-size: 47px;
            block-size: 15px;
            margin-block-start: 7px;
            margin-inline-start: -7px;
            inset-inline-start: 50%;
        }

    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: var(--theme-darkColor) !important;
        border-color: var(--theme-darkColor) !important;
        border-radius: 2px !important;
        padding: 5px 10px !important;
    }

 
    .select2-dropdown .select2-search__field:focus, .select2-search--inline .select2-search__field:focus {
        outline: none;
        border: 1px solid var(--theme-darkbg);
    }

    .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true] {
        background-color: #5d91fe;
        color: #fff !important;
    }

.select2-container .select2-selection--single .select2-selection__rendered {
    padding-block-start: 6px;
    padding-inline: 0 10px;
}

    .select2-container--default.select2-container--focus .select2-selection--multiple {
        border-color: var(--theme-darkColor);
    }
    /*====================
    Multi Selec2
======================*/
    .multiSelect .select2-results__option:before {
        content: "";
        display: inline-block;
        position: relative;
        block-size: 20px;
        inline-size: 20px;
        border: 2px solid #e9e9e9;
        border-radius: 4px;
        background-color: #fff;
        margin-inline-end: 20px;
        vertical-align: middle;
    }

    .multiSelect .select2-results__option[aria-selected=true]:before {
        font-family: fontAwesome;
        content: "\f00c";
        color: #fff;
        background-color: var(--theme-darkbg);
        border: 0;
        display: inline-block;
        padding-inline-start: 3px;
    }

    .select2-container--default .select2-selection--multiple .select2-selection__rendered {
        block-size: 36px;
        overflow-y: auto;
    }
.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar {
   inline-size: 4px;
   block-size: 4px;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: #E0E0E0;
    border: 2px solid #E0E0E0;
    margin: 0;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb {
    background-color: #BDBDBD !important;
    border-radius: 0;
    border: 2px solid #BDBDBD !important;
   block-size: 40px;
}
.select2-input-group :is(.select2-container--default .select2-selection--single, .select2-selection .select2-selection--single) {
    border: 0;
}
.select2-input-group .input-group-btn .btn,.select2-input-group .input-group-btn .btn:is(:hover,:focus,:active,:active:focus) {
    background-color: #fff;
    border-radius: 0;
    font-size: 20px;
    min-width: auto !important;
       
}
    .select2-input-group .input-group-btn .btn .fa {
    color:currentColor;
    }
    /*======================================
    Custom file
========================================*/
    .custom-file {
        position: relative;
        display: inline-block;
       inline-size: 100%;
       block-size: 44px;
        margin-block-end: 0;
    }

        .custom-file-input, .custom-file input[type=file] {
            position: relative;
            z-index: 2;
           inline-size: 100%;
           block-size: 44px;
            margin: 0;
            opacity: 0;
            /* display:none;*/
        }

.custom-file-label {
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    z-index: 1;
    block-size: 44px;
    padding: 4px 11px;
    font-weight: 400;
    line-height: 2.2;
    color: currentColor;
    background-color: #fff;
    border: 1px solid #ced4da;
    border-start-start-radius: 4px;
    border-start-end-radius: 20px;
    border-end-start-radius: 4px;
    border-end-end-radius: 20px;
}

    .custom-file-label::after {
        position: absolute;
        inset-block: 0;
        inset-inline-end: 0;
        z-index: 3;
        display: block;
        block-size: 42px;
        padding: 8px 18px;
        line-height: 1.7;
        color: var(--theme-darkColor);
        content: "Browse";
        background-color: #fff;
        border-inline-start: none;
        border-start-start-radius: 0;
        border-start-end-radius: 20px;
        border-end-start-radius: 0;
        border-end-end-radius: 20px;
        font-weight: bold;
    }

    .custom-file-input:lang(en) ~ .custom-file-label::after {
        content: "Browse";
    }
    /*---------------------
        AlertPopup
    ----------------------*/
#SmartAlert {
    position: fixed;
    margin-inline-start: 280px;
    inset-block-end: 50px;
    text-align: center;
    inset-inline: 0;
    background-color: #fff;
    padding-block: 1.5rem;
    padding-inline: 1.9rem;
    font-size: 1.8rem;
    transform-origin: bottom;
    box-shadow: 0px -6px 6px 0px rgb(0 0 0 / 6%);
    border-block-start: 1px solid rgb(0 0 0 / 14%);
    display: flex;
    z-index: 1050;
}

    #SmartAlert #SmartAlert-Title {
        align-content: center;
        font-weight: bold;
        margin-inline-end: 1rem;
        font-size: 2rem;
        margin: -1.5rem -1.9rem;
        padding: 1.5rem 1.9rem;
        border-inline-end: 1px solid;
    }
    #SmartAlert #SmartAlert-Discription {
        font-weight: 400;
        flex: 1;
        text-align: start;
        padding-inline: 3.2rem;
    }
    #SmartAlert.toggle-SmartAlert {
        display: flex !important;
    }
    #SmartAlert #SmartAlert-Actions {
        align-content: center;
        font-weight: bold;
        margin-inline-start: 1rem;
        font-size: 2rem;
        margin: -1.5rem -1.9rem;
        padding: 1.5rem 1.9rem;
        border-inline-start: 1px solid;
    }
        #SmartAlert #SmartAlert-Actions .fa  {
            cursor: pointer;
        }
    #SmartAlert #SmartAlert-Actions .fa + .fa {
       margin-inline-start:1rem;
    }
.btnSmartAlertAgain {
    position: fixed;
    padding: 1rem 1.4rem 0.5rem;
    text-align: center;
    margin-inline-start: 61px;
    inset-block-end: 50px;
    margin-inline-start: 280px;
    font-size: 3rem;
    display: none;
    cursor: pointer;
    z-index: 1050;
    animation: updown 3s infinite alternate-reverse;
    transition: transform .3s ease-in-out, margin .3s ease-in-out;
}
body:has(.modal.in,.modal-backdrop.fade.in) .btnSmartAlertAgain {
    color: #fff;
}
@keyframes inverseScale {
    0% {
        transform: scaleY(0);
    }

    20% {
        transform: scaleY(1);
    }
   
    100% {
        transform: scaleY(1);
    }
}
@keyframes updown {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(7px);
    }

    100% {
        transform: translateY(0);
    }
}

/*===========================================
    Table
============================================*/
/*.table-responsive {
    max-height: 500px;
    overflow-y: auto;
}*/
.table-responsive {
    scroll-behavior: smooth;
}
    .fixed-table-header {
        position: relative;
        border-collapse: separate;
        border-spacing: 0;
    }

        .fixed-table-header thead th {
            position: sticky;
           inset-block-start: 0;
            background-color: #fff;
            z-index: 2;
            border-block: 0 !important;
        }

        .fixed-table-header thead :is(tr:last-child) th {
            border-block-end: 1px solid #d2d6de !IMPORTANT
        }

    .table-responsive1 {
        max-height: 450px;
        overflow-y: auto;
    }

table.dataTable tbody th, table.dataTable tbody td, table.dataTable thead th, table.dataTable thead td {
    padding-block: 6px;
    padding-inline: 7px;
    line-height: 1.2;
}

table.dataTable tbody th, table.dataTable thead th {
    padding-block: 10px;
    padding-inline:7px;
}

    .dataTables_wrapper .dataTables_info {
       padding-block-start: 0.455em;
    }

    .dataTables_wrapper .dataTables_scroll {
        margin-block-end: 12px !important;
    }
[class^=dataTables_] [class^=dataTables_]:first-child {
    float: inline-start !important;
}

[class^=dataTables_] [class^=dataTables_]:nth-child(3):not(.dataTables_info) {
    float: inline-end !important;
    text-align: start !important;
}
    [class^=dataTables_] input[type=search], [class^=dataTables_] select {
        border-radius: 20px !important;
        border: 1px solid var(--theme-darkColor) !important;
       block-size: 31px;
        min-width: 75px;
       padding-inline-start: 10px !IMPORTANT;
    }

    [class^=dataTables_] label {
        font-weight: normal
    }

[class^=dataTables_] .dt-buttons {
    margin-block-end: 9px !important;
    float: inline-end !important;
    margin-inline-start: 10px !important;
}
.dataTables_wrapper .dataTables_processing {
    inset-block-start: 50%;
    inset-inline-end: 50%;
    margin-inline-start: -50%;
    margin-block-start: -25px;
    inline-size: 100%;
    block-size: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 10;
}
    .dataTables_wrapper .dataTables_processing:after {
       inline-size: 50px;
        font-size: 38px;
        color: currentColor;
        content: '\f1ce';
        font-family: "FontAwesome";
        -webkit-animation: fa-spin 1s infinite linear;
        animation: fa-spin 1s infinite linear;
        text-align: center;
        flex: 0 0 50px;
        order: -1;
    }
.dataTables_wrapper .dataTables_filter input {
    margin-inline: 0.5em auto;
}

.dataTables_info {
    float: inline-start !important;
}

.dataTables_paginate {
    float: inline-end !important;
}



    .table {
        border: none !important;
    }

        .table th, .table td {
            border-style: solid none none none !important;
            vertical-align: middle !important;
        }

        .table th {
            /*border-top: 1px solid #ddd !important;*/
            color: rgb(79 88 101 / 75%) !important;
            /*font-weight: normal !IMPORTANT;*/
        }

        .table tbody td .fa-paperclip {
            font-size: 17px;
        }

        .table tbody td a + a {
            border-inline-start: 1px solid #494e5657;
           padding-inline-start: 6px;
           margin-inline-start: 5px;
            line-height: 1;
            display: inline-block;
        }

    .TableCellActions {
        table-layout: fixed;
    }

        .TableCellActions :is(th,td) {
            font-size: 15px;
        }

        .TableCellActions :is(th) {
            text-align: center;
        }

        .TableCellActions :is(thead,tbody) tr :is(th,td)[data-balance="debit"] {
            color: #477247 !important;
            white-space:nowrap;
        }

        .TableCellActions :is(thead,tbody) tr :is(th,td)[data-balance="credit"] {
            color: #dd4b39 !important;
            white-space: nowrap;
        }

        .TableCellActions tbody tr:nth-child(odd) {
            background-color: rgb(245 246 250 / 39%);
        }

.btn-panelexpand, .btn-panelexpand1, .btn-panelexpand2, .btn-panelexpand3, .panelexpandable-div {
   inline-size: 200px;
   block-size: 5px;
    background-color: currentColor;
    margin-inline: auto;
    border-radius: 3px;
    cursor: pointer;
}
:is(#VoucherClass, #StatementClass, #GroupClass) .table-responsive {
    transition: max-height 0.3s ease-in-out;
}
.toggleVoucherClass, .toggleTableMaxHeigh-70 {
    max-height: 70vh !important;
    transition: max-height 0.3s;
}
.toggleTableMaxHeight {
    max-block-size: none !important;
    transition: max-height 0.3s cubic-bezier(0, 1, 0, 1);
}

.highlighted-tr {
    background-color: rgba(var(--theme-darkColor-rgb), 0.20) !important;
}
.defaultBranch td, .defaultBranch td * {
    color: #fff !important;
    border-color:currentColor !important
}
.table tbody tr td.table {
    border-block-start: 1px solid #f4f4f4 !important
}
/*================================
    Table dropdown
===================================*/
.grid-dropdown {
    position: relative;
    display: inline-block;
}
    .grid-dropdown .grid-dropdownmenu {
        inset-block-start: 0;
        inset-inline-start: 2.5rem;
        position: absolute;
        border: none !important;
        border-radius: 7px;
        padding: 10px 15px 10px !important;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .175);
        font-size: 14px;
        text-align: start;
        list-style: none;
        background-color: #fff;
        min-width: 200px;
        background-clip: padding-box;
        transform-style: preserve-3d;
        perspective: 600px;
        transform-origin: right center;
        display: block;
        z-index: 10;
        backface-visibility: hidden;
        transform: scaleX(0);
        transition: transform 0.1s;
    }
    .grid-dropdownmenu li {
        margin-block-end: 1px;
    }
        .grid-dropdownmenu li a {
            color: var(--theme-darkColor) !IMPORTANT;
            overflow: hidden;
            text-overflow: ellipsis;
            padding-block: 4px;
            padding-inline: 5px;
            display: block;
            white-space: nowrap !IMPORTANT;
        }
.dt-buttons:has(>.grid-dropdown.leftMenu) {
    float: inline-end;
    margin-inline-start: 8px;
}
html .sidebar-mini .grid-dropdownmenu li a:is(:hover,:focus,:active,:active:focus,:focus:active) {
    background-color: #f4f4f4 !important;
    box-shadow: none;
}
.grid-dropdownmenu li a > .fa {
    margin-inline-end: 0.5rem;
   inline-size: 16px;
    color: var(--theme-darkColor);
}
.grid-dropdown.toggleDropwnMenu .grid-dropdownmenu {
    transform: scaleX(1);
    transform-origin: left center;
    transition: transform 0.1s;
}
tr:nth-last-child(-n+3) .grid-dropdown .grid-dropdownmenu {
    inset-block: auto 0;
}
tr:is(:first-child:nth-last-child(3),:nth-child(2):nth-last-child(2),:nth-child(3):nth-last-child(1)) .grid-dropdown .grid-dropdownmenu, tr:first-child .grid-dropdown .grid-dropdownmenu, tr:nth-child(2) .grid-dropdown .grid-dropdownmenu, tr:nth-child(3) .grid-dropdown .grid-dropdownmenu {
    inset-block: 0 auto;
}

tr td:last-child .grid-dropdown .grid-dropdownmenu, .grid-dropdown.leftMenu .grid-dropdownmenu {
    inset-inline: auto 2.5rem;
    transform-origin: left center;
}
tr td:last-child .grid-dropdown.toggleDropwnMenu .grid-dropdownmenu, .grid-dropdown.leftMenu.toggleDropwnMenu .grid-dropdownmenu {
    transform-origin: right center;
}

html .sidebar-mini .dt-buttons .grid-dropdownmenu .dt-button {
    background-color: #fff !important;
    border-color: #fff !important;
    text-align: start !important;
    border-radius:0 !important;
    box-shadow:none !important;
}
.grid-dropdownmenu li a[data-toggle="tooltip"] {
    display:none !important;
}
.dt-buttons:has(.grid-dropdown.leftMenu) {
    display: flex;
    align-items: center;
}
.dt-buttons .grid-dropdown.leftMenu {
    order:2;
}
.filter-icon:before {
    content: "\f0b0";
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    margin-inline-end: 0.3rem;
}
.search-icon:before {
    content: "\f002";
    display: inline-block;
    font: normal normal normal 14px / 1 FontAwesome;
    margin-inline-end: 0.3rem;
}
/*--------Inlineend dropdown-----*/
.inlineend-dropdown {
    position: relative;
    display: inline-block;
}

    .inlineend-dropdown .dropdown-menu {
        inset-block-start: 0;
        inset-inline-start: 2.5rem;
        position: absolute;
        border: none !important;
        border-radius: 7px;
        padding: 10px 15px 10px !important;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .175);
        font-size: 14px;
        text-align: start;
        list-style: none;
        background-color: #fff;
        min-width: 200px;
        background-clip: padding-box;
        transform-style: preserve-3d;
        perspective: 600px;
        transform-origin: right center;
        display: block;
        z-index: 10;
        backface-visibility: hidden;
        transform: scaleX(0);
        transition: transform 0.1s;
    }
        .inlineend-dropdown .dropdown-menu :is(a,button,.btn) {
            background-color: #fff !important;
            border-color: #fff !important;
            text-align: start !important;
            border-radius: 0 !important;
            box-shadow: none !important;
        }

        .inlineend-dropdown .dropdown-menu:before, .dropdown-menu:after {
            inset-block-start: 4px;
            inset-inline-start: -7px;
            transform: rotate(-35deg) !important;
        }
    .inlineend-dropdown.toggleDropwnMenu .dropdown-menu {
        transform: scaleX(1);
        transform-origin: left center;
        transition: transform 0.1s;
    }
        .inlineend-dropdown .dropdown-menu li {
            margin-block-end: 1px;
        }

            .inlineend-dropdown .dropdown-menu li :is(a,button,.btn) {
                color: var(--theme-darkColor) !IMPORTANT;
                overflow: hidden;
                text-overflow: ellipsis;
                padding-block: 4px;
                padding-inline: 5px;
                display: block;
                width:100%;
                white-space: nowrap !IMPORTANT;
            }



                .inlineend-dropdown .dropdown-menu li :is(a,button,.btn):is(:hover,:focus,:active,:active:focus,:focus:active) {
                    background-color: #f4f4f4 !important;
                    box-shadow: none;
                }

        .inlineend-dropdown .dropdown-menu li :is(a,button,.btn) > .fa {
            margin-inline-start: 0.5rem;
            inline-size: 16px;
            color: var(--theme-darkColor);
        }

/*=====================*/
.cell-lightgrey {
    background-color: #f6f7fa;
}

    .start-shadow {
        box-shadow: -2px 0 0 rgb(128 128 128 / 2%), -3px 0 0 rgb(128 128 128 / 5%);
    }

    .end-shadow {
        box-shadow: 2px 0 0 rgb(128 128 128 / 2%), 3px 0 0 rgb(128 128 128 / 5%);
    }

    .start-bordershadow {
        box-shadow: -2px 0 0 rgb(128 128 128 / 2%), -3px 0 0 rgb(128 128 128 / 5%);
        border-inline-start: 4px solid rgb(204 208 216 / 8%) !important;
    }

    .end-bordershadow {
        box-shadow: 2px 0 0 rgb(128 128 128 / 2%), 3px 0 0 rgb(128 128 128 / 5%);
        border-inline-end: 4px solid rgb(204 208 216 / 8%) !important;
    }
    /* ================*/

    td .IsActive, td.IsActive, td .IsFreeze, td.IsFreeze, td .isVerified, td.isVerified, td .ActiveDeactive, td.ActiveDeactive {
        text-align: center;
    }

        td .IsActive img, td.IsActive img, td .IsFreeze img, td.IsFreeze img, td .isVerified img, td.isVerified img, td .ActiveDeactive img, td.ActiveDeactive img, td a.IsActiveEmployee img {
           inline-size: 18px !important;
        }

    .table tbody td .fa {
        color: var(--theme-darkColor);
    }

.table tbody td a {
    white-space: nowrap;
    color: var(--theme-darkColor);
}
.table tbody td:not(:has(.grid-dropdownmenu,.dropdownmenu)) a {
    font-style: italic;
}
.dt-buttons .dt-button {
    background-image: none;
    color: #dae2ff;
    border-color: var(--theme-darkColor);
    background-color: var(--theme-darkColor)
}

div.dt-buttons a.dt-button:hover, div.dt-buttons a.dt-button:focus, div.dt-buttons a.dt-button:focus:active, div.dt-buttons a.dt-button:active {
    color: #dae2ff;
    border-color: var(--theme-darkColor);
    background-color: var(--theme-darkColor) !important;
    background-image: none !important;
    box-shadow: inset 0 0 0px 1px rgb(255 255 255) !important;
}

    [class^=dataTables_] input[type=search], .bg-sidebargreen [class^=dataTables_] select {
        border-color: var(--theme-darkbg);
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        border-color: var(--theme-darkbg);
    }

.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    border: 1px solid var(--theme-darkColor);
    box-shadow: 0 0 0px 1px var(--theme-darkColor) !important;
}

    .AddReceipt, .AddRecord:not(:has(#lblAddUpdate)), .AddPayment, .AddExpense, .AddInvoice, .AddCredit, .AddBill, .AddDebit, .AddMoreLedgers, .AddAccount {
        background: transparent;
        border: 0;
        font-size: 23px !important;
        line-height: 1.8
    }
        .AddReceipt:focus, .AddRecord:focus, .AddPayment:focus, .AddExpense:focus, .AddInvoice:focus, .AddCredit:focus, .AddBill:focus, .AddDebit:focus, .AddMoreLedgers:focus, .AddAccount:focus {
            outline: 1px solid var(--theme-darkColor) !important;
        }
#tblLedgersListMain #AddExpense.AddExpense {
    background-color: var(--theme-darkColor) !important;
    border-color: var(--theme-darkColor) !important;
}
    .table > tbody > tr > td, .table > tfoot > tr > td, .table > tbody > tr > th, .table > tfoot > tr > th {
        border-color: #d2d6de;
    }

.table:not(.NotColumnBorder):not(#tblList):not(.TableCellActions):not(table.borderh-0):not(#tblAssignedStatus):not(#tblAssignedUser) > tbody > tr > td:not(:last-child), .table:not(.NotColumnBorder):not(#tblList):not(#tblAssignedStatus):not(#tblAssignedUser) > tfoot > tr > td:not(:last-child), .table:not(.NotColumnBorder):not(#tblList) > thead > tr > th:not(:last-child), .table:not(.NotColumnBorder):not(#tblList) > tfoot > tr > th:not(:last-child) {
    border-inline-end: 1px solid #eaeaea !IMPORTANT;
}

    .table:not(.NotColumnBorder):not(#tblList) > thead > tr > th:first-child, .table:not(.NotColumnBorder):not(#tblList) > tbody > tr > td:first-child, .table:not(.NotColumnBorder):not(#tblList) > tfoot > tr > td:first-child,
    .table:not(.NotColumnBorder):not(#tblList) > thead > tr > th:last-child, .table:not(.NotColumnBorder):not(#tblList) > tbody > tr > td:last-child, .table:not(.NotColumnBorder):not(#tblList) > tfoot > tr > td:last-child {
        text-align: center;
    }

.table:not(.NotColumnBorder):not(#tblList):not(.purshaseOrderTable):not(#tblAssignedStatus):not(#tblAssignedUser) > thead:first-child > tr:first-child > th {
    border-block-start: 1px solid #d2d6de !IMPORTANT;
}

    table.dataTable.no-footer {
        border-block-end: 1px solid #ccc !important;
       padding-block-end: 2px;
        margin-block-end: 13px;
    }

    .dataTables_wrapper.no-footer .dataTables_scrollBody {
        border-block-end: 1px solid #ccc !important;
    }

    .table.dataTable, .dataTables_scrollHeadInner {
       inline-size: 100% !important;
    }

    .dataTables_scroll table.dataTable.no-footer {
       padding-block-end: 0 !important;
        margin-block-end: 0 !important;
        border: 0 !IMPORTANT;
    }

    .table.dataTable tr td:first-child {
        white-space: nowrap;
    }

    .borderd-header thead th {
        border: 1px solid #ccc !important;
    }

    .fixed-table-header thead th {
        border: 0.4px solid #ccc !important;
    }

.table .text-aqua {
    color: var(--theme-darkColor) !important;
    font-weight: 600;
    font-style: italic;
}

    .table-fixed-header {
        position: relative;
    }

        .table-fixed-header thead th {
            background-color: #fff;
            position: sticky;
           inset-block-start: 0;
            z-index: 2
        }

    .table-responsive .table .navigateCell {
        background-color: var(--theme-darkColor);
        color: #fff !important;
        /*font-size: 14px !important;*/
        font-weight: bold;
        outline: none;
    }
.table-responsive .table .startsticky-cell.navigateCell {
    background-color: var(--theme-darkColor) !important;
}
    .table .navigateCell :is(p,a,span) {
        color: #fff !important;
        /*font-size: 14px !important;*/
        font-weight: bold
    }
    /******Collapsable Table*******/
    .collapsed-table table,.fixed-table {
        table-layout: fixed;
    }

        .collapsed-table table th, .collapsed-table table td {
            padding: 8px;
        }

    .collapesed-row {
        display: none;
        background: rgb(247 247 247);
    }

        .collapesed-row table td {
            border: 0
        }

        .collapesed-row table th {
            border-block-start: 1px solid #000;
            border-block-end: 1px solid #000;
        }

    .btn-collapsed {
        cursor: pointer;
    }

    td.btn-collapsed {
        cursor: pointer;
        /*border-top: 0 !important;*/
    }

    .collapsed-table table tbody td .fa {
        font-weight: bold;
        font-size: 18px;
        vertical-align: bottom;
    }

    .toggle-collapsed {
        transform: rotate(180deg);
        transition: transform 0.3s;
    }

    .sidebar-form #search-btn {
        pointer-events: none;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Pagination
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding-block: 0.2em !important;
    padding-inline: 1em !important;
    background: #fff !important;
    background-color: white !important;
    margin-inline-start: 4px;
    color: var(--theme-darkColor);
}

    .dataTables_wrapper .dataTables_paginate .paginate_button:active, .dataTables_wrapper .dataTables_paginate .paginate_button.current {
        box-shadow: 0 0 0px 1px var(--theme-darkColor) !important;
        background: none !important
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        color: var(--theme-darkColor) !important;
        box-shadow: 0 0 0px 1px var(--theme-darkColor) !important;
        border-color: var(--theme-darkColor) !important;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
        Swithcer
    \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
    .custom-switcher {
        position: relative;
    }

        .custom-switcher input[type=checkbox] {
            display: none;
        }

            .custom-switcher input[type=checkbox] ~ b {
                background: var(--theme-darkColor);
                position: relative;
               inline-size: 45px;
               block-size: 25px;
                border-radius: 22px;
                -webkit-transition: all 0.3s;
                -moz-transition: all 0.3s;
                -ms-transition: all 0.3s;
                transition: all 0.3s;
                display: inline-block;
            }

                .custom-switcher input[type=checkbox] ~ b:before {
                    position: absolute;
                    content: '';
                   inline-size: 22px;
                   block-size: 22px;
                    text-align: center;
                    font-size: 13px;
                    font-weight: bolder;
                    line-height: 1.8;
                    display: inline-block;
                    border-radius: 50%;
                    background: #fff;
                   inset-block-start: 1px;
                   inset-inline-start: 2px;
                    z-index: 1;
                    -webkit-transition: all 0.3s;
                    -moz-transition: all 0.3s;
                    -ms-transition: all 0.3s;
                    transition: all 0.3s;
                }

            .custom-switcher input[type=checkbox]:checked ~ b:before {
                content: '';
               inset-inline-start: 21px;
                -webkit-transition: all 0.3s;
                -moz-transition: all 0.3s;
                -ms-transition: all 0.3s;
                transition: all 0.3s;
                background-color: #ffffff;
            }

            .custom-switcher input[type=checkbox]:checked ~ b {
                background: #252a45;
                -webkit-transition: all 0.3s;
                -moz-transition: all 0.3s;
                -ms-transition: all 0.3s;
                transition: all 0.3s;
            }
    /*==================================
    Input Date Search
====================================*/
    :is(.input-group.date,.input-group:not(:has(.input-group-btn))) {
        /*border: 1px solid #d2d6de;*/
        box-shadow: 0 0 0 1px #d2d6de;
        border-radius: 4px;
        overflow: hidden;
       inline-size: 100%;
    }

    :is(.input-group.date,.input-group:not(:has(.input-group-btn,[readonly],[disabled]))):focus-within {
        /*border-color: var(--theme-lightbg);*/
        box-shadow: 0 0 0 1px var(--theme-darkColor);
    }

    :is(.input-group.date,.input-group:not(:has(.input-group-btn))) :is(.form-control,.input-group-addon) {
        border: none;
    }

    :is(.input-group.date,.input-group:not(:has(.input-group-btn))) :is(.form-control + .input-group-addon + .input-group-addon) {
        border-inline-start: 1px solid #d2d6de;
    }

    :is(.input-group.date,.input-group:not(:has(.input-group-btn))) .input-group-addon:first-child:nth-last-child(2) {
        position: absolute;
        inset-block-start: 0;
        inset-inline-start: 0;
        z-index: 1;
       block-size: 100%;
        pointer-events: none;
        padding: 11px 12px;
    }

    :is(.input-group.date,.input-group:not(:has(.input-group-btn))) .form-control:not(:first-child) {
        padding-inline: 55px 6px;
    }

    :is(.input-group.date,.input-group:not(:has(.input-group-btn))) .form-control:focus {
        z-index: 0;
    }

.GenralLedgerStatementSearch #btnSave, .incomeStatementSearch #btnSearch {
    border-radius: 4px !important;
    padding-block: 10px !IMPORTANT;
    padding-inline: 17px !IMPORTANT;
}

    .input-group:has(.input-group-btn) {
        box-shadow: 0 0 0 1px #d2d6de;
        border-radius: 4px;
        overflow: hidden;
    }

    .sidebar-form .input-group:has(.input-group-btn) {
        border-radius: 3px;
    }

    .input-group:has(.input-group-btn) :is(.form-control,.input-group-btn) {
        border: none;
    }

    .input-group:has(.input-group-btn) :is(.form-control,.input-group-btn >.btn) {
        background-color: #fff;
        color: currentColor !IMPORTANT;
        border: 0;
    }

    .input-group:has(.input-group-btn) :is(.form-control + .input-group-btn .btn + .btn) {
        border-inline-start: 1px solid #d2d6de;
    }

    .input-group:has(.input-group-btn):not(:has([readonly],[disabled])):focus-within {
        box-shadow: 0 0 0 1px var(--theme-darkColor);
    }

    .input-group:has(:is(.form-control[disabled],.form-control[readonly])) .form-control ~ .input-group-addon {
        background-color: #eee;
    }

    .form-group > .input-group:not(:has(.form-control)) {
        border: 0;
        box-shadow: none;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
        Accordian
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
    .panel-title a[data-toggle="collapse"] i:before {
        content: "\f068";
    }

    .panel-title a[data-toggle="collapse"].collapsed i:before {
        content: "\f067";
    }

    .panel-default > .panel-heading {
        background-color: #f6f7fa;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Login
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
    .login-page {
        background: #f8f8f8;
    }

.login-box, .register-box {
    max-width: 500px;
    inline-size: 100%;
    margin-block: 0%;
    margin-inline: auto;
    padding-block: 35px 10px;
    padding-inline: 0;
    background: #fff;
}

.login-box-body, .register-box-body {
    background: #fff;
    padding-block: 0px 30px;
    padding-inline: 50px;
    border-block-start: 0;
    color: #666;
}

    .login-logo, .register-logo {
        font-size: 29px;
        margin-block-end: 0;
    }

        .login-logo img, .register-logo img {
            display: block;
            margin: 0 auto;
           inline-size: 114px;
           block-size: 100px;
            object-fit: contain;
        }

.login-box-msg, .register-box-msg {
    line-height: 1;
    margin: 0;
    text-align: center;
    padding-block: 0 8px;
    padding-inline: 20px 20px;
}

    .login-page .navbar-default {
        border: none;
    }

.login-box-body .form-control {
    border-radius: 0;
    box-shadow: none;
    border-color: #d2d6de;
    border-style: none none solid none;
    padding-block: 6px;
    padding-inline: 0;
}

    .login-box-body .form-control-feedback {
       inline-size: 18px;
       block-size: 34px;
    }

        .login-box-body .form-control-feedback.fa-lock {
            font-size: 20px;
        }
:is(.login-page,.site-config-box) .form-control-feedback.fa {
    font-family: 'FontAwesome' !important;  
}
.login-box .login-box-body #SmartAlert {
    position: absolute;
    margin-inline-start: 0;
    inset-block-end: 0;
}
/*---------------------------------
    Sub Login
---------------------------------*/
.sublogin {
    background: url(../Images/account1.jpg) no-repeat center top;
    background-size: cover;
    padding-block-start: 5vh;
}

    .sublogin .login-box {
        max-inline-size: none;
        padding: 0px 0 10px;
       block-size: calc(100% - 3.8%);
        border-end-end-radius: 2.5rem;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .sublogin [class^=col-md-]:has(.login-box) {
       block-size: 100% !important;
    }

    .sublogin :is(.login-box-body, .register-box-body) {
        padding-block: 0px 30px;
        padding-inline: 90px;
    }

    .sublogin .row:has(.login-box) {
       block-size: 100%;
        margin-inline: 0;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        border-radius: 3.5rem;
        overflow: hidden;
    }

    .sublogin .form-img {
       inline-size: 100%;
       block-size: 100%;
        object-fit: cover;
        position: relative;
        border-start-start-radius: 3.5rem;
        border-end-start-radius: 3.5rem;
    }

    .sublogin :is(.login-box-body) {
        border-end-start-radius: 3.5rem;
        border-end-end-radius: 3.5rem;
    }

.sublogin-form {
    block-size: calc(100% - 17px );
    background-color: rgb(255 255 255 / 17%);
    backdrop-filter: blur(1px);
    -webkit-backdrop-filter: blur(5px);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    border-radius: 3.7rem;
    margin-inline: auto;
    /*padding: 2.6rem;*/
    padding-block: 2.6rem 3.8rem;
    padding-inline: 2.6rem;
    position: relative;
    overflow: hidden;
}

    .sublogin-form [class^=col-md-]:has(.form-img) {
       block-size: 100%
    }

        .sublogin-form [class^=col-md-]:has(.form-img):before {
            content: '';
            position: absolute;
            border-end-start-radius: 3.5rem;
            border-start-start-radius: 3.5rem;
           inline-size: 100%;
           block-size: 100%;
            inset-block-start: 0;
            inset-inline-start: 0;
            background-color: rgb(255 255 255 / 0%);
            z-index: 2
        }
    .sublogin-form .main-footer1 {
        text-align: center;
        padding-block-start: 0.9rem;
    }
@media(min-width:992px) {
    .sublogin-form {
        max-inline-size: 95%;
    }

    .sublogin {
        padding-block-start: 2vh;
    }
}

@media(max-width:991px) {
    .sublogin {
        padding-block-start: 0;
    }

    .sublogin-form {
        overflow: visible;
       block-size: auto;
        max-inline-size: 100%;
    }

    .sublogin .row:has(.login-box) {
       block-size: auto;
        overflow: visible;
    }

    .sublogin-form > .row.gutters-0 {
        display: flex;
        flex-direction: column
    }

        .sublogin-form > .row.gutters-0 > [class^=col-md-]:first-child {
            order: 2;
        }

    .sublogin .navbar-default {
        border-start-start-radius: 3.5rem;
        border-start-end-radius: 3.5rem;
    }

    .sublogin .login-box {
        border-end-end-radius: 3.5rem;
        border-end-start-radius: 3.5rem;
        margin-block-end: 3rem;
    }

    .sublogin :is(.login-box-body) {
        border-end-start-radius: 3.5rem;
        border-end-end-radius: 3.5rem;
    }

    .sublogin .form-img {
        border-radius: 3.5rem;
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    }
    .content-header > .breadcrumb {
        inset-inline:auto 0;
        padding-inline:10px inherit;
    }
    .navbar-custom-menu .navbar-nav > li {
        float: inline-start
    }

    .navbar-custom-menu .navbar-nav {
        float: inline-start;
    }
    .navbar-collapse.pull-left + .navbar-custom-menu {
        inset-inline:auto 40px;
    }

    .navbar-custom-menu > .navbar-nav {
        float: inline-end
    }
        .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
           
            inset-inline:auto 5%;
        }
    .error-page > .error-content {
        margin-inline:0 auto;
    }
}

@media(max-width:767px) {
    .sublogin-form {
        padding: 1.3rem;
    }

    .sublogin :is(.login-box-body) {
        padding-block: 0px 30px;
        padding-inline: 60px;
    }
}
.sublogin .prepage-loader, .sublogin .custom-loader {
    inset-block: 0;
    inset-inline: 0;
}
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
            Site Configration
 \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
    .siteconfiguration {
    background: url(../Images/account1.jpg) no-repeat center top;
    background-size: cover;
    padding-block-start: 6rem;
}
    .siteconfiguration .navbar-default {
        background-color: #fff;
        border-start-end-radius: 3.5rem;
        padding-inline: 4rem;
        min-block-size: auto;
        margin-block-end: 0;
        position: absolute;
        inset-inline-end: 1rem;
        inset-block-start: 3.9rem;
        z-index: 2;
    }
.site-config-box {
    max-inline-size: 960px;
    position: relative;
    border-radius: 3.5rem;
    min-block-size: 77vh;
}
    .site-config-box:after {
        content: '';
        position: absolute;
        inset: -2.6rem;
        background-color: rgb(255 255 255 / 17%);
        backdrop-filter: blur(1px);
        -webkit-backdrop-filter: blur(5px);
        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
        border-radius: 3.7rem;
        z-index:-1
    }
.siteconfiguration .footer-seprator:before {
    background-image: linear-gradient(to right, transparent, rgb(68 68 68), transparent, transparent, rgb(68 68 68), transparent);
}
.siteconfiguration .footer-seprator h3 {
    background-color: transparent !important;
}
.siteconfiguration .navbar-nav > li > a {
    padding: 0;
    font-size: 1.6rem;
}

.site-config-box :is(.form-control-feedback.fa, .form-control-feedback) {
    line-height: 48px;
    font-size: 20px;
    color: rgb(20 90 51);
    pointer-events: initial;
}
:is(.login-page,.site-config-box) .form-control-feedback {
    inset-block-start: 16px;
    block-size: 18px;
    line-height: 1 !important;
    pointer-events: initial !important;
    inset-inline: auto 0;
}
        .site-config-box .heading-seprator h3 {
        font-size: 24px !important;
    }
    .site-config-box .config-steps {
        list-style: none;
        padding: 0;
        display: flex;
        justify-content: space-between;
        margin-block-end: 2.6rem;
    }
        .site-config-box .config-steps li {
            background-color: #1F7245;
            color: #fff;
            flex: 1;
            text-align: center;
            padding-block: 1.2rem;
            margin-block-start: 0.5rem;
        }
            .site-config-box .config-steps li.active {
                font-weight: bold;
                color: #d8b147;
                background-color: rgb(20 90 51)
            }
.site-config-box :is(.btn-primary,.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary:active:focus) {
    background-color: var(--theme-lightbg);
    border-color: var(--theme-lightbg);
    color: #fff;
}
.site-config-box .btn{
    border-radius: 3px !important;
}

.avatar-upload {
    position: relative;
    max-inline-size: 125px;
    margin-block: 1rem 0;
    margin-inline: auto;
}

    .avatar-upload .avatar-edit {
        position: absolute;
        inset-inline-end: 12px;
        z-index: 1;
        inset-block-start: 10px;
    }

        

    .avatar-upload .avatar-preview {
       inline-size: 112px;
       block-size: 112px;
        position: relative;
        border-radius: 100%;
        border: 6px solid #F8F8F8;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
    }

        .avatar-upload .avatar-preview > div {
            inline-size: 100%;
            block-size: 100%;
            border-radius: 100%;
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center;
        }
    .avatar-upload .avatar-edit input {
        display: none;
    }

        .avatar-upload .avatar-edit input + label {
            display: inline-block;
           inline-size: 34px;
           block-size: 34px;
            margin-block-end: 0;
            border-radius: 100%;
            background: #FFFFFF;
            border: 1px solid transparent;
            box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
            cursor: pointer;
            font-weight: normal;
            transition: all 0.2s ease-in-out;
        }

            .avatar-upload .avatar-edit input + label:hover {
                background: #f1f1f1;
                border-color: #d6d6d6;
            }

            .avatar-upload .avatar-edit input + label:after {
                content: "\f040";
                font-family: 'FontAwesome';
                color: #365a35;
                position: absolute;
                inset-block-start: 10px;
                inset-inline: 0;
                text-align: center;
                margin: auto;
            }

.site-config-box .form-control:focus {
    border-color: rgb(20 90 51) !important;
}
.site-config-box select {
    background: #fff url(/Images/arrow-downG.png) top 13px right 0 no-repeat !important;
    background-size: 27px !important;
}
.site-config-box :is(#div2, #div3) {
    display: none;
}

.site-config-box :is(#prev, #complete) {
    display: none;
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Sidebar
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.main-sidebar, .main-header .logo {
    position: fixed;
}

    .sidebar {
        overflow: hidden !IMPORTANT;
        position: relative;
       block-size: 72vh !important;
        overflow-y: auto !IMPORTANT;
    }

    .skin-blue .wrapper {
        background-color: #f5f7fa;
    }

    .skin-blue .main-sidebar, .skin-blue .left-side, .skin-blue .main-header .logo {
        background-color: var(--theme-lightbg);
        color: var(--theme-leftbar-links);
        border-block-end: 1px solid var(--theme-darkbg);
    }

    .skin-blue .main-header .logo {
       inset-block-start: 0;
    }

        .skin-blue .main-header .logo:hover {
            background: var(--theme-lightbg);
            color: var(--theme-leftbar-links-hover);
            text-decoration: none;
        }

.sidebar-menu {
    padding-block: 0  0;
    padding-inline: 12px 0;
}

    .sidebar-menu > li > a {
        padding-block: 9px 9px;
        padding-inline: 5px 15px;
    }

        .sidebar-menu .treeview-menu > li > a > .fa.fa-circle-o {
            color: #00a65a
        }

:is(.sidebar-menu,.sidebar-menu1) > li > a > :is(.fa, .glyphicon,.icon){
   inline-size: 22px;
    font-size: 17px;
}

.skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.active > a {
    color: var(--theme-leftbar-links-hover);
    background: var(--theme-lightbg);
    border-inline-start-color: var(--theme-lightbg);
    border-inline-end-color: transparent;
}

.sidebar-menu li.treeview > a {
    border-start-start-radius: 0;
    border-start-end-radius: 10px;
    border-end-start-radius: 0;
    border-end-end-radius: 0;
}

.sidebar-menu .treeview-menu {
    border-start-start-radius: 0;
    border-start-end-radius: 0;
    border-end-start-radius: 10px;
    border-end-end-radius: 0;
}

    .sidebar-menu .treeview-menu > li > a {
        padding-block: 0 15px;
        padding-inline: 5px 15px;
    }

.skin-blue .sidebar-menu > li:hover > a, .skin-blue .sidebar-menu > li.treeview.active > a {
    color: var(--theme-leftbar-links-hover);
    border-inline-color: var(--theme-lightbg);
    background-color: var(--theme-lightbg);
    border-start-start-radius: 0;
    border-start-end-radius: 10px;
    border-end-start-radius: 0;
    border-end-end-radius: 0;
}

    .sidebar-menu li > a > .fa-angle-left, .sidebar-menu li > a > .pull-right-container > .fa-angle-left {
        transition: transform 0.3s;
        margin-inline:auto;
    }

    .sidebar-menu li.active > a > .fa-angle-left, .sidebar-menu li.active > a > .pull-right-container > .fa-angle-left {
        transition: transform 0.3s;
    }

    .skin-blue .treeview-menu > li > a {
        color: #ececec;
    }

.skin-blue .sidebar-form {
    border: none;
    margin-block: 20px 12px;
    margin-inline: 9px;
}

    .skin-blue .treeview-menu > li.active > a > .fa:before, .skin-blue .treeview-menu > li > a:hover > .fa:before {
        content: '\f111';
        font-family: FontAwesome;
    }

.skin-blue .sidebar-form input[type="text"] {
    border-start-start-radius: 6px;
    border-start-end-radius: 0;
    border-end-start-radius: 6px;
    border-end-end-radius: 0;
    background-color: var(--theme-darkbg) !important;
}

        .skin-blue .sidebar-form input[type="text"]:focus, .skin-blue .sidebar-form input[type="text"] + .input-group-btn .btn, .skin-blue .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
            background-color: var(--theme-darkbg) !important;
        }

.skin-blue .sidebar-form .btn {
    border-start-start-radius: 0;
    border-start-end-radius: 6px;
    border-end-start-radius: 0;
    border-end-end-radius: 6px;
    background-color: var(--theme-darkbg)
}

        .skin-blue .sidebar-form input[type="text"]:focus, .skin-blue .sidebar-form .btn:focus {
            outline: none;
        }

.skin-blue .sidebar a {
    color: var(--theme-leftbar-links);
    font-weight: 700;
}
.skin-blue .treeview-menu > li > a {
    color: var(--theme-leftbar-links);
}
.skin-blue .treeview-menu > li.active > a, .skin-blue .treeview-menu > li > a:hover {
    color: var(--theme-leftbar-links-hover);
}
.skin-blue .sidebar-menu > li > .treeview-menu {
    background-color: var(--theme-darkbg);
    margin: 0;
}

    .sidebar-menu li a .fa-stack {
       inline-size: 1.3em;
       block-size: 1.3em;
    }

        .sidebar-menu li a .fa-stack .fa-stack-1x {
            font-size: 10px;
           inset-block-start: -5px;
            font-weight: bold;
        }

        .sidebar-menu li a .fa-stack .fa-stack-2x {
            font-size: 1.3em;
        }

    .sidebar-menu1 {
        position: fixed;
        inset-block-end: 0;
        padding: 0;
        list-style: none;
        padding-inline-end: 0;
       inline-size: 280px;
    }

        .sidebar-menu1 li a {
            position: relative;
            padding: 5px 15px;
            display: block;
        }

.sidebar-menu1:hover {
    overflow: visible;
}
.main-sidebar, .left-side {
    inset-inline:0 auto;
}
.bg-sidebargreen3 .sidebar-menu > li > .treeview-menu :is(a,a .fa) {
    color: rgb(216 177 71 / 66%) !important;
}
    @media (min-width: 768px) {
        .sidebar-mini.sidebar-collapse .sidebar-menu1 > li > a > .link-text {
            display: none !important;
            -webkit-transform: translateZ(0);
        }
        .sidebar-collapse .content-wrapper, .sidebar-collapse .right-side, .sidebar-collapse .main-footer {
            margin-inline:auto 0;
        }
         .sidebar-mini.sidebar-collapse .sidebar-menu1 {
       inline-size: 50px !important;
    }
     
        .skin-blue .sidebar-menu1 > li:hover > a {
            color: var(--theme-leftbar-links-hover);
            border-inline-end-color: var(--theme-lightbg);
            background-color: var(--theme-lightbg);
            border-start-end-radius: 0;
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu1 > li:hover > a > .link-text {
            inset-block-start: 0;
            margin-inline-start: -3px;
            padding-block: 12px;
            padding-inline: 5px 20px;
            background-color: inherit;
            border-start-end-radius: 4px;
            border-end-end-radius: 4px
        }

            .sidebar-mini.sidebar-collapse .sidebar-menu1 > li:hover > a > .link-text:not(.pull-right), .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
                display: block !important;
                position: absolute;
                inline-size: 180px;
                inset-inline-start: 50px;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu1 > li:hover > a > .link-text:not(.pull-right), .sidebar-menu1.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
               inline-size: 240px;
            }
        .sidebar-mini.sidebar-collapse .content-wrapper, .sidebar-mini.sidebar-collapse .right-side, .sidebar-mini.sidebar-collapse .main-footer {
            margin-inline: 50px auto !important;
        }
        .sidebar-mini.sidebar-collapse .sidebar-menu > li {
            position: relative
        }


            .sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
              
                margin-inline: auto 0;
            }


            .sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview) > a > span {
                border-end-end-radius: 4px;
                border-end-start-radius: initial;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu {
                border-end-end-radius: 4px;
                border-end-start-radius: initial
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right), .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
                inset-inline:50px auto;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span {
                margin-inline:-3px auto;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container {
                float: inline-end;
                inset-inline:180px auto !important;
            }


            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
                margin-inline: 0 auto;
            }



        .sidebar-mini.sidebar-collapse .main-header .navbar {
            margin-inline: 50px auto;
        }
        .sidebar-mini.sidebar-collapse #SmartAlert, .sidebar-mini.sidebar-collapse .btnSmartAlertAgain {
            margin-inline: 50px auto;
        }
        .control-sidebar-open .content-wrapper, .control-sidebar-open .right-side, .control-sidebar-open .main-footer {
            margin-inline: auto 230px;
        }
    }
    /*Sidebar hover*/
    .sidebar-mini.sidebar-collapse .main-sidebar, .sidebar-mini.sidebar-collapse .main-sidebar .sidebar {
        overflow: visible !IMPORTANT;
        overflow-y: visible !important;
    }
.sidebar-mini.sidebar-collapse :is(.sidebar-menu,.sidebar-menu1) > li > a {
    padding-block: 7px;
    padding-inline: 15px 5px;
}
        .sidebar-mini.sidebar-collapse .main-sidebar .sidebar .sidebar-menu {
            padding: 0 0 0 0;
        }
    /*Sidebar right*/

.control-sidebar-dark, .control-sidebar-dark + .control-sidebar-bg {
    background-color: var(--theme-lightbg);
}
    .control-sidebar-dark .nav-tabs.control-sidebar-tabs > :is(li,li.active) > :is(a,a:hover,a:focus,a:active) {
        background-color: transparent !important;
        color: var(--theme-darkColor);
        background-color: transparent;
        font-size: 20px;
    }

        .control-sidebar-dark h3 {
            font-size: 19px !important;
        }

        .control-sidebar-dark .control-sidebar-menu > li > a:hover {
            background: transparent;
        }

.control-colortheme {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap:wrap;
    gap:2% 3.6%;
}

    .control-colortheme li {
        align-items: center;
        margin-block-end: 7px;
        vertical-align: top;
        border-radius: 67px;
        /*padding: 1px 4px;*/
        padding-block: 1px;
        padding-inline: 4px;
        border: 1px solid var(--theme-darkbg);
        cursor: pointer;
    }


            .control-colortheme li .fa {
                font-size: 39px;
                position: relative;
                color: #222a45;
            }

            .control-colortheme li span {
                display: inline-block;
                text-align: center;
                -webkit-flex: 1;
                flex: 1;
            }

.rightsidebardefalt .fa {
    color: #222a45;
}

.rightsidebarpurple .fa {
    color: #56368e !important ;
}

.rightsidebardarkgray .fa {
    color: #272c33 !important
}

.rightsidebarlight .fa {
    color: #edf0f2 !important;
}

    .rightsidebargreen .fa {
        color: rgb(18 84 47) !important;
    }

    .rightsidebargreen2 .fa {
        color: rgb(18 84 47) !important
    }

    .rightsidebargreen3 .fa {
        color: rgb(183 153 71) !important;
    }
.rightsidebarnavyblue .fa {
    color: #00296b !important;
}
.control-colortheme li.selected {
    box-shadow: inset 0px -3px 4px 2px var(--theme-lightbg);
    border-color: var(--theme-darkColor);
}
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Rightbar
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
    #control-sidebar-settings-tab > form {
        display: flex;
        flex-wrap: wrap;
        /*height: 80vh;*/
        /*flex-direction: column;*/
    }
.control-sidebar {
    position:fixed;
}
    .control-sidebar :is(h3,.h3, h4, .h4) {
        color: var(--theme-leftbar-links) !important
    }
    .control-sidebar-subheading {
        list-style: none;
        padding: 0;
        margin-block-start: auto;
        color:var(--theme-leftbar-links) !important
    }

.sitesetting-list {
    list-style: none;
    padding: 0;
    margin: 0;
    color: var(--theme-leftbar-links);
    padding-block-end: 6px;
    margin-block-end: 9px;
    border-block-end: 1px solid transparent;
    border-image: linear-gradient(0.25turn, var(--theme-lightbg), #fff, var(--theme-lightbg));
    border-image-slice: 1;
}

        .sitesetting-list > li {
            display: flex;
            align-items: center;
            padding-block: 0.15rem
        }

.setting-input {
    position: relative;
    display: flex;
}

        .setting-input .edit-sitelist {
            font-size: 12px;
        }

    .sitesetting-list li .form-control {
       inline-size: 34px;
        margin-inline: 0.5rem;
       block-size: auto;
        padding: 0;
        font-weight: bold;
        text-align: center;
    }

        .sitesetting-list li .form-control.plain-form-control {
            background-color: transparent;
            color: var(--theme-leftbar-links);
            border-color: transparent !important;
        }

    .sitesetting-list li .edit-sitelist {
        display: none;
        cursor: pointer;
    }

    .sitesetting-list li:has(.form-control.plain-form-control):hover .edit-sitelist {
        display: block;
        text-align: center
    }

    .sitesetting-list li:has(.form-control):hover .edit-sitelist {
        display: none;
    }
.setting-input:has(.edit-sitelist):is(:hover,:focus-within) .plain-form-control {
    border: 1px solid currentColor !important;
}
.sitesetting-list li .actions {
    display: none;
    text-align: center;
    margin-inline-end: 0.5rem;
}

        .sitesetting-list li .actions .fa {
            display: block;
            cursor: pointer;
            font-size: 12px;
        }

    .sitesetting-list2 li, .sitesetting-list2 li label {
        cursor: pointer;
    }

        .sitesetting-list2 li + li {
            margin-block-start: 0.3rem;
        }

        .sitesetting-list2 li img {
           inline-size: 22px;
           block-size: 22px;
            object-fit: contain;
        }

        .sitesetting-list2 li label {
            margin-inline-start: 1rem;
            line-height: 1.1;
            flex: 1;
            margin-block-end: 0;
        }
:is(.help-links,.help-links a) {
    color:var(--theme-leftbar-links);
}
/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Quickadd Sidebar
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.quickadd-sidebar, .quick-sidebar {
    position: fixed;
    inset-inline-end: 0;
    inset-block: 0px;
   inline-size: 600px;
    /*transform: translateX(100%);*/
    transform: translateX(101%);
    transition: transform 0.3s;
    background-color: #fff;
    padding-block: 50px 20px;
    padding-inline: 30px 15px;
    z-index: 5;
}

.quickadd-sidebar1, .quickadd-sidebar-layout, .quickadd-sidebar-layout-voucher, .quickadd-sidebar-layout-report, .quickadd-sidebar-company, .quick-sidebar {
    position: fixed;
    inset-inline-end: 0;
    inset-block-start: 0px;
    inset-block-end: 0px;
   inline-size: 600px;
    transform: translateX(101%);
    transition: transform 0.3s;
    background-color: #fff;
    padding-block: 50px 20px;
    padding-inline: 30px 15px;
    z-index: 850;
    box-shadow: 0px 7px 9px rgb(0 0 0 / 47%);
}
:is(.quickadd-sidebar1,.quickadd-sidebar-layout,.quickadd-sidebar-layout-voucher,.quickadd-sidebar-layout-report, .quickadd-sidebar-company,.quick-sidebar) > h4:first-child {
    white-space: nowrap;
}
:is(.quickadd-sidebar1,.quickadd-sidebar-layout,.quickadd-sidebar-layout-voucher,.quickadd-sidebar-layout-report, .quickadd-sidebar-company,.quick-sidebar) > h4 span[id="lblFileName"] {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    font-weight: 300;
    font-size: 15px;
   inline-size: 21em;
}

.toggle-quickaddsidebar, .toggle-quickaddsidebar1, .toggle-quickaddsidebar2 {
    transform: translateX(0) !important;
    transition: transform 0.3s;
}

    .btns-quicksidebar {
        position: absolute;
       inset-block-end: 50px;
        text-align: center;
    }
.btn-moredetail {
   block-size: 12px;
    background-color: #fff;
    border-radius: 3px;
    cursor: pointer;
    position: absolute;
    inset-block-end: 1rem;
    inset-inline: 0;
}
    .btn-moredetail:hover:before {
    display:block;
    }
    .btn-moredetail:before {
        content: '';
        background-color: #000;
       block-size: 100%;
        color: #fff;
        border-radius: 3px;
        cursor: pointer;
        position: absolute;
        margin-block-start: 0;
        inset-inline: 20%;
    }

.btn-AccountMoreDetail {
   block-size: 26px;
    background-color: #fff;
    border-radius: 3px;
    cursor: pointer;
    position: fixed;
    inset-block-end: 0;
    inset-inline: 0;
    z-index: 10;
}

.btn-AccountMoreDetail:hover:before {
    display: block;
}

    .btn-AccountMoreDetail:before {
        content: '';
        background-color: #000;
       block-size: 13px;
        color: #fff;
        border-radius: 3px;
        cursor: pointer;
        position: absolute;
        margin-block-start: 10px;
        inset-inline: 20%;
        animation-name: blinkoverlayline;
        animation-duration: 1s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        animation-direction: alternate;
    }

.sub-quickadd {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    background-color: #fff;
    inline-size: 100%;
    block-size: 100%;
    box-shadow: 0px 7px 9px rgb(0 0 0 / 47%);
    padding-block: 5rem;
    padding-inline: 3rem;
    transform: scaleY(0);
    transform-origin: bottom;
    transition: transform 0.3s;
    z-index: 10;
}
    .sub-quickadd.openSubQuickadd {
        transform: scaleY(1);
        transition: transform 0.3s;
    }
.DivAccountDetail {
    overflow-y: auto;
    max-height: calc(100vh - 130px);
    padding-inline: 15px;
}
.quickdoc-sidebar {
    position: absolute;
    inset-inline-end: calc(100% + 30px);
    inset-block-start: 55px;
    border-radius: 7px !important;
    padding-block: 16px 10px !important;
    padding-inline: 16px !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, .175);
    inline-size: 400px;
    background-color: #fff;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform 0.3s;
}
.quickadd-sidebar1.toggle-quickaddsidebar1 .toggle-quickdoc-sidebar, .quickadd-sidebar-layout-documents.toggle-quickaddsidebar1 .toggle-quickdoc-sidebar {
    transform: scaleX(1);
    transition: transform 0.3s;
}
.quickdoc-sidebar .quickdoc-list {
    list-style: none;
    padding: 0;
    margin: 0;
    max-height: 270px;
    overflow-y: auto;
}
        .quickdoc-sidebar .quickdoc-list li {
            padding: 10px;
            border-block-end: 1px solid #f4f4f4;
        }
    .quickdoc-sidebar .quickdoc-list li:focus {
       outline:none
    }

#QuickProfitPixUser {
   inline-size: 50px;
   block-size: 50px;
    border-radius: 50%;
    margin-inline-end: 0.4rem;
    object-fit: cover;
    border: 1px solid #d3d6de;
    padding: 2px;
    cursor:pointer;
}
.imgoverlay {
display:flex;
justify-content:center;
align-items:center;
padding-block-start:0;
}
    .imgoverlay .close {
        position: absolute;
        inset-block-start: 3rem;
        inset-inline-end: 3rem;
        font-size: 25px;
        background-color: #fff;
       inline-size: 30px;
       block-size: 30px;
        text-align: center;
        cursor: pointer;
    }
    .imgoverlay .zoomImg {
       inline-size: auto;
       block-size: 85vh;
        max-height: 90%;
        pointer-events:none !important;
    }
/*==============================
    Document Viewer
================================*/
.Viewer-docoments-wapper {
    display: flex;
    position: relative;
   inline-size: 100%;
   block-size: calc(100vh - 192px);
    overflow: hidden;
    margin-block: 2rem 10px;
    border-block-start: 1px solid #d2d6de;
    border-radius: 4px;
}
.view-toolbar {
   inline-size: 60px;
    background-color: var(--theme-lightbg);
    color: var(--theme-leftbar-links);
}
    .view-toolbar .toolbar-list {
        list-style: none;
        margin: 0;
        padding: 0;
        padding-block: 16px;
        display: flex;
        flex-direction: column;
        font-size: 30px;
       block-size: 100%;
        text-align: center;
    }
.toolbar-list .updown-arrow {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
    .toolbar-list .updown-arrow .fa {
        cursor:pointer;
    }
.view-toolbar .toolbar-list a {
    color: currentColor;
    line-height: 1;
    vertical-align: bottom;
}
.Viewer-docoments {
    flex: 1;
    position: relative;
    border: 1px solid currentColor;
    padding-block: 5px;
    padding-inline: 10px;
    overflow-y: auto;
    background-color: #fff;
    border-start-end-radius: 15px;
    border-end-end-radius: 15px;
}
    .Viewer-docoments:has(> img) {
    display:flex;
    justify-content:center;
    align-items:center;
    }
    .Viewer-docoments img {
       inline-size: 100%;
        max-inline-size: 100%;
        display: block;
        margin-inline: auto;
    }
    .Viewer-docoments table {
       empty-cells:hide;
    }
        .Viewer-docoments table :is(td,th) {
            border-block-end: 1px solid #d2d6de;
            padding: 8px;
        }
        .Viewer-docoments table tr:has(td:first-child:empty + td:empty) {
            display: none;
        }
.ViewDocumentInfo[data-extention="CSV"] {
    white-space: pre-line;
}

.Viewerdocoments-popup {
    position: fixed;
    inset-block-start: 0;
    inset-inline-start: 0;
    background-color: rgb(0 0 0 / 79%);
   inline-size: 100%;
   block-size: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1100;
    display: none;
}
    .Viewerdocoments-popup .Viewerdocoments-body {
        background-color: #fff;
       inline-size: 70vw;
       block-size: 92vh;
        padding: 9px;
        border-radius: 20px;
        overflow: hidden;
    }
.Viewerdocoments-body .Viewer-docoments {
   block-size: 100%;
   inline-size: auto;
    max-width: 100%;
    border-radius: 15px;

}
.close-Viewerdocoments, .download-Viewerdocoments {
    position: absolute;
    inset-inline-end: 3rem;
    inset-block-start: 2rem;
    font-size: 26px;
   inline-size: 40px;
   block-size: 40px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
    text-align: center;
    line-height: 1.53;
    cursor: pointer;
    transition: background-color 0.3s
}
    .close-Viewerdocoments:hover, .download-Viewerdocoments:hover {
        background-color: rgba(0, 0, 0, 0.8);
        transition: background-color 0.3s
    }
.download-Viewerdocoments {
    inset-block: auto 2rem;
}
    .nextprev {
    position: absolute;
    inset-inline: 2vw;
    font-size: 5rem;
    transform: translateY(-50%);
    inset-block-start: 50%;
    display: flex;
    justify-content: space-between;
    color: #fff;
}
    .nextprev :is(.next-Viewerdocoments,.prev-Viewerdocoments) {
        cursor:pointer;
    }
    /*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Loader
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
.custom-loader {
    position: fixed;
    inset-block: 53px 50px;
    inset-inline: 280px 0;
    background: rgba(0,0,0,0.3);
    display: none;
    color: #fff;
    z-index: 5;
}
body .loader {
   inline-size:auto;
   block-size:auto;
}
.sidebar-collapse :is(.custom-loader, .loader) {
    inset-inline: 50px 0;
    inset-block: 51px 50px;
}
body:has(:is(.custom-loader,.loader)[style*="display: block"]) :is(.main-header,.main-sidebar) {
    pointer-events: none
}



    .preloader {
        display: flex;
    }

    .preloader {
        animation: tiltSpin 8s linear infinite;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin: auto;
       inline-size: 17em;
       block-size: 17em;
    }

    .preloader, .preloader__ring {
        transform-style: preserve-3d;
    }

    .preloader__ring {
        animation-name: spin;
        animation-duration: 4s;
        animation-timing-function: inherit;
        animation-iteration-count: inherit;
        font-size: 2em;
        position: relative;
       block-size: 3rem;
       inline-size: 1.5rem;
    }

        .preloader__ring:nth-child(even) {
            animation-direction: reverse;
        }

    .preloader__sector {
        font-weight: 600;
        position: absolute;
       inset-block-start: 0;
       inset-inline-start: 0;
        text-align: center;
        text-transform: uppercase;
        transform: translateZ(7rem);
    }

        .preloader__sector, .preloader__sector:empty:before {
            display: inline-block;
           inline-size: 100%;
           block-size: 100%;
        }

            .preloader__sector:empty:before {
                background: linear-gradient(transparent 45%, currentColor 45% 55%, transparent 55%);
                content: "";
            }

            .preloader__sector:nth-child(2) {
                transform: rotateY(12deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(3) {
                transform: rotateY(24deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(4) {
                transform: rotateY(36deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(5) {
                transform: rotateY(48deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(6) {
                transform: rotateY(60deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(7) {
                transform: rotateY(72deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(8) {
                transform: rotateY(84deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(9) {
                transform: rotateY(96deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(10) {
                transform: rotateY(108deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(11) {
                transform: rotateY(120deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(12) {
                transform: rotateY(132deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(13) {
                transform: rotateY(144deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(14) {
                transform: rotateY(156deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(15) {
                transform: rotateY(168deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(16) {
                transform: rotateY(180deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(17) {
                transform: rotateY(192deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(18) {
                transform: rotateY(204deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(19) {
                transform: rotateY(216deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(20) {
                transform: rotateY(228deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(21) {
                transform: rotateY(240deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(22) {
                transform: rotateY(252deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(23) {
                transform: rotateY(264deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(24) {
                transform: rotateY(276deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(25) {
                transform: rotateY(288deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(26) {
                transform: rotateY(300deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(27) {
                transform: rotateY(312deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(28) {
                transform: rotateY(324deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(29) {
                transform: rotateY(336deg) translateZ(7rem);
            }

            .preloader__sector:nth-child(30) {
                transform: rotateY(348deg) translateZ(7rem);
            }




    /* Animations */
    @keyframes tiltSpin {
        from {
            transform: rotateY(0) rotateX(30deg);
        }

        to {
            transform: rotateY(1turn) rotateX(30deg);
        }
    }

    @keyframes spin {
        from {
            transform: rotateY(0);
        }

        to {
            transform: rotateY(1turn);
        }
    }


    .outer-loader {
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        justify-content: center;
        align-items: center;
       block-size: 100%;
       inline-size: 100%;
    }

    .InlineLoader {
        position: absolute;
       inset-inline-end: 30px;
       inset-block-start: 3px;
    }
   
    .inline-loader-sm:after {
        position: absolute;
       inset-block-start: 6px;
       inset-inline-start: 50%;
        transform: translate(-50%, 6px);
        font-size: 24px;
        z-index: 3;
        content: '\f1ce';
        font-family: "FontAwesome";
        -webkit-animation: fa-spin 2s infinite linear;
        animation: fa-spin 2s infinite linear;
    }

    @-webkit-keyframes fa-spin {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        100% {
            -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
        }
    }

    @keyframes fa-spin {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        100% {
            -webkit-transform: rotate(359deg);
            transform: rotate(359deg);
        }
    }

.lblWait:before {
    content: "Wait Please...";
    position: absolute;
    inset-block-start: 50%;
    inset-inline-start: 50%;
    transform: translate(-50%, -50%);
    z-index: 7;
    background: url(../../Images/loader.gif) no-repeat center;
    background-size: 58px;
   inline-size: 70px;
   block-size: 70px;
    white-space: nowrap;
   padding-block-start: 5.5rem;
}

.lblWait:after {
    content: '';
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    background-color: rgba(0,0,0,0.3);
   inline-size: 100%;
   block-size: 100%;
    z-index: 5;
}

.lblWait.lblWaitHide:before, .lblWait.lblWaitHide:after {
    display: none;
}
/*.alloversearch-menu .inline-loader-sm:after {
   margin-inline-start: 47px;
}*/
/*=================================
    Preloader
==================================*/
.prepage-loader {
    position: fixed;
    inset-block: 53px 50px;
    inset-inline: 280px 0;
    background: rgb(25 26 26 / 86%);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1040;
    font-family: ‘Arial Narrow’, sans-serif;
    display: none;
}
body:has(.prepage-loader[style="display: flex;"]) :is(.main-header, .main-sidebar ) {
    pointer-events: none;
}
.sidebar-collapse .prepage-loader {
    inset-inline: 50px 0;
    inset-block: 50px 48px;
}

#DivCenterContent {
    position: relative;
    /*min-block-size: 594px;*/
    position: relative;
   block-size: calc(100vh - 100px);
    overflow-y: auto;
    min-width: 768px;
    /*overflow-x: auto;*/
}
    #DivCenterContent:has(.content-wrapper1) {
       
        margin-inline: 280px 0;
       
    }
    #DivCenterContent .content-wrapper1 {
        block-size: calc(100vh - 102px);
        justify-content: end;
        align-items: center;
        display: flex;
        justify-content: center;
        padding-block: 2rem;
    }
.sidebar-collapse #DivCenterContent:has(.content-wrapper1) {
   block-size: calc(100vh - 102px);
    margin-inline: 50px 0;
}
.content-wrapper1 #excHolder {
    padding-top: 6vh;
}

.prepage-loader h2 {
    font-weight: 100;
    font-size: 1.6em;
    color: #a3e1f0 !IMPORTANT;
    margin-block-start: -20vh;
    direction: ltr;
}

    .prepage-loader span {
        position: relative;
       inset-block-start: 0.63em;
        display: inline-block;
        text-transform: uppercase;
        margin-inline: -2px;
        opacity: 0;
        transform: rotateX(-90deg);
    }

    .prepage-loader .me-1 {
        margin-inline-end: 0.4rem;
    }

.let1 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.1s;
}

.let2 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.2s;
}

.let3 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.3s;
}

.let4 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.4s;
}

.let5 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.5s;
}

.let6 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.6s;
}

.let7 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.7s;
}

.let8 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.8s;
}

.let9 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 0.9s;
}

.let10 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1s;
}

.let11 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.1s;
}

.let12 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.2s;
}

.let13 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.3s;
}

.let14 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.4s;
}

.let15 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.5s;
}

.let16 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.6s;
}

.let17 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.7s;
}
.let18 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.8s;
}
.let19 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 1.9s;
}
.let20 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2s;
}
.let21 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.1s;
}



.let22 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.2s;
}
.let23 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.3s;
}
.let24 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.4s;
}
.let25 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.5s;
}
.let26 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.6s;
}
.let27 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.7s;
}
.let28 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.8s;
}
.let29 {
    animation: drop 1.2s ease-in-out infinite;
    animation-delay: 2.9s;
}


@keyframes drop {
    10% {
        opacity: 0.5;
    }

    20% {
        opacity: 1;
       inset-block-start: 3.78em;
        transform: rotateX(-360deg);
    }

    80% {
        opacity: 1;
       inset-block-start: 3.78em;
        transform: rotateX(-360deg);
    }

    90% {
        opacity: 0.5;
    }

    100% {
        opacity: 0;
       inset-block-start: 6.94em
    }
}
/*==================================
    Datatable loader
====================================*/


/*\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
    Media queries
\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\*/
@media(min-width: 992px) {
}

    @media(min-width: 768px) {
        .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right), .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
           inline-size: 240px;
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .pull-right-container {
           inset-inline-start: 220px !important;
        }
    }

    @media (min-width:1025px) {
        :is(body, #DivCenterContent)::-webkit-scrollbar {
            inline-size: 10px;
            block-size: 5px;
            -webkit-appearance: none;
        }

        :is(body, .sidebar, .autocomplete-items,.table-responsive, .dataTables_scrollBody, .box .box-body, .tree-wrapper, .quickdoc-list, .quick-sidebar, #DivCenterContent)::-webkit-scrollbar-thumb {
            background-color: var(--theme-darkbg);
            border: none;
           block-size: 40px;
        }
        .table-responsive:has(.table-fixed-header,.custom-table,.fixed-table-header,.table-fixed-tbody-header)::-webkit-scrollbar-track {
            margin-block: 35px 10px;
            margin-inline: 0;
        }

        :is(body, .sidebar, .autocomplete-items, .box .box-body, #DivCenterContent)::-webkit-scrollbar-track {
            background-color: #f8f8f8;
            border: 2px solid transparent;
            margin: 0;
        }

        :is(.sidebar, .autocomplete-items,.status-steps-v, .box .box-body, body.sidebar-mini.sidebar-collapse:not(.sidebar-open) .sidebar-menu > li > .treeview-menu, .tree-wrapper)::-webkit-scrollbar {
            inline-size: 5px;
            block-size: 5px;
        }

        .sidebar-mini.sidebar-collapse:not(.sidebar-open) .sidebar-menu > li > .treeview-menu::-webkit-scrollbar-thumb {
            background-color: var(--theme-darkColor);
            block-size: 40px;
        }

         :is(.sidebar, .autocomplete-items, .box .box-body, .tree-wrapper, .DivAccountDetail, .Viewer-docoments, .quickdoc-list, .quick-sidebar, pre,#DivCenterContent,.table-responsive)::-webkit-scrollbar-thumb, .quick-sidebar ::-webkit-scrollbar-thumb, .box-body ::-webkit-scrollbar-thumb {
            background-color: var(--theme-darkColor);
        }

        :is(.sidebar, .autocomplete-items, .box .box-body, .tree-wrapper, .DivAccountDetail, .Viewer-docoments, .quickdoc-list, .quick-sidebar, #DivCenterContent,.table-responsive,.status-steps-v)::-webkit-scrollbar-thumb {
            background-color: var(--theme-darkColor);
        }

        :is(.table-responsive, .dataTables_scrollBody, .box .box-body, .DivAccountDetail, .Viewer-docoments, .quickdoc-list, .quick-sidebar, pre)::-webkit-scrollbar, :is(.quick-sidebar, .box-body) ::-webkit-scrollbar {
            inline-size: 7px;
            block-size: 7px;
            -webkit-appearance: none;
        }

        :is(.table-responsive, .dataTables_scrollBody, .box .box-body,.status-steps-v)::-webkit-scrollbar-track {
            background-color: #fff;
        }

        ::-webkit-scrollbar-track:horizontal {
           block-size: 5px;
        }

        .dataTables_scrollBody {
            overflow: visible !important;
        }

        body.sidebar-mini.sidebar-collapse:not(.sidebar-open) .sidebar-menu > li > .treeview-menu {
            max-height: 200px;
            overflow-y: auto !important;
        }

        .sidebar-collapse .HeaderCompanyName {
            display: flex
        }
        .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span {
            border-start-start-radius: 0;
            border-start-end-radius: 4px;
        }
        .table-responsive::-webkit-scrollbar-thumb, .dataTables_scrollBody::-webkit-scrollbar-thumb {
            background-color: var(--theme-darkColor);
        }
        .table-responsive::-webkit-scrollbar-thumb, .dataTables_scrollBody::-webkit-scrollbar-thumb {
            border: none;
            block-size: 40px;
        }
    }

    @media(max-width:1024px) {

        .HeaderCompanyName {
            display: flex
        }

        .HeaderCompanyName {
            margin-block-start: -48px;
        }

        .btns-evaluation {
            text-align: center;
            border: 0;
            -webkit-flex: 1;
            flex: 1;
        }

            .btns-evaluation .btn {
                border: 1px solid #272c33;
                padding-block: 6px !important;
                padding-inline: 17px !important;
                display: block;
                min-width: 100% !important
            }

                .btns-evaluation .btn + .btn {
                   margin-inline-start: auto;
                    margin-block-start: 8px;
                }

                    .btns-evaluation .btn + .btn:after {
                        content: normal;
                    }

        div.dt-buttons {
           margin-inline-start: auto;
        }
        /***********Nav dropdown*************/
        .btn-navbartoggle {
            display: block;
        }

        .navbar-custom-menu > .navbar-nav, .main-header .navbar-custom-menu, .main-header .navbar-right, .navbar-custom-menu > .navbar-nav, .navbar-custom-menu .navbar-nav > li {
            float: none;
        }


        .main-header .sidebar-toggle {
            float: none;
            font-size: 23px;
            margin-block-start: -3px;
            display: inline-block;
        }

        .navbar-custom-menu {
            display: none;
            background-color: #fff;
        }

        .main-header {
            max-height: inherit;
        }

        .navbar-custom-menu > .navbar-nav > li {
            position: relative;
        }

            .navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
                /*position: relative;*/
               inline-size: 100%;
               inset-inline-end: 0;
               inset-inline-start: 0;
                box-shadow: none;
                transform-style: initial;
                transform-origin: top;
                transform: scale(1);
                display: none;
            }

            .navbar-custom-menu > .navbar-nav > li.open > .dropdown-menu {
                position: relative;
                transform: scale(1);
                display: block;
               inline-size: 100% !IMPORTANT;
            }

        .navbar-custom-menu .dropdown-menu:before, .navbar-custom-menu .dropdown-menu-right:before {
            content: normal;
        }

        .skin-blue .main-header .navbar .nav > li > a:hover, .skin-blue .main-header .navbar .nav > li > a:active, .skin-blue .main-header .navbar .nav > li > a:focus, .skin-blue .main-header .navbar .nav .open > a, .skin-blue .main-header .navbar .nav .open > a:hover, .skin-blue .main-header .navbar .nav .open > a:focus, .skin-blue .main-header .navbar .nav > .active > a {
            background: #ffffff;
        }

        .navbar-custom-menu .dropdown-menu {
            padding-block: 3px 10px !important;
            padding-inline:28px !important;
        }

        .navbar-custom-menu .navbar-nav > li > a {
            line-height: 4px
        }

        .main-sidebar, .left-side {
           padding-block-start: 25px;
        }
        /*Nav dropdown ends*/
        /*features-grid*/
        .features-grid .col-lg-2 {
           inline-size: 33.3333%;
        }
        /*features-grid ends*/
        .control-rightbar {
            position: absolute;
           inset-inline-end: 57px;
           inset-block-start: 12px;
            z-index: 10;
            color: #32373e;
            font-size: 18px;
        }

        .WadaBhai {
            flex: 1;
            flex-direction: column;
            background-color: #d1d6de;
            padding: 20px;
        }

            .WadaBhai > div {
                flex: 0 0 100%;
                align-items: center;
                justify-content: center;
                display: flex;
            }

                .WadaBhai > div .form-control, .WadaBhai > div label {
                    flex: 0 0 100%;
                }
    }

    @media(max-width:767px) {
        .HeaderCompanyName {
            margin-block-start: -43px;
            font-size: 13px;
        }

        .features-grid .col-lg-2 {
           inline-size: 50%;
        }

        .sidebar-mini .main-header .logo .logo-mini {
            display: block;
            padding: 0;
        }

        .sidebar-mini.sidebar-open .main-header .logo .logo-lg {
            display: block;
        }

        .sidebar-mini.sidebar-open .main-header .logo .logo-mini {
            display: none;
        }
        /*.main-sidebar, .left-side,*/ .main-header .logo {
           inline-size: 50px;
        }
        /*Sidebarmini*/
        .sidebar-mini:not(.sidebar-open) .sidebar {
            overflow: visible !IMPORTANT;
            overflow-y: visible !IMPORTANT;
        }

        .sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu {
            overflow: visible;
            padding: 0 0 0 0;
        }

            .sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu > li > a > span {
                display: none;
            }

            .sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu > li:hover > a > span {
                display: inline-block;
            }

        body.sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu > li > a > span:not(.pull-right), body.sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu > li > .treeview-menu {
            position: absolute !important;
           inline-size: 220px;
           inset-inline-start: 50px;
            max-height: 150px;
            overflow-y: auto !important;
        }

        body.sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu .treeview-menu {
            display: none;
        }

        body.sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu > li > a > span {
            inset-block-start: 6px;
            margin-inline-start: -3px;
            padding-block: 7px 12px;
            padding-inline: 5px 20px;
            background-color: inherit;
        }

        body.sidebar-mini:not(.sidebar-open):not(.sidebar-collapse) .sidebar-menu > li > a > .pull-right-container {
            position: relative !important;
            float: inline-end;
           inline-size: auto !important;
           inset-inline-start: 236px !important;
           inset-block-start: 16px !important;
            z-index: 900;
        }

        /*Sidebarmini*/
        .main-sidebar {
            -webkit-transform: translate(0, 0);
            -ms-transform: translate(0, 0);
            -o-transform: translate(0, 0);
            transform: translate(0, 0);
           inline-size: 50px;
        }

        .sidebar-mini.sidebar-open .main-sidebar, .sidebar-mini.sidebar-open .left-side, .sidebar-mini.sidebar-open .main-header .logo {
           inline-size: 280px;
        }

        .content-wrapper, .right-side, .main-footer, .main-header .navbar {
           margin-inline-start: 50px;
        }

        .sidebar-mini.sidebar-open .right-side, .sidebar-mini.sidebar-open .main-header .navbar {
           margin-inline-start: 280px;
        }

        .main-header .navbar {
           inline-size: auto;
        }

        .sidebar-mini.sidebar-open .main-header .navbar {
           inline-size: 100%;
        }

        sidebar-mini .sidebar-menu > li > a > span {
            /* display: none;*/
        }

        .sidebar-mini.sidebar-open .sidebar-menu > li > a > span {
            display: inline;
        }

        .skin-blue .main-header .logo {
            padding: 0;
        }

        .form-control:not(.overallsearch,.breakEvenFilterAll) {
           block-size: 35px;
        }

        .select2-container--default .select2-selection--single .select2-selection__rendered {
            line-height: 15px;
        }

        .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single, .select2-selection .select2-selection--single {
            min-block-size: 35px;
        }

            .select2-container--default .select2-selection--single .select2-selection__arrow b {
                background: url(/../Images/arrow-downW.png) center right 24px no-repeat !important;
                margin-block-start: 2px;
            }

        #ItemsDiv > .row [class^=col-] {
            border-block-end: 0 !important
        }

        #ItemsDiv > .row:not(:last-child) {
            border-block-end: 1px solid #ccc !important;
            margin-block-end: 14px;
        }

        .action-items {
           padding-block-end: 14px;
            margin-block-start: 16px;
        }

        .form-group {
            margin-block-end: 5px;
        }

        .content-header > h1 {
            font-size: 21px;
        }

        .h3, h3 {
            font-size: 20px !IMPORTANT;
        }
        .content-wrapper, .right-side, .main-footer {
            margin-inline:auto 0;
        }
        .main-header .navbar-custom-menu {
            float: inline-end;
        }
        .navbar-nav > .user-menu .user-image {
            margin-inline: auto 0;
        }
    }

    @media print {

        .main-header {
            border-block-end: 1px solid #d2d6de;
        }

            .main-header :is(.logo, .sidebar-toggle,.control-rightbar,.btn-navbartoggle), .layoutoverlay-wrapper {
                display: none !important;
            }

            .main-header .navbar-custom-menu {
                float: inline-end !important;
            }

            .main-header .navbar-nav li:not(:is(:first-child,.user-menu,:nth-child(2))) {
                display: none;
            }

            .main-header .navbar-nav li.user-menu span.hidden-xs {
                display: block !important;
            }

        .navbar-custom-menu .navbar-nav > li > a {
            line-height: 20px;
            white-space: nowrap;
        }

        .navbar-custom-menu > .navbar-nav, .main-header .navbar-custom-menu, .main-header .navbar-right, .navbar-custom-menu > .navbar-nav, .navbar-custom-menu .navbar-nav > li {
            float: inline-start;
        }

        .main-header, .navbar-custom-menu {
            display: block !important;
        }

        .sidebar-mini.sidebar-collapse :is(.content-wrapper, .right-side, .main-footer,.main-header .navbar) {
            margin-inline-start: 0 !important;
            display: block;
        }

        [class^="dataTables_"] :is([class="dataTables_length"],.dt-buttons,.dataTables_filter) {
            display: none;
        }

        .navbar.navbar-static-top {
            display: flex !important;
            align-items: center;
        }

        .print-logo {
            display: flex;
            order: -1;
            align-items: center;
            margin-inline-end: auto;
        }

            .print-logo .printLogo {
                display: block !important;
                margin-inline-end: 1rem;
               inline-size: 70px;
            }

        .sidebar-collapse .HeaderCompanyName {
            -webkit-text-fill-color: inherit;
            text-align: start;
            margin-block-start: 0;
            display: initial !IMPORTANT;
            margin-inline-start: 0;
        }

        .features-grid {
            margin-block-start: 0;
        }

        .content {
            padding: 0;
        }

        .main-footer {
            margin-block-start: 1.5rem;
        }

            .main-footer .print-btn {
                display: none;
            }

        .box {
            border: 0;
            padding-block: 5px 15px;
            padding-inline: 0;
        }

        .box-body {
            padding-block: 10px 0;
            padding-inline: 0;
        }

        h3 {
            margin-block: 1rem !IMPORTANT;
        }

        a[href]:after {
            content: none !important;
        }


        .dataTables_scrollBody {
            overflow-x: auto;
        }

        .tree ul li {
            display: block !important
        }


        .iradio_minimal {
            background-image: url('images/minimal@2x.png') !important;
            background-position: -100px 0 !important;
            background-size: 200px 20px !important;
            background-repeat: no-repeat !important;
        }

            .iradio_minimal.checked {
                background-image: url('images/minimal@2x.png') !important;
                background-position: -140px 0 !important;
                background-size: 200px 20px !important
            }

        .icheckbox_minimal {
            background-image: url('images/minimal@2x.png') !important;
            background-position: 0 0 !important;
            background-size: 200px 20px !important;
            background-repeat: no-repeat !important;
        }

            .icheckbox_minimal.checked {
                background-image: url('images/minimal@2x.png') !important;
                background-position: -40px 0 !important;
                background-size: 200px 20px !important
            }

        label:has(+ .form-control,+.input-group.date,+.input-group>.form-control) {
           inline-size: 10em;
            overflow: hidden !IMPORTANT;
            text-overflow: ellipsis;
            white-space: nowrap;
            margin-block-end: 0;
        }

        .input-group-addon select {
           block-size: auto !important;
        }

        .select2-container .select2-selection--single .select2-selection__rendered {
            overflow-x: visible !important;
        }

        *:not(.select2-selection__arrow) {
            overflow-y: visible !important;
        }

        .BreakevenRateManageAllbox {
            box-shadow: 1px 1px 1px rgb(0 0 0 / 12%) !important;
        }

        .row {
            margin-inline: -5px;
        }

        .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
            float: inline-start;
           padding-inline-end: 5px;
           padding-inline-start: 5px;
        }

        .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xl-1 {
           inline-size: 8.33333333%;
        }

        .col-sm-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xl-2 {
           inline-size: 16.66666667%;
        }

        .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xl-3 {
           inline-size: 25%;
        }

        .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xl-4 {
           inline-size: 33.33333333%;
        }

        .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xl-5 {
           inline-size: 41.66666667%;
        }

        .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xl-6 {
           inline-size: 50%;
        }

        .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xl-7 {
           inline-size: 58.33333333%;
        }

        .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xl-8 {
           inline-size: 66.66666667%;
        }

        .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xl-9 {
           inline-size: 75%;
        }

        .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xl-10 {
           inline-size: 83.33333333%;
        }

        .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xl-11 {
           inline-size: 91.66666667%;
        }

        .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12, .col-xl-12 {
           inline-size: 100%;
        }

        ::-webkit-scrollbar {
           inline-size: 7px; /* width of vertical scrollbar */
           block-size: 7px; /* height of horizontal scrollbar ← You're missing this */
        }
        .input-group:is(.date), .input-group:has([readonly="readOnly"],[disabled="disabled"]) {
            box-shadow: 0 0 0 1px #d2d6de !important;
        }
        ::-webkit-scrollbar-track {
            border-radius: 0;
            background-color: #E0E0E0;
            border: 2px solid #E0E0E0;
            margin: 0;
        }

        ::-webkit-scrollbar-thumb {
            background-color: #BDBDBD !important;
            border-radius: 0;
            border: 2px solid #BDBDBD !important;
           block-size: 40px;
        }
    }

    .WadaBhai > div {
        display: flex;
        flex-wrap: wrap;
    }

.main-footer :is(.shortkeys-btn,.print-btn,.shortkeys-btn) {
    display: none;
    cursor: pointer;
}

.main-footer:hover :is(.print-btn, .shortkeys-btn,.shortkeys-btn) {
    display: block;
}

.line-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}