:root {

    --btnOutlineBGDanger__: 220, 53, 69, 1;
    --btnOutlineTextDanger__: 255, 255, 255, 1;
    --btnBGPrimary: 11, 94, 215, 1;
    --btnTextPrimary: 255, 255, 255, 1;
    --btnBgWarning: 255, 193, 7, 1;
    --btnTextWarning: 0, 0, 0, 1;
    --btnBGDanger__: 220, 23, 69, 1;
    --btnTextDanger__: 255, 255, 255, 1;


    --btnOutlineBgDanger: var(--btnOutlineBGDanger__);
    --btnOutlineTextDanger: var(--btnOutlineTextDanger__);
    --btnBGPrimary__: var(--btnBGPrimary);
    --btnTextPrimary__: var(--btnTextPrimary);
    --btnBGWarning__: var(--btnBgWarning);
    --btnTextWarning__: var(--btnTextWarning);
    --btnBGDanger: var(--btnBGDanger__);
    --btnTextDanger: var(--btnTextDanger__);

    --purple: 13, 110, 253;
    --dark-gray: 108, 117, 125;
    --sky: 13, 202, 240;
    --green: 25, 135, 84;
    --orange: 255, 193, 7, 1;
    --magento: 220, 53, 69;
    --white: 255, 255, 255;
    --light: 255, 255, 255;
    --black: 45, 45, 45, 1;
    --light-purple: 237, 236, 253;
    --light-gray: 238, 238, 238;
    --mid-light-gray: 164, 164, 164;
    --light-yellow: 250, 240, 170;
    --light-sky: 213, 232, 248;
    --display-no-Icon: none;
    --display-Icon: inline-block;
    --display-LblPos: left;
    --display-Shape: normal;
    --purple_1: rgba(127, 37, 177, 1);
    --dark-gray_1: rgba(193, 161, 211, 1);
    --sky_1: rgba(255, 255, 255, 1);
    --green_1: rgba(0, 175, 145, 1);
    --orange_1: rgba(255, 205, 163, 1);
    --magento_1: rgba(44, 46, 29, 1);
    --white_1: rgba(255, 255, 255, 1);
    --black_1: rgba(0, 0, 0, 1);
    --light-purple_1: rgba(255, 243, 230, 1);
    --light-gray_1: rgba(255, 243, 230, 1);
    --mid-light-gray_1: rgba(255, 243, 230, 1);
    --light-yellow_1: rgba(255, 243, 230, 1);
    --light-sky_1: rgba(255, 243, 230, 1);
    --defaultBgClr: 0,0,0,0;
    /* --wrngBgColor: rgba(226, 226, 226, 1); */
    /* --wrngBgColor_1: var(--wrngBgColor); */
    --defaultTxtClr: 0,0,0,0;
    /* --navBarMenu: var(--mid-light-gray); */
    --primaryTxtClr: 255,255,255,1;
    --blackTextClr: 45,45,45,1;
    --successBgClr: 25, 135, 84,1;
    --successTxtClr: 255,255,255,1;
    --dangerBgClr: 220, 53, 69,1;
    --dangerTxtClr: 220, 53, 69,1;
    --infoBgClr:  13, 202, 240,1;
    --infoTxtClr: 255,255,255,1;
    --lightBgClr: 248, 249, 250;
    --lightTxtClr: 33, 37, 41;
    --lightBorderClr:215, 218, 227;
    --darkBgClr: 33, 37, 41;
    --darkTxtClr: 255,255,255,1;
    --warningBgClr: 255, 193, 7,1;
    --warningTxtClr: 255, 193, 7, 1; 
    --secondaryBgClr: 108, 117, 125;
    --secondaryTxtClr: 255,255,255,1;
    --sbLevel1BgClr: 0,0,0,0;
    --sbLevel1TxtClr: 90, 106, 133,1;
    --sbLevel1ActiveBgClr: 93, 135, 255 ,1;
    --sbLevel1ActiveTxtClr: 255,255,255,1;
    --sbLevel2BgClr: 0,0,0,0;
    --sbLevel2TxtClr: 90, 106, 133,1;
    --sbLevel2ActiveBgClr: 0,0,0,0;
    --sbLevel2ActiveTxtClr: 255,255,255,1;
    --sbLevel3BgClr: 238, 238, 238,1;
    --sbLevel3TxtClr: 90, 106, 133,1;
    --sbLevel3ActiveBgClr:  13, 202, 240,1;
    --sbLevel3ActiveTxtClr: 255,255,255,1;
    --topNavBgClr: 13, 110, 253,1;
    --topMenuBgClr: 0,0,0,0;
    --topMenuTxtClr: 45,45,45,1;
    --topMenuActiveBgClr: 236,242,255,1;
    --topMenuActiveTxtClr: 93,135,255,1;
    --pagemenu1BgClr: 0,0,0,0;
    --pagemenu1TxtClr: 45,45,45,1;
    --pagemenu1ActBgClr: 45,45,45,1;
    --pagemenu1ActTxtClr: 255,255,255,1;
    --pagemenu1ActBorderClr: 11, 94, 215, 1;
    --pagemenu1BorderClr: 0,0,0,0;
    --pagemenu2BgClr: 238, 238, 238,1;
    --pagemenu2TxtClr: 45,45,45,1;
    --pagemenu2ActBgClr: 108, 117, 125;
    --pagemenu2ActTxtClr: 255,255,255,1;
    --pagemenu3BgClr: 213, 232, 248,1;
    --pagemenu3TxtClr: 45,45,45,1;
    --pagemenu3ActBgClr:  13, 202, 240,1;
    --pagemenu3ActTxtClr: 255,255,255,1;
    --commonDDBgClr: 213, 232, 248,1;
    --commonDDTxtClr: 220, 53, 69,1;
    --inputBg: 255,255,255,1;
    --inputTxt: 45,45,45,1;
    --inputFocusbg: 250, 240, 170,1;
    --inputFocusTxt: 45,45,45,1;
    --bottomlineBgClr: 45,45,45,1;
    --bottomlineTxtClr: 255,255,255,1;
    --footerBgClr: 250, 240, 170,1;
    --footerTxtClr: 213, 232, 248,1;
    --cardheaderBgClr: 213, 232, 248,1;
    --cardheaderTxtClr: 13, 110, 253,1;
    --bodyBgClr: 0,0,0,0;
    --containerBg: 13, 110, 253,1;
    --gridHeaderBgClr: 238, 238, 238,1;
    --gridHeaderTxtClr: 45,45,45,1;
    --gridBgClr: 255,255,255,1;
    --gridTxtClr: 45,45,45,1;
    --gridSelectBgClr: 108, 117, 125;
    --gridSelectTxtClr: 255,255,255,1;
    --sidebarIcon: var(--display-Icon);
    --topMenuIcon: var(--display-Icon);
    --pageTab1Icon: var(--display-Icon);
    --pageTab2Icon: var(--display-Icon);
    --pageTab3Icon: var(--display-Icon);
    --inputLblPosition: var(--display-LblPos);
    --inputShape: var(--display-Shape);
    --gridEvenBg:  255,255,255,1;
    --gridEvenClr:  0,0,0,1;
    --gridOddBg:  255,255,255,1;
    --gridOddClr:   0,0,0,1;
    --gridBorderClr:  223,227,232,1;
    --h1 : var(--h1);
    --h2 : var(--h2);
    --h3 : var(--h3);
    --h4 : var(--h4);
    --h5 : var(--h5);
    --h6 : var(--h6);
    --p : var(--p);
    --FontFamily : var(--FontFamily);
    --cardbg : 255, 255, 255, 1;
    --card-bg : 255, 255, 255, 1;
    --formborderClr : 223,227,232,1;
    --dashboardbg : 0,0,0,0;
    --disableFormBG : 255 , 255 , 255, 1;
    --bs-body-color : 0,0,0,1;
    --bs-heading-color : 255,255,255,1;
    --inputbtnBG : 11, 94, 215, 1;
    --inputbtnClr : 255,255,255,1;
    --inputbtnBorder : 11, 94, 215, 1;
    --white : 255,255,255,1;
    --bs-primary-rgb : 13,110,253,1;
    --bs-secondary-rgb : 108,117,125,1;
    --bs-danger-rgb : 220,53,69,1;
    --bs-success-rgb : 25,135,84,1;
    --bs-info-rgb : 13,202,240,1;
    --bs-warning-rgb : 255,93,7,1;
    --bs-dark-rgb : 66,70,73,1;
    --bs-white-rgb : 255,255,255,1;
    --bs-light-rgb : 211,212,213,1;
    --bs-heading-h1 :  0,171,85,1;
    --bs-heading-h2 : 108,117,125,1;
    --bs-heading-h3 : 220,53,69,1;
    --bs-heading-h4 : 25,135,84,1;
    --bs-heading-h5 : 13,202,240,1;
    --bs-heading-h6 : 66,70,73,1;
    --inputFocusborder : 11, 94, 215, 1;
    --inputlabelClr : 66,70,73,1;
    --inputborder : 145,158,171,0.322;
    --sidebarIconClr: 111,107,125,1;
    --topMenuIconClr:45,45,45,1;
    --topheaderBg: 248,249,250,1; 
    --headerbg: 0,0,0,0; 
     --disableFormBG:    ;
     --bg-Primary-main: 13,110,253,1;
     --bg-Secondary-main: 108,117,125,1;
     --bg-Danger-main: 220,53,69,1;
     --bg-Success-main: 25,135,84,1;
     --bg-Info-main: 13,202,240,1;
     --bg-Warning-main: 255,193,7,1;
     --bg-Dark-main: 66,70,73,1;
     --bg-Light-main: 248, 249, 250, 1;
     --bg-White-main: 255,255,255,1;
     --navbardarkclr: 255,255,255,.75;
     --navBgprimary: 13,110,253,1;
     --navBgsecondary:108,117,125,1;
     --navBgdark: 66,70,73,1;
     --navBgwhite: 255,255,255,1;
     --navBglight: 248, 249, 250, 1;
     --navBgdanger: 220,53,69,1;
     --navBginfo:13,202,240,1;
     --navBgsuccess:25,135,84,1;
     --navBgwarning: 255,193,7,1;
     --leftmenu1bg:  236, 242, 255, 1;
     --leftmenu2bg: 255,255,255,1;
     --gridRowhover: 160, 176, 197, 1;
     --gridRowhoverClr: 0,0,0,1;
     --gridCellhover: 160, 176, 197, 1;
     --gridCellhoverClr: 0,0,0,1;
}

.text-danger {
    color: rgba(var(--btnBGDanger__));
}

.text-dark {
    color: rgba(var(--black));
}


.text-white {
    color: rgba(var(--white_1));
}

/* .btn-outline-danger {
    background-color: rgba(var(--btnOutlineBGDanger__)) !important;
    color: rgba(var(--btnOutlineTextDanger__))!important;
} */




/* new css  */

/* #top_nav_bar .navbar.bg-light{
    background-color: rgba(var(--topMenuBgClr)) !important;
} */

#top_nav_bar .navbar.bg-light ul li a {
 color:rgba(var(--topMenuTxtClr)) ; 
}
/* #top_nav_bar .navbar.bg-light ul li a.active {
    background-color:rgba(var(--topMenuActiveBgClr)); 
}
#top_nav_bar .navbar.bg-light ul li a.active {
    color:rgba(var(--topMenuActiveTxtClr)); 
} */
#top_nav_bar .navbar.bg-light ul li a.active {
    background-color: rgb(248 249 250);
}
#top_nav_bar .navbar.bg-light ul li a.active {
    color: rgb(0 0 0);
}
#top_nav_bar .navbar.bg-light ul li a{
    color:rgba(var(--topMenuTxtClr)); 
}

/* new css  */





.sidebar.sidebar-dark>ul>li {
    border-bottom: .2vh solid rgba(var(--white));
}


/* .rightbar-dark ul li a:hover,
.rightbar-dark ul .active a,
.sidebar-dark ul li a:hover,
.sidebar-dark ul .active a,
#topMoreButton:hover {
    border-radius: 22px;
    border: 2px rgba(var(--purple)) solid!important;
    color: rgba(var(--purple));
} */


/* .rightbar ul li a,
.sidebar ul li a {
    padding: 4px 5px 4px 6px!important;
    color: rgba(var(--sbLevel1TxtClr));
    background-color: rgba(var(--sbLevel1BgClr));
    border-radius: 22px;
    border: 2px rgba(238, 238, 238, 0) solid!important;
} */


/* .rightbar-dark ul li a:hover,
.rightbar-dark ul .active a,
.sidebar-dark ul li a:hover,
.sidebar-dark ul .active a,
#topMoreButton:hover {
    border-radius: 22px;
    border: 2px rgba(var(--sbLevel1ActiveBgClr)) solid!important;
} */

.d-flex.h-100.flex-column {
    overflow: hidden;
}

.dashboard_dropdown .d-flex.h-100.flex-column {
    overflow: inherit !important;
}

.list-unstyled {
    padding-left: 5px;
    padding-right: 3px;
    margin: 2px 0;
}

.sidebar.sidebar-dark ul li a i {
    color: rgba(var(--sbLevel1TxtClr));
    background-color: rgba(var(--sbLevel1BgClr));
    height: 24px;
    width: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 50px;
}

.sidebar-dark ul li a:hover i {
    color: rgba(var(--white)) !important;
}

.sidebar.sidebar-dark ul li a.active i {
    background-color: rgba(var(--topMenuActiveBgClr));
    color: rgba(var(--sbLevel1TxtClr));
}

#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active {
    background-color: rgba(var(--sbLevel2ActiveBgClr));
    color: rgba(var(--sbLevel2ActiveTxtClr));
}

#leftMenu>ul>ul>li a[aria-expanded='true']~ul li div a.active {
    background-color: rgba(var(--sbLevel3ActiveBgClr));
    color: rgba(var(--sbLevel3ActiveTxtClr));
}

.sidebar.sidebar-dark ul ul.show li a.active:after {
    background-color: #fff;
}

#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active:hover,
#leftMenu>ul>li a[aria-expanded='true']~ul li div a:hover {
    border: 2px rgba(var(--dark-gray)) solid !important;
}

#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active~ul li a.active {
    background-color: rgba(var(--sky)) !important;
    color: rgba(var(--white)) !important;
}

#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active~ul li a.active:hover,
#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active~ul li a.active {
    border: 2px rgba(var(--sky)) solid !important;
}


/* .rightbar-dark [aria-expanded="true"],
.sidebar-dark [aria-expanded="true"],
.rightbar-dark a.active,
.sidebar-dark a.active,
#leftMenu a.active {
    background-color: rgba(var(--sbLevel1ActiveBgClr));
    color: rgba(var(--sbLevel1ActiveTxtClr));
     border-radius: 22px; 
} */


/* .sidebar-dark [aria-expanded="true"] i {
    color: white !important;
} */

.sag_grid .paginationBlk .btn-group .btn {
    height: 26px;
    width: 28px;
    align-items: center;
    display: flex;
    border: none;
    justify-content: center;
    background-color: rgba(var(--purple));
    color: rgba(var(--white)) !important;
    border-radius: 3px;
}

.btn-danger:not(:disabled):not(.disabled).active,
.btn-danger:not(:disabled):not(.disabled):active,
.show>.btn-danger.dropdown-toggle,
.sag_grid .paginationBlk .btn-group .btn:nth-child(3),
.sag_grid .paginationBlk .btn-group .btn:nth-child(4) {
    background-color: rgba(var(--magento));
}

.sag_grid .paginationBlk .btn-group .btn:nth-child(3) i,
.sag_grid .paginationBlk .btn-group .btn:nth-child(4) i {
    color: rgba(var(--white)) !important;
}


/* .sidebar.sidebar-dark ul ul {
    margin-left: 0px;
    background-color: rgba(var(--sbLevel2BgClr));
    border-radius: 20px;
    padding: 5px 7px;
} */


/* .sidebar.sidebar-dark ul ul ul {
    background-color: rgba(var(--sbLevel3BgClr));
} */


/* .rightbar-dark ul ul a,
.sidebar-dark ul ul a {
    background-color: rgba(var(--sbLevel2BgClr));
    color: rgba(var(--sbLevel2TxtClr));
    padding-left: 14px!important;
} */


/* .sidebar-dark ul ul ul a {
    background-color: rgba(var(--sbLevel3BgClr));
    color: rgba(var(--sbLevel3TxtClr));
} */


/* .sidebar.sidebar-dark ul ul li a {
    border-left: 0px;
} */


/* .sidebar.sidebar-dark ul ul li a:after {
    width: 6px;
    height: 6px;
    border-radius: 5px;
    margin: 6px 6px;
} */

#leftMenu ul ul li.active:hover,
#leftMenu ul ul li a:hover {
    border: 2px rgba(var(--sbLevel2ActiveBgClr)) solid !important;
}

#leftMenu ul ul ul li.active:hover,
#leftMenu ul ul ul li a:hover {
    border: 2px rgba(var(--sbLevel3ActiveBgClr)) solid !important;
}

#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active~ul li a.active:hover,
#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active~ul li a.active {
    border: 2px rgba(var(--sbLevel3ActiveBgClr)) solid !important;
}

#leftMenu>ul>li a[aria-expanded='true']~ul li div a.active~ul li a.active {
    background-color: rgba(var(--sbLevel3ActiveBgClr));
    color: rgba(var(--sbLevel3ActiveTxtClr));
}

.consolidate-dropdown,
.sagFieldsec {
    background-color: rgba(var(--commonDDBgClr));
    border: 1px solid rgba(var(--sbLevel1ActiveTxtClr));
    padding: 0.2vh;
}

.show>.btn-primary.dropdown-toggle,
.nav-pills .show>.nav-link {
    background-color: rgba(var(--primaryBgClr));
    border-color: rgba(var(--primaryBgClr));
    color: rgba(var(--primaryTxtClr));
    font-weight: bold;
}

.nav-pills .nav-link.active {
    background-color: rgba(var(--primaryBgClr));
    border-color: rgba(var(--primaryBgClr));
    color: rgba(var(--primaryTxtClr));
}

.sml_slectedRow {
    background-color: rgba(var(--dark-gray)) !important;
    color: rgba(var(--white));
}

.nav-link i {
    margin-right: 5px;
}

#navbarColor01 .dropdown-menu:before {
    content: "";
    position: absolute;
    border-bottom: 5px solid #fff;
    border-top: 0;
    border-left: 5px solid #ccc0;
    border-right: 5px solid #ccc0;
    top: -5px;
    left: 50%;
}

#navbarColor01 .dropdown-menu-right ul {
    padding: 5px 10px;
    border: 1px solid rgba(0, 0, 0, .15);
    border-top: 0px;
    color: rgba(var(--sky)) !important;
}

#navbarColor01 .dropdown-menu-right ul:hover {
    background-color: transparent;
}

#newDashboard .nav-pills .nav-item a {
    background-color: rgba(var(--purple)) !important;
}

.headerMain a.nav-link:focus,
.headerMain a.nav-link:hover,
.headerMain .navbar-collapse .nav-item>.nav-link:focus,
.headerMain .navbar-collapse .nav-item>.nav-link:hover {
    color: rgba(var(--topMenuActiveTxtClr));
    background-color: rgba(var(--topMenuActiveBgClr));
}

.navbar-light .navbar-nav .nav-link.text-succes:focus,
.navbar-light .navbar-nav .nav-link.text-succes:hover {
    color: rgba(var(--white));
    background-color: rgba(var(--green));
}



app-header {
    border-top: 2px rgba(var(--pagemenuActBgClr)) solid;
}

.sagFieldsec .form-group>label {
    color: rgba(var(--commonDDTxtClr)) !important;
    font-weight: bold;
}

.header_cell {
    border-top: 1px solid rgba(var(--mid-light-gray));
}

.header_cell .sagGridFilter {
    background-color: rgba(var(--mid-light-gray));
}

input,
optgroup,
select,
textarea {
    border: 1px rgba(var(--light-yellow)) solid;
}

.header_cell input[type="text"] {
    text-indent: 5px;
}

.wrapperMain .headerMain {
    box-shadow: 0 0 14px var(--gray);
    -moz-box-shadow: 0 0 14px var(--gray);
    -webkit-box-shadow: 0 0 14px var(--gray);
    background-color: #fff;
    border-bottom: 0;
    z-index: 9999;
}

.headerMain i {
    border-radius: 22px;
    background-color: rgba(var(--white));
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    color: rgba(var(--topMenuTxtClr));
    margin: 0 !important;
    font-family: Font Awesome\ 5 Free;
}

.headerMain .navbar-collapse .nav-item {
    padding: 0 2px
}

.headerMain .navbar-collapse .nav-item>.nav-link {
    padding: 2px 10px 2px 2px;
    color: rgba(var(--topMenuTxtClr));
    background-color: rgba(var(--topMenuBgClr));
    font-weight: 600;
    border: none
}



.headerMain .navbar-collapse .dropdown-toggle .nav-item {
    padding: 8px
}

.wrapperMain .headerMain .navbar-collapse .nav-item {
    padding: 0 2px;
    white-space: nowrap;
}

.headerMain .navbar-collapse .nav-item>.nav-link:focus {
    border: unset;
    outline: unset
}


/* reset color */


/**/


/* naving start */

.page-footer .dropup.btn-primary {
    padding: 0;
    background-color: none;
    border: none
}

.nav-pills li:last-child .nav-link {
    border: none
}

.nav-pills .nav-link:hover {
    background-color: rgba(var(--purple));
    color: rgba(var(--white));
}

.nav-pills {
    display: flex;
    flex-wrap: wrap
}


/*.nav-pills .nav-item{	display: flex;    flex: 1;}*/

.nav-pills .nav-item .nav-link {
    padding: 4px 15px;
    text-transform: capitalize;
}

.nav-pills .nav-item .nav-link,
.nav-pills .nav-item .nav-link {
    color: rgba(var(--pagemenu1TxtClr));
    background-color: rgba(var(--pagemenu1BgClr));
    border-right: 1px rgba(var(--pagemenu1ActBgClr)) solid;
}

.nav-pills .nav-item .nav-link.active,
.nav-pills .nav-item .nav-link:hover {
    color: rgba(var(--pagemenu1ActTxtClr));
    background-color: rgba(var(--pagemenu1ActBgClr));
    border-radius: 3px;
}

.nav-pills.nav-two {
    display: flex;
    flex-wrap: wrap
}


/*.nav-pills.nav-two .nav-item{	display: flex;    flex: 1;}*/

.nav-pills.nav-two .nav-item .nav-link {
    padding: 3px 11px;
    color: rgba(var(--dark-gray));
}

.nav-pills.nav-two .nav-item .nav-link,
.nav-pills.nav-two .nav-item .nav-link {
    color: rgba(var(--pagemenu2TxtClr));
    background-color: rgba(var(--pagemenu2BgClr));
    border-right: 1px rgba(var(--pagemenu2ActBgClr)) solid;
}

.nav-pills.nav-two .nav-item .nav-link.active,
.nav-pills.nav-two .nav-item .nav-link:hover {
    color: rgba(var(--pagemenu2ActTxtClr));
    background-color: rgba(var(--pagemenu2ActBgClr));
}

.nav-pills.nav-three {
    display: flex;
    flex-wrap: wrap
}


/*.nav-pills.nav-three .nav-item{	display: flex;    flex: 1;}*/

.nav-pills.nav-three .nav-item .nav-link {
    padding: 4px 15px;
    background-color: rgba(var(--pagemenu3BgClr));
    color: rgba(var(--pagemenu3TxtClr));
}

.nav-pills.nav-three .nav-item .nav-link.active,
.nav-pills.nav-three .nav-item .nav-link:hover {
    background-color: rgba(var(--pagemenu3ActBgClr));
    color: rgba(var(--pagemenu3ActTxtClr));
}

.dropright .dropdown-menu {
    top: auto
}

.footer-right-menu .btn-group.dropup .dropdown-menu .dropdown-submenu .dropdown-menu a:hover,
.footer-right-menu .btn-group.dropup .dropdown-menu .dropdown-submenu:hover a {
    background-color: rgba(var(--sky));
    color: rgba(var(--white))
}

#navbarColor01 .dropdown-menu:before {
    content: "";
    position: absolute;
    border-bottom: 5px solid rgba(var(--white));
    border-top: 0;
    border-left: 5px solid #ccc0;
    border-right: 5px solid #ccc0;
    top: -5px;
    left: 50%;
}

#navbarColor01 .dropdown-menu.show {
    border-radius: 0;
    top: 45px;
    box-shadow: 0px 1px 10px 2px #7d7d7d;
}

#navbarColor01 .dropdown-menu-right ul {
    padding: 5px 10px;
    border: 1px solid rgba(0, 0, 0, .15);
    border-top: 0px;
    color: rgba(var(--sky)) !important;
}

#navbarColor01 .dropdown-menu-right ul:hover {
    background-color: transparent;
}

.btn-group.dropup.btn-primary.active,
.btn-group.dropup.btn-primary {
    padding: 0 !important
}


/* naving end */


/* footer navigation start */

footer .btn-group.dropup,
footer .btn {
    border-radius: 0px;
}


/* footer navigation end */


/* ---Faizan 5/6/2020----Start-- */


/* ---Modal Start-- */

.modal-sm .modal-header h4 {
    font-weight: bold;
}

h5#exampleModalLongTitle {
    font-weight: bold;
}

.modal-header:not(.sidebar_left .modal-header), .modal-footer:not(.sidebar_left .modal-footer){
    background-color: rgba(var(--cardbg)) !important;
}
.modal-body:not(.sidebar_left .modal-body){
    background-color: rgba(var(--cardbg)) !important;
}

.modal-header {
    padding: 1rem 1rem;
}

/* .btn-danger {
    background-color: rgba(var(--dangerBgClr));
    border-color: rgba(var(--dangerBgClr));
    color: rgba(var(--dangerTxtClr));
} */

#smsEmailSending .modal-body .form-group .inputBox .btn {
    border-radius: 22px;
    margin-bottom: 0px;
}

.maxsize {
    padding-top: calc(.375rem + 1px);
    padding-bottom: calc(.375rem + 1px);
    margin-bottom: 0;
    font-size: inherit;
    line-height: 1.5;
}

.modal-title .fa {
    font-weight: normal;
}

.angular-editor-button .fa {
    font-family: Font Awesome \ 5 Free;
}

#sellerModal #goodsOrServiceGrid {
    min-height: 270px;
}

.modal .modal-fullscreen>.modal-dialog,
.modal .modal-fullscreen {
    padding: 0 !important;
    top: 0 !important;
    margin: 0 !important;
}


/* ---Modal End-- */


/*.table-bordered td:first-child {
	 text-align: center; 
}*/

.table-bordered .custom-control {
    text-align: left;
}


/* ---header nav-bar strat--- */


/* ---header nav-bar End--- */


/* ---Faizan 5/6/2020----End-- */

.gridColumnTblTwo {
    max-height: 460px;
    overflow-x: hidden;
    overflow-y: auto;
}

.gridColumnTblTwo .table td {
    padding: 1px 5px;
    text-align: left !important;
}

.modal .modal-content {
    border-radius: 24px;
}

.modal .modal-content .modal-header {
    border-top-left-radius: 22px;
    border-top-right-radius: 22px;
}

.modal .modal-content .modal-footer {
    border-radius: 0px 0px 22px 22px;
    border-radius: 0px 0px 22px 22px;
}

.modal .modal-content .modal-footer .btn {
    border-radius: 22px;
}

.modalFullscreen .modal-content,
.modal-full-screen .modal-content {
    border-radius: 0;
}

.modalFullscreen .modal-content .modal-header,
.modal-full-screen .modal-content .modal-header {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.modalFullscreen .modal-content .modal-footer,
.modal-full-screen .modal-content .modal-footer {
    border-radius: 0px 0px 0 0;
    border-radius: 0px 0px 0 0;
}

.modalFullscreen .modal-content .modal-footer .btn,
.modal-full-screen .modal-content .modal-footer .btn {
    border-radius: 0;
}

.tableColors li.greenColor {
    background-color: #e1ffe5;
}

.tableColors li {
    display: inline-block;
    padding: 0.8vh;
}

.tableColors li.greyColor {
    background-color: #e2e2e2;
}

.addicon i {
    background-color: #192567;
}

.custom-control-label::after {
    position: absolute;
    display: block;
    content: "";
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
    top: 0.10rem;
    left: -1.6rem;
    display: block;
    width: 1.4rem;
    height: 1.4rem;
}

.custom-control-label::before {
    position: absolute;
    top: 0.10rem;
    left: -1.6rem;
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    pointer-events: none;
    content: "";
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: #dee2e6;
}


/* .custom-control-label {
    position: fixed;
    margin-bottom: 0;
    padding-left: 6px;
   
} */

#collapseExample i {
    font-size: 16px;
}

@media not all and (min-resolution:.001dpcm) {
    .rightbar.toggled {
        margin-right: -230px;
        display: none !important;
    }

    .rightbar {
        display: none !important;
    }

    .page-footer {
        display: initial !important;
        justify-content: space-between !important;
    }

    .footer-left-menu {
        float: left !important;
    }

    .topMenu #leftMenu .list-unstyled li ul {
        top: 14% !important;
    }

    .footer-right-menu {
        float: right !important;
        margin-top: 5px;
    }
}


/*----- 09-28-2020 Faizan----- */

.diffrenceBlk .well {
    font-size: 1vw;
}

.diffrenceBlk .well {
    margin-bottom: 0;
    padding: 6px;
    box-sizing: border-box;
}

.diffrenceBlk .staticHeadTbl {
    margin-top: 0;
    margin-bottom: 0;
}

.diffrenceBlk span {
    line-height: 3.5vh;
}

.diffrenceBlk b {
    font-size: .8vw;
}

.sidebar.bg-dark {
    background-color: rgba(var(--sbLevel1BgClr)) !important;
}

.wrapperMain .footerMain {
    background-color: rgba(var(--bottomlineBgClr));
    color: rgba(var(--bottomlineTxtClr));
}


/* ----- GRID-COLORS START ----- */

.header_Blk,
.header_cell {
    background-color: rgba(var(--gridHeaderBgClr));
    color: rgba(var(--gridHeaderTxtClr));
}

.totalFooter,
.footerGrid {
    background-color: rgba(var(--gridHeaderBgClr)) !important;
    filter: brightness(.95) !important;
}

.header_cell .sagGridFilter {
    background-color: inherit !important;
    color: inherit !important;
}

.totalFooter .totalField,
.sag_grid {
    background-color: rgba(var(--gridBgClr)) !important;
    color: rgba(var(--gridTxtClr)) !important;
}

.sml_slectedRow {
    background-color: rgba(var(--gridSelectBgClr)) !important;
    color: rgba(var(--gridSelectTxtClr)) !important;
}

.sag_grid .paginationBlk .btn-group .btn {
    background-color: rgba(var(--primaryBgClr)) !important;
    color: rgba(var(--primaryTxtClr)) !important;
}

.sag_grid .paginationBlk .btn-group .btn:nth-child(3),
.sag_grid .paginationBlk .btn-group .btn:nth-child(4) {
    background-color: rgba(var(--dangerBgClr)) !important;
    color: rgba(var(--dangerTxtClr)) !important;
}


/* ----- GRID-COLORS END ----- */


/* ------ INPUT SECTION START ------ */


.form-control,
body .ui-inputtext,
body .ui-multiselect,
body .ui-multiselect .ui-multiselect-label,
.form-select,
body .ui-tree {
    background-color: rgba(var(--inputBg)) !important;
    color: rgba(var(--inputTxt)) !important;
}

input::placeholder {
    color: rgba(var(--inputTxt)) !important;
}

.form-control:focus {
    background-color: rgba(var(--inputFocusbg)) !important;
    color: rgba(var(--inputFocusTxt)) !important;
}


/* ------ INPUT SECTION END ------ */

.wrapperMain .bodyMain .content {
    background-color: rgba(var(--bodyBgClr)) !important
}

body {
    background-color: rgba(var(--bodyBgClr));
}


/* .sagloader{ display: none!important} */

.navbar-light .navbar-brand {
    color: rgba(var(--sbLevel1ActiveBgClr));
}

.border-primary {
    border-color: rgba(var(--btnBGPrimary)) !important;
}

body .ui-dropdown .ui-dropdown {
    border: none !important
}

.notice_board table .isOdd {
    background-color: rgba(var(--sbLevel1ActiveBgClr))
}

.notice_board table tr td {
    border-color: rgba(var(--sbLevel2ActiveBgClr))
}


/* 
@keyframes newupdate {
  from {
    color: red
  }

  to {
    color: #53634b
  }
} */

.newLinkanimate {
    animation-duration: 0s !important;
    color: rgba(var(--purple)) !important;
}


/* 
.headerMain a.newupdate {
  animation-name: newupdate;
  border: none;
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-direction: alternate;
} */


/* 

a.newupdate:hover {
  color: rgba(var(--white)) !important;
}  */


/* icon css start */


/*
--sidebarIcon  : var(--display-Icon);
--topMenuIcon : var(--display-Icon);
--pageTab1Icon  : var(--display-Icon);
--pageTab2Icon  : var(--display-Icon);
--pageTab3Icon  : var(--display-Icon);
--inputShape  : var(--display-Shape);
--inputLblPosition  : var(--display-LblPos);
*/

.headerMain i {
    display: var(--topMenuIcon);
}

.sidebar.sidebar-dark ul li a i {
    display: var(--sidebarIcon) !important;
}
header#top_nav_bar .navbar-nav li a i {
    display: var(--topMenuIcon) !important;
}

/* icon css end */


/* nav css */

/* #top_nav_bar .navbar{
    background-color: rgba(var(--topMenuBgClr)) !important;
} */


/* #top_nav_bar .big_box {
    position: absolute;
    margin-top: 10px;
    background-color: #fff !important;
    box-shadow: 0px 0px 30px rgba(127 137 161 / 25%);
    transition: 0.3s;
    padding: 10px;
} */


/* #top_nav_bar .navbar-expand-lg .navbar-nav .dropdown-menu {
    margin-top: 10px;
    box-shadow: 0px 0px 30px rgba(127 137 161 / 25%);
    transition: 0.3s;
    padding: 0px;
} */


/* #top_nav_bar .navbar-light .navbar-nav .nav-link {
    font-size: 13px;
    font-weight: 600;
    color: #000;
    white-space: nowrap;
    cursor: pointer;
} */


/* #top_nav_bar .dropdown-item {
    font-weight: 400;
    font-size: 13px;
    padding: 7px;
    display: inline-block;
    vertical-align: middle;
    color: #000 !important;
    margin-right: 20px;
    cursor: pointer;
    background-color: none!important;
} */

#top_nav_bar .dropdown-item:hover {
    background-color: none;
}


/* #top_nav_bar .navbar-light .navbar-nav .nav-link:hover {
    color: rgba(var(--black)) !important;
} */

#top_nav_bar .dropdown-toggle::after {
    border-bottom-style: solid !important;
    border-bottom-width: 2px !important;
    border-right-style: solid !important;
    border-right-width: 2px !important;
    content: "";
    display: inline-block;
    height: 8px;
    width: 8px;
    -webkit-transform: rotate(45deg);
    transform: rotate(46deg);
    margin-left: 13px;
    border: none;
}


/* #top_nav_bar .nav-item {
    position: relative;
} */

#top_nav_bar .modal-body {
    overflow: inherit !important;
    padding: 0;
}


#top_nav_bar .navbar-nav li a {
    /* border-radius: 0px; */
    background-color: rgba(var(--topMenuBgClr));
    /* color: rgba(var(--topMenuTxtClr)) ; */
}


/* .top_header121{
    background-color: rgba(var(--topNavBgClr)) !important;
} */

#top_nav_bar .navbar-nav li a h6 {
    padding: 10px 20px 0px 6px;
    font-weight: bold;
    color: #484848;
    font-size: 16px;
}

.max-w-100 {
    flex-direction: row;
    margin: 0;
    padding: 0;
    flex: auto;
    white-space: nowrap;
}

.max-w-100 li {
    list-style: none;
}


/* 
.dropdown-submenu {
    position: relative;
    margin: 2px 4px 2px 4px;
} */

.dropdown-submenu a::after {
    transform: rotate(-90deg);
    position: absolute;
    right: 6px;
    top: 0.8em;
}


/* .dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-left: 0.1rem;
    margin-right: 0.1rem;
} */



.heading_dropdown h5 {
    text-decoration: none;
    margin-left: 10px !important;
    margin-bottom: 10px !important;
}

#top_nav_bar .rightbar [aria-expanded="true"]:before,
.sidebar [aria-expanded="true"]:before {
    content: "";
    display: none;
}


/* #top_nav_bar .navbar-expand-lg .navbar-nav .dropdown-menu ul {
    padding: 10px;
} */

#top_nav_bar ul.navbar-nav.ml-auto li.nav-item.dropdown.show .big_box.show {
    right: 0;
    left: auto;
}


/*  top menu and navbar end*/


/* .btn-primary, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active {
    background-color: rgba(var(--primaryBgClr));
    border-color: rgba(var(--primaryBgClr));
    color: rgba(var(--primaryTxtClr));
}

.btn-primary:hover, .btn-primary.active {
    background-color: rgba(var(--primaryBgClr));
    border-color: rgba(var(--primaryBgClr));
    color: rgba(var(--primaryTxtClr));
} */

.wnrgColor {
    background-color: var(--wrngBgColor);
}


/* widget css start */

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) {
    .sidebar.sidebar-dark.bg-dark.left_close {
        margin-left: -230px;
    }

    .sidebar.sidebar-dark.bg-dark.left_open {
        margin-left: 0;
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1023px) and (-webkit-min-device-pixel-ratio: 2) {
    .sidebar.sidebar-dark.bg-dark.left_close {
        margin-left: 0;
    }

    .sidebar.sidebar-dark.bg-dark.left_open {
        margin-left: -230px;
    }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 767px) and (-webkit-min-device-pixel-ratio: 2) {
    .sidebar.sidebar-dark.bg-dark.left_close {
        margin-left: 0;
    }

    .sidebar.sidebar-dark.bg-dark.left_open {
        margin-left: -230px;
    }
}

@media screen and (max-width: 768px) {
    .sidebar.sidebar-dark.bg-dark.left_close {
        margin-left: 0;
    }

    .sidebar.sidebar-dark.bg-dark.left_open {
        margin-left: -230px;
    }
}

@media screen and (max-width:800px) and (orientation: landscape) {
    .sidebar.sidebar-dark.bg-dark.left_close {
        margin-left: 0;
    }

    .sidebar.sidebar-dark.bg-dark.left_open {
        margin-left: -230px;
    }
}

.left_close {
    margin-left: -230px;
}

.rightbar.rightbar-dark.toggled.right_close {
    margin-right: -230px;
}


/* widget css end */


/* my css */

.bg-primary{
    background-color: rgb(var(--bg-Primary-main));
} 
.bg-danger{
    background-color: rgb(var(--bg-Danger-main));
}  
.bg-secondary{
    background-color: rgb(var(--bg-Secondary-main));
} 
.bg-info{
    background-color: rgb(var(--bg-Info-main));
} 
.bg-warning{
    background-color: rgb(var(--bg-Warning-main));
} 
.bg-success{
    background-color: rgb(var(--bg-Success-main));
} 
.bg-light{
    background-color: rgb(var(--bg-Light-main));
} 
.bg-dark{
    background-color: rgb(var(--bg-Dark-main));
} 
.bg-white{
    background-color: rgb(var(--bg-White-main));
} 
.page-header{
    background-color: rgba(var(--headerbg)) !important;
}
.card{
    background-color: rgba(var(--cardbg)) !important;
}
.form-area{ 
    border-color: rgba(var(--formborderClr)) !important; 
    background: rgba(var(--card-bg)) !important;
}
.form-select{
    background-color: rgba(var(--inputBg)) !important;
    border-color: rgba(var(--inputborder)) !important;
}
.form-control{
    border-color: rgba(var(--inputborder)) !important;
}
.inputBox input:not(.form-check-input), .inputBox textarea, p-calendar .ui-calendar input, .inputBox p-multiselect .ui-multiselect, body .ui-dropdown{
    border-color: rgba(var(--inputborder)) !important;
}
.dashboard_content{
    background: rgba(var(--dashboardbg)) !important;
}
.form-control:disabled, .form-control[readonly]{
    background: rgba(var(--disableFormBG)) !important;
}
.table_body .sagRow:nth-child(even){
    background: rgba(var(--gridEvenBg)) !important;
    color: rgba(var(--gridEvenClr)) !important;
}
.table_body .sagRow:nth-child(odd){
    background: rgba(var(--gridOddBg)) !important;
    color: rgba(var(--gridOddClr)) !important;
}


.text-primary{
    color: rgba(var(--bs-primary-rgb)); 
}
.text-info{
    color: rgba(var(--bs-info-rgb)); 
}
.text-danger{
    color: rgba(var(--bs-danger-rgb)); 
}
.text-success{
    color: rgba(var(--bs-success-rgb)); 
}
.text-warning{
    color: rgba(var(--bs-warning-rgb)); 
}
.text-dark{
    color: rgba(var(--bs-dark-rgb)); 
}
.text-secondary{
    color: rgba(var(--bs-secondary-rgb)); 
}
.text-white{
    color: rgba(var(--bs-white-rgb)); 
}
.text-light{
    color: rgba(var(--bs-light-rgb)); 
}




.dashboard_wrapperMain .mainPage{
    background-color: rgba(var(--bodyBgClr));
}

.header_Blk , .sag_grid , .header_div , .child_header , .header_cell , .center-tbl-header  .header_row  .header_cell:last-child
,.grid_row , .grid_cell , .table_body {
    border-color:rgba(var(--gridBorderClr));
}

.inputBox.input-group .input-group-text i, .ui-calendar.ui-calendar-w-btn .ui-datepicker-trigger.ui-button{
    border-color:rgba(var(--inputbtnBorder));
    color: rgba(var(--inputbtnClr));
    background: rgba(var(--inputbtnBG));
}
.inputBox.input-group .input-group-text i.text-dark{
    color: rgba(var(--inputbtnClr))!important;
}
 .inputBox select:focus, .inputBox .form-control:focus, .inputBox textarea:focus, input.ui-inputtext:focus{
    box-shadow: none !important;
    border: 1px solid rgba(var(--inputFocusborder)) !important;
    background-color: rgba(var(--inputFocusbg)) !important;
}
.form_group_label label{
    color: rgba(var(--inputlabelClr));
}

body .ui-dropdown, body .ui-dropdown .ui-dropdown-trigger, body .ui-multiselect .ui-multiselect-trigger{
    background: rgba(var(--inputBg))!important;
}
.form-check-input:checked{
    background-color: rgb(var(--btnBGPrimary));
    border-color: rgb(var(--btnBGPrimary));
}
.form-control[type="file"]::file-selector-button{
    border-color: rgba(var(--inputbtnBorder)) !important;
 color: rgba(var(--inputbtnClr)) !important;
 background: rgba(var(--inputbtnBG)) !important;
}


.defaultTheme h1:not(app-themes h1){
    font-size: var(--h1) !important;
}
.defaultTheme h2:not(app-themes h2){
    font-size: var(--h2) !important;
}
.defaultTheme h3:not(app-themes h3){
    font-size: var(--h3) !important;
}
.defaultTheme h4:not(app-themes h4){
    font-size: var(--h4) !important;
}
.defaultTheme h5:not(app-themes h5){
    font-size: var(--h5) !important;
}
.defaultTheme h6:not(app-themes h6){
    font-size: var(--h6) !important;
}

.defaultTheme p:not(app-themes p), .defaultTheme button:not(app-themes button){
    font-size: var(--p) !important;
}

body.defaultFamily{
    font-family: var(--FontFamily) !important;
}

app-themes{
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.sagRow.gridRowHoverClass:hover{
    background: rgba(var(--gridRowhover)) !important;
    color: rgba(var(--gridRowhoverClr)) !important;
}
.gridCellHoverClass:hover{
    background: rgba(var(--gridCellhover)) !important;
    color: rgba(var(--gridCellhoverClr)) !important;
}


@media(max-width: 767px){
    .defaultTheme h1:not(app-themes h1){
        font-size: calc(var(--h1) - 2px) !important;
    }
    .defaultTheme h2:not(app-themes h2){
        font-size: calc(var(--h2) - 2px) !important;
    }
    .defaultTheme h3:not(app-themes h3){
        font-size: calc(var(--h3) - 2px) !important;
    }
    .defaultTheme h4:not(app-themes h4){
        font-size: calc(var(--h4) - 2px) !important;
    }
    .defaultTheme h5:not(app-themes h5){
        font-size: calc(var(--h5) - 2px) !important;
    }
    .defaultTheme h6:not(app-themes h6){
        font-size: calc(var(--h6) - 2px) !important;
    }
    .defaultTheme p:not(app-themes p), .defaultTheme button:not(app-themes button){
        font-size: calc(var(--p) - 2px) !important;
    }
}