@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
/* font-family: 'DM Sans', sans-serif;
Regular 400,Regular 400 italic,Medium 500,Medium 500 italic,Bold 700,Bold 700 italic
    font-family: 'Roboto', sans-serif;
*/
/* header-section-new.php */
/* <!-- Bootstrap 3.3.6 --> */
@import url("../bootstrap/css/bootstrap.min.css");
@import url("../bootstrap/css/icheck-bootstrap.min.css");
/* <!-- Font Awesome --> */
@import url("../css/font-awesome/css/font-awesome.css");
/* <!-- Ionicons --> */
@import url("../plugins/datepicker/datepicker3.css");
@import url("../plugins/timepicker/bootstrap-timepicker.css");
/* <!-- DataTables --> */
@import url("../plugins/datatables/dataTables.bootstrap.css");
/* <!-- Theme style --> */
/* @import url("../dist/css/AdminLTE.min.css"); */
/* <!-- AdminLTE Skins. Choose a skin from the css/skins
       folder instead of downloading all of them to reduce the load. --> */
/* @import url("../dist/css/skins/_all-skins.min.css"); */
/* <!-- iCheck --> */

/* col-lg-6=100% | col-md-12=1200px; | col-sm-12=991px; | col-xs-12=767px; | mobile-width=599px; */

@import url("../plugins/iCheck/square/blue.css");

/* col-lg-6=100% | col-md-12=1200px; | col-sm-12=991px; | col-xs-12=767px; | mobile-width=599px; */

html { scroll-behaviour: smooth; }

body { font-family: 'DM Sans', sans-serif; font-weight:400; font-size: 14px; line-height: 20px; color: var(--black-color); overflow-x:hidden; overflow-y:hidden; background: #fff; }

/* Comman Classes */
a, img, span {border:0; margin:0; padding:0;}
a, button {text-decoration:none; color:var(--black-color); /* -webkit-transition:all .3s linear; -moz-transition:all .3s linear; transition:all .3s linear; */ }
a:hover, a:focus {text-decoration:none; color:var(--blue-color); outline:none; }
p {padding:0px; margin:0px; border:0px;}
img {line-height:0px; max-width:100%; padding:0; margin:0; border:none; }
.btn:focus,
input:focus,
select:focus,
textarea:focus { outline:none; }
.text-start { text-align: left; }
.text-end { text-align: right; }

a:focus, button:focus,
a:active, button:active { outline: none !important; text-decoration: none; box-shadow: none !important; }
.w-100 { width: 100%; }

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* width */
/* ::-webkit-scrollbar { width: 5px; height: 5px; box-sizing: content-box; } */
/* *:hover::-webkit-scrollbar { width: 7px; height: 7px; } */
/* Track */
/* ::-webkit-scrollbar-track { background: transparent; } */
/* Handle */
/* ::-webkit-scrollbar-thumb { background: #a5a7b2; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } */
/* Handle on hover */
/* ::-webkit-scrollbar-thumb:hover { background: #4c5066; } */

/* Works on Firefox */
/* * { scrollbar-width: thin; scrollbar-color: #a5a7b2 #ffffff;  } */
/* Works on Chrome, Edge, and Safari */
/* width */
/* * ::-webkit-scrollbar { width: 5px; height: 5px; box-sizing: content-box; } */
/* * ::-webkit-scrollbar-track { background: transparent; } */
/* Handle */
/* * ::-webkit-scrollbar-thumb { background-color: #a5a7b2; border: 3px solid orange; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: none; } */
/* Handle on hover */
/* * ::-webkit-scrollbar-thumb:hover { background-color: #4c5066; } */

/* Custom Scrollbar Styles */
/* Width and height of the scrollbar */
* ::-webkit-scrollbar { width: 4px; height: 4px; }
    /* Track (background) of the scrollbar */
* ::-webkit-scrollbar-track { background: none; border-radius: 10px; }
    /* Scrollbar thumb (draggable part) */
* ::-webkit-scrollbar-thumb { background-color: #a5a7b2; border-radius: 10px; border: 2px solid #a5a7b2; }
    /* Scrollbar thumb on hover */
* ::-webkit-scrollbar-thumb:hover { background-color: #4c5066; border: 2px solid #4c5066; }

input,
select,
textarea { outline: none; }
* { list-style:none; margin: 0; padding: 0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -moz-hyphens: none; -ms-hyphens: none; -webkit-hyphens: none; hyphens: none;  }
li {display:list-item; border:0; margin:0; padding:0;}
.clear { clear:both; }
.clear2 { clear:both; max-width: 100%; width: 100%; padding: 0; margin: 0; }
::selection{background:#0078d7; color:#fff; /* Safari */}
::-moz-selection{background:#0078d7; color:#fff; /* Firefox */}
::-webkit-selection{background:#0078d7; color:#fff; /* Firefox */}

h1,h2,h3,h4,h5,h6 { font-family: 'DM Sans', sans-serif; color: var(--black-color); font-weight: 500; font-size: 18px; line-height: 24px; padding: 0; margin: 0; }

a { outline: none !important; }
.border-0{ border: 0;}
.border-0-imp{ border: 0 !important;}

.order-1{order:1;}
.order-2{order:2;}
.order-3{order:3;}
.order-4{order:4;}
.order-5{order:5;}

/* Color Master */
:root {
    --blue-color: #263db8;
    --blue-bg-hvr-color: #20349d;
    --sky-color: #00a3ef;
    --sky2-color: #bdeaff;
    --sky-bg-hvr-color: #0092d7;
    --danger-color: #ee4646;
    --danger2-color: #cb3c3c;
    --orange-color: #ff7e00;
    --orange2-color: #ffaa57;
    --yellow-color: #ffcc00;
    --athens-gray: #e7ebef;
    --ghost-gray: #ced4da;
    --geyser-gray: #dfe4e8;
    --catskill-white: #eff2f7;
    --athens2-gray2: #e3e6ea;
    --athens3-gray3: #e5e8ec;
    --peppermint-color: #edf8ec;
    --yellow-bg-hvr-color: #e5b700;
    --light-color: #6c6c6c;
    --light-color-op6: rgba(108,108,108,0.6);
    --light2-color: #585d62;
    --black-color: #292a33;
    --light-black-color: rgba(10,10,10,0.5);
    --green-color: #51b848;
    --green-bg-hvr-color: #49a541;
    --green2-color: #258c1c;
    --pink-color: #ff68d6;
    --pink2-color: #f65587;
    --light-bg-color : #e6e9ed;
    --light-bg2-color : #e9ebf8;
    --light-bg-hvr-color : #ced2d8;
    --light-border-color : #c7ccd0;
    --aqua-haze-bg-color : #eef2f5;
    --blue-border-color-op : #929edb;
    --blue-bg-color-op : #e9ebf8;
    --blue-bg-color-2 : #7666d7;
    --tundora-bg : #404040;
    --violet-bg: #7666d7;
    --dark-pink-bg: #d66df8;
    --cyan-color: #82bdd9;
    --pink-color-op12 : #ffedfa;
    --blue-color-op12 : #e5e7f6;
    --sky-color-op12 : #e0f4fd;
    --green-color-op12 : #eaf6e9;
    --orange-color-op12 : #ffefe0;
    --danger-color-op12 : #fde9e9;
    --light-color-op12 : #ededed;
    --yellow-color-op12 : #fff9e0;
    --violet-bg-op12 : #eeecfa;
    --cyan-color-op12 : #f0f7fa;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
html, body { min-height: 100%; }
.wrapper { min-height: 100%; position: relative; overflow: hidden; }

.container-fluid { width:100%; max-width:100%; padding:0; margin:0 auto; }

.layout-wrapper { display: flex; width: 100%; height: 100%; overflow: hidden; }

/* Start Login Page */
.login-page2 { background: var(--aqua-haze-bg-color) url(../images/company-onboarding.png) center right no-repeat; background-size: auto 100%; position: relative; display: block; width: 100%; padding: 100px 0; height: 100vh; }
.login-header { display: table; width: 100%; position: fixed; left: 0; top: 0; padding: 40px; }
.login-header .list { display: table-cell; vertical-align: middle; }
.login-time-date { color: var(--black-color); font-size: 15px; text-align: right; opacity: 0.6; }

.login-content-main { width: 100%; height: calc(100vh - 200px); overflow: auto; overflow: auto; }
.login-content { width: 100%; display: table; }
.login-content .list { display: table-cell; vertical-align: middle; height: calc(100vh - 200px); width: 33.3%; padding: 40px 0; }

.login-box { background: #fff; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12); border-radius: 32px; width: 100%; max-width: 480px; margin: 0 auto 0 auto; padding: 0 60px 60px 60px; }
.login-box .comet-symbol { width: 100%; text-align: center; display: block; position: relative; top: -40px; margin-bottom: -6px; /* padding-bottom: 35px; */ }
.login-box .welcome-text { width: 100%; text-align: center; color: var(--light-color); font-size: 14px; line-height: 20px; font-weight: 500; padding-bottom: 35px; }
.login-box .welcome-text h2 { color: var(--black-color); font-size: 24px; line-height: 30px; font-weight: 500; padding: 0 0 2px 0; margin: 0; }

.login-box .remember-forgot { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; padding: 3px 0 23px 0; }
.login-box .or { width: 100%; text-align: center; color: var(--light-color); font-size: 14px; line-height: 18px; font-weight: 500; position: relative; margin: 35px 0; }
.login-box .or:before { background: var(--light-border-color); width: 100%; height: 1px; content: ''; position: absolute; left: 0; top: 0; bottom: 0; margin: auto 0; }
.login-box .or span { background: #fff; padding: 0 5px; display: inline-block; position: relative; z-index: 1; }
.login-box .signin-google { width: 100%; }
body .login-box .signin-google button { width: 100% !important; border: 1px solid var(--light-border-color) !important; overflow: hidden !important; border-radius: 6px !important; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12) !important; }
body .login-box .btn { border-radius: 6px; }

.login-content .right-login { padding: 0 15px; }
.login-content .quote { width: 100%; text-align: center; color: rgba(31, 31, 31, 0.6); font-size: 24px; line-height: 30px; font-weight: 500; position: relative; padding: 115px 0 0 0; }
.login-content .quote:before { width: 80px; height: 80px; position: absolute; content: ''; top: 0; left: 0; right: 0; margin: 0 auto; background: rgba(255, 255, 255, 0.12) url(../images/quote.png) center center no-repeat; border-radius: 50%; }
.login-content .quote .name { display: block; font-size: 18px; line-height: 24px; width: 100%; padding: 17px 0 0 0; }

.login-footer { position: fixed; left: 0; bottom: 45px; width: 100%; text-align: center; }
.login-footer .f-logo { display: flex; align-items: center; justify-content: center; }
.login-footer .f-logo span { font-size: 13px; font-weight: 500; color: #8a8c99; padding-right: 10px; }
/* End Login Page */

/* Header */
.page-topbar { position: fixed; /* background: hsla(0,0%,100%,.03); */ top: 0; right: 0; left: 0; z-index: 1002; /* z-index: 1056; */ padding-left: 300px; }
.page-topbar .container-fluid { padding: 0; position: relative; }
.page-topbar > .container-fluid:before { position: absolute; left: 0; bottom: -15px; content: ''; background: var(--aqua-haze-bg-color); width: 100%; height: 15px; opacity: 0; }

.navbar-header { width:100%; display:table; padding:8px 20px 8px 0; background: var(--athens-gray) url(../images/corner-top.svg) left top no-repeat; position: relative; margin:0 !important; float: none; }
.navbar-header .navbar-list { display: table-cell; vertical-align: middle; width: 50%; float: none !important; margin: 0; }
.navbar-brand-box { width: 100%; padding: 24px 15px 20px 24px; }
.navbar-brand-box .logo { display: inline-block; }
.navbar-brand-box .logo span { display: inline-block; }
.navbar-brand-box .logo .logo-sm { display: none; }

.all-module-drop-down { width: 100%; padding: 12px 15px 20px 15px; }

.dropdown-mega-menu ul.dropdown-mega { padding: 0; margin: 0; }
.dropdown-mega-menu ul.dropdown-mega > li { display: inline-block; vertical-align: middle; }
.dropdown-mega-menu ul.dropdown-mega > li > .btn { display: inline-block; padding: 0 15px 0 0; margin: 0; font-size: 14px; font-weight: 500; color: #fff; box-shadow:none !important; position: relative; }
.dropdown-mega-menu ul.dropdown-mega > li > .btn:after { opacity: 0; }
.dropdown-mega-menu ul.dropdown-mega > li > .btn .feather { top:-1px; position:absolute; right:0; }

.dropdown-mega-menu .dropdown-menu { position: absolute; padding: 20px; left: 20px !important; right: 20px !important; box-shadow: 0 3px 3px rgba(0,0,0,.12); border-radius:6px; border:none; transform:none !important; margin:0 !important; -moz-transition:all .2s linear;-webkit-transition:all .2s linear;transition:all .3s linear; top: 100%; opacity: 0; visibility: hidden; display: block !important; }
.dropdown-mega-menu .dropdown-menu.show { top: 100% !important; opacity: 1; visibility: visible; }
/* Mega Menu */
.megamenu-list { margin: 0 0 15px 0; padding:0; }
.megamenu-list li { position: relative; padding: 5px 0; font-size:14px; line-height: 18px; font-weight:500; }
.megamenu-list li:last-child { padding-bottom:0; }
.megamenu-list li a { display:block; color:#626c76; }
.megamenu-list li a:hover,
.megamenu-list li.active a { color:var(--blue-color); }

.top-navbar-right { float:right; padding: 0; margin: 0; position: relative; }
.top-navbar-right > li { display: inline-block; padding:0 9px 0 0; vertical-align: middle; position:relative; height: 32px; }
.top-navbar-right > li:last-child { padding-right:0; }
.top-navbar-right > li.line { margin-right: 8px; }
.top-navbar-right > li.line:before { content: ''; position: absolute; right: 0; top: 0; bottom: 0; margin: auto 0; width: 1px; height: 18px; background: var(--ghost-gray); }
.top-navbar-right > li .dot { position: absolute; width: 6px; height: 6px; font-size: 0; border-radius: 50%; left: 0; right: 0; margin: 0 auto; bottom: -11px; display: block; opacity: 0; z-index: 1002; }
.top-navbar-right > li.show .dot,
.top-navbar-right > li .dropdown.show .dot { opacity: 1; }
.top-navbar-right .header-item { background: none; box-shadow:none; border:none; padding:0; line-height: normal; color:var(--light-color); position: relative; }
.top-navbar-right .header-item:hover { color:var(--blue-color); }
.top-navbar-right .user-dropdown .header-item { color:var(--black-color); background: none !important; }
body .top-navbar-right .user-dropdown .show>.btn-primary.dropdown-toggle,
.top-navbar-right .user-dropdown .header-item:hover,
.top-navbar-right .user-dropdown .header-item:focus,
.top-navbar-right .user-dropdown .header-item:not([disabled]):not(.disabled):active{ color:var(--black-color); background: none !important; }
.top-navbar-right .user-dropdown .dropdown-menu ul { padding: 0; margin: 0; }

.top-navbar-right .count-noti { position: absolute; right: -6px; top: -2px; box-shadow:none; padding:4px 6px; font-size:12px; line-height: 16px; padding: 0px 6px; font-weight: 400; /* width:24px; */ height:16px; }

.noti-icon .badge { position: absolute; right: -6px; top: -2px; box-shadow:none; padding:4px 6px; font-size:12px; line-height: 16px; padding: 0px 6px; font-weight: 400; /* width:24px; */ height:16px; background: var(--blue-color); color: #fff; }
.top-navbar-right .header-item.btnic { width: 32px; height:32px; padding:0px 0; text-align: center; display: inline-flex; border-radius: 6px; color: var(--light-color); background: none !important; }
.top-navbar-right .header-item.btnic:hover,
.top-navbar-right .header-item.btnic:focus,
body .top-navbar-right .show>.btn-primary.dropdown-toggle.header-item.btnic,
.top-navbar-right .header-item.btnic:not([disabled]):not(.disabled):active,
.top-navbar-right > li.show .header-item.btnic { color: var(--black-color); background: none !important; } 
.top-navbar-right .header-item.btnic .name-icon { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; } 
.top-navbar-right .header-item.btnic .feather { align-self: center; margin: 0 auto; }
.top-navbar-right .header-item.btnic .feather:before { display: none; }
.top-navbar-right .full-screen { position: absolute; right: 0; top: -8px; right: -20px; width: 48px; }
.top-navbar-right .full-screen .header-item.btnic { width: 48px; height: 48px; text-align: center; background: var(--geyser-gray) !important; border-radius: 0 0 0 16px; position: relative; cursor: pointer; }
.top-navbar-right .full-screen .minimize { position: absolute; left: 0; right: 0; margin: 0 auto; opacity: 0; }
.top-navbar-right .full-screen .maximize-screen .maximize { opacity: 0; }
.top-navbar-right .full-screen .maximize-screen .minimize { opacity: 1; }

.top-navbar-right .header-item:after { opacity: 0; display: none; }

.top-navbar-right .dropdown-menu { position: absolute; padding: 15px 0; left: auto !important; right: 38px !important; transform:none !important; transform-style:inherit !important; margin:0 !important; top: 40px; }
.top-navbar-right .dropdown-menu.show { top: 40px !important; transform:none !important; transform-style:inherit !important; }

/* Top Search */
.navbar-header .navbar-list.erp-search { padding:0 20px 0 20px; }
.top-search { width: 100%; position: relative; max-width: 500px; margin: 0 auto; }
.top-search .form-control { width:100%; background:rgba(255,255,255); height: 32px; line-height: 32px; font-size: 15px; text-shadow: none; font-family: 'DM Sans', sans-serif; font-weight:500; padding: 0 20px 0 40px; border: 1px solid var(--sky-color); border-radius: 6px; color:(--light-color); outline: none !important; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.top-search .feather { position:absolute; left:6px; color:(--light-color); top:6px; }

.top-search ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: (--light-color); opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.top-search ::-moz-placeholder { /* Firefox 19+ */ color: (--light-color); opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.top-search :-ms-input-placeholder { /* IE 10+ */ color: (--light-color); opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.top-search :-moz-placeholder { /* Firefox 18- */ color: (--light-color); opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }

body .top-navbar-right > li.top-serch-toggle .dropdown-menu,
body .top-navbar-right > li .top-serch-toggle .dropdown-menu { background: none; box-shadow: none; border-radius: 0; border: none; padding: 0; top: 0 !important; right: 7px !important; transform:none !important; min-width: 0; width: 0px; transition: width 2s; transition: max-width 0.2s ease,min-width 0.2s ease,width 0.2s ease; }
body .top-navbar-right > li.top-serch-toggle.open .dropdown-menu,
body .top-navbar-right > li .top-serch-toggle.open .dropdown-menu { min-width: 500px; width: 100%; }

.top-search-results { position: absolute; width: 100%; left: 0; top: 100%; background: #fff; border: 1px solid var(--light-border-color); box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-radius: 6px; margin-top: 10px; visibility: hidden; opacity: 0; -moz-transition:all .1s linear;-webkit-transition:all .1s linear;transition:all .1s linear; }
.top-search-results.show { visibility: visible; opacity: 1; }
.top-search-results:before { position: absolute; top: -14px; width: calc(100% - 50px); left: 31px; height: 3px; background: var(--sky-color); content: ''; border-radius: 2px 2px 0 0; }
.top-search-results .search-results { width: 100%; padding: 0; margin: 0; max-height: 295px; overflow: auto; }
.top-search-results .search-results li { color: var(--light-color); font-size: 14px; line-height: 20px; font-weight: 500; padding: 0 2px; margin: 0 0 1px 0; }
.top-search-results .search-results li.heading { background: #edf1f4; font-size: 13px; color: var(--black-color); padding: 2px 10px; }
.top-search-results .search-results li.heading a { padding: 0; background: none !important; color: var(--black-color); }
.top-search-results .search-results li.heading a:hover,
.top-search-results .search-results li.heading a:active,
.top-search-results .search-results li.heading a:focus { background: none !important; }
.top-search-results .search-results li.heading:first-child { border-top-left-radius: 6px; border-top-right-radius: 6px; }
.top-search-results .search-results li.heading:last-child { border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; }
.top-search-results .search-results li a,
.top-search-results .search-results li button { color: var(--light-color); font-size: 14px; line-height: 20px; font-weight: 500; border-radius: 4px; padding: 6px 8px; display: block; border: none; width: 100%; background: none; text-align: left; white-space: normal; }
.top-search-results .search-results li a:active,
.top-search-results .search-results li a:focus,
.top-search-results .search-results li:hover a,
.top-search-results .search-results li:hover button,
.top-search-results .search-results li.highlighted a,
.top-search-results .search-results li.highlighted button,
.top-search-results .search-results li.highlight-searched a,
.top-search-results .search-results li.highlight-searched button { background: var(--light-bg-color) !important; color: var(--black-color); }

body .ui-autocomplete.ui-menu { background: #fff; border-radius: 10px; margin-top: 10px; border: 1px solid var(--light-border-color); box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06);  -moz-transition:all .1s linear;-webkit-transition:all .1s linear;transition:all .1s linear; z-index: 1002; padding: 8px 2px; max-width: 500px; overflow: initial; }
body .ui-autocomplete.ui-menu:before { background: var(--sky-color); border-radius: 2px 2px 0 0; content: ''; height: 3px; left: 31px; position: absolute; top: -5px; width: calc(100% - 50px); }
body .ui-autocomplete.ui-menu li { color: var(--light-color); font-size: 14px; line-height: 20px; font-weight: 500; padding: 0px; margin: 0 0 1px 0; }
body .ui-autocomplete.ui-menu li a { color: var(--light-color); font-size: 14px; line-height: 20px; font-weight: 500; border-radius: 4px; padding: 6px 8px; display: block; border: none; width: 100%; background: none; text-align: left; white-space: normal; }
body .ui-autocomplete.ui-menu li.ui-state-focus a,
body .ui-autocomplete.ui-menu li a:hover,
body .ui-autocomplete.ui-menu li a:active { background: var(--light-bg-color) !important; color: var(--black-color); }

/* Dropdown-Menu */
body .dropdown.open
body .dropdown-toggle:after { position: absolute; opacity: 0; }
body .dropdown-menu { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); background: #fff; border:1px solid var(--light-border-color); padding: 0; margin: 0 !important; min-width: 200px; border-radius:6px !important; opacity: 0; visibility: hidden; display: none !important; -moz-transition:all .1s linear;-webkit-transition:all .1s linear;transition:all .1s linear;
/*transform: translate3d(0px, 15px, 0px) scale3d(0.9, 0.9, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg) !important; transform-style: preserve-3d !important;*/ }
body .dropdown-menu.show { opacity: 1; visibility: visible; display: block !important; /* transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg) !important; transform-style: preserve-3d !important;*/ }
body .dropdown.open .dropdown-menu { opacity: 1; visibility: visible; display: block !important; /* transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg) !important; transform-style: preserve-3d !important;*/ }

.top-navbar-right .noti-menu .dropdown-menu { padding: 0; background:#fff; right: 0 !important; overflow: hidden; }
.header-noti { padding:15px 10px; font-size:15px; line-height:15px; font-weight:500; }

.notification-main {  }
.notification-main .notification-inn { overflow: auto; height: calc(100vh - 112px); /* 82 + margin+12=112 */ width: 100%; margin: 15px 0; padding: 0px 15px; }
.notification-main .filter-footer { display: flex; justify-content: space-between; }
.notification-main .notification-date { font-size: 14px; line-height: 18px; color: var(--black-color); font-weight: 500; position: relative; }
.notification-main .notification-date .date { background: #fff; padding-left: 10px; padding-right: 10px; position: relative; z-index: 1; }
.notification-main .notification-date:before { position: absolute; left: 0; top: 0; content: ''; width: 2px; height: 100%; background: var(--sky-color); border-radius: 1px; z-index: 2; }
.notification-main .notification-date:after { position: absolute; left: 0; top: 0; bottom: 0; content: ''; margin: auto 0; border-bottom: 1px dashed var(--light-border-color); height: 1px; width: 100%; }
.notification-main .content-noti { padding: 0; margin: 0; }
.notification-main .content-noti li { padding: 0 0 13px 0; margin: 15px 0 15px 0; text-align: left; position: relative; font-size: 14px; line-height: 18px; font-weight: 500; }
.notification-main .content-noti li + li { margin-top: 0; }
.notification-main .content-noti li:before { position: absolute; left: 43px; bottom: 0; height: 1px; content: ''; background: var(--light-border-color); width: calc(100% - 43px); }
.notification-main .content-noti li:last-child { padding-bottom: 0; }
.notification-main .content-noti li:last-child:before { opacity: 0; }
.notification-main .content-noti li .btn.button-toggle-link { background: none !important; padding: 0; width: 100%; display: block; cursor: default; }
.notification-main .content-noti li .btn.button-toggle-link:focus,
.notification-main .content-noti li .btn.button-toggle-link:hover,
.notification-main .content-noti li .btn.button-toggle-link:not([disabled]):not(.disabled):active { background: none !important; }
.notification-main .content-noti li a { white-space: normal; }
.notification-main .content-noti li .notification-list { display: flex; text-align: left; color: var(--black-color); }
.notification-main .content-noti li .notification-left { width: 43px; min-width: 43px; }
body .notification-main .content-noti li .notification-left .btn.btn-light { background: var(--athens-gray) !important; opacity: 1; }
.notification-main .content-noti li .notification-right { width: 100%; }
.notification-main .content-noti li .notification-name { margin-top: -4px; color: var(--black-color); }
.notification-main .content-noti li .notification-name .code { color: var(--light-color); }
.notification-main .content-noti li .notification-content { color: var(--light-color); padding: 3px 0 0 0; width: 100%; }
.notification-main .content-noti li .notification-content b { font-weight: 500; color: var(--black-color); }
.notification-main .content-noti li .notification-time { position: relative; padding-left: 22px; width: 100%; margin: 5px 0 0 0; color: var(--light-color); }
.notification-main .content-noti li .notification-time .feather { position: absolute; left: 0; top: 2px; }
.notification-main .content-noti li.no-notification { margin: 0; padding: 0; }
.notification-main .content-noti li.no-notification .notification-list { align-items: center; }
.notification-main .content-noti li.no-notification .notification-content { padding: 0; }

.top-navbar-right > li.user-dropdown { padding-right: 38px; }
.top-navbar-right > li.user-dropdown .header-item { display: flex; }
.user-profile { display: table; height:32px; }
.user-profile .image { display: table-cell; vertical-align: middle; height: 32px; }
.user-profile .image-text { display: table-cell; vertical-align: middle; }
.user-profile .image-text .profile-name { width: 32px; height: 32px; line-height: 32px; font-size: 14px; text-transform: uppercase; display: block; border-radius: 6px; background: var(--sky2-color); color: var(--sky-color); text-align: center; font-weight: 700; position: relative; }
.user-profile .image-text .profile-name:before { width: 100%; height: 100%; content: ''; position: absolute; left: 0; top: 0; border: 1px solid rgba(0, 0, 0, 0.10); border-radius: 6px; }
.user-profile .image img { width:32px; height:32px; /* padding: 3px; */ background:rgba(255,255,255,.25); object-fit: cover; object-position: 50% 50%; border-radius: 6px !important; }
.user-profile .info { display: table-cell; vertical-align: middle; padding-left:13px; font-size:14px; line-height: 32px; font-weight:500; height: 32px; position:relative; padding-right:37px; }
.user-profile .info .feather { position:absolute; right:0; top: 8px; color: var(--light-color); width:16px; height: 16px; }
.user-profile .info .feather svg { width:16px; }
.user-dropdown.show .user-profile .info .feather { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

.top-navbar-right .user-dropdown .dropdown-menu { padding:8px 2px; }
.user-dropdown .dropdown-menu li { display:block; padding:0px; }
.user-dropdown .dropdown-menu li a,
.user-dropdown .dropdown-menu li .dropdown-item { display:block; font-size:14px; font-weight:500; line-height:20px; color:var(--light-color); padding:8px 20px 8px 44px; background: #fff; position:relative; border-radius: 6px; }
.user-dropdown .dropdown-menu li.logout a { color:var(--danger-color); }
.user-dropdown .dropdown-menu li a:hover,
.user-dropdown .dropdown-menu li .dropdown-item:hover { background: var(--light-bg-color); color:var(--blue-color); }
.user-dropdown .dropdown-menu li .feather { position:absolute; left:14px; top:8px; }

.preloader { height: 100% !important; opacity: 0; visibility: hidden; }
.preloader.show { opacity: 1; visibility: visible; }
.preloader .preloader-box { display: block !important; }
.preloader .preloader-box { padding: 5px; background: #fff; border-radius: 50%; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border: 1px solid var(--light-border-color); }


/* .preloader .preloader-box {
    display: block!important;
} */

/* Start Sidebar */
.main-sidebar2 { position: relative; min-width: 300px; max-width: 300px; top:0; bottom:0; z-index: 1003; z-index: 999; }
body .vertical-menu { border-radius: 7px; position: relative; /* margin-top: 35px; */ width: 100%; z-index: 1001; background: #fff; bottom: 0; /* top: 70px; */ /* box-shadow: 0 .75rem 1.5rem rgba(18,38,63,.03); */ /* min-height: calc(100vh - 105px) !important; padding: 0 0 30px 0; */ min-height: 100vh !important; padding: 0; height: 100%; }
.menu-title { padding: 12px 20px !important; letter-spacing: 0.8px; pointer-events: none; cursor: default; font-size: 12px; text-transform: uppercase; color: var(--light-color); font-weight: 700; }
.vertical-menu .sidebar { padding: 0; height: 100% !important; }

/* .vertical-nav ul.nav-sidebar {  } */
.vertical-nav { padding: 0 15px 15px 15px; /* padding-bottom: 62px; */ /* height: calc(100vh - 65px); */ height: calc(100vh - 188px) !important; overflow-y: auto; }
/* .vertical-nav ul.nav-sidebar { padding-top:20px; } */
.vertical-nav ul.nav-sidebar > li { display: block; width: 100%; }

.vertical-nav ul.nav-sidebar > li.all-settings { position: fixed; left: 0; bottom: 0px; max-width: 300px; padding: 15px 15px; background: #fff; z-index: 1; padding-left: 12px; padding-right: 12px; }
.vertical-nav ul.nav-sidebar > li.all-settings > a.nav-link { margin-bottom: 0; }

.vertical-nav ul.nav-sidebar > li.all-skelton { display: none; visibility: hidden; }

.vertical-nav ul.nav-sidebar > li > a.nav-link { display:block; padding: 0; margin: 0 0 8px 0; position: relative; font-size:15px; font-weight: 500; color:var(--light-color); background:none !important; box-shadow:none !important; border-radius: 6px; }
.vertical-nav ul.nav-sidebar > li > a.nav-link .menu-icon { width: 50px; height: 32px; display: block; padding: 6px 0 0 0; text-align: center; position: absolute; left: 0; top: 0; }
.vertical-nav ul.nav-sidebar > li > a.nav-link .menu-name { width: 100%; /* height: 32px; */ padding: 6px 20px 6px 50px; display: block; }
/*.vertical-nav ul.nav-sidebar > li > a.nav-link.no-icon { padding-left: 15px; }*/
.vertical-nav ul.nav-sidebar > li > a.nav-link.no-icon .menu-name { padding-left: 15px; }
.vertical-nav ul.nav-sidebar > li > a.nav-link:before { background: var(--sky-color); width: 2px; height: 26px; content: ''; position: absolute; left: -6px; top: 0; bottom: 0; margin: auto 0; opacity: 0; }
.vertical-nav ul.nav-sidebar > li > a.nav-link:focus { color:var(--light-color) !important; }
.vertical-nav ul.nav-sidebar > li > a.nav-link.active:before { opacity: 1; }
.vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link:before,
.vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link.active:before { opacity: 1; }
.vertical-nav ul.nav-sidebar > li:hover > a.nav-link,
.vertical-nav ul.nav-sidebar > li > a.nav-link.active,
.vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link { color:var(--black-color) !important; background: var(--aqua-haze-bg-color) !important; }
/*.vertical-nav ul.nav-sidebar > li > a.nav-link .icon-name { position: absolute; left:14px; top:6px; }*/
.vertical-nav ul.nav-sidebar > li > a.nav-link > .feather.right2 { right:10px; position: absolute; top:6px; transition: opacity 0.3s; -webkit-transition: opacity 0.3s; }
.vertical-nav ul.nav-sidebar > li > a.nav-link > .feather.dots-vertical { position: absolute; left: 32px; top: 6px; color: var(--light-border-color); /* transition: opacity 0.3s; -webkit-transition: opacity 0.3s; */ opacity: 0; }

.vertical-nav ul.nav-sidebar > li > a.nav-link > .feather.right2.chevron-up,
.vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link > .feather.right2.chevron-down { opacity: 0; }
.vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link > .feather.right2.chevron-up { opacity: 1; }

.vertical-nav ul.nav-sidebar > li.active > a.nav-link > .feather.right2.chevron-down { opacity: 0; }
.vertical-nav ul.nav-sidebar > li.active > a.nav-link > .feather.right2.chevron-up { opacity: 1; }

.vertical-nav .nav-sidebar .nav-treeview { padding:0; margin:0; }
.vertical-nav .nav-sidebar .nav-treeview > li { display:block; padding:0; margin:0; }
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link { font-size: 15px; font-weight: 500; color: var(--light-color); padding:6px 24px 6px 60px; margin:0 0 8px 0; border-radius: 6px; position: relative; }
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link:before { background: var(--sky-color); width: 2px; height: 26px; content: ''; position: absolute; left: -6px; top: 0; bottom: 0; margin: auto 0; opacity: 0; }
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link:focus,
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link:hover,
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active,
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active:hover,
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active:focus { color:var(--blue-color); background: var(--light-bg-color); }

.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link:focus:before,
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active:before,
/* .vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link:hover:before,
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active:hover:before, */
.vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active:focus:before { opacity: 1; }
.vertical-nav .nav-sidebar .nav-treeview > li > a .far { display:none; }

/* Sub Mneu */
.vertical-nav ul.nav-sidebar > li > ul.nav-treeview { /* display: none !important; opacity: 0; transition: all .3s linear; */  transition: max-height 0.25s ease-out; /* overflow: hidden; max-height: 0; */ }
.vertical-nav ul.nav-sidebar > li.menu-open > ul.nav-treeview { /* display: block !important; opacity: 1; */ max-height: 800px; transition: max-height 0.35s ease-in; }

.sidebar-big .vertical-nav { width: calc(100% - 6px) !important; }

/* Start Sidebar Mini */
.arrow-menu { background: url(../images/arrow-menu.svg) center center no-repeat; position: absolute; width: 20px; height: 44px; z-index: 1; right: -15px; top: 0; bottom: 0; margin: auto 0; opacity: 0; cursor: pointer; }
.arrow-menu:hover { background-image: url(../images/arrow-menu-hvr.svg); }
.main-sidebar2:hover .arrow-menu,
.main-sidebar2:active .arrow-menu { opacity: 1; }
.sidebar-mini .arrow-menu { background-image: url(../images/arrow-menu-open.svg); }
.sidebar-mini .arrow-menu:hover,
.sidebar-mini .arrow-menu:active { background-image: url(../images/arrow-menu-open-hvr.svg); }

.sidebar-mini .main-sidebar2 { min-width: 60px; max-width: 60px; }
.sidebar-mini .page-topbar { padding-left: 60px; }

.sidebar-mini .navbar-brand-box { padding: 12px 0 1px 0; text-align: center; }
.sidebar-mini .navbar-brand-box .logo .logo-sm { display: block; }
.sidebar-mini .navbar-brand-box .logo .logo-lg { display: none; }

.sidebar-mini .all-module-drop-down { padding-left: 12px; padding-right: 12px; }
.sidebar-mini .all-module-drop-down .form-group .form-select-drop .select-value,
.sidebar-mini .all-module-drop-down .form-group .form-select-drop .select-indicators { opacity: 0; }
body.sidebar-mini .all-module-drop-down .form-group .form-select-drop .btn.form-control:focus,
body.sidebar-mini .all-module-drop-down .form-group .form-select-drop.show .btn.form-control { box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; border-color: var(--sky-color); }
body.sidebar-mini .all-module-drop-down .form-group .form-select-drop .btn.form-control,
body.sidebar-mini .all-module-drop-down .form-group .form-select-drop .btn.form-control:not([disabled]):not(.disabled):active { background: #fff url(../images/menu.svg) center center no-repeat !important; background-size: 20px 20px !important; cursor: pointer; }
body.sidebar-mini .all-module-drop-down .form-group .form-select-drop .dropdown-menu { top: 10px !important; left: 58px !important; }
/* body.sidebar-mini .all-module-drop-down .form-group .form-select-drop .dropdown-menu.show { top: -38px !important; } */
body.sidebar-mini .all-module-drop-down .form-group .form-select-drop .dropdown-menu.show { top: 0px !important; }

.sidebar-mini .vertical-nav { padding: 0 12px 15px 12px; overflow-x: hidden; -ms-overflow-style: none; scrollbar-width: none; }
/* .sidebar-mini .vertical-nav:hover,
.sidebar-mini .vertical-nav:active { width: 330px; } */
.sidebar-mini .vertical-nav.expanded { width: 350px; }
.sidebar-mini .vertical-nav::-webkit-scrollbar { display: none; }
.sidebar-mini .vertical-nav::-webkit-scrollbar-thumb { opacity: 0; display: none; }
.sidebar-mini .vertical-nav::-webkit-scrollbar-thumb:hover { opacity: 0; display: none; }

.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link { display: inline-block; }

/* .sidebar-mini .vertical-nav ul.nav-sidebar > li { position: static; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li:hover { width: auto; position: absolute; display: block; z-index: 10; } */
.sidebar-mini .vertical-nav ul.nav-sidebar > li.all-settings { padding-top: 0; padding-bottom: 0; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li.all-settings { max-width: 60px; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li.all-settings > a.nav-link .menu-name { min-width: 82px; }

.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link > .feather.right2 { opacity: 0 !important; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link > .feather.dots-vertical { opacity: 1; }

.sidebar-mini .vertical-nav ul.nav-sidebar > li:hover > a.nav-link,
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link.active,
.sidebar-mini .vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link { background: none !important; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link .menu-icon { width: 36px; border-radius: 6px; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li:hover > a.nav-link .menu-icon,
.sidebar-mini .vertical-nav ul.nav-sidebar > li:active > a.nav-link .menu-icon,
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link.active .menu-icon,
.sidebar-mini .vertical-nav ul.nav-sidebar > li.menu-open > a.nav-link .menu-icon { background: var(--aqua-haze-bg-color) !important; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link .menu-name { margin-left: 58px; border-radius: 6px; padding-left: 12px; padding-right: 12px; background: #fff; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); color: var(--black-color); opacity: 0; display: inline-block; width: auto; white-space: nowrap; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li:hover > a.nav-link .menu-name,
.sidebar-mini .vertical-nav ul.nav-sidebar > li:active > a.nav-link .menu-name { opacity: 1; }

.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 6px 0px rgba(0, 0, 0, 0.06); border-radius: 6px; width: 270px; background: #fff !important; padding: 2px; margin: -5px 0 0 58px; opacity: 0; border: 1px solid var(--light-border-color); }
.sidebar-mini .vertical-nav .nav-sidebar > li:hover > .nav-treeview { opacity: 1; }
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li { width: 100%; max-width: 100%; max-height:inherit; }
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link { margin-bottom: 2px; padding: 6px 15px 6px 16px; max-width: 100%; justify-content: flex-start; }
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link:before { width: 2px; height: 22px; position: absolute; left: 5px; top: 0; bottom: 0; margin: auto 0; border-radius: 1px; background: var(--sky-color); content: ''; opacity: 0; }
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li:hover > a.nav-link,
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li:active > a.nav-link,
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active { color: var(--black-color); }
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li:hover > a.nav-link:before,
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li:active > a.nav-link:before,
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li > a.nav-link.active:before { opacity: 1; }
.sidebar-mini .vertical-nav .nav-sidebar .nav-treeview > li:last-child > a.nav-link { margin-bottom: 0; }

body .my-tooltip.menu-tooltip { margin-left: 22px !important; border-radius: 6px; padding: 6px 12px; background: #fff; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); color: var(--black-color); font-size: 14px; font-weight: 500; line-height: 18px; opacity: 0 !important; /* visibility: hidden !important; */ left: 48px !important; }
body.sidebar-mini .my-tooltip.menu-tooltip { opacity: 0 !important; }
body .my-tooltip.menu-tooltip:before,
body .my-tooltip.menu-tooltip:after { opacity: 0; background: #fff !important; }

.sidebar-mini .modal.add-page-modal { padding-left: 60px !important; }
.sidebar-mini .modal { padding-left: 60px !important; }
/* End Sidebar Mini */

.main-content { width: 100%; margin: 0; position: relative; max-height: 100vh; background: var(--aqua-haze-bg-color); border-radius: 0 0 0 16px; /*  display: flex; flex-direction: column; */ overflow: hidden; padding:48px 0 50px 0; }
.page-content-main { width: 100%; overflow-y:auto; height: calc(100vh - 40px); padding: 15px 15px; }
.page-content { margin: 0; padding: 0; }

/* Company Setup */
.company-onboarding { width: 100%; padding: 30px; height: 100vh; background: url(../images/company-onboarding.png) center right no-repeat; background-size: auto 100%; overflow: auto; }
.company-onboarding .company-header { position: absolute; left: 0; top: 0; width: 100%; padding: 30px 30px 0 30px; z-index: 1002; display: flex; flex-shrink: 0; align-items: flex-start; justify-content: space-between; }

.company-main-content { width: 100%; display: flex; }
.company-onboarding .breadcrumb li.page-name { text-transform: none; }

.company-onboarding .company-left-welcome { width: 100%; padding: 0 30px 0 0; display: flex; align-items: center; }
.company-welcome { width: 100%; padding: 0px 0 0 110px; margin-top: -120px; }
.company-welcome .welcome { color: var(--light-border-color); font-size: 30px; line-height: 30px; font-weight: 500; width: 100%; padding-bottom: 5px; }
.company-welcome .owner-name { font-size: 36px; line-height: 36px; font-weight: 500; width: 100%; color: var(--blue-color); padding-bottom: 20px; }
.company-welcome .welcome-text { font-size: 21px; line-height: 24px; font-weight: 500; color: var(--black-color); padding-bottom: 80px; background: url(../images/welcome.jpg) left bottom no-repeat; }

.company-onboarding .company-right-menu { width: 100%; padding-left: 30px; position: relative; min-height: calc(100vh - 60px); }
.company-right-menu .vertical-nav { padding: 85px 0 20px 0; overflow: inherit; height: auto; width: 100%; max-width: 262px; }

.company-page { max-width: 600px; min-width: 600px; position: relative; z-index: 1004; padding: 10px 0; }
.company-page .company-page-scroll { overflow: auto; min-height: calc(100vh - 238px); max-height: calc(100vh - 238px); }

/* Sales Configuration */
.sales-setup-page { width: 100%; max-width: 1170px; margin: 0 auto; position: relative; z-index: 1004; padding: 10px 0; }
.sales-setup-page .sales-setup-page-scroll { overflow: auto; min-height: calc(100vh - 238px); max-height: calc(100vh - 238px); }

/* Start All Configuration Page */
.all-configuration-page { width: 100%; height: 100vh; background: url(../images/company-onboarding.png) center right no-repeat; background-size: auto 100%; overflow: auto; position: relative; }
.all-configuration-page:before { position: absolute; left: 0; width: 100%; content: ''; height: 80px; background: url(../images/all-tile-white-bg.png) top right no-repeat; z-index: 1; }
.all-configuration-page .company-header { position: absolute; left: 0; top: 0; width: 100%; padding: 30px 30px 0 30px; z-index: 1002; display: flex; flex-shrink: 0; align-items: flex-start; justify-content: space-between; }
.configuration-main { width: 100%; height: 100vh; }
.configuration-content { width: 100%; display: table; padding: 35px 60px; }
.configuration-content .list { display: table-cell; vertical-align: middle; height: calc(100vh - 70px); }
.configuration-content .configuration-left-scroll { max-height: calc(100vh - 110px); overflow-y: auto; }
.configuration-content .left-configuration { width: 40%; padding-right: 40px; padding-top: 40px; }
.configuration-content .middle-configuration { width: 60%; position: relative; padding-top: 40px; height: calc(100vh - 110px); }
.configuration-content .middle-configuration .back-page { position: absolute; left: 20px; top: 0; z-index: 1003; }
.configuration-content .configuration-right-scroll { max-height: calc(100vh - 110px); overflow-y: auto; padding: 0 115px 0 20px; }

.configuration-content .left-configuration-inn { width: 100%; max-width: 510px; font-size: 14px; line-height: 20px; color: var(--light-color); font-weight: 500; }
.configuration-content .left-configuration-inn h2 { font-size: 18px; line-height: 24px; color: var(--black-color); font-weight: 500; padding: 0 0 20px 0; margin: 0; }
.configuration-content .left-configuration-inn p { padding: 0 0 38px 0; margin: 0; }
.configuration-content .left-configuration-inn ul { padding: 0; margin: 0; }
.configuration-content .left-configuration-inn ul li { width: 100%; padding: 0 0 28px 40px; margin: 0; font-size: 15px; line-height: 20px; font-weight: 500; color: var(--blue-color); position: relative; }
.configuration-content .left-configuration-inn ul li .feather { position: absolute; left: 0; top: -4px; }

.module-list { margin: 0 -15px; width: calc(100% + 30px); padding: 60px 0 0 0; /* display: flex; flex-flow: wrap; */ }
.module-list li { padding: 15px; width: 50%; margin: 0 -2px; display: inline-block; vertical-align: top; font-size: 14px; line-height: 20px; color: var(--black-color); font-weight: 500; }
.module-list li:nth-child(2n+1) { margin-top: -60px; }
.module-list li .box-bg { width: 100%; height: 100%; padding: 11px; background: #fff; border-radius: 10px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 8px 16px 0px rgba(0, 0, 0, 0.04); border: 1px solid transparent; position: relative; }
.module-list li .box-bg h2,
.module-list li .box-bg p,
.module-list li .box-bg .progress-configuration { cursor: pointer; }
.module-list li:hover .box-bg,
.module-list li:active .box-bg { border-color: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33),0px 8px 16px 0px rgba(0, 163, 239, 0.12); }
.module-list li:hover .configuration-header h2,
.module-list li:active .configuration-header h2 { color: var(--sky-color); }
.module-list li:hover .configuration-footer .more-button,
.module-list li:active .configuration-footer .more-button { color: var(--black-color); }

.module-list li .ribbon-main { position: absolute; right: -1px; top: -11px; padding: 0 8px; background: var(--sky-color); border-radius: 0 6px 0 0; font-size: 14px; line-height: 22px; font-weight: 500; color: #fff; white-space: nowrap; opacity: 0; cursor: pointer; }
.module-list li .ribbon-main .feather { position: absolute; left: -15px; top: 0; height: 22px; }
.module-list li .ribbon-main .feather svg { height: 22px; }
.module-list li .ribbon-main .feather path { fill: var(--sky-color); }

.module-list .circular-chart { width: 30px; height: 30px; }
.module-list .circular-chart .circle-bg { fill: none; stroke: var(--aqua-haze-bg-color); stroke-width: 3; }
.module-list .circular-chart .circle { stroke: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); fill: none; stroke-width: 3; stroke-linecap: round; animation: progress 1s ease-out forwards; }

.module-list li .configuration-header { position: relative; padding-left: 53px; padding-bottom: 16px; color: var(--light-color); }
.module-list li .configuration-header .module-icon { position: absolute; left: 0; top: 0; }
.module-list li .configuration-header h2 { font-size: 18px; line-height: 24px; color: var(--black-color); padding: 0 0 11px 0; margin: 0; }
.module-list li .configuration-header p { padding: 0 0 16px 0; margin: 0; }
.module-list li .configuration-header p:last-child { padding-bottom: 0; }

.module-list li .configuration-footer { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; }
.module-list li .configuration-footer .progress-percentage { padding-left: 22px; }
.module-list li .configuration-footer .more-button { color: var(--light-border-color); height: 20px; cursor: pointer; }
.module-list li .configuration-footer .more-button .feather { color: var(--light-border-color); }
/*.module-list li .configuration-footer .more-button .feather.arrowredirect { color: var(--black-color); }*/
.module-list li .configuration-footer .more-button a:hover .feather,
.module-list li .configuration-footer .more-button a:active .feather { color: var(--black-color) !important; }

.module-list li.configuration-green .circular-chart .circle { stroke: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.module-list li.configuration-yellow .circular-chart .circle { stroke: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }

.module-list li.configuration-green .box-bg { border-color: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33),0px 8px 16px 0px rgba(81, 184, 72, 0.12); }
.module-list li.configuration-green .ribbon-main { background: var(--green-color); opacity: 1; }
.module-list li.configuration-green .ribbon-main .feather path { fill: var(--green-color); }
.module-list li.configuration-green .configuration-header h2 { color: var(--green-color); }

.module-list li.configuration-yellow .box-bg { border-color: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33),0px 8px 16px 0px rgba(255, 204, 0, 0.12); }
.module-list li.configuration-yellow .ribbon-main { background: var(--yellow-color); opacity: 1; color: var(--black-color); }
.module-list li.configuration-yellow .ribbon-main .feather path { fill: var(--yellow-color); }
.module-list li.configuration-yellow .configuration-header h2 { color: var(--black-color); }
/* End All Configuration Page */

/* Select Drop Need Help */
.need-help { position: absolute; right: 0px; bottom: 0px; }
.need-help.need-help-sales-setup { right: 30px; bottom: 30px; }

body .need-help .dropdown-menu { width: 100%; right: 0 !important; left: auto !important; top: auto !important; bottom: 100% !important; transform:inherit !important; min-width: 291px; transform-style:inherit !important; -moz-transition:all .2s linear;-webkit-transition:all .2s linear;transition:all .2s linear; opacity:0; visibility:hidden; margin-bottom: 2px !important; padding: 12px 15px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); background: #fff; border: none; border-radius: 6px; }
body .need-help .dropdown-menu.show { top: auto !important; bottom: 100% !important; opacity:1; visibility:visible; }
body .need-help .dropdown-menu[x-placement="top-start"] { top: auto !important; bottom: 150% !important; margin-top: 0 !important; margin-bottom: 1px !important; }
body .need-help .dropdown-menu.show[x-placement="top-start"] { top: auto !important; bottom: 100% !important; }
body .need-help .btn.btn-text.btn-icon .feather { top: 0; bottom: 0; margin: auto 0; }

/* Start Dashboard Config */
.dashboard-tab-main { display: flex; align-items: center; margin-top: -5px; }
.dashboard-tab-main .tab-list { width: calc(100% - 116px); }
.dashboard-tab-main .tab-list.right-button { width: 116px; justify-content: end; display: flex; position: relative; padding-left: 20px; }
.dashboard-tab-main.no-view-permission .tab-list { width: calc(100% - 70px); }
.dashboard-tab-main.no-view-permission .tab-list.right-button { width: 70px; }

.dashboard-tab-main .tab-list.right-button:before { background: var(--ghost-gray); width: 1px; height: 18px; position: absolute; left: 12px; top: 0px; bottom: 0; margin: auto 0; content: ''; }
.dashboard-tab-main .dashbord-tab { width: 100%; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-wrapper--inner { text-align: left !important; }
.dashboard-tab.tab-menu2 .horizontal-menu { background: none; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item-wrapper { padding: 0; outline: none; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item { display: flex; align-items: center; justify-content: center; padding: 4px; min-width: inherit; margin: 5px 0; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item:hover { background-color: var(--light-bg-color); color: var(--black-color); }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item.active:hover { background: #fff; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item span { padding: 2px 12px 2px 36px; padding: 2px 24px 2px 24px; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item span:before { width: 3px; height: 0px; border-radius: 2px; margin: auto 0; left: -1px; top: 0; bottom: 0; right: auto; transition: width 4s, height 0.5s; }
.dashboard-tab.tab-menu2 .horizontal-menu .menu-item.active span:before { height: 26px; width: 3px; }
.dashboard-tab.tab-menu2 .horizontal-menu .scroll-menu-arrow .slider-arrow { background: var(--athens-gray); }
.dashboard-tab.tab-menu2 .horizontal-menu .scroll-menu-arrow .slider-arrow:hover { background: var(--light-bg-hvr-color); }

.toggle-more-list .MuiPopover-paper { box-shadow: none; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06) !important; border:1px solid var(--light-border-color); border-radius: 6px; }
.toggle-more-list ul.MuiMenu-list { padding: 0 2px; margin: 8px 0; min-width: 200px; }
.toggle-more-list ul.MuiMenu-list li.li-list { font-size: 14px; font-weight: 500; color: var(--light-color); line-height: 18px; border-radius: 4px; padding: 6px 13px; width: 100%; }
.toggle-more-list ul.MuiMenu-list li.li-list:hover,
.toggle-more-list ul.MuiMenu-list li.li-list:active { background: var(--light-bg-color) !important; color: var(--black-color); }

.chart-main { width: 100%; padding: 15px; position: relative; }
.chart-main .chart-title { font-weight: 500; line-height: 20px; font-size: 16px; color: var(--black-color); text-align: left; position: absolute; left: 15px; top: 13px; background: #fff; padding: 5px 5px 5px 0; border-radius: 0 6px 6px 0; z-index: 10; }
.chart-main .chart-title.ralative { position: relative; left:0; top:0; }
.chart-main .chart-title span { position: relative; display: inline-block; padding-left: 18px; }
.chart-main .chart-title span:before { position: absolute; content: ""; background-color: var(--sky-color); border-radius: 1.5px; width: 3px; height: 100%; left: 0; top: 0; }

.top-chart-filter { display: flex; padding: 14px 14px 0 14px; margin-bottom: 2px; text-align: left; }
.top-chart-filter .filtered { padding: 0; }
/* .Card-Matric .top-chart-filter { justify-content: space-between; } */
.Card-Matric .top-chart-filter .filtered { /* display: none; visibility: hidden; */ /* display: flex; justify-content: space-between; */ }
.top-chart-filter .filtered .filter .label-text,
.top-chart-filter .filtered .filter .name-text { margin-bottom: 3px; margin-top: 3px; }

.dashboard-min-height { width: 100%; min-height: calc(100vh - 196px); }

.dashboard-column-drop .dashboard-column-drop-list { padding: 0px 15px 0px 15px; position: relative; z-index: 1; }
.dashboard-configure .dashboard-column-drop .dashboard-column-drop-list { /* margin-top: 15px; */ }
.dashboard-column-drop .row-drag-drop-items .mobile-width { margin-top: 15px; }
.dashboard-column-drop .dashboard-column-drop-list .col-pd { padding-top: 15px; }
.dashboard-column-drop .dashboard-column-drop-list:before { box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); border: 1px solid var(--sky-color); position: absolute; content: ''; width: calc(100% + 15px); top: 14px; left: -15px; height: calc(100% - 13px); border-radius: 6px; opacity: 0; transition: opacity 0.3s; }
.dashboard-column-drop .dashboard-column-drop-list:hover:before,
.dashboard-column-drop .dashboard-column-drop-list:active:before { opacity: 1; }

.dashboard-column-drop .dashboard-column-drop-list:after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; margin: auto 0; width: 100%; height: 4px; background: var(--sky-color); z-index: 3; opacity: 0; transition: opacity 0.3s; }

.dashboard-column-drop .move-delete-button { position: absolute; left: -14px; top: 15px; bottom: 0; display: flex; align-items: center; justify-content: center; flex-flow: wrap; width: 40px; background: var(--aqua-haze-bg-color); border-radius: 6px 0 0 6px; z-index: 11; /* box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); */ /* border: 1px solid var(--sky-color); border-right-width: 0; */ opacity: 0; transition: opacity 0.3s; }
.dashboard-column-drop .move-delete-button:before { position: absolute; content: ''; width: 6px; height: 16px; background: url(../images/drag-right-cuw.svg) 50% 50% no-repeat; right: -6px; opacity: 0; transition: opacity 0.3s; }

/* Start Draging */
.dashboard-column-drop .dashboard-column-drop-list.draging { height: 40px !important; min-height: 40px; }
.dashboard-column-drop .dashboard-column-drop-list.draging:after { opacity: 1; }
.dashboard-column-drop .dashboard-column-drop-list.draging:before { opacity: 0; }
.dashboard-column-drop .dashboard-column-drop-list.draging .row-drag-drop-items { position: absolute; height: 0px; overflow: hidden; }
.draging .chart-box-list { border-color: transparent !important; }

.dashboard-column-drop .draging .move-delete-button { box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); border-right-width: 1px; border-radius: 6px; }
.dashboard-column-drop .draging .move-delete-button .list.move-button:before { opacity: 0; }
.dashboard-column-drop .draging .move-delete-button .list.delete-button { display: none; }

.dashboard-column-drop .draging .move-delete-button:before { opacity: 1; }
.dashboard-column-drop .draging .move-delete-button { border: 1px solid var(--sky-color); }
/* End Draging */

.dashboard-column-drop .dashboard-column-drop-list:hover .move-delete-button,
.dashboard-column-drop .dashboard-column-drop-list:active .move-delete-button { opacity: 1; }

.dashboard-column-drop .move-delete-button .list { padding: 6px 0; position: relative; }
.dashboard-column-drop .move-delete-button .list:before { background: var(--ghost-gray); width: 18px; height: 1px; position: absolute; left: 0; right: 0; margin: 0 auto; bottom: 0; content: ''; transition: opacity 0.3s; }
.dashboard-column-drop .move-delete-button .list:last-child:before { opacity: 0; }

.chart-box-list { width: 100%; border-radius: 6px; border: 1px solid var(--light-border-color); background: #fff; /* height: 100%; */ min-height: 100%; max-height: 100%; position: relative;  text-align: center; align-items: center; display: grid; position: relative; }
.chart-box-list.Card-Matric { min-height: 80px; height: 100%; }
.chart-box-list.pie-donut-chart {  }

/* Start Left Line */
.chart-box-list.first-chart-box:before { position: absolute; left: 10px; top: -1px; width: 10px; height: calc(100% + 2px); border: 1px solid var(--light-border-color); content: ''; border-radius: 6px 0 0 6px; z-index: 13; border-right-width: 0; background: #fff; opacity: 0; transition: opacity 0.3s; }
.chart-box-list.first-chart-box:after { position: absolute; left: 10px; top: -1px; width: 10px; height: calc(100% + 2px); content: ''; z-index: 12; background: var(--aqua-haze-bg-color); opacity: 0; transition: opacity 0.3s; }
.chart-box-list.first-chart-box:hover:before,
.chart-box-list.first-chart-box:active:before { border-color: var(--sky-color); }
.dashboard-column-drop-list:hover .chart-box-list.first-chart-box:before,
.dashboard-column-drop-list:hover .chart-box-list.first-chart-box:after { opacity: 1; }
/* End Left Line */

.chart-box-list.no-data-chart-box { /* min-height: 80px; */ }
.chart-box-list:hover,
.chart-box-list:active,
.chart-box-list.active { border-color: var(--sky-color); box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12); }
.chart-box-list .chart-caption { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-radius: 6px; z-index: 1; background: rgba(255, 255, 255, 0.9); }
.chart-box-list .chart-edit-button { position: absolute; left: 0; top: 0; bottom: 0; margin: auto 0; width: 100%; text-align: center; z-index: 3; display: flex; justify-content: center; align-items: center; }
.chart-box-list .apexcharts-canvas { margin: 0 auto; }
#chart .apexcharts-canvas { margin: 0 auto; }

.chart-box-list.data-chart-box .chart-caption,
.chart-box-list.data-chart-box .chart-edit-button { opacity: 0; transition: opacity 0.3s; z-index: -1; }

.chart-box-list.data-chart-box:hover .chart-caption,
.chart-box-list.data-chart-box:active .chart-caption { z-index: 9; opacity: 1; }
.chart-box-list.data-chart-box:hover .chart-edit-button,
.chart-box-list.data-chart-box:active .chart-edit-button { z-index: 10; opacity: 1; }

.dashbord-nodata { width: 100%; text-align: center; font-size: 14px; line-height: 20px; color: var(--light-color); padding: 15px; height: calc(100vh - 120px); display: flex; align-items: center; justify-content: center; flex-direction: column; }
.dashbord-nodata .title { font-size: 18px; line-height: 24px; padding: 0 0 10px 0; margin: 0; color: var(--black-color); font-family: 'DM Sans', sans-serif; font-weight: 500; }
.dashbord-nodata p { padding: 0 0 15px 0; margin: 0; }

.dashboard-column-box { position: relative; display: flex; flex-direction: column; overflow: hidden; flex: 2 1; }
.dashboard-column-box-inn { width: 100%; height: 100%; overflow: auto; padding: 8px 15px; }
.checkbox-custom.checkbox-layout-box { width: 100%; margin: 7px 0 8px 0 !important; }
.checkbox-layout-box label.label-text { width: 100%; }
.checkbox-layout-box.checkbox-custom > input:first-child + label:before { top: 10px; }
.checkbox-layout-box.checkbox-custom > input:first-child:checked + label:after { top: 7px; }  
.checkbox-layout-box .row { margin-left: -3px; margin-right: -3px; }
.checkbox-layout-box .row>* { padding-left: 3px; padding-right: 3px; }

.checkbox-layout-box .layout-border { width: 100%; border: 1px solid var(--light-border-color); border-radius: 6px; padding: 5px; }
.checkbox-layout-box.active .layout-border { border-color: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.checkbox-layout-box .layout-border--inn { width: 100%; background: var(--aqua-haze-bg-color); border: 2px solid var(--light-border-color); border-radius: 4px; height: 28px; font-size: 0; display: flex; align-items: center; justify-content: center; }
.checkbox-layout-box .layout-border-inn { background: var(--aqua-haze-bg-color); height: 28px; display: flex; align-items: center; justify-content: center; color: var(--aqua-haze-bg-color); border-radius: 4px; border: 2px solid var(--light-border-color); }

.dashboard-drop-here { width: 100%; height: 3px; background: var(--black-color); border-radius: 1.5px; position: relative; text-align: center; z-index: 15; }
.dashboard-drop-here .drop-here-tit { background: var(--black-color); border-radius: 4px; font-size: 12px; color: #fff; line-height: 20px; font-weight: 500; padding: 0 10px; display: inline-block; position: relative; top: -9px; }

/* End Dashboard Config */

/* Start Dashboard View */
/* .dashboard-view .dashboard-tab-main .tab-list { width: calc(100% - 50px); }
.dashboard-view .dashboard-tab-main .tab-list.right-button { width: 50px; } */

.dashboard-view .dashboard-column-drop .dashboard-column-drop-list:hover:before,
.dashboard-view .dashboard-column-drop .dashboard-column-drop-list:active:before { opacity: 0; }

.dashboard-view .chart-box-list { display: block; }
.dashboard-view .chart-main { height: 100%; text-align: center; align-items: center; display: grid; padding: 15px; }

.chart-main .apexcharts-legend-series { text-align: left; }
.chart-main .apexcharts-title-text { font-family: 'DM Sans', sans-serif !important; font-weight: 500; color: var(--black-color); font-size: 16px; position: relative; opacity: 0 !important; }
.chart-main .apexcharts-title-text:before { position: absolute; content: "|"; background-color: var(--sky-color); border-radius: 1.5px; width: 3px; height: 20px; left: 0; top: 0; }
.chart-main .apexcharts-datalabels .apexcharts-text { font-family: 'DM Sans', sans-serif !important; font-weight: 700; /* filter: inherit; */ }

/* Start Pie Chart */
.chart-main .apexcharts-slices .apexcharts-series.apexcharts-pie-series path { /* stroke-width: 0px; stroke-color: transparent !important; */ filter: opacity(100%) !important; }
.chart-main .apexcharts-legend.apx-legend-position-right { justify-content: center; }

/* Legend */
.chart-main .apexcharts-legend-series .apexcharts-legend-marker { width: 8px !important; height: 8px !important; border-radius: 8px !important; margin-right: 5px; }
.chart-main .apexcharts-legend-series .apexcharts-legend-text { font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; color: var(--light-color) !important; font-size: 14px !important; }
.chart-main .apexcharts-legend-series .apexcharts-legend-text span { font-weight: 500 !important; font-size: 14px !important; color: var(--black-color) !important; }
.chart-main .apexcharts-legend-series .apexcharts-legend-text span:before { content: ': '; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; color: var(--black-color) !important; font-size: 14px !important; top: -1px; position: relative; }
/* Tooltip */
.pie-donut-chart .chart-main .apexcharts-tooltip { overflow: inherit; background: none !important; z-index: 10; }
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group { background: #fff !important; padding: 0 8px 0 5px !important; border-radius: 10px; box-shadow: 0px 1px 4px 0px rgba(41, 42, 51, 0.4) !important; }
/*.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group:after { content: ' '; display: block; position: absolute; width: 0; height: 0; border-width: 6px; border-style: solid; pointer-events: none; }
/** Common styles: Horizontally Centered, Up/Down arrows **/
/*.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group:after,
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group:after { left: 50%; margin-left: -6px; }
/** Common styles: Down arrow **/
/*.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group:after { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-45deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; top: auto; bottom: -4px; margin-left: -4px; }*/

.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-marker { display: inline-block !important; width: 8px; height: 8px; border-radius: 8px; margin-right: 3px; }
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-text { padding: 0 !important; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; color: var(--light-color) !important; font-size: 14px !important; }
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-text .apexcharts-tooltip-y-group { padding: 0px 0 !important; }
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-text .apexcharts-tooltip-y-group .apexcharts-tooltip-text-y-label {  }
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-text .apexcharts-tooltip-y-group .apexcharts-tooltip-text-y-value { color: var(--black-color) !important; font-weight: 500 !important; font-size: 14px !important; margin-left: 0; }
.pie-donut-chart .chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-text .apexcharts-tooltip-y-group .apexcharts-tooltip-text-y-value:before { content: ': '; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; color: var(--black-color) !important; font-size: 14px !important; top: -1px; position: relative; }
/* End Pie Chart */

.chart-main .apexcharts-yaxis-texts-g text,
.chart-main .apexcharts-xaxis-texts-g text,
.chart-main .apexcharts-data-labels text { font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; }

/* Toolbar Other Chart */
.chart-main .apexcharts-toolbar { max-width: 192px; padding: 0; right: 0 !important; z-index: 9; }
.chart-main .apexcharts-toolbar .apexcharts-zoomin-icon,
.chart-main .apexcharts-toolbar .apexcharts-zoomout-icon,
.chart-main .apexcharts-toolbar .apexcharts-zoom-icon,
.chart-main .apexcharts-toolbar .apexcharts-pan-icon,
.chart-main .apexcharts-toolbar .apexcharts-reset-icon,
.chart-main .apexcharts-toolbar .apexcharts-menu-icon { margin: 0 2px; width: 28px; height: 28px; border-radius: 6px; background: url(../images/plus-circle.svg) 50% 50% no-repeat; background-size: 20px 20px; transform:inherit; }
.chart-main .apexcharts-toolbar .apexcharts-zoomout-icon { background-image: url(../images/minus-circle.svg); }
.chart-main .apexcharts-toolbar .apexcharts-zoom-icon { background-image: url(../images/zoom-in.svg); }
.chart-main .apexcharts-toolbar .apexcharts-pan-icon { background-image: url(../images/hand.svg); }
.chart-main .apexcharts-toolbar .apexcharts-reset-icon { background-image: url(../images/refresh-cw.svg); }
.chart-main .apexcharts-toolbar .apexcharts-menu-icon { background-image: url(../images/more-vertical.svg); margin-right: 0; }
.chart-main .apexcharts-toolbar .apexcharts-zoomin-icon svg,
.chart-main .apexcharts-toolbar .apexcharts-zoomout-icon svg,
.chart-main .apexcharts-toolbar .apexcharts-zoom-icon svg,
.chart-main .apexcharts-toolbar .apexcharts-pan-icon svg,
.chart-main .apexcharts-toolbar .apexcharts-reset-icon svg,
.chart-main .apexcharts-toolbar .apexcharts-menu-icon svg { opacity: 0; width: 28px; height: 28px; }
.chart-main .apexcharts-toolbar .apexcharts-zoomin-icon:hover,
.chart-main .apexcharts-toolbar .apexcharts-zoomin-icon:active,
.chart-main .apexcharts-toolbar .apexcharts-zoomin-icon.apexcharts-selected { background-color: var(--light-bg-hvr-color); background-image: url(../images/plus-circle-h.svg); }
.chart-main .apexcharts-toolbar .apexcharts-zoomout-icon:hover,
.chart-main .apexcharts-toolbar .apexcharts-zoomout-icon:active,
.chart-main .apexcharts-toolbar .apexcharts-zoomout-icon.apexcharts-selected { background-color: var(--light-bg-hvr-color); background-image: url(../images/minus-circle-h.svg); }
.chart-main .apexcharts-toolbar .apexcharts-zoom-icon:hover,
.chart-main .apexcharts-toolbar .apexcharts-zoom-icon:active,
.chart-main .apexcharts-toolbar .apexcharts-zoom-icon.apexcharts-selected { background-color: var(--light-bg-hvr-color); background-image: url(../images/zoom-in-h.svg); }
.chart-main .apexcharts-toolbar .apexcharts-pan-icon:hover,
.chart-main .apexcharts-toolbar .apexcharts-pan-icon:active,
.chart-main .apexcharts-toolbar .apexcharts-pan-icon.apexcharts-selected { background-color: var(--light-bg-hvr-color); background-image: url(../images/hand-h.svg); }
.chart-main .apexcharts-toolbar .apexcharts-reset-icon:hover,
.chart-main .apexcharts-toolbar .apexcharts-reset-icon:active,
.chart-main .apexcharts-toolbar .apexcharts-reset-icon.apexcharts-selected { background-color: var(--light-bg-hvr-color); background-image: url(../images/refresh-cw-h.svg); }
.chart-main .apexcharts-toolbar .apexcharts-menu-icon:hover,
.chart-main .apexcharts-toolbar .apexcharts-menu-icon:active,
.chart-main .apexcharts-toolbar .apexcharts-menu-icon.apexcharts-selected { background-color: var(--light-bg-hvr-color); background-image: url(../images/more-vertical-h.svg); }

.chart-main .apexcharts-toolbar .apexcharts-menu { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border:1px solid var(--light-border-color); border-radius: 6px; padding: 8px 2px; margin: 0; right: 0; }
.chart-main .apexcharts-toolbar .apexcharts-menu .apexcharts-menu-item { font-size: 14px; font-weight: 500; font-family: 'DM Sans', sans-serif; color: var(--black-color); line-height: 18px; border-radius: 4px; padding: 6px 14px; cursor: pointer; margin: 0; white-space: nowrap; }
.chart-main .apexcharts-toolbar .apexcharts-menu .apexcharts-menu-item:hover { background: var(--blue-color); color: #fff; }

/* Tooltip Other Chart */
.chart-main .apexcharts-tooltip.apexcharts-theme-light { border: 1px solid var(--light-border-color); background: #fff; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); border-radius: 4px; padding: 0 0 2px 0; }
.chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-marker { width: 8px; height: 8px; border-radius: 8px; }
.chart-main .apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title { font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; font-size: 14px !important; text-align: left; background: #fff; border-bottom: 1px solid var(--light-border-color); padding: 0 8px; margin: 0 0 2px 0; }
.chart-main .apexcharts-tooltip-text-y-label { font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; font-size: 14px; color: var(--light-color) !important; }
.chart-main .apexcharts-tooltip-text-goals-value,
.chart-main .apexcharts-tooltip-text-y-value, .apexcharts-tooltip-text-z-value { font-size: 14px; font-weight: 500 !important; color: var(--black-color); font-family: 'DM Sans', sans-serif !important; margin-left: 0; }
.chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group { padding: 0 8px; }
.chart-main .apexcharts-tooltip .apexcharts-tooltip-series-group .apexcharts-tooltip-y-group { padding: 0; }

.chart-main .apexcharts-xaxistooltip,
.chart-main .apexcharts-yaxistooltip { border-radius: 10px; border: 1px solid var(--light-border-color); background: #fff; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); padding: 0 8px; }

.chart-main .apexcharts-xaxistooltip-bottom:before { border-bottom-color: var(--light-border-color); }
.chart-main .apexcharts-xaxistooltip-bottom:after { border-bottom-color: #fff; }
.chart-main .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text,
.chart-main .apexcharts-yaxistooltip .apexcharts-xaxistooltip-text { font-size: 14px !important; font-weight: 500 !important; color: var(--black-color) !important; font-family: 'DM Sans', sans-serif !important; line-height: 18px; }

/* End Dashboard View */

/* Logo Preview */
.logo-preview { width: 100%; display: table; }
.logo-preview .logo-image { display: table-cell; vertical-align: middle; position: relative; width: 128px; height: 128px; border-radius: 6px; border: 1px solid var(--light-border-color); text-align: center; overflow: hidden; }
.logo-preview .logo-image .img-preview { width: 126px !important; height: 126px !important; overflow: hidden; display: table-cell; vertical-align: middle; }
.logo-preview .logo-image.widht108 { width: 108px; height: 108px; }
.logo-preview .logo-image.widht108 .img-preview { width: 106px !important; height: 106px !important; }
.logo-preview .logo-image.square { border-radius: 0 !important; }
.logo-preview .logo-image.rounded { border-radius: 50% !important; overflow: hidden; }
.logo-preview .logo-image.rounded .safe-space { border-radius: 50%; }
.logo-preview .blank-space { display: table-cell; width: 15px; }
.logo-preview .logo-image img { max-width: 100%; }
.logo-preview.big-logo .logo-image { width: 226px; height: 97px; }
.logo-preview.big-logo .logo-image .img-preview { width: 224px !important; height: 95px !important; }
.logo-preview.passport-photo-preview .logo-image { width: 145px; height: 145px; }
.logo-preview.passport-photo-preview .logo-image .img-preview,
.logo-preview.passport-photo-preview .logo-image .img-preview img { width: 145px !important; height: 145px !important; }
.logo-preview.passport-photo-preview .profile-name2 { width: 145px; height: 145px; line-height: 145px; font-size: 62px; text-transform: uppercase; border-radius: 6px; background: var(--sky2-color); color: var(--sky-color); text-align: center; font-weight: 700; position: relative; display: table-cell; vertical-align: middle; }
.logo-preview.passport-photo-preview .profile-name2:before { width: 100%; height: 100%; content: ''; position: absolute; left: 0; top: 0; border: 1px solid rgba(0, 0, 0, 0.10); border-radius: 6px; }
.logo-preview .logo-image .round-box,
.logo-preview .logo-image .square-box { border: 1px solid rgba(0, 0, 0, 0.1); position: absolute; width: calc(100% - 20px); height: calc(100% - 20px); left: 10px; top: 10px; z-index: 1; }
.logo-preview .logo-image .round-box { border-radius: 50%; }
.logo-preview .logo-image .safe-space { position: absolute; width: calc(100% - 20px); height: calc(100% - 20px); left: 10px; top: 10px; z-index: 1; background: url(../images/safe-space-patten.png) left top repeat; }
.logo-preview .logo-image .safe-space.hide { opacity: 0; }

.logo-preview .logo-preview-btn { display: table-cell; vertical-align: middle; position: relative; padding-left: 15px; }
.logo-preview .logo-preview-btn .logo-info-top { position: absolute; left: 15px; top: 0; }
body .logo-preview label.btn { font-weight: 500 !important; }
.NewCroppingTool {max-height: 360px;}

.box-form { width: 100%; background: var(--aqua-haze-bg-color); border-radius: 16px; }
.box-form-header { width: 100%; display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; background: var(--athens-gray); border-radius: 16px 16px 0 0; padding: 20px 15px; }
.box-form-body { border-radius: 6px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); background: #fff; border: 1px solid var(--light-border-color); }

.page-list { padding: 0; margin: 0; display: flex; }
.page-list li { display: inline-flex; border: 1px solid var(--light-border-color); width: 12px; height: 12px; padding: 0; margin: 0 6px 0 0; border-radius: 50%; }
.page-list li:hover { border-color: var(--sky-color); }
.page-list li.done-page { border-color: var(--blue-color); background: var(--blue-color); }
.page-list li.active-page { border-color: var(--sky-color); background: var(--sky-color); }

.breadcrumb { font-family: 'DM Sans', sans-serif; font-weight: 500; font-size:14px; margin: 0; padding: 0 0 0 20px; background: none; display: flex; flex-wrap: wrap; }
.breadcrumb li.page-name { font-size: 16px; color:var(--blue-color); text-transform: uppercase; padding: 0 30px 0 17px; position: relative; }
.breadcrumb > li + li:before { opacity: 0; padding: 0; content: ''; }
.breadcrumb li.page-name:before { position: absolute; content: ''; width: 3px; height: 24px; left: 0; top: 0; bottom: 0; margin: auto 0; background: var(--sky-color); border-radius: 1.5px; opacity: 1; }
.breadcrumb li.breadcrumb-item { color:var(--light-black-color); padding: 0; margin: 0; position: relative; text-transform: capitalize; }
.breadcrumb li.breadcrumb-item + .breadcrumb-item { padding-left: 16px; }
.breadcrumb-item + .breadcrumb-item:before { color:var(--light-black-color); content: ''; position: absolute; left: 0; top: 2px; background: url(../images/breadcrumb-chevron-right.svg) center center no-repeat; background-size: 16px; width: 16px; height: 16px; opacity: 1; }
.breadcrumb li a { color:var(--light-black-color); }
.breadcrumb li a:hover,
.breadcrumb li a.active,
.breadcrumb li.active { color:var(--black-color); }

/* Card */
.card { margin-bottom:24px; background:#fff; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12); position: relative; display: flex; flex-direction: column; border-radius: 8px; }
.card.overflow-hidden { overflow: hidden; }
.card-body { padding:15px; }
.card-header { padding:0 15px; background:none; border-bottom:1px solid var(--athens2-gray2) !important; display: table; border-radius: 6px 6px 0 0; width: 100%; }
.card-header:first-child { border-radius: 6px 6px 0 0; }
.card-header.border-top { border-top: 1px solid var(--athens2-gray2); }
.card-title { font-size:16px; font-weight: 500 !important; margin:0; padding:11px 0; display: table-cell; float: none; vertical-align: middle; width: 100%; }
.card-header > .card-tools { display: table-cell; float: none; text-align: right; vertical-align: middle; margin: 0; white-space: nowrap; }
.card-footer { background: none; border-radius: 6px !important; border: none; padding: 0px 15px; margin-bottom: 24px; }

hr { background-color: var(--light-border-color); opacity: 1; margin: 0; height: 1px; border: none; }

/* Filter CSS */
.filter-main.collapsed-card .card-header { border-radius: 6px;  }
.filter-main .card-header { /* background:var(--blue-bg); */ position: relative; background: url(../images/bg-effect-header.png) 50% no-repeat; background-size: cover; }
.filter-main .card-header:after { background: url(../images/bg-effect.png) 50% no-repeat; background-size: cover; content: ''; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; background-size: cover; opacity: .03; border-radius: 6px; display: none; }
.filter-main .card-header .card-title { cursor: pointer; position: relative; z-index: 1; color: #fff; }
.filter-main .card-header > .card-tools { position: relative; z-index: 1; }
.filter-search-foot { width: 100%; }

/* New */
.filter-btn-main { padding-right: 15px; position: relative; }
body .filter-btn-main .btn.filter-btn { white-space: nowrap; padding-right: 51px; }
body .filter-btn-main .btn.filter-btn:after { display: none; }
.filter-btn-main .count { width: 30px; height: 22px; line-height: 22px; font-size: 12px; font-weight: 700; text-align: center; background: #fff; border-radius: 11px; color: var(--black-color); display: inline-block; position: absolute; right: 10px; top: 5px; }


.dash-filter-btn .count { width: 30px; height: 22px; line-height: 22px; font-size: 12px; font-weight: 700; text-align: center; background: #fff; border-radius: 11px; color: var(--black-color); display: inline-block; position: absolute; right: 10px; top: 5px; }

.dash-filter-btn.small { width: 60px; }
body .dash-filter-btn.btn.btn-icon.small .feather { left: 6px; width: 18px; height: 18px; }
.dash-filter-btn.small { height: 28px; }
.dash-filter-btn.small .count { width: 24px; height: 18px; line-height: 18px; right: 6px; top: 5px; }

/* Dropdown Filter */
.dropdown-menu.filter-drop-down { position: absolute; width: 100%; max-width: 700px; min-width: 700px; padding: 0; left: 0 !important; right: auto !important; margin:0 !important; top: 50px; }
.dropdown-menu.filter-drop-down.show { top: 50px !important; }
.dropdown-menu.filter-drop-down.show[x-placement="top-start"] { top: auto !important; bottom: 50px !important; }

/* Dropdown Right */
.dropdown-menu.dropdown-right { width: 100%; max-width: 400px; height: 100vh; overflow-y: auto; padding: 0; border-radius: 6px 0 0 6px; position: fixed !important; top: 0; left: auto !important; right: -700px !important; visibility: hidden; z-index: 1003; /* z-index: 1061; */ -webkit-transition: right .3s ease-in-out; -o-transition: right .3s ease-in-out; transition: right .3s ease-in-out; transform: inherit !important; transform-style:inherit !important; }
.dropdown-menu.dropdown-right.show { visibility: visible; top: 0 !important; right: 0 !important; transform: inherit !important; transform-style: inherit !important; }

/* Filter Normal */
.filter-panel { display: flex; flex-direction: column; overflow: hidden; flex: 1 1 auto; height: calc(100vh - 42px); }
.filter-list-panel { position: relative; display: flex; flex-direction: column; overflow: hidden; flex: 2 1; }
.filter-list-panel.flex1 { flex: 1 1; }
.filter-list-panel-inn { width: 100%; height: 100%; overflow: auto; }

.panel-filter-body { padding: 15px; width: 100%; }
.select-filter-name { color: var(--blue-color); font-size: 14px; font-weight: 500; cursor: pointer; display: inline-block; }
.select-filter-name:hover { color: var(--black-color); }

.panel-filter-select-footer { background: var(--athens-gray); padding: 5px 15px; }
.panel-filter-select-footer .tit-search { color: var(--black-color); font-size: 14px; font-weight: 500; }
.panel-filter-select-body { padding: 7px 15px 7px 15px; width: 100%; }

.filter-panel-save { padding: 0 15px 15px 15px; }
.my-filter-title { display: flex; align-items: center; font-size: 14px; font-weight: 500; color: var(--light-color); padding: 15px 15px 20px 15px; }
.my-filter-title .filter-title { flex: 1 1 auto; position: relative; padding-left: 33px; }
.my-filter-title .filter-title .feather { position: absolute; left: 0; }
.my-filter-title .close-filter { cursor: pointer; }
.my-filter-title .close-filter:hover { color: var(--black-color); }
.my-filter-form { padding: 0 15px 15px 15px; width: 100%; }

.filtered2 { display: inline-flex; font-size: 13px; line-height: 18px; font-weight: 500; /* margin: 0 4px 4px 0; */ }
.filtered2 .name-text { margin: 0 8px 6px 0; color: var(--light-color); border: 1px solid var(--light-border-color); border-radius: 6px; padding: 2px 30px 0px 9px; position: relative; cursor: pointer; text-overflow: ellipsis; max-width: 230px; overflow: hidden; }
.filtered2 .name-text .close-filter { color: var(--light-color); cursor: pointer; position: absolute; right: 5px; top: 0px; }
.filtered2 .name-text .close-filter:hover { color: var(--blue-color); }
.filtered2 .name-text:hover,
.filtered2 .name-text.active { border-color: var(--blue-border-color-op); background: var(--blue-bg-color-op); color: var(--blue-color); }
.filtered2 .name-text.active .close-filter { color: var(--blue-color); }

.form-group.filter-save .input-group .right-icon { position: absolute; right: 1px; top: 1px; z-index: 5; }
body .form-group.filter-save .input-group .right-icon .btn { background: none !important; }

.form-group.filter-save .form-control { padding-right: 35px; }

/* Pivot Filter */
.column-panel { display: flex; flex-direction: column; overflow: hidden; flex: 1 1 auto; height: calc(100vh - 82px); position: relative; }
.pivot-mode-panel { padding: 10px 15px 10px 15px; display: flex; }
.pivot-column-select { position: relative; display: flex; flex-direction: column; overflow: hidden; flex: 2 1 0px; }

.column-select-header-filter-wrapper { width: 100%; padding: 10px 15px; }
.column-select-header-filter-wrapper .form-group { position: relative; padding-left: 35px; }
.column-select-header-filter-wrapper .checkbox-custom { position: absolute; left: 0; }

.virtual-list-viewport { width: 100%; height: 100%; overflow: auto; padding: 7px 15px; }
.virtual-list-viewport .checkbox-custom { margin-top: 8px !important; margin-bottom: 8px !important; }

/* Sub Accordian Check */
.select-virtual-list-item-main { position: relative; padding-left: 22px; width: 100%; }
.select-virtual-list-item-main .draggable-handle.draging { /* padding-top: 8px; */ padding-bottom: 8px; height: 100%; }
.select-virtual-list-item-main .left-down-chevron { position: absolute; left: -5px; top: 0; width: 20px; height: 20px; display: inline-block; cursor: pointer; color: var(--light-color); }
.select-virtual-list-item-sub { padding: 0 0 0 20px; width: 100%; }

.draggable-handle { user-select: none; }
.draggable-handle.draging { border: 1px dashed var(--light-border-color); border-radius: 6px; padding: 0 10px; background: #fff; min-height: 38px; }

.row-groups { display: flex; flex-direction: column; overflow: hidden; align-items: stretch; flex: 1 1 0px; }
.column-drop-title-bar { font-size: 14px; font-weight: 500; color: var(--light-color); padding: 12px 15px 0 15px; position: relative; }
.column-drop-title-bar.icon { padding-left: 47px; }
.column-drop-title-bar.icon .feather { position: absolute; left: 13px; top: 10px; }

.column-drop-vertical-list { position: relative; align-items: stretch; flex-grow: 1; flex-direction: column; overflow-x: auto; padding: 10px 15px 10px 15px; }
.column-drop-cell { flex: none; display: flex; align-items: center; margin-top: 2px; background: var(--aqua-haze-bg-color); border-radius: 6px; padding: 2px 2px; user-select: none; cursor: default !important; }
.column-drop-cell:hover { background: var(--light-bg-color); }
.column-drop-cell .drag-handle { cursor: grab; width: 24px; height: 24px; background: url(../images/move-dot.svg) center center no-repeat; margin-left: 8px; }
.column-drop-cell .column-drop-cell-text { overflow: hidden; flex: 1 1 auto; text-overflow: ellipsis; white-space: nowrap; margin: 0 10px; color: var(--black-color); font-size: 14px; font-weight: 500; }
/*.column-drop-cell .column-drop-cell-button { padding: ; }*/
.column-drop-empty-message { display: flex; align-items: center; margin: 10px 15px; padding: 10px 15px; border: 1px dashed var(--light-border-color); position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; font-size: 15px; font-weight: 500; color: var(--light-color-op6); min-height: 32px; border-radius: 6px; user-select: none; }

/* Attachment List */
.column-attachment-cell { flex: none; display: flex; align-items: center; margin-bottom: 5px; border: 1px solid var(--light-border-color); border-radius: 6px; padding: 3px 0 3px 10px; user-select: none; cursor: default !important; font-size: 14px; font-weight: 500; line-height: 20px; color: var(--black-color); }
.column-attachment-cell .column-attachment-cell-number { width: 15px; }
.column-attachment-cell .column-attachment-cell-text { flex: 1 1 auto; margin: 0 10px; position: relative; text-overflow: ellipsis; white-space: nowrap; width: calc(100% - 93px); }
.column-attachment-cell .column-attachment-cell-text.mgl-0 { margin-left: 0; }
.column-attachment-cell .column-attachment-cell-text span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.column-attachment-cell .column-attachment-cell-text .progress { position: absolute; bottom: -8px; left: 0; }
.column-attachment-cell .column-attachment-cell-button { display: flex; flex-direction: row; flex-wrap: nowrap; }
.column-attachment-cell.column-attachment-progress-bar .column-attachment-cell-text { margin-left: 0; width: 100%; }

/* Progress Bar */
.progress { width: 100%; border-radius: 2px !important; background: none; height: 4px !important; }
.progress-bar { border-radius: 2px; }
.progress-bar.bg-success { background-color: var(--green-color) !important; }
.progress-bar.bg-info { background-color: var(--cyan-color) !important; }
.progress-bar.bg-warning { background-color: var(--yellow-color) !important; }
.progress-bar.bg-danger { background-color: var(--danger-color) !important; }
.progress-bar.bg-primary { background-color: var(--sky-color) !important; }
.progress-bar.bg-secondary { background-color: var(--light-color) !important; }
.progress-bar.bg-light { background-color: var(--black-color) !important; }
.progress-bar.bg-muted { background-color: var(--light-border-color) !important; }

/*  */
.right-pivot-filter { padding-bottom: 15px; }
.left-pivot-filter,
.right-pivot-filter { display: flex; flex-direction: column; align-items: stretch; flex: 1 1 0px; overflow: auto; }

.pivot-filtered-dropdown .left-pivot-filter,
.pivot-filtered-dropdown .right-pivot-filter { padding-bottom: 15px; }

.pivot-filtered-dropdown .right-pivot-filter { border-left: 1px solid var(--light-border-color); }

.pivot-filtered-dropdown .column-panel { flex-direction: row; }
.dropdown-menu.dropdown-right.pivot-filtered-dropdown { max-width: 800px; }
.pivot-filtered-dropdown .left-pivot-filter,
.pivot-filtered-dropdown .right-pivot-filter { width: 50%; flex-direction: column; flex-wrap: nowrap; }

.pivot-filtered-dropdown .pivot-mode-panel,
.pivot-filtered-dropdown .pivot-column-select { flex-direction: column; }

.filter-body {  width: 100%; padding: 10px 15px 0 15px; }
.filter-footer { width: 100%; padding: 5px 15px 0px 15px; }

.filtered { padding: 0px 10px 0px 10px; width: 100%; }
.filtered .filter { display: inline-flex; font-size: 14px; line-height: 18px; font-weight: 500; margin: 0 4px 0px 0; flex-wrap: wrap; }
.filtered .filter span { display: inline-flex; vertical-align: middle; }
.filtered .filter .label-text { color: var(--light-color); padding: 2px 8px 2px 0; margin-bottom: 6px; }
.filtered .filter .name-text { margin: 0 6px 6px 0; color: var(--light-color); border: 1px solid var(--light-border-color); border-radius: 6px; padding: 1px 30px 1px 10px; position: relative; }
.filtered .filter .close-filter { color: var(--light-color); cursor: pointer; position: absolute; right: 5px; top: 0px; }
.filtered .filter .close-filter:hover { color: var(--blue-color); }

.filtered .filter.clear-all .name-text { background: var(--aqua-haze-bg-color); border-color: var(--light-border-color); color: var(--black-color); padding-right: 10px; cursor: pointer; }
.filtered .filter.clear-all:hover .name-text { color: var(--black-color); background: var(--light-bg-hvr-color); border-color: var(--light-bg-hvr-color); }

.filtered .filter.clearAllFilter .name-text { background: var(--aqua-haze-bg-color); border-color: var(--light-border-color); color: var(--black-color); padding-right: 10px; cursor: pointer; }
.filtered .filter.clearAllFilter:hover .name-text { color: var(--black-color); background: var(--light-bg-hvr-color); border-color: var(--light-bg-hvr-color); }

.copy-to-clipboard .list-btn { display: inline-block; background: var(--blue-bg-color-op); border: 1px solid var(--blue-border-color-op); color: var(--black-color); padding: 1px 10px; cursor: pointer; margin: 0 6px 6px 0; color: var(--blue-color); border-radius: 6px; font-weight: 500; }
.copy-to-clipboard .list-btn .cuw { letter-spacing: -1px; }
.copy-to-clipboard .list-btn .cuw.cuw-r { margin-left: -1px; letter-spacing: 0; }
.copy-to-clipboard .list-btn span { color: #929edb; }
.copy-to-clipboard .list-btn:hover span,
.copy-to-clipboard .list-btn:active span { color: var(--blue-color); }

.copy-clip-icon { position: relative; padding-left: 22px; margin: 3px 0; width: 100%; }
.copy-clip-icon .feather { position: absolute; left: 0; top: 0px; }
.copy-clip-icon .feather svg { width: 18px; height: 18px; }

.management-main > .row { margin: 0; }
.management-main .management-left { padding-left: 0; padding-right: 0; }
.management-main .management-right { border-left: 1px solid var(--athens2-gray2); padding-left: 0; padding-right: 0; }

.row { margin-left: -8px; margin-right: -8px; display: flex; flex-wrap: wrap; }
.row>* { padding-left: 8px; padding-right: 8px; }

.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 { float: none; flex: 0 0 auto; }

/* Start Modal */
.modal.show { display: block; }
.modal-backdrop { background: #fff; opacity: 0; }
.modal-backdrop.remove-bg { background: none; }
.modal-backdrop.show { opacity: 0; }
.modal { padding-left: 300px !important; width: 100%; /* z-index: 9999; */ }
.modal-open .modal { overflow-x: hidden; overflow-y: hidden; }
.modal.modal-body-center-v { padding-left: 0 !important; }
.modal-dialog .modal-content { border-radius: 6px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border: 1px solid var(--light-border-color); display: flex; flex-direction: column; position: relative; width: 100%; }
.modal-dialog .modal-content .modal-header { padding: 5px 5px; background: var(--light-bg-color); border-radius: 6px 6px 0 0; border-bottom-color: transparent; border-bottom: none; align-items: center; display: flex; flex-shrink: 0; justify-content: space-between; }
.modal-title { font-size: 16px; color: var(--black-color); text-align: center; width: 100%; padding: 2px 10px; font-weight: 500; }
.modal-body { padding: 15px; }
.model-content-hide .modal-dialog .modal-content { box-shadow: none; border: none; }
.modal-custom-overlay { width: 100%;height: 100%;position: absolute; z-index: 1050; display: none; left: 0; top: 0; }
body.modal-open .modal-custom-overlay { display: block; }

.modal-dialog-centered { align-items: center; display: flex; min-height: calc(100% - 60px);  }

/* .modal.moving.show { animation: shake 0.5s; animation-iteration-count: infinite; } */
.modal.moving { animation: shake 0.5s; animation-iteration-count: infinite; }
@keyframes shake {
    10%, 90% {
      transform: translate3d(-1px, 0, 0);
    }
    
    20%, 80% {
      transform: translate3d(2px, 0, 0);
    }
  
    30%, 50%, 70% {
      transform: translate3d(-4px, 0, 0);
    }
  
    40%, 60% {
      transform: translate3d(4px, 0, 0);
    }
}
.modal .modal-dialog { width: 100%; }
.modal .modal-content { width: 100%; }
.modal.add-page-modal .modal-content {  }
.modal-w-1350 .modal-dialog { max-width: 1350px; }
.modal-w-1300 .modal-dialog { max-width: 1300px; }
.modal-w-1250 .modal-dialog { max-width: 1250px; }
.modal-w-1200 .modal-dialog { max-width: 1200px; }
.modal-w-1150 .modal-dialog { max-width: 1150px; }
.modal-w-1100 .modal-dialog { max-width: 1100px; }
.modal-w-1050 .modal-dialog { max-width: 1050px; }
.modal-w-1000 .modal-dialog { max-width: 1000px; }
.modal-w-950 .modal-dialog { max-width: 950px; }
.modal-w-900 .modal-dialog { max-width: 900px; }
.modal-w-850 .modal-dialog { max-width: 850px; }
.modal-w-800 .modal-dialog { max-width: 800px; }
.modal-w-750 .modal-dialog { max-width: 750px; }
.modal-w-700 .modal-dialog { max-width: 700px; }
.modal-w-650 .modal-dialog { max-width: 650px; }
.modal-w-600 .modal-dialog { max-width: 600px; }
.modal-w-550 .modal-dialog { max-width: 550px; }
.modal-w-500 .modal-dialog { max-width: 500px; }
.modal-w-450 .modal-dialog { max-width: 450px; }
.modal-w-400 .modal-dialog { max-width: 400px; }

body .custom-modal { width: 100%; max-width: 400px; background: #fff; border-radius: 6px 0 0 6px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border:1px solid var(--light-border-color); height: 100vh; overflow-y: auto; padding: 0; position: fixed !important; top: 0; left: auto !important; right: -500px !important; visibility: hidden; z-index: 1003; -webkit-transition: right .3s ease-in-out; -o-transition: right .3s ease-in-out; transition: right .3s ease-in-out; transform: none !important; }
body .custom-modal.show { visibility: visible; right: 0 !important; }
.custom-modal-header { width: 100%; display: table; padding: 10px 15px 0 15px; }
.custom-modal-header .list { display: table-cell; vertical-align: middle; }
.custom-modal-header .modal-title { font-size: 16px; line-height: 20px; color: var(--black-color); font-weight: 500; padding: 0 0 5px 0; margin: 0; }
.custom-modal-header .modal-tools { text-align: right; }
.custom-modal-body { padding: 15px; }
.custom-modal-footer { padding: 15px; display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; }

.confirm-dialog-modal .modal-dialog .modal-content .modal-header { background: #fff; position: relative; margin-top: 6px; z-index: 1; }
.confirm-dialog-modal .modal-dialog .modal-content:before { width: 100%; content: ''; height: 10px; border-radius: 6px 6px 0 0; position: absolute; left: 0; top: 0px; background: var(--light-bg-color); }

.modal-page-scroll { width: 100%; max-height: calc(100vh - 178px); min-height: calc(100vh - 178px); overflow: auto; }
.modal-page-scroll-auto-height { width: 100%; max-height: calc(100vh - 178px); overflow: auto; }
.modal-page-scroll.page-scroll-md { width: 100%; max-height: calc(100vh - 80px); min-height: calc(100vh - 80px); overflow: auto; }
.modal-page-scroll.page-scroll-lg { width: 100%; max-height: calc(100vh - 140px); min-height: calc(100vh - 140px); overflow: auto; }
/* .modal-page-scroll.page-scroll-lg > .mCustomScrollBox { max-height: calc(100vh - 140px) !important; min-height: calc(100vh - 140px) !important; } */
/* .modal-page-scroll.page-scroll-lg > .mCustomScrollBox > .mCSB_container { max-height: calc(100vh - 140px) !important; min-height: calc(100vh - 140px) !important; } */
.modal.add-page-modal { padding-left: 300px !important; }
.add-page-modal.modal > .modal-dialog { margin: 63px auto 15px auto; max-width: calc(100% - 30px); width: 100%; }

.add-page-scroll { width: 100%; max-height: calc(100vh - 138px); min-height: calc(100vh - 138px); overflow: auto; }

.billing-shipping-main {  }
.billing-shipping-main .billing-shipping-inn { height: 100%; }

.billing-shipping-address { width: 100%; position: relative; padding: 0 10px 0 0; margin: 0; }
.billing-shipping-address.border-bottom:before { position: absolute; right: 0; bottom: -1px; height: 1px; width: 10px; background: #fff; content: ''; }
.billing-shipping-address.border-bottom { border-bottom: 1px dashed var(--light-border-color) !important; }
.billing-shipping-address.border-right { border-right: 1px dashed var(--light-border-color) !important; }
.billing-shipping-address li { font-size: 15px; line-height: 21px; font-weight: 500; padding: 0 20px 11px 0; color: var(--black-color); }
.tags-main { width: 100%; }
.tags-main .tag { display: inline-flex; border-radius: 10px; padding: 1px 8px; margin: 0 6px 6px 0; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--black-color); background: var(--athens2-gray2); }
.tags-main .tag.tag-green { background: var(--green-color); color: #fff; }

.special-tag { display: inline-flex; border-radius: 10px; padding: 1px 8px; margin-left: 8px; font-size: 13px; line-height: 16px; font-weight: 500; color: #fff; background: var(--green-color); }
.special-tag.pink-fill { background: var(--pink-color); }

.billing-shipping-address li.icon { padding-left: 25px; min-height: 32px; }
.billing-shipping-address li.icon .feather { color: var(--light-color); position: absolute; left: 0; }

.billing-address-list .list-add { padding: 10px 0; border-bottom: 1px solid var(--light-border-color); }
.billing-address-list .list-add:last-child { border-bottom: none; }
.billing-address-list .list-add-check { width: 35px; }
.billing-address-list .list-add-btn { padding-left: 15px; text-align: right; }

.invoice-total-mian { max-width: 500px; float: right; width: 100%; padding: 20px 15px 0 0; }

.history-scroll { max-height: calc(100vh - 166px); overflow: auto; }
.history-main { width: 100%; position: relative; padding: 0 0 0 25px; }
.history-main:before { width: 1px; height: 100%; position: absolute; left: 24px; top: 0; content: ''; background: var(--light-border-color); }
.history-list { padding: 10px 0 0px 15px; width: 100%; position: relative; font-size: 14px; font-weight: 400; color: var(--light-color); }
.history-list:before { width: 13px; height: 13px; background: #fff; border: 1px solid var(--light-border-color); position: absolute; left: -7px; top: 14px; content: ''; border-radius: 50%; }
.history-list:after { width: 5px; height: 5px; content: ''; border-radius: 50%; background: var(--blue-color); position: absolute; left: -3px; top: 18px; }
.history-list ul.history { padding: 0; margin: 0; width: 100%; }
.history-list ul.history li { font-size: 14px; color: var(--black-color); font-weight: 500; padding: 5px 0 5px 9px; display: block; position: relative; }
.history-list ul.history li:before { content: '•'; position: absolute; left: 0; }
.history-list ul.history li.no-bull { padding-left: 0; }
.history-list ul.history li.no-bull:before { opacity: 0; }
.history-list ul.history li .button-history { display: inline-flex; position: relative; max-width: 28px; width: 100%; }
.history-list ul.history li .button-history .btn { position: absolute; top: -19px; }

.tag-tcs { background: var(--athens2-gray2); display: inline-flex; flex-shrink: 0; align-items: center; justify-content: space-between; border-radius: 6px; padding: 5px 10px; font-size: 15px; font-weight: 500; color: var(--black-color); white-space: nowrap; }
.total-amount { background: var(--peppermint-color); color: var(--green-color); font-size: 21px; font-weight: 500; border-radius: 6px; padding: 5px 8px; display: inline-flex; }

.max-h100-scroll { max-height: 100px; overflow: auto; }
.max-h200-scroll { max-height: 200px; overflow: auto; }
.max-h300-scroll { max-height: 300px; overflow: auto; }
.max-h400-scroll { max-height: 400px; overflow: auto; }
.max-h500-scroll { max-height: 500px; overflow: auto; }
.max-h190-scroll { max-height: 190px; overflow: auto; }
.scroll-auto { overflow-y: auto; }

.title-style1 { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; width: 100%; min-height: 42px; position: relative; border-bottom: 1px dashed var(--light-border-color); padding: 0px 0 0px 0px; font-size: 16px; font-weight: 500; color: var(--black-color); }
.title-style1 .style1 { font-size: 16px; font-weight: 500; color: var(--black-color); padding: 0 0 0 33px; }
.title-style1 .style1:before { width: 3px; height: 20px; border-radius: 1.5px; content: ''; left: 15px; position: absolute; top: 0; bottom: 0; margin: auto 0; background: var(--sky-color); }
.title-style1.green-style .style1:before { background: var(--green-color); }
.title-style1.pink2-style .style1:before { background: var(--pink2-color); }
.title-style1:after {  content: ''; width: 120px; height: 1px; position: absolute; left: 0; bottom: -1px; transform:none;
background: -moz-linear-gradient(left,  rgba(198,203,207,1) 0%, rgba(195,200,204,0) 100%);
background: -webkit-linear-gradient(left,  rgba(198,203,207,1) 0%,rgba(195,200,204,0) 100%);
background: linear-gradient(to right,  rgba(198,203,207,1) 0%,rgba(195,200,204,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c6cbcf', endColorstr='#00c3c8cc',GradientType=1 ); }

.title-style1.mstyle1 { border-top: 1px solid var(--light-border-color); border-bottom-width: 0; }
.title-style1.mstyle1:after { opacity: 0; }
.title-style1.mstyle1 .style1 { padding-left: 20px; }
.title-style1.mstyle1 .style1:before { left: 1px; }

.title-style2 { font-size: 16px; line-height: 20px; color: var(--black-color); font-weight: 500; position: relative; padding: 6px 0 6px 18px; background: none !important; display: flex; align-items: center; }
.title-style2 .icon-title { position: relative; top: 0px; }
.title-style2.width50percentage { width: 50%; }
.title-style2.width100percentage { width: 100%; }
.title-style2 .holiday-name { overflow: hidden; text-overflow: ellipsis; display: block; width: 100%; white-space: nowrap; position: absolute; left: 0; top: 6px; padding-left: 40px }
.title-style2:before { border-radius: 1.5px; width: 3px; height: 30px; content: ''; background: var(--blue-bg-color-2); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); position: absolute; left: 0; top: 0; }
.title-style2.pink:before { background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.title-style2.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.title-style2.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.title-style2.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.title-style2.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
.title-style2.orange:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.title-style2.red:before { background: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.title-style2.light:before { background: var(--light-color); box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
.title-style2.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.title-style2.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
.title-style2.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

.title-style3 { font-size: 13px; line-height: 13px; color: var(--black-color); font-weight: 500; position: relative; padding: 0px 0 0px 10px; background: none !important; display: inline-block; }
.title-style3:before { border-radius: 1px; width: 2px; height: 12px; content: ''; background: var(--blue-bg-color-2); /* box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); */ position: absolute; left: 0; top: 0; }
.title-style3.pink:before { background: var(--pink-color); /* box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); */ }
.title-style3.blue:before { background: var(--blue-color); /* box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); */ }
.title-style3.sky-blue:before { background: var(--sky-color); /* box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); */ }
.title-style3.green:before { background: var(--green-color); /* box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); */ }
.title-style3.orange:before { background: var(--orange-color); /* box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); */ }
.title-style3.red:before { background: var(--danger-color); /* box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); */ }
.title-style3.light:before { background: var(--light-color); /* box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); */ }
.title-style3.yellow:before { background: var(--yellow-color); /* box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); */ }
.title-style3.violet:before { background: var(--violet-bg); /* box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); */ }
.title-style3.cyan:before { background: var(--cyan-color); /* box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); */ }

.title-style4 { font-size: 14px; line-height: 18px; color: var(--black-color); font-weight: 500; position: relative; padding: 0px 0 0px 10px; background: none !important; display: inline-block; }
.title-style4 .info-label { margin-top: -4px; position: relative; }
.title-style4:before { border-radius: 1px; width: 2px; height: 18px; content: ''; background: var(--blue-bg-color-2); /* box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); */ position: absolute; left: 0; top: 0; }
.title-style4.pink:before { background: var(--pink-color); /* box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); */ }
.title-style4.blue:before { background: var(--blue-color); /* box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); */ }
.title-style4.sky-blue:before { background: var(--sky-color); /* box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); */ }
.title-style4.green:before { background: var(--green-color); /* box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); */ }
.title-style4.orange:before { background: var(--orange-color); /* box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); */ }
.title-style4.red:before { background: var(--danger-color); /* box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); */ }
.title-style4.light:before { background: var(--light-color); /* box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); */ }
.title-style4.yellow:before { background: var(--yellow-color); /* box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); */ }
.title-style4.violet:before { background: var(--violet-bg); /* box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); */ }
.title-style4.cyan:before { background: var(--cyan-color); /* box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); */ }

.title-style5 { font-size: 15px; line-height: 15px; color: var(--black-color); font-weight: 500; position: relative; }
.title-style5.width50percentage { width: 50%; }
.title-style5.width100percentage { width: 100%; }
.title-style5 .name { display: block; position: relative; padding-left: 18px; margin: 1px 0; width: 100%; background: none !important; }
.title-style5 .name:before { border-radius: 1.5px; width: 3px; height: 12px; content: ''; background: var(--blue-bg-color-2); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); position: absolute; left: 0; top: 0; }
.title-style5 .name .holiday-name { overflow: hidden; text-overflow: ellipsis; display: block; width: 100%; white-space: nowrap; position: absolute; left: 0; top: 0; padding-left: 40px }
.title-style5 .name.pink:before { background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.title-style5 .name.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.title-style5 .name.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.title-style5 .name.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.title-style5 .name.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
.title-style5 .name.orange:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.title-style5 .name.red:before { background: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.title-style5 .name.light:before { background: var(--light-color); box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
.title-style5 .name.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.title-style5 .name.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
.title-style5 .name.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

.title-style6 { font-size: 13px; line-height: 14px; color: var(--black-color); font-weight: 500; position: relative; background: none !important; padding-left: 13px; }
.title-style6:before { border-radius: 1.5px; width: 3px; height: 14px; content: ''; background: var(--blue-bg-color-2); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); position: absolute; left: 0; top: 0; }
.title-style6.pink:before { background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.title-style6.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.title-style6.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.title-style6.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.title-style6.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
.title-style6.orange:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.title-style6.red:before { background: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.title-style6.light:before { background: var(--light-color); box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
.title-style6.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.title-style6.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
.title-style6.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

.so-title-li-drop { background: #fff !important; position: relative; text-align: left; padding: 5px 0 5px 13px !important; cursor: auto !important; }
.so-title-li-drop:before { position: absolute; left: 0; top: 5px; height: 18px; content: ''; width: 2px; background: var(--sky-color); border-radius: 1px; }

.box-view-container { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.box-view-container .box-view-item { margin: 8px 8px; flex-grow: 1; position: relative; padding: 0 0 0 16px; font-size: 15px; font-weight: 500; color: var(--light-color); }
.box-view-container .box-view-item:before { width: 2px; height: 100%; content: ''; position: absolute; left: 0; top: 0; background: var(--sky-color); border-radius: 1px; }
.box-view-container .box-view-item .big-text { font-size: 18px; color: var(--black-color); }

.manage-tcs-edit table.table-design3 tr > td .btn { opacity: 0; cursor: inherit; }
.manage-tcs-edit table.table-design3 tr.active > td .btn { opacity: 1; cursor: pointer; }
 
/* Form CSS */
.input-group { align-items: stretch; display: flex; flex-wrap: wrap; position: relative; width: 100%; }

.form-group { width: 100%; margin-bottom:15px; }
.form-group .control-label { font-weight: 500 !important; margin:0 0 5px 0; padding:0; font-size:14px; line-height: 14px; color: var(--light-color); display: block; }
body .form-group .control-label .btn.info-label { margin-top: -7px; margin-bottom: -2px; }
.form-group .control-label span { color: var(--danger-color); }
.form-group .control-label span.sub-text { color: var(--light-color); font-size: 11px; margin-left: 4px; }
.form-group .control-label.count-text-limit { display: flex; align-items: center; flex-shrink: 0; justify-content: space-between; }
.form-group .control-label.count-text-limit .the-count { text-align: right; }
.form-group .control-label.count-text-limit .the-count span { font-size: 14px; font-weight: 500; color: var(--light-color); }
.form-group .control-label.count-text-limit .the-count .sep { padding: 0 4px; }
.form-group .control-label.count-text-limit .tag-icon-label { position: relative; margin-top: -8px; margin-bottom: -4px; cursor: pointer; }
.form-group .form-control { padding:0 7px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; outline: none !important; box-shadow: none !important; height: 30px; color: var(--black-color); text-shadow: none; display: block; width: 100%; margin: 0; resize: vertical; resize: none; }
.form-group .form-control.h-36 { height: 36px; }
.form-group .ant-picker-input > input { font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; color: var(--black-color); line-height: 16px; height: 28px; line-height: 28px; }
/*.form-group .form-control.is-invalid:focus { box-shadow: none !important; border-color: var(--danger-color); }*/
.form-group .form-control.is-invalid { background-image:none;  /* border-color: var(--danger-color); background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23ff715b'%3E%3Ccircle cx='6' cy='6' r='4.5'/%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='var(--danger-color)b' stroke='none'/%3E%3C/svg%3E"); */ }
.form-group label.error { width: 100%; color: var(--danger-color); font-size: 13px; font-weight: 500; line-height: 16px; position: relative; padding-left: 30px; margin-top: 7px; position: relative; text-align: left; }
/*.form-group .invalid-feedback */
.form-group label.error:before { position: absolute; left: 0; top: -2px; content: ''; background: url(../images/invalid-feedback.svg) 0 0 no-repeat; background-size: 20px 20px; width: 20px; height: 20px; }
.form-group .invalid-feedback .feather { position: absolute; left: 3px; top: -2px; }
.form-group.form-row .invalid-feedback { margin-left: 70px; }
/* .table-design .form-group .invalid-feedback { white-space: normal; } */
.table-design .form-group .invalid-feedback { white-space: nowrap; }

.td-error-list { padding: 0; margin: 0; }
.td-error-list li { width: 100%; color: var(--danger-color); font-size: 13px; font-weight: 500; line-height: 16px; position: relative; padding-left: 30px; margin-top: 3px; margin-bottom: 3px; }
.td-error-list li.no-icon { padding-left: 0; }
.td-error-list li .feather { position: absolute; left: 3px; top: -2px; }

.invalid-feedback2 { width: 100%; position: relative; background: #fdecec; border-radius: 6px; color: var(--danger-color); font-size: 13px; font-weight: 500; line-height: 20px; margin-top: 2px; padding: 5px 10px 5px 38px; }
.invalid-feedback2 .feather { position: absolute; left: 8px; top: 5px; }

.invalid-feedback3 { width: 100%; color: var(--danger-color); font-size: 13px; font-weight: 500; line-height: 16px; position: relative; padding-left: 30px; margin-top: 7px; }
.invalid-feedback3 .feather { position: absolute; left: 3px; top: -2px; }

.form-group.form-sign { position: relative; padding-left: 30px; }
.form-group.form-sign .sign { position: absolute; left: 0px; top: 19px; font-size: 24px; line-height: 24px; font-weight: 500; opacity: 0.7; text-transform: lowercase; display: flex; align-items: center; width: 30px; height: 30px; }
.form-group.form-sign .sign .feather { width: 20px; height: 20px; }

.form-group div.form-control.disable,
.form-group div.form-control.disabled,
.form-group .form-control:disabled,
.form-group .form-control[disabled],
.form-group .form-control.disable,
.form-group .form-control.disabled { background-color: #ecf0f3; opacity: 1; }
.form-group .form-control[readonly] { background-color: #ecf0f3; opacity: 1; }
.form-group .form-control.disable.input-white-disable { background: #fff; }

.form-group div.form-control.disable { padding-top: 4px; padding-bottom: 3px; height: auto; min-height: 30px; line-height: 21px; word-wrap: break-word; overflow-wrap: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
.form-group div.form-control.disable.no-wrap-text-limit { text-overflow: ellipsis; white-space: nowrap; overflow: hidden;  }
.form-group .form-control .separator { font-weight: 500; opacity: 1; color: #f0f3f4; display: inline-block; margin: 0 2px; width: 1px; background: var(--ghost-gray); }
.form-group div.form-control.form-control-product-desc { min-height: 51px; /* 140 Character */ }

.form-group .form-control.blue-form-control,
.form-group div.form-control.blue-form-control { background: #e5f6fd; border-color: #7fd1f7; }
.form-group .form-control.green-form-control,
.form-group div.form-control.green-form-control { background: var(--peppermint-color); border-color: #a8dba3; }
.form-group .form-control.red-form-control,
.form-group div.form-control.red-form-control { background: #fdecec; border-color: #f6a2a2; }
.form-group .form-control.white-form-control,
.form-group div.form-control.white-form-control { background: #fff; }

.form-group .form-control.blue-border-form-control,
.form-group div.form-control.blue-border-form-control { background: #fff; border-color: #7fd1f7; }

.form-group div.form-control.disable.label-no-bg { background: none; border-color: transparent; padding-left: 0; padding-right: 0; }

.form-group select.form-control { background:#fff url(../images/select-arrow.png) right center no-repeat; padding-right: 50px; -webkit-appearance: none; -moz-appearance: none; }
.form-group textarea.form-control { height: 120px; padding-top: 5px; padding-bottom: 5px; resize: none; resize: vertical; }
.form-group textarea.form-control.h-text-60 { height: 60px; }

.form-group ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: var(--black-color) !important; opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.form-group ::-moz-placeholder { /* Firefox 19+ */ color: var(--black-color) !important; opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.form-group :-ms-input-placeholder { /* IE 10+ */ color: var(--black-color) !important; opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.form-group :-moz-placeholder { /* Firefox 18- */ color: var(--black-color) !important; opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }
.form-group ::placeholder { /* Firefox 18- */ color: var(--black-color) !important; opacity: 1; font-family: 'DM Sans', sans-serif; font-weight:500; }

.form-group input:focus::-webkit-input-placeholder { font-weight: 500; }
.form-group input:focus::-moz-placeholder { font-weight: 500; }
.form-group input:focus:-ms-input-placeholder { font-weight: 500; }
.form-group input:focus:-moz-placeholder { font-weight: 500; }
.form-group input:focus::placeholder { font-weight: 500; }

.form-group.form-row { display: flex; justify-content: flex-end; margin-left: 0; margin-right: 0; }
.form-group.form-row label.control-label { flex: 1; margin-bottom: 0; align-self: center; max-width: 70px; min-width: 70px; white-space: nowrap; width: 100%; }
.form-group.form-row.text-editor-main label.control-label { align-self: flex-start; }
.form-group.form-row.w-140-label label.control-label { max-width: 140px; min-width: 140px; }
.form-group.form-row.w-140-label .invalid-feedback { margin-left: 140px; }
.form-group.form-row.w-140-label .editor-email-row .invalid-feedback { margin-left: 0; }

.form-group.form-row .react-tag-input,
.form-group.form-row .form-select-drop,
.form-group.form-row .form-control,
.form-group.form-row .react-tags-wrapper,
.form-group.form-row.text-editor-main .editor-email-row { flex: 2; }

/* Floating Group */
.floating-group { position: relative; }
.floating-group .control-label { position: absolute; z-index: 8; top: 8px; left: 8px; padding: 0 6px; transition:0.2s ease all; -moz-transition:0.2s ease all; -webkit-transition:0.2s ease all; font-size: 14px; pointer-events: none; }
.floating-group .control-label:before { position: absolute; left: 0; bottom: 6px; width: 100%; height: 1px; background: #fff; content: ''; z-index: -1; opacity: 0; }
.floating-group.show .control-label { top: -7px; z-index: 9; color: var(--sky-color); }
.floating-group.show .control-label:before { opacity: 1; }

/* Amount Ragne */
.form-group .amount-range-main.input-group { position: relative; }
.form-group .amount-range-main.input-group .form-control { width: 50%; }
.form-group .amount-range-main .to { position: absolute; z-index: 7; top: 4px; left: 50%; margin-left: -11px !important; display: inline-block; line-height: 22px; width: 22px; height: 22px; text-align: center; font-family: 'DM Sans', sans-serif; font-weight:500; font-size: 13px; color: var(--light-color); background: var(--aqua-haze-bg-color); border-radius: 50% !important; }
.form-group .amount-range-main .white-sep { background: #fff; position: absolute; margin-left: -11px !important; left: 50%; top: 2px; width: 22px; height: 27px; z-index: 4; display: inline-block; }
.form-group .amount-range-main .form-control.input-left { border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; border-right: none !important; padding-right: 18px; }
.form-group .amount-range-main .form-control.input-right { border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; border-left: none !important; padding-left: 18px; }

/* Start Select 2 */
.form-group .select2-container.form-control { padding: 0; }
.form-group .select2-container { width: 100% !important; min-height: 30px; height: 100%; }
.form-group .select2-container--default .select2-selection--single { width: 100%; border: 1px solid var(--light-border-color); border-radius: 6px !important; }
.form-group .select2-container--default.select2-container--focus .select2-selection--single { border-color: var(--sky-color) !important; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }
.form-group .select2-container .select2-selection--single { height: 30px; }
.form-group .select2-container .select2-selection--single .select2-selection__rendered { padding: 0 40px 0 7px; line-height: 30px; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; color: var(--black-color); }
.form-group .select2-container--default .select2-selection--single .select2-selection__arrow { width: 28px; height: 28px; background: url(../images/chevron-down-select.svg) 50% 50% no-repeat; background-size: 20px 20px; }
.form-group .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow { background-image: url(../images/chevron-up-select.svg); }
.form-group .select2-container--default .select2-selection--single .select2-selection__arrow b { display: none; }
.form-group .select2-container--default .select2-selection--single .select2-selection__arrow:before { background: var(--light-border-color); position: absolute; left: -1px; width: 1px; height: 12px; top: 8px; content: ''; }
.select2-result-selectable .select2-match, .select2-result-unselectable .select2-match { text-decoration: unset !important; }

/* Select Multiple */
.form-group .select2-container--default .select2-selection--multiple { border: 1px solid var(--light-border-color); border-radius: 6px !important; min-height: 30px; }
.form-group .select2-container--default.select2-container--focus .select2-selection--multiple { border-color: var(--sky-color) !important; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }
.form-group .select2-container--default .select2-selection--multiple .select2-selection__rendered { padding: 0; display: flex; flex-flow: wrap; }
.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice { margin: 2px; background: var(--blue-bg-color-op); color: var(--blue-color); border-radius: 4px; border: 1px solid var(--blue-border-color-op); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); padding: 2px 26px 2px 7px; white-space: normal; color: var(--blue-color); font-family: DM Sans,sans-serif; font-size: 13px; font-weight: 500; line-height: 18px; position: relative; }
.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice__remove { position: absolute; right: 1px; top: 0px; margin: 0; font-size: 0; color: var(--blue-border-color-op); cursor: pointer; padding: 0 3px; width: 26px; height:22px; background: url(../images/x-blue-op.svg) 50% 50% no-repeat; background-size: 20px 20px; }
.form-group .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover { background-image: url(../images/x-blue.svg); }

.form-group .select2-container--default.select2-container--below.select2-container--open .select2-selection--single { /* border-bottom-right-radius: 0px !important; border-bottom-left-radius: 0px !important; */ }
.form-group .select2-container--default.select2-container--above.select2-container--open .select2-selection--single { /* border-top-left-radius: 0px !important; border-top-right-radius: 0px !important; */ }

body .select2-dropdown { margin-top: 3px; border: 1px solid var(--light-border-color); border-radius: 6px !important; box-shadow: 0 1px 6px 0 rgba(0,0,0,.12),0 1px 48px 0 rgba(0,0,0,.06); }
body .select2-search--dropdown { padding: 8px; border-bottom: 1px solid var(--light-border-color); }
body .select2-container--default .select2-search--dropdown .select2-search__field { padding:0 7px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; outline: none !important; box-shadow: none !important; height: 30px; color: var(--black-color); text-shadow: none; display: block; width: 100%; }
body .select2-container--default .select2-search--dropdown .select2-search__field:focus { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }

body ul.select2-results__options { margin: 8px 0; padding: 0 2px; }
body ul.select2-results__options li.select2-results__option { border-radius: 4px; color: var(--black-color); cursor: pointer; font-size: 14px; font-weight: 500; line-height: 18px; margin: 0 0 4px 0; /* margin: 0px 0 9px 0; */ padding: 6px 13px; position: relative; display: block; }
body ul.select2-results__options li.select2-results__option:last-child { /* margin-bottom: 5px; */ margin-bottom: 0; }
body ul.select2-results__options li.select2-results__option:before { width: calc(100% - 30px); height: 1px; bottom: -5px; left: 15px; position: absolute; content: ''; background: var(--light-border-color); opacity: 0; }
body ul.select2-results__options li.select2-results__option:hover,
body ul.select2-results__options li.select2-results__option:active { background: var(--athens3-gray3); }
body .select2-container--default ul.select2-results__options li.select2-results__option[aria-selected="true"] { background: var(--blue-color); color: #fff; }
body ul.select2-results__options li.select2-results__option.select2-results__option--highlighted { background: var(--athens3-gray3); color: var(--black-color); }

/* Start Select 2 Advance */

.select2-chosen { line-height: 28px !important; }
.form-group .select2-container-multi .select2-choices { padding: 0; display: flex; flex-flow: wrap; border: none !important; background: none;  line-height: 26px !important; }
.form-group .select2-dropdown-open.select2-drop-above .select2-choice,
.form-group .select2-dropdown-open.select2-drop-above .select2-choices { background: none; }
.form-group .select2-container-multi .select2-choices .select2-search-choice { margin: 2px; background: var(--blue-bg-color-op); color: var(--blue-color); border-radius: 4px; border: 1px solid var(--blue-border-color-op); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); padding: 1px 26px 1px 7px; white-space: normal; color: var(--blue-color); font-family: DM Sans,sans-serif; font-size: 13px; font-weight: 500; line-height: 20px; position: relative; }
.form-group .select2-container-multi .select2-search-choice-close { position: absolute; left:auto; right: 1px; top: 0px; margin: 0; font-size: 0; color: var(--blue-border-color-op); cursor: pointer; padding: 0 3px; width: 26px; height:22px; background: url(../images/x-blue-op.svg) 50% 50% no-repeat !important; background-size: 20px 20px !important; }
.form-group .select2-container-multi .select2-search-choice-close:hover { background-image: url(../images/x-blue.svg) !important; }

.select2-drop.select2-drop-above.select2-drop-active { border-top : 1px solid var(--light-border-color); }
body .select2-drop { margin: 3px 0; border: 1px solid var(--light-border-color); border-radius: 6px !important; box-shadow: 0 1px 6px 0 rgba(0,0,0,.12),0 1px 48px 0 rgba(0,0,0,.06); }
body .select2-drop .slimScrollDiv { height: auto !important; }
body .select2-drop .slimScrollDiv .slimScrollBar { display: block !important; opacity: 1 !important; }
body ul.select2-results { margin: 8px 0 !important; padding: 0 2px; height: auto !important; }
body ul.select2-results li.select2-result { border-radius: 4px; color: var(--black-color); cursor: pointer; font-size: 14px; font-weight: 500; line-height: 18px; margin: 0 0 4px 0; /* margin: 0px 0 9px 0; */ padding: 6px 13px; position: relative; }
body ul.select2-results li.select2-result .select2-result-label { padding: 0; min-height: inherit; }
body ul.select2-results li.select2-result:last-child { /* margin-bottom: 5px; */ margin-bottom: 0; }
body ul.select2-results li.select2-result:before { width: calc(100% - 30px); height: 1px; bottom: -5px; left: 15px; position: absolute; content: ''; background: var(--light-border-color); opacity: 0; }
body ul.select2-results li.select2-result:hover,
body ul.select2-results li.select2-result:active { background: var(--athens3-gray3); }
body .select2-container--default ul.select2-results li.select2-result[aria-selected="true"] { background: var(--blue-color); color: #fff; }
body ul.select2-results li.select2-result.select2-highlighted { background: var(--athens3-gray3); color: var(--black-color); }
body ul.select2-results li.select2-result.select2-selected { background: var(--blue-color); color: #fff; }

body ul.select2-results li.select2-no-results { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Start Select 2 Multiple Advance */
.select2-container.select2-container-multi.form-control { padding: 0; }
.form-group .select2-container-multi .select2-choices .select2-search-field { width: 100%; width: auto; }
.form-group .select2-container-multi .select2-choices .select2-search-field input { padding: 0px 9px; font-family: 'DM Sans', sans-serif; font-weight: 500; }
.form-group .form-control.select2 { height: auto; padding: 0; }
.form-group .select2-container.select2-container-active { border-color: var(--sky-color) !important; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; outline: none !important; }
.form-group .select2-container.select2-container-active.select2-container-multi { /* box-shadow: none !important; */ }
.form-group .select2-container .select2-choice { height: 28px; border: none; box-shadow: none; padding: 0 35px 0 7px; background: none; width: 100%; }
.form-group .select2-container .select2-choice > .select2-chosen { margin: 0; display: flex; align-items: center; display: block; }
.form-group .select2-container .select2-choice > .select2-chosen .separator-td { height: 20px; top: 4px; }
.form-group .select2-container .select2-choice .select2-arrow { width: 28px; height: 28px; background: url(../images/chevron-down-select.svg) 50% 50% no-repeat; background-size: 20px 20px; border: none; }
.form-group .select2-container.select2-dropdown-open .select2-choice .select2-arrow { background-image: url(../images/chevron-up-select.svg); }
.form-group .select2-container .select2-choice .select2-arrow:before { background: var(--light-border-color); position: absolute; left: -1px; width: 1px; height: 12px; top: 8px; content: ''; }
.form-group .select2-container .select2-choice .select2-arrow b { font-size: 0; display:none; }

body .select2-search { padding: 8px; border-bottom: 1px solid var(--light-border-color); }
body .select2-search input { padding:0 7px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; height: 30px; line-height: 28px; outline: none !important; box-shadow: none !important; height: 30px; color: var(--black-color); text-shadow: none; display: block; width: 100%; background: #fff; }
body .select2-search input:focus { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }

/* Input Focus */
.form-group .form-control:focus { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }
.select2-choices { box-shadow: none !important; }
.select2-choices:focus { box-shadow: none !important; }

.form-group.focus-input .form-control { transition: none; }
.form-group.focus-input .form-control:focus { border-color: var(--light-border-color); box-shadow: none !important; }
.form-group.focus-input.show .form-control { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }

.form-group .custom-file-main .form-control:focus ~ .custom-file-label,
.form-group.lebel-up .custom-file-main .custom-file-label { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.custom-file-label::after { position: absolute; top: 0; right: 0; bottom: 0; z-index: 3; display: block; height: 2.25rem; padding: .375rem .75rem; line-height: 1.5; color: #495057; content: "Browse"; background-color: #e9ecef; border-left: inherit; border-radius: 0 .25rem .25rem 0; }

/* Tags Input */
.form-group .react-tag-input { border:1px solid var(--light-border-color); border-radius: 6px; min-height: 30px; padding: 0 0px; }
.form-group .react-tag-input__tag { background: var(--blue-bg-color-op); border: 1px solid var(--blue-border-color-op); color: var(--blue-color); border-radius: 4px; margin: 2px; font-size: 13px; font-weight: 500; }
.form-group .react-tag-input__tag .react-tag-input__tag__content { padding: 0 0 0 6px; }
.form-group .react-tag-input__tag__remove { background: url(../images/x-blue-op.svg) center center no-repeat; background-size: 20px; width: 26px; }
.form-group .react-tag-input__tag__remove:before,
.form-group .react-tag-input__tag__remove:after { background-color:#fff; opacity: 0; }
.form-group .react-tag-input__tag__remove:hover { background-image: url(../images/x-blue.svg); }
.form-group .react-tag-input__input { color: var(--black-color); padding: 0 4px; height: 28px; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; }
.form-group .react-tag-input.focus { border-color: var(--sky-color); }

.form-group .bootstrap-tagsinput { border:1px solid var(--light-border-color); border-radius: 6px; min-height: 30px; padding: 0 0px; display: flex; flex-wrap: wrap; width: 100%; position: relative; }
.form-group .bootstrap-tagsinput .tag.label-info { background: var(--blue-bg-color-op); border: 1px solid var(--blue-border-color-op); color: var(--blue-color); border-radius: 4px; margin: 2px; font-size: 13px; font-weight: 500; display: flex; align-items: center; position: relative; padding: 0 0 0 6px; }
.form-group .bootstrap-tagsinput .tag.label-info span[data-role="remove"] { background: url(../images/x-blue-op.svg) center center no-repeat; background-size: 20px; width: 26px; height: 22px; cursor: pointer; }
.form-group .bootstrap-tagsinput .tag.label-info span[data-role="remove"]:hover { background-image: url(../images/x-blue.svg); }
.form-group .bootstrap-tagsinput input { color: var(--black-color); padding: 0 4px; height: 28px; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; background: none; border: none; margin: 0 4px; width: auto !important; }

/* Tags Input New */
.form-group .react-tags-wrapper { width: 100%; }
.form-group .tag-input { border:1px solid var(--light-border-color); border-radius: 6px; min-height: 30px; padding: 0 0px; display: flex; flex-wrap: wrap; align-items: center; }
.form-group .tag-input:focus { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }
.form-group .tag-input-tag { background: var(--blue-bg-color-op); border: 1px solid var(--blue-border-color-op); color: var(--blue-color); border-radius: 4px; margin: 2px; font-size: 13px; font-weight: 500; position: relative; display: flex; align-items: center; padding: 2px 0 0 6px; line-height: 20px; }
.form-group .tag-input-tag .tag-input-tag-remove { background: url(../images/x-blue-op.svg) center center no-repeat; background-size: 20px; width: 26px; border: none; font-size: 0; }
.form-group .tag-input-tag .tag-input-tag-remove:hover,
.form-group .tag-input-tag .tag-input-tag-remove:active { background-image: url(../images/x-blue.svg); }
.form-group .tagInputClass { width: auto; flex-grow: 1; }
.form-group .tagInputFieldClass { width: 100%; color: var(--black-color); padding: 0 7px; height: 28px; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; border: none; border-radius: 0; background: none; }

/* Start Editor */
.form-group.text-editor-main .ql-snow.ql-toolbar button:hover,
.form-group.text-editor-main .ql-snow .ql-toolbar button:hover,
.form-group.text-editor-main .ql-snow.ql-toolbar button:focus,
.form-group.text-editor-main .ql-snow .ql-toolbar button:focus,
.form-group.text-editor-main .ql-snow.ql-toolbar button.ql-active,
.form-group.text-editor-main .ql-snow .ql-toolbar button.ql-active,
.form-group.text-editor-main .ql-snow.ql-toolbar .ql-picker-label:hover,
.form-group.text-editor-main .ql-snow .ql-toolbar .ql-picker-label:hover,
.form-group.text-editor-main .ql-snow.ql-toolbar .ql-picker-label.ql-active,
.form-group.text-editor-main .ql-snow .ql-toolbar .ql-picker-label.ql-active,
.form-group.text-editor-main .ql-snow.ql-toolbar .ql-picker-item:hover,
.form-group.text-editor-main .ql-snow .ql-toolbar .ql-picker-item:hover,
.form-group.text-editor-main .ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.form-group.text-editor-main .ql-snow .ql-toolbar .ql-picker-item.ql-selected { color: var(--blue-color); }


.form-group.text-editor-main .ql-toolbar.ql-snow { border-color: var(--light-border-color) !important; border-radius: 6px 6px 0 0; font-family: 'DM Sans', sans-serif; font-weight:500; }
.form-group.text-editor-main .ql-container.ql-snow { border-color: var(--light-border-color) !important; border-radius: 0 0 6px 6px; font-family: 'DM Sans', sans-serif; font-weight:500; }

.form-group.text-editor-main .ql-container.ql-snow strong,
.form-group.text-editor-main .ql-container.ql-snow b { font-weight: 700; }
/* .form-group.text-editor-main .ql-container p {padding: 0; margin: 0 0 20px 0; } */
.form-group.text-editor-main .ql-container img { border-radius: 6px; }
.form-group.text-editor-main .ql-container h1,
.form-group.text-editor-main .ql-container h2,
.form-group.text-editor-main .ql-container h3,
.form-group.text-editor-main .ql-container h4,
.form-group.text-editor-main .ql-container h5,
.form-group.text-editor-main .ql-container h6 { font-family: 'DM Sans', sans-serif; font-weight: 500; padding: 0 0 10px 0; margin: 0; }
.form-group.text-editor-main .ql-container blockquote { border-left: 5px solid var(--blue-color); background: none; }

.form-group.text-editor-main .ql-container ol,
.form-group.text-editor-main .ql-container ul { padding: 0 0 0 15px; margin: 0; }
.form-group.text-editor-main .ql-container ol li,
.form-group.text-editor-main .ql-container ul li { padding: 0; margin: 0; }

.form-group.text-editor-main .ql-container .ql-indent-1 { padding-left: 48px !important; }
.form-group.text-editor-main .ql-container .ql-indent-2 { padding-left: 96px !important; }
.form-group.text-editor-main .ql-container .ql-indent-3 { padding-left: 144px !important; }
.form-group.text-editor-main .ql-container .ql-indent-4 { padding-left: 192px !important; }
.form-group.text-editor-main .ql-container .ql-indent-5 { padding-left: 240px !important; }
.form-group.text-editor-main .ql-container .ql-indent-6 { padding-left: 288px !important; }
.form-group.text-editor-main .ql-container .ql-indent-7 { padding-left: 336px !important; }
.form-group.text-editor-main .ql-container .ql-indent-8 { padding-left: 384px !important; }
.form-group.text-editor-main .ql-container .ql-indent-9 { padding-left: 432px !important; }
.form-group.text-editor-main .ql-container .ql-indent-10 { padding-left: 480px !important; }

.form-group.text-editor-main .ql-container a { color: var(--blue-color); text-decoration: none; }
.form-group.text-editor-main .ql-container a:hover,
.form-group.text-editor-main .ql-container a:active { color: var(--sky-color); }

/* Ed */
.form-group.text-editor-main .ql-snow .ql-tooltip.ql-editing,
.form-group.text-editor-main .ql-snow .ql-tooltip { left: 50% !important; top: 50% !important; margin-left: -154px; margin-top: -20px; transform: none !important; }
.form-group.text-editor-main .ql-snow .ql-tooltip { border-color: var(--light-border-color); border-radius: 6px; box-shadow: none; margin-left: -200px; }

.form-group.text-editor-main .ql-snow .ql-tooltip input[type=text] { padding:0 7px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; outline: none !important; box-shadow: none !important; height: 30px; color: var(--black-color); text-shadow: none; }

.form-group.text-editor-main .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label { border-color: var(--light-border-color); border-radius: 4px; color: var(--black-color); }
.form-group.text-editor-main .ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label:before { color: var(--black-color); }

.form-group.text-editor-main .ql-snow .ql-picker.ql-expanded .ql-picker-options { z-index: 9; }

.form-group.text-editor-main .ql-toolbar.ql-snow .ql-picker-options { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border:1px solid var(--light-border-color); border-radius: 6px; padding: 8px 2px; }
.form-group.text-editor-main .ql-snow .ql-picker-options .ql-picker-item { font-family: 'DM Sans', sans-serif; font-weight: 500; color: var(--black-color); line-height: 18px; border-radius: 4px; padding: 6px 12px; cursor: pointer; margin: 0; }
.form-group.text-editor-main .ql-snow .ql-picker-options .ql-picker-item:hover,
.form-group.text-editor-main .ql-snow .ql-picker-options .ql-picker-item:active { background: var(--athens3-gray3); color: var(--black-color); }

.form-group.text-editor-main .ql-snow .ql-color-picker .ql-picker-options .ql-picker-item { border-radius: 50%; /* box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.2); */ width: 18px; height: 18px; padding: 0; margin: 3px; }
.form-group.text-editor-main .ql-snow .ql-color-label.ql-transparent { opacity: 1; }

/* Editor Preview */
.text-editor-main-preview .editor-preview { font-size: 14px; line-height: 18px; }
.text-editor-main-preview .editor-preview img { border-radius: 6px; }
.text-editor-main-preview .editor-preview b,
.text-editor-main-preview .editor-preview strong { font-weight: 700; }
.text-editor-main-preview .editor-preview h1,
.text-editor-main-preview .editor-preview h2,
.text-editor-main-preview .editor-preview h3,
.text-editor-main-preview .editor-preview h4,
.text-editor-main-preview .editor-preview h5,
.text-editor-main-preview .editor-preview h6 { font-family: 'DM Sans', sans-serif; font-weight: 500; padding: 0 0 10px 0; margin: 0; }
.text-editor-main-preview .editor-preview blockquote { border-left: 5px solid var(--blue-color); background: none; padding: 0 0 0 22px; font-size: 14px; line-height: 18px; }
.text-editor-main-preview .editor-preview h1 { font-size: 26px; line-height: 30px; }
.text-editor-main-preview .editor-preview h2 { font-size: 20px; line-height: 24px; }

.text-editor-main-preview .editor-preview ol { padding: 0 0 0 5px; margin: 0; list-style: none; counter-reset: item; }
.text-editor-main-preview .editor-preview ol li { padding: 0 0 0 0px; margin: 0; /*counter-increment: item;*/ position: relative; counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; counter-increment: list-0; }
.text-editor-main-preview .editor-preview ol li:before { content: counter(list-0, decimal) '. '; display: inline-block; white-space: nowrap; width: 1.2em; }
/*.text-editor-main-preview .editor-preview ol li:before { content: counter(item) ". "; left: -5px; position: relative; }*/

.text-editor-main-preview .editor-preview ul { padding: 0 0 0 15px; margin: 0; list-style-position: outside; }
.text-editor-main-preview .editor-preview ul li { padding: 0 0 0 0px; margin: 0; position: relative; /* list-style: disc; */ }
.text-editor-main-preview .editor-preview ul li:before { content: '•'; left: -5px; position: relative; }

.text-editor-main-preview .editor-preview ol li.ql-indent-1 { counter-increment: list-1; }
.text-editor-main-preview .editor-preview ol li.ql-indent-1:before { content: counter(list-1, lower-alpha) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-1 { counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-2 { counter-increment: list-2; }
.text-editor-main-preview .editor-preview ol li.ql-indent-2:before { content: counter(list-2, lower-roman) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-2 { counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-3 { counter-increment: list-3; }
.text-editor-main-preview .editor-preview ol li.ql-indent-3:before { content: counter(list-3, decimal) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-3 { counter-reset: list-4 list-5 list-6 list-7 list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-4 { counter-increment: list-4; }
.text-editor-main-preview .editor-preview ol li.ql-indent-4:before { content: counter(list-4, lower-alpha) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-4 { counter-reset: list-5 list-6 list-7 list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-5 { counter-increment: list-5; }
.text-editor-main-preview .editor-preview ol li.ql-indent-5:before { content: counter(list-5, lower-roman) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-5 { counter-reset: list-6 list-7 list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-6 { counter-increment: list-6; }
.text-editor-main-preview .editor-preview ol li.ql-indent-6:before { content: counter(list-6, decimal) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-6 { counter-reset: list-7 list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-7 { counter-increment: list-7; }
.text-editor-main-preview .editor-preview ol li.ql-indent-7:before { content: counter(list-7, lower-alpha) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-7 { counter-reset: list-8 list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-8 { counter-increment: list-8; }
.text-editor-main-preview .editor-preview ol li.ql-indent-8:before { content: counter(list-8, lower-roman) '. '; }
.text-editor-main-preview .editor-preview ol li.ql-indent-8 { counter-reset: list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-9 { counter-increment: list-9; }
.text-editor-main-preview .editor-preview ol li.ql-indent-9:before { content: counter(list-9, decimal) '. '; }


.text-editor-main-preview .editor-preview p { padding: 0; margin: 0; }

.text-editor-main-preview .editor-preview a { color: var(--blue-color); text-decoration: none; }
.text-editor-main-preview .editor-preview a:hover,
.text-editor-main-preview .editor-preview a:active { color: var(--sky-color); }

.text-editor-main-preview .editor-preview .ql-indent-1 { padding-left: 48px !important; }
.text-editor-main-preview .editor-preview .ql-indent-2 { padding-left: 96px !important; }
.text-editor-main-preview .editor-preview .ql-indent-3 { padding-left: 144px !important; }
.text-editor-main-preview .editor-preview .ql-indent-4 { padding-left: 192px !important; }
.text-editor-main-preview .editor-preview .ql-indent-5 { padding-left: 240px !important; }
.text-editor-main-preview .editor-preview .ql-indent-6 { padding-left: 288px !important; }
.text-editor-main-preview .editor-preview .ql-indent-7 { padding-left: 336px !important; }
.text-editor-main-preview .editor-preview .ql-indent-8 { padding-left: 384px !important; }
.text-editor-main-preview .editor-preview .ql-indent-9 { padding-left: 432px !important; }
.text-editor-main-preview .editor-preview .ql-indent-10 { padding-left: 480px !important; }

/* End Editor */

/* File */
.custom-file-input { position: relative; z-index: 2; width: 100%; height: calc(2.25rem + 2px); margin: 0; overflow: hidden; opacity: 0; }
.form-group .custom-file-main .custom-file { /* height: 30px; */ cursor: pointer; }
.form-group .custom-file-main .custom-file .custom-file-input { height: 30px; cursor: pointer; display: block; width: 100%; }
.form-group .custom-file-main .form-control { border-color: transparent; opacity: 0; width: 100%; }
.form-group .custom-file-main .custom-file-label { font-size: 14px; line-height: 22px; font-family: 'DM Sans', sans-serif; font-weight:500; padding: 3px 9px; height: 30px; color: var(--black-color); margin: 0; border:1px solid var(--light-border-color); border-radius: 6px !important; width: calc(100% - 104px); overflow: inherit; background: #fff; }
.form-group .custom-file-main .custom-file-label.not_use { font-size: unset !important; line-height: unset !important; padding: unset; height: unset; color: unset; margin: unset; border:unset; border-radius: unset !important; width: unset; overflow: unset !important; }
.form-group .custom-file-main .custom-file-label .file-name { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 100%; display: block; }
.form-group .custom-file-main .custom-file-input:focus ~ .custom-file-label { border-color: var(--sky-color); color: var(--black-color); box-shadow: none !important; }
.form-group .custom-file-main .custom-file-label:after { background-color: var(--blue-color); color: #fff; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; border-radius: 6px !important; content: 'Upload'; right: -103px; top: -1px; border: none; width: 95px; text-align: center; height: 30px; line-height: 30px; padding: 0; cursor: pointer; display: inline-block; }
.form-group .custom-file-main .custom-file-label:hover:after { background-color: var(--blue-bg-hvr-color); }
.form-group .custom-file-main.custom-file-choose-file .custom-file-label { width: calc(100% - 142px); left: 142px; }
.form-group .custom-file-main.custom-file-choose-file .custom-file-label:after { width: 134px; line-height: 28px; left: -143px; right: auto; content: 'Choose a file'; color: var(--black-color); background-color: var(--aqua-haze-bg-color); box-shadow: 0px 1px 4px 0px rgb(0 0 0 / 12%); border: 1px solid var(--light-border-color); }
.form-group .custom-file-main.custom-file-green .custom-file-label:after { background-color: var(--green-color); }
.form-group .custom-file-main.custom-file-sky .custom-file-label:after { background-color: var(--sky-color); }

.form-group .custom-file-main.disabled .custom-file { pointer-events: none; cursor: default; }
.form-group .custom-file-main.disabled .custom-file-label { color: var(--light-color-op6) !important; }
.form-group .custom-file-main.disabled .custom-file-label:after { opacity: 0.6; }

.form-group .custom-file-main.custom-file-attechments { overflow: hidden; }
.form-group .custom-file-main.custom-file-attechments .custom-file-label { background: url(../images/paperclip-grey.svg) 0 4px no-repeat; background-size: 20px 20px; padding-left: 30px; border: none !important; box-shadow: none !important; width: calc(100% - 141px); cursor: pointer; }
.form-group .custom-file-main.custom-file-attechments .custom-file-label:after { content: 'Attach a File'; line-height: 28px; border: 1px solid var(--light-border-color); background: #fff url(../images/plus-grey.svg) 10px 4px no-repeat; background-size: 20px 20px; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgb(0 0 0 / 12%); width: 141px; right: -139px; text-align: left; padding-left: 38px; top: 0; cursor: pointer; }
.form-group .custom-file-main.custom-file-attechments:hover .custom-file-label:after { background-color: var(--light-bg-color); }
.form-group .custom-file-main.custom-file-attechments .custom-file .custom-file-input { opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: -200px; z-index: 7; height: 30px; margin: 0; padding: 0; display: block; cursor: pointer; width: calc(100% + 200px); width: 100%; }

/* New */
.form-group .custom-file-main2.custom-file-attechments2 { padding: 0; }
.form-group .custom-file2 { position: relative; width: 100%; height: 30px; }
.form-group .custom-file-main2.custom-file-attechments2 .custom-file2:after { content: 'Attechments'; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight: 500; position: absolute; top: 0; left: 0; padding-left: 30px; display: block; width: calc(100% - 40px); pointer-events: none; z-index: 20; height: 30px; line-height: 30px; color: var(--black-color); background: url(../images/paperclip-grey.svg) 0 4px no-repeat; background-size: 20px 20px; }
.form-group .custom-file-main2.custom-file-attechments2 .custom-file2:before { position: absolute; top: 0; right: 0; z-index: 25; pointer-events: none; border-radius: 6px; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; content: 'Attach a File'; line-height: 28px; border: 1px solid var(--light-border-color); background: #fff url(../images/plus-grey.svg) 10px 4px no-repeat; background-size: 20px 20px; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgb(0 0 0 / 12%); width: 141px; right: 0; text-align: left; padding-left: 38px; top: 0; }
.form-group .custom-file-main2.custom-file-attechments2 .custom-file2:hover:before {  background-color: var(--light-bg-color); }
.form-group .custom-file2 input { opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 99; height: 30px; margin: 0; padding: 0; display: block; cursor: pointer; width: 100%; }
.form-group .custom-file2 .custom-file-label { display: none; }

/* Start Select CSS Drop */
.form-group .form-select-drop { width: 100%; position: relative; }
body .form-group .form-select-drop .btn.form-control { background: #fff !important; color: var(--black-color); padding: 0; font-size: 14px; font-weight: 500; border: 1px solid var(--light-border-color) !important; text-align: left; cursor: text; align-items: center; display: flex; flex-wrap: nowrap; height: auto; min-height: 30px; overflow: hidden; }
body .form-group .form-select-drop .btn.form-control:hover,
body .form-group .form-select-drop .btn.form-control:not([disabled]):not(.disabled):active { background: #fff !important; color: var(--black-color); }
body .form-group .form-select-drop .btn.form-control:focus { border-color: var(--sky-color) !important; font-weight: 500; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }
.form-group .form-select-drop .select-value { align-items: center; display: flex; flex: 1; flex-wrap: nowrap; padding: 0 7px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: calc(100% - 110px); text-transform: none; }
.form-group .form-select-drop.text-transform-inherit .select-value { text-transform: inherit; }
.form-group .form-select-drop.text-transform-capitalize .select-value { text-transform: capitalize; }
.form-group .form-select-drop .select-value .branch-code { color: var(--light-color); }
.form-group .form-select-drop .select-indicators { align-items: center; align-self: stretch; display: flex; flex-shrink: 0; position: relative; z-index: 1; }
.form-group .form-select-drop .select-indicators .select-clear-indicator { display: flex; padding: 2px 3px; cursor: pointer; color: var(--light-color); }
.form-group .form-select-drop .select-indicators .select-clear-indicator:hover { color: var(--black-color); }
.form-group .form-select-drop .select-indicators .select-indicator-separator { align-self: stretch; margin-bottom: 8px; margin-top: 8px; width: 1px; background-color: var(--light-border-color); }
.form-group .form-select-drop .select-indicators .select-dropdown-indicator { padding: 2px 4px; display: flex; color: var(--ghost-gray); }
.form-group .form-select-drop.show .select-indicators .select-dropdown-indicator { -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); color: var(--black-color); }

body .form-group .form-select-drop .btn.form-control.disable,
body .form-group .form-select-drop .btn.form-control.disabled,
body .form-group .form-select-drop .btn.form-control[readonly],
body .form-group .form-select-drop .btn.form-control[disabled] { background-color: #ecf0f3 !important; opacity: 1; pointer-events: none; }

/* Big */
body .form-group .form-select-drop.select-drop-h36 .btn.form-control { min-height: 36px; font-size: 15px; }
.form-group .form-select-drop.select-drop-h36 .select-value { padding: 0 20px; }
.form-group .form-select-drop.select-drop-h36 .select-indicators .select-dropdown-indicator { padding-left: 7px; padding-right: 7px; }

/* Black Drop Down */
body .form-group .form-select-drop .dropdown-menu.black-dropdown { padding: 0; border: none; background: var(--black-color); width: 100%; }
.form-select-drop .black-dropdown .select-results { padding: 0 5px; margin: 5px 0; }
.form-select-drop .black-dropdown .select-results .select-results-value a { color: #999999; padding: 7px 15px; position: relative; display: block; }
.form-select-drop .black-dropdown .select-results .select-results-value a:after { content: ''; position: absolute; left: 5px; top: 0; bottom: 0; margin: auto 0; border-radius: 1px; background: var(--sky-color); width: 3px; height: 22px; opacity: 0; }
.form-select-drop .black-dropdown .select-results .select-results-value a:before { position: absolute; content: ''; left: 0; top: 0; width: 100%; height: 100%; border-radius: 4px; opacity: 0;
background: -moz-linear-gradient(left,  rgba(0,174,239,0.24) 0%, rgba(0,174,239,0) 10%, rgba(0,174,239,0) 100%);
background: -webkit-linear-gradient(left,  rgba(0,174,239,0.24) 0%,rgba(0,174,239,0) 10%,rgba(0,174,239,0) 100%);
background: linear-gradient(to right,  rgba(0,174,239,0.24) 0%,rgba(0,174,239,0) 10%,rgba(0,174,239,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d00aeef', endColorstr='#0000aeef',GradientType=1 ); }

/* Handle */
.form-select-drop .black-dropdown .select-results::-webkit-scrollbar-thumb { background: #999999; }
/* Handle on hover */
.form-select-drop .black-dropdown .select-results::-webkit-scrollbar-thumb:hover { background: #949599; }

.form-select-drop .black-dropdown .select-results .select-results-value.highlight-selected a:after,
.form-select-drop .black-dropdown .select-results .select-results-value.highlight-selected a:before { opacity: 1; }
.form-select-drop .black-dropdown .select-results .select-results-value.highlight-selected,
.form-select-drop .black-dropdown .select-results .select-results-value:hover { background: #43444c; }
.form-select-drop .black-dropdown .select-results .select-results-value:hover a:before,
.form-select-drop .black-dropdown .select-results .select-results-value:hover a:after { opacity: 1; }
.form-select-drop .black-dropdown .select-results .select-results-value:hover a { color: #ffff; }

/* Blue Drop Down */
body .form-group .form-select-drop .dropdown-menu.blue-dropdown { background: var(--blue-color); }
.form-select-drop .blue-dropdown .select-results .select-results-value a { color: #a5b0f2; }
.form-select-drop .blue-dropdown .select-results .select-results-value.highlight-selected,
.form-select-drop .blue-dropdown .select-results .select-results-value:hover { background: #4055c1; }

/* Handle */
.form-select-drop .blue-dropdown .select-results::-webkit-scrollbar-thumb { background: #4055c1; }
/* Handle on hover */
.form-select-drop .blue-dropdown .select-results::-webkit-scrollbar-thumb:hover { background: #939edc; }

/* Single Count */
.form-group .form-select-drop .select-value .select-multi-value { display: flex; margin: 3px 3px 3px 10px; background: var(--blue-bg-color-op); color: var(--blue-color); border-radius: 4px; border: 1px solid var(--blue-border-color-op); }
.form-group .form-select-drop .select-value .select-multi-value .select-multi-value-label { color: var(--blue-color); font-size: 13px; line-height: 18px; padding: 1px 0 1px 0px; text-overflow: ellipsis;
    white-space: nowrap; overflow: hidden; font-family: 'DM Sans', sans-serif; font-weight: 500; }
.form-group .form-select-drop .select-value .select-multi-value.count-value { background: var(--aqua-haze-bg-color); border-color: var(--aqua-haze-bg-color); }
.form-group .form-select-drop .select-value .select-multi-value.count-value .select-multi-value-label { color: var(--blue-color); padding-left: 7px; padding-right: 7px; }

/* Multi */
.form-group .form-select-drop.multi-select .select-value { padding: 0px; overflow: inherit; }
.form-group .form-select-drop.multi-select .select-value .select-multi-value { display: flex; margin: 2px; background: var(--blue-bg-color-op); color: var(--blue-color); border-radius: 4px; border: 1px solid var(--blue-border-color-op); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); }
.form-group .form-select-drop.multi-select .select-value .select-multi-value .select-multi-value-label { color: var(--blue-color); font-size: 13px; line-height: 18px; padding: 2px 0 2px 7px; text-overflow: ellipsis;
    white-space: nowrap; overflow: hidden; font-family: 'DM Sans', sans-serif; font-weight: 500; }
.form-group .form-select-drop.multi-select .select-value .select-multi-value.count-value { background: var(--blue-color); border-color: var(--blue-color); }
.form-group .form-select-drop.multi-select .select-value .select-multi-value.count-value .select-multi-value-label { color: #fff; padding-left: 8px; padding-right: 8px; }
.form-group .form-select-drop.multi-select .select-value .select-multi-value .select-multi-value-remove { color: var(--blue-border-color-op); width: 26px; padding: 0 3px; cursor: pointer; align-items: center; display: flex; }
.form-group .form-select-drop.multi-select .select-value .select-multi-value .select-multi-value-remove:hover { color: var(--blue-color); }

/*  */
.form-group .form-select-drop .select-value-input { display: flex; align-self: stretch; width: 100%; align-items: center; padding: 0 7px; }

/* Select Drop */
body .form-group .form-select-drop .dropdown-menu { /*width: 100%; left: 0 !important; top: 100% !important; transform:inherit !important; transform-style:inherit !important;*/ /* -moz-transition:all .2s linear;-webkit-transition:all .2s linear;transition:all .2s linear; */ opacity:0; visibility:hidden; margin-top: 1px !important; padding: 0; transition: none !important; }
body .form-group .form-select-drop.filter-dropdown .dropdown-menu { max-width: 367px; }
body .form-group .form-select-drop .dropdown-menu.show { /*top: 100% !important; */opacity:1; visibility:visible; z-index: 11; }
body .form-group .form-select-drop .dropdown-menu[x-placement="top-start"] { /*top: auto !important; bottom: 150% !important;*/ margin-top: 0 !important; margin-bottom: 1px !important; }
/* body .form-group .form-select-drop .dropdown-menu.show[x-placement="top-start"] { top: auto !important; bottom: 100% !important; } */

.form-select-drop .form-group.select-search { padding: 8px; border-bottom: 1px solid var(--light-border-color); margin: 0; }
.form-select-drop .form-group.select-search .form-control { padding: 0 7px; }
.form-group.add-new-btn-select { padding: 8px 15px 0 15px !important; }
.form-select-drop .select-results { padding: 0px 2px; margin: 8px 0; max-height: 150px; overflow-x: auto; width: 100%; }
.form-select-drop .select-results .select-results-value { font-size: 14px; font-weight: 500; color: var(--black-color); line-height: 18px; border-radius: 4px; padding: 0; cursor: pointer; margin: 0; }
.form-select-drop .select-results .select-results-value.disabled { opacity: 0.5; }
.form-select-drop .select-results .select-results-value a { font-size: 14px; font-weight: 500; color: var(--black-color); padding: 6px 13px; margin: 0; background: none !important; white-space: normal; }
.form-select-drop .select-results .select-results-value a .branch-code { color: var(--light-color); }
.form-select-drop .select-results .selected { font-size: 13px; line-height: 18px; color: var(--light-color); font-weight: 500; padding: 0px 13px 3px 13px; margin: 0; margin-top: -3px; }
.form-select-drop .select-results .hr-line-select { padding: 8px 13px 8px 13px; width: 100%; }
.form-select-drop .select-results .select-results-value.even { background-color: var(--aqua-haze-bg-color); }
.form-select-drop .select-results .select-results-value.highlighted,
.form-select-drop .select-results .select-results-value:hover,
.form-select-drop .select-results .select-results-value:active { background: var(--athens3-gray3); }
.form-select-drop .select-results .select-results-value.highlight-selected { background: var(--blue-color); color: #fff; }
.form-select-drop .select-results .select-results-value.highlight-selected a { color: #fff; }
.form-select-drop .select-results .select-results-value.highlight-selected a .branch-code { color: #bdc4e9; }
.form-select-drop .select-results.select-results-selected { margin-bottom: 0; }
.form-select-drop .select-results.select-results-selected .hr-line-select { padding-bottom: 0; }

body .form-group .form-select-drop.table-showing-select .dropdown-menu { /*left: auto !important;*/ right: 0 !important; z-index: 1004; min-width: 85px; }

.form-select-drop .select-results .select-results-value.sub-branch a { padding-left: 28px; }
.form-select-drop .select-results .select-results-value.main-branch a .branch-code,
.form-select-drop .select-results .select-results-value.sub-branch a .branch-code, 
.form-select-drop .select-results .select-results-value.main-branch label .branch-code,
.form-select-drop .select-results .select-results-value.sub-branch label .branch-code { color: var(--light-color); }

.form-select-drop .select-results .select-results-value.main-branch.highlight-selected a .branch-code,
.form-select-drop .select-results .select-results-value.sub-branch.highlight-selected a .branch-code { color: #bdc4e9; }
.form-select-drop .select-results .select-results-value.main-branch.highlight-selected separator-td:before,
.form-select-drop .select-results .select-results-value.sub-branch.highlight-selected .separator-td:before { background: #929edb; }

.form-select-drop .select-results .select-results-value.main-branch separator-td,
.form-select-drop .select-results .select-results-value.sub-branch .separator-td { min-height: 18px; }

/* Select Drop Multi */
.form-select-drop.multi-select .select-results .select-results-value { padding: 5px 13px; }
.form-select-drop.multi-select .select-results .select-results-value .checkbox-custom { width: 100%; }
.form-select-drop.multi-select .select-results .select-results-value .checkbox-custom label.label-text { width: 100%; color: var(--black-color); }
.form-select-drop.multi-select .select-results .select-results-value .checkbox-custom label.label-text .branch-code { color: var(--light-color); }
.form-select-drop.multi-select.branch-sub-branch-select .select-results .select-results-value.sub-branch div { padding-left: 15px; }

/* Location Drop Down */
.form-select-drop.multi-select.location-sub-location-select .select-results .select-results-value.main-branch { background: #fff !important; position: relative; text-align: left; padding: 5px 0 5px 13px !important; cursor: auto !important; }
.form-select-drop.multi-select.location-sub-location-select .select-results .select-results-value.main-branch:before { position: absolute; left: 0; top: 6px; height: 18px; content: ''; width: 2px; background: var(--sky-color); border-radius: 1px; }
.form-select-drop.multi-select.location-sub-location-select .select-results .select-results-value.main-branch .checkbox-custom label.label-text { padding-left: 0 !important; cursor: auto !important; }
.form-select-drop.multi-select.location-sub-location-select .select-results .select-results-value.sub-branch div { padding-left: 0px; }

/* Select Country */
.form-select-drop.select-country-drop .dropdown-menu { min-width: 380px; }
.form-select-drop.select-country-drop .select-results .select-results-value { position: relative; }
.form-select-drop.select-country-drop .select-results .select-results-value .country-icon { position: absolute; width: 20px; top: 8px; left: 13px; border: 1px solid var(--athens3-gray3); }
.form-select-drop.select-country-drop .select-results .select-results-value .country-name { display: inline-block; padding: 0 5px 0 30px; }
.form-select-drop.select-country-drop .select-results .select-results-value .country-code span { opacity: 0.5; }
.form-select-drop.select-country-drop .select-results .select-results-value .country-code span:first-child { padding-right: 3px; }
.form-select-drop.select-country-drop .select-results .select-results-value .country-code span:last-child { padding-left: 3px; }
/* End Select CSS Drop */
.form-select-drop.mr-mrs-drop .dropdown-menu { min-width: 200px; }

.form-group.in-out-punch-main .control-label { padding-left: 65px; }
.form-group.in-out-punch-main .form-control { margin-right: 15px !important; }
.in-out-punch { position: relative; display: flex; flex-shrink: 0; align-items: flex-start; justify-content: space-between; flex-wrap: nowrap; }
.in-out-punch .form-control.width50 { width: 50px; min-width: 50px; }

.icon-left .input-icon,
.icon-right .input-icon { width: 31px; height: 30px; position: absolute; left: 0; top: 0; z-index: 6; text-align: center; padding-top: 5px; line-height: 24px; font-weight: 500; font-size:15px; color: var(--light-color); }
.icon-left.icon16 .input-icon,
.icon-right.icon16 .input-icon { padding-top: 6px; }

.icon-left .input-icon-text,
.icon-right .input-icon-text { width: 31px; height: 30px; position: absolute; left: 0; top: 0; z-index: 6; text-align: center; line-height: 30px; font-weight: 500; font-size:15px; color: var(--light-color); }
.icon-right .input-icon-text { left: auto; right: 0; }

.input-group-big.icon-left .input-icon,
.input-group-big.icon-right .input-icon { padding-top: 8px; }

.icon-left .input-icon.right-icon { left: auto; right: 1px; }
.icon-left .input-icon.right-icon.right4 { right: 4px; }
.icon-right .input-icon { left: auto; right: 0; }
.form-group .icon-left .form-control { padding-left: 35px; }
.form-group .icon-left .form-select-drop .select-value { padding-left: 35px; }
.form-group .icon-right .form-control { padding-right: 35px; }
.form-group .icon-right2 .form-control { padding-right: 35px; }
.form-group .icon-right .select-grey .form-control { padding-right: 15px; background: var(--aqua-haze-bg-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12) !important; }

/* Select Search */
.form-group.select-generic-search .form-select-drop .select-indicators .select-indicator-separator,
.form-group.select-generic-search .form-select-drop .select-indicators .select-dropdown-indicator { display: none; }
.form-group.select-generic-search .form-select-drop .select-value { width: calc(100% - 7px); min-width: calc(100% - 7px); max-width: calc(100% - 7px); }

.form-group .percentage-amount { line-height: 30px; position: absolute; right: 10px; color: var(--light-color); z-index: 3; }

.input-group.icon1 { position: relative; display: flex; flex-shrink: 0; align-items: flex-start; justify-content: space-between; flex-wrap: nowrap; }
.input-group.icon1 .input-control { width: 100%; }
.icon-left .input-icon.right-icon.disabled { opacity: 0.5; pointer-events: none; cursor: default; }
.icon-left .input-icon.right-icon.date-picker-clear { opacity: 0.5; }
.icon-left .input-icon.right-icon.date-picker-clear:hover,
.icon-left .input-icon.right-icon.date-picker-clear:active { opacity: 1; }

.icon-left .input-icon.right-icon.date-picker-clear { right: 0; }

.input-group.qty-group { position: relative; }
.form-group .input-group.qty-group .form-control { padding-right: 81px; }
.input-group.qty-group .qty-btn { z-index: 6; display: flex; flex-wrap: nowrap; overflow: hidden; position: absolute; top: 4px; right: 4px; border-radius: 4px !important; border: 1px solid var(--light-border-color); background: var(--aqua-haze-bg-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); width: 70px; height: 22px; }
.input-group.qty-group .qty-btn:before { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; content: ''; width: 1px; height: 12px; background: var(--light-border-color); z-index: 2; }
body .qty-btn .btn.btnic { width: 34px; height: 22px; background: none; }
body .qty-btn .btn.btn-minus { margin-right: 1px; }
body .qty-btn .btn:hover { background: rgb(255,255,255);
background: -moz-linear-gradient(left,  rgba(255,255,255,1) 1%, rgba(238,242,245,1) 100%);
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 1%,rgba(238,242,245,1) 100%);
background: linear-gradient(to right,  rgba(255,255,255,1) 1%,rgba(238,242,245,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eef2f5',GradientType=1 ); }
body .qty-btn .btn.btn-plus:hover { background: rgb(238,242,245);
background: -moz-linear-gradient(left,  rgba(238,242,245,1) 0%, rgba(255,255,255,1) 100%);
background: -webkit-linear-gradient(left,  rgba(238,242,245,1) 0%,rgba(255,255,255,1) 100%);
background: linear-gradient(to right,  rgba(238,242,245,1) 0%,rgba(255,255,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eef2f5', endColorstr='#ffffff',GradientType=1 ); }

.input-group.tier-price-border { position: relative; }
.input-group.tier-price-border .tier-price-border-strip { width: calc(100% - 18px); height: 2px; background: var(--green-color); border-radius: 2px 2px 0 0; position: absolute; left: 8px; top: 28px; z-index: 4; }
.input-group.tier-price-border.pink-strip .tier-price-border-strip { background: var(--pink2-color); }
.input-group.tier-price-border.qty-group .tier-price-border-strip { width: calc(100% - 90px); }

.input-tier-price-tag .tier-price-tag { background: var(--green-color); line-height: 22px; font-size: 13px; font-weight: 500; color: #fff; position: absolute; right: 25px; top: -21px; z-index: 3; }
.input-tier-price-tag .tier-price-tag .trapezium-icon { position: absolute; left: -17px; top: 0; color: var(--green-color); }
.input-tier-price-tag .tier-price-tag .trapezium-icon.right { left: auto; right: -17px; transform: scaleX(-1); }

.input-tier-price-tag.pink-fill .tier-price-tag { background: var(--pink2-color); }
.input-tier-price-tag.pink-fill .tier-price-tag .trapezium-icon { color: var(--pink2-color); }

.input-group.two-input { width: 100%; position: relative; flex-wrap: nowrap; justify-content: space-between; flex-shrink: 0; }
.input-group.two-input .select-grey { width: 165px; margin-right: 8px; /* border-right: 1px solid var(--light-border-color); */ }
.input-group.two-input.right-input .select-grey { margin-right: 0; margin-left: 8px !important; }
.input-group.two-input .select-grey .filter__indicator-separator { opacity: 0; }
.input-group.two-input .select-grey.select-width85 { width: 85px; }
/* .form-group .input-group.two-input .form-control { border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; border-left-color: transparent !important; } */
/* .form-group .input-group.two-input .filter__control { border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-right-color: transparent !important; } */

.input-group.two-input .input_group_validat2 { width: 100%; }
/* .input-group.two-input .input_group_validat2 { width: calc(100% - 173px); }
.input-group.two-input.validat1-select-width85 .input_group_validat2 { width: calc(100% - 103px); }

.input-group.two-input.select-big-l .input_group_validat2 { width: calc(100% - 173px); }
.input-group.two-input.select-big-l.validat1-select-width85 .input_group_validat2 { width: calc(100% - 103px); } */

/* Custam Select */
.input-group.two-input .form-select-drop.select-grey { max-width: 165px; }
body .form-group .input-group.two-input .form-select-drop .btn.form-control { background: var(--aqua-haze-bg-color) !important; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12) !important; }
.form-group .form-select-drop.select-grey .select-value { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 134px; padding-right: 0; }
.form-group .select-grey .select-indicators .select-indicator-separator { opacity: 0; }
.form-group .select-grey .form-select-drop .select-value { padding-right: 0; }

.input-group.two-input .select-grey.select-width85 { min-width: 95px; }
.form-group .input-group.two-input .select-grey.select-width85 .select-value { max-width: 67px; }

/* Start Date Range New */
.form-group .form-control.date-picker { background-color: #fff; text-transform: capitalize; margin: 0 !important; }

body .flatpickr-calendar { border: 1px solid var(--light-border-color); background: #fff; border-radius: 6px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); }
body .flatpickr-innerContainer { border: none; background: transparent;  box-shadow: none; }
body .flatpickr-calendar:before { width: 12px; height: 12px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(135deg) !important; border-radius: 0 0 0 5px; background: var(--sky-color); position: absolute; content: ''; border: none; margin-bottom: -6px; left: 37px; background: #fff; border: 1px solid var(--light-border-color); box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); opacity: 0; }
body .flatpickr-calendar.arrowBottom:before { transform: rotate(-45deg) !important; margin-top: -6px; }
body .flatpickr-calendar:after { opacity: 0; }

body .flatpickr-months { height: 40px; }
body .flatpickr-months .flatpickr-month { background: none; border-bottom: 1px dashed var(--light-border-color); height: 38px; margin-bottom: 6px; }
body .flatpickr-months .flatpickr-prev-month,
body .flatpickr-months .flatpickr-next-month { background: url(../images/chevron-left.svg) center center no-repeat; background-size: 18px; width: 28px; height: 28px; margin: 5px; border-radius: 6px; }
body .flatpickr-months .flatpickr-next-month { background-image: url(../images/chevron-right.svg); }
body .flatpickr-months .flatpickr-prev-month:hover,
body .flatpickr-months .flatpickr-next-month:hover { background-color: var(--light-bg-hvr-color); background-image: url(../images/chevron-left-hvr.svg); }
body .flatpickr-months .flatpickr-next-month:hover { background-image: url(../images/chevron-right-hvr.svg); }
body .flatpickr-months .flatpickr-prev-month svg,
body .flatpickr-months .flatpickr-next-month svg { opacity: 0; }

body .flatpickr-current-month { padding: 5px 0 0 0; height: 33px; }
body .flatpickr-current-month .flatpickr-monthDropdown-months { background: url(../images/chevron-down-select.svg) 100% 50% no-repeat !important; background-size: 20px !important; height: 28px; color: var(--black-color); font-size: 14px; font-weight: 500; font-family: 'DM Sans', sans-serif; -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; padding: 0 20px 0 10px; border-radius: 0; line-height: 28px; }
body .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month { background: #fff; color: var(--black-color); font-size: 14px; font-weight: 500; font-family: 'DM Sans', sans-serif; }
body .flatpickr-month .flatpickr-current-month { padding-top: 7px; }

body .flatpickr-current-month input.cur-year { color: var(--black-color); font-size: 14px; font-weight: 500; font-family: 'DM Sans', sans-serif; background: none !important; padding: 0 0 0 15px; }
body .flatpickr-current-month input.cur-year[disabled] { font-size: 14px; }
body .flatpickr-current-month input.cur-year[disabled] + .arrowUp,
body .flatpickr-current-month input.cur-year[disabled] + .arrowUp + .arrowDown { opacity: 0; pointer-events: none; }
body .flatpickr-current-month label.invalid-feedback,
body .flatpickr-current-month label.error { display: none !important; visibility: hidden; opacity: 0; }
body .flatpickr-current-month input.cur-year.invalid-feedback { color: var(--danger-color); }

body .numInputWrapper:hover { background: transparent; }
body .numInputWrapper span.arrowUp,
body .numInputWrapper span.arrowDown { border-color: transparent; background: url(../images/chevron-up-grey.svg) center center no-repeat; background-size: 18px; width: 28px; height: 10px; top: -4px; }
body .numInputWrapper span.arrowDown { background-image: url(../images/chevron-down-grey.svg); top: auto; bottom: -2px; }
body .numInputWrapper span.arrowUp:hover { background-image: url(../images/chevron-up-black.svg); }
body .numInputWrapper span.arrowDown:hover { background-image: url(../images/chevron-down-black.svg); }
body .numInputWrapper span.arrowUp:after,
body .numInputWrapper span.arrowDown:after { opacity: 0; }

body .flatpickr-time .numInputWrapper span.arrowUp { top: 6px; }
body .flatpickr-time .numInputWrapper span.arrowDown { bottom: 6px; }

body .flatpickr-weekdays { padding: 0 15px; background: none; }
body span.flatpickr-weekday { background: none; color: var(--black-color); font-size: 14px; font-weight: 500; font-family: 'DM Sans', sans-serif; }

body .flatpickr-calendar { width: 286.875px; }
body .dayContainer { width: 337.875px; min-width: 255.875px; max-width: 255.875px; }
body .flatpickr-days { padding: 0 15px 15px 15px; width: 286.875px; border: none; }

body .flatpickr-day {/*  border-left: 9px solid transparent; border-right: 9px solid transparent; */ border-radius: 6px; margin-top: 3px !important; margin-bottom: 2px; color: var(--black-color); font-family: 'DM Sans', sans-serif; font-weight: 500; font-size: 14px; /* width: 32px; max-width: 35px; */ max-width: 32px; height: 32px; line-height: 32px; }

body .flatpickr-day.nextMonthDay,
body .flatpickr-day.prevMonthDay { color: rgba(0, 0, 0, 0.25); }

body .flatpickr-day.inRange { -webkit-box-shadow: -5px 0 0 var(--aqua-haze-bg-color), 5px 0 0 var(--aqua-haze-bg-color); box-shadow: -5px 0 0 var(--aqua-haze-bg-color), 5px 0 0 var(--aqua-haze-bg-color); }
body .flatpickr-day.inRange,
body .flatpickr-day.prevMonthDay.inRange,
body .flatpickr-day.nextMonthDay.inRange,
body .flatpickr-day.today.inRange,
body .flatpickr-day.prevMonthDay.today.inRange,
body .flatpickr-day.nextMonthDay.today.inRange,
body .flatpickr-day:hover,
body .flatpickr-day.prevMonthDay:hover,
body .flatpickr-day.nextMonthDay:hover,
body .flatpickr-day:focus,
body .flatpickr-day.prevMonthDay:focus,
body .flatpickr-day.nextMonthDay:focus { background-color: var(--aqua-haze-bg-color); border-color: var(--aqua-haze-bg-color); color: var(--black-color); }
body .flatpickr-day.inRange:hover,
body .flatpickr-day.inRange:active { background-color: var(--light-bg-color); border-color: var(--light-bg-color); color: var(--black-color); /*-webkit-box-shadow: -5px 0 0 var(--light-bg-color), 5px 0 0 var(--light-bg-color); box-shadow: -5px 0 0 var(--light-bg-color), 5px 0 0 var(--light-bg-color);*/ }

body .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
body .flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
body .flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) { box-shadow: -5px 0 0 var(--sky-color), 5px 0 0 var(--sky-color); }

body .flatpickr-day:hover,
body .flatpickr-day:active,
body .flatpickr-day.today,
body .flatpickr-day.selected,
body .flatpickr-day.today:hover,
body .flatpickr-day.today:active { color: #fff; background: var(--sky-color); border-color: var(--sky-color); }
body .flatpickr-day.today { color: var(--black-color); background: none; }

body .flatpickr-day.selected,
body .flatpickr-day.startRange,
body .flatpickr-day.endRange,
body .flatpickr-day.selected.inRange,
body .flatpickr-day.startRange.inRange,
body .flatpickr-day.endRange.inRange,
body .flatpickr-day.selected:focus,
body .flatpickr-day.startRange:focus,
body .flatpickr-day.endRange:focus,
body .flatpickr-day.selected:hover,
body .flatpickr-day.startRange:hover,
body .flatpickr-day.endRange:hover,
body .flatpickr-day.selected.prevMonthDay,
body .flatpickr-day.startRange.prevMonthDay,
body .flatpickr-day.endRange.prevMonthDay,
body .flatpickr-day.selected.nextMonthDay,
body .flatpickr-day.startRange.nextMonthDay,
body .flatpickr-day.endRange.nextMonthDay { color: #fff; background: var(--sky-color); border-color: var(--sky-color); }

body .flatpickr-day.selected.startRange,
body .flatpickr-day.startRange.startRange,
body .flatpickr-day.endRange.startRange { border-radius: 6px 0 0 6px; }
body .flatpickr-day.selected.endRange,
body .flatpickr-day.startRange.endRange,
body .flatpickr-day.endRange.endRange { border-radius: 0 6px 6px 0; }

body .flatpickr-day.selected,
body .flatpickr-day.startRange,
body .flatpickr-day.endRange,
body .flatpickr-day.selected.inRange,
body .flatpickr-day.startRange.inRange,
body .flatpickr-day.endRange.inRange,
body .flatpickr-day.selected:focus,
body .flatpickr-day.startRange:focus,
body .flatpickr-day.endRange:focus,
body .flatpickr-day.selected:hover,
body .flatpickr-day.startRange:hover,
body .flatpickr-day.endRange:hover,
body .flatpickr-day.selected.prevMonthDay,
body .flatpickr-day.startRange.prevMonthDay,
body .flatpickr-day.endRange.prevMonthDay,
body .flatpickr-day.selected.nextMonthDay,
body .flatpickr-day.startRange.nextMonthDay,
body .flatpickr-day.endRange.nextMonthDay { box-shadow: none; }

/*body .flatpickr-calendar.hasTime { width: 228px; }*/

.flatpickr-time input { background: none; font-family: 'DM Sans', sans-serif; font-weight:500 !important; text-align: left; padding-left: 10px; }
body .flatpickr-calendar.hasTime .flatpickr-time { border: none; background: none; }
body .flatpickr-time input:hover,
body .flatpickr-time .flatpickr-am-pm:hover,
body .flatpickr-time input:focus,
body .flatpickr-time .flatpickr-am-pm:focus { background: none; font-family: 'DM Sans', sans-serif; font-weight: 500; font-size: 14px; color: var(--black-color); }

body .flatpickr-monthSelect-months { margin: 3px; }
body .flatpickr-monthSelect-months .flatpickr-monthSelect-month { display: inline-block; width: 52px; margin: 3px 8px; border-radius: 6px; font-family: 'DM Sans', sans-serif; font-weight: 500; line-height: 30px; font-size: 14px; color: var(--black-color); cursor: pointer; }
body .flatpickr-monthSelect-months .flatpickr-monthSelect-month.today { background: var(--aqua-haze-bg-color); position: relative; }
body .flatpickr-monthSelect-months .flatpickr-monthSelect-month.today:before { position: absolute; left: 4px; top: 4px; width: 6px; height: 6px; content: ''; background: var(--sky-color); border-radius: 50%; }
body .flatpickr-monthSelect-months .flatpickr-monthSelect-month:hover,
body .flatpickr-monthSelect-months .flatpickr-monthSelect-month:active { background: var(--light-bg-color); }
body .flatpickr-monthSelect-months .flatpickr-monthSelect-month.selected { background: var(--sky-color); color: #fff; }

body .flatpickr-calendar.OnlyMonth .flatpickr-months{ display: none;}
body .flatpickr-calendar.OnlyYear .flatpickr-innerContainer{ display: none;}
body .flatpickr-calendar.OnlyYear .flatpickr-month{ border-bottom:0 none;}

/* End Date Range New */

/* Check Box */
.checkbox-custom.table-check { width: 20px; }
.checkbox-custom { margin: 5px 20px 5px 0 !important; display: inline-block; min-height: 20px; position: relative; }
.checkbox-custom.w-60 { width: 60; }
.checkbox-custom.check-drag .drag-handle { width: 24px; height: 24px; cursor: grab; position: absolute; left: 28px; top: -2px; background: url(../images/move-dot.svg) center center no-repeat; }
.checkbox-custom.check-drag label.label-text { padding-left: 60px !important; }
.checkbox-custom.mg-0 { margin: 0 !important; }
.checkbox-custom.mgt-0 { margin-top: 0 !important; }
.checkbox-custom.mgb-0 { margin-bottom: 0 !important; }
.checkbox-custom.mgr-0 { margin-right: 0 !important; }
.checkbox-custom label.label-text { font-size:14px; color: var(--black-color); font-weight: 500; line-height: 20px; min-height: 20px; user-select: none; padding-left: 30px !important; }
.checkbox-custom label.label-text.pdl-35p { padding-left: 35px !important; }
.checkbox-custom > input:first-child + label:before { border: 1px solid var(--light-border-color); border-radius: 4px; background: #fff; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); width: 20px; height: 20px; left: 0; margin: 0 !important; }
.checkbox-custom > input:first-child:not(:checked):not(:disabled):hover + label:before,
.checkbox-custom > input:first-child:not(:checked):not(:disabled):focus + label:before { border-color: var(--sky-color); border-width: 1px; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); /* box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); */ }
.checkbox-custom > input:first-child:checked + label:before { background-color: var(--blue-color); border-color: var(--blue-color); }
.checkbox-custom > input:first-child:checked + label:after { height: 12px; top: -2px; left: -1px; }

.checkbox-custom > input:first-child:disabled + label.label-text { opacity: 1; }

.checkbox-custom.checkstyle { padding-left: 18px; }
.checkbox-custom.checkstyle:before { width: 3px; height: 20px; border-radius: 1.5px; content: ''; left: 0px; position: absolute; top: 0; bottom: 0; margin: auto 0; background: var(--sky-color); }
.checkbox-custom.checkstyle.green-style:before { background: var(--green-color); }
.checkbox-custom.checkstyle.pink2-style:before { background: var(--pink2-color); }
.checkbox-custom.click-disable { pointer-events: none; cursor: default; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/* Pink Checkbox */
/* .icheck-pink.checkbox-custom > input:first-child:not(:checked):not(:disabled):hover + label:before,
.icheck-pink.checkbox-custom > input:first-child:not(:checked):not(:disabled):focus + label:before { border-color: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); } */
.icheck-pink.checkbox-custom > input:first-child:checked + label:before { background-color: var(--pink-color); border-color: var(--pink-color); }

/* Pink2 Checkbox */
.icheck-pink2.checkbox-custom > input:first-child:checked + label:before { background-color: var(--pink2-color); border-color: var(--pink2-color); }

/* Green Checkbox */
.icheck-green.checkbox-custom > input:first-child:checked + label:before { background-color: var(--green-color); border-color: var(--green-color); }

/* Radio Box */
.radio-custom { margin: 5px 20px 5px 0 !important; display: inline-block; min-height: 20px; }
.radio-custom.mg-0 { margin: 0 !important; }
.radio-custom.mgt-0 { margin-top: 0 !important; }
.radio-custom.mgb-0 { margin-bottom: 0 !important; }
.radio-custom.mgr-0 { margin-right: 0 !important; }
.radio-custom label.label-text { font-size:15px; color: var(--black-color); font-weight: 500; line-height: 20px; min-height: 20px; }
.radio-custom > input:first-child + label:before { border: 1px solid var(--light-border-color); border-radius: 4px; background: #fff; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); width: 20px; height: 20px; }
.radio-custom.radio-custom-type-checkbox > input:first-child + label:before { border-radius: 50%; }
.radio-custom > input:first-child:not(:checked):not(:disabled):hover + label:before,
.radio-custom > input:first-child:not(:checked):not(:disabled):focus + label:before { border-color: var(--sky-color) !important; border-width: 1px; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); }
.radio-custom > input:first-child:checked + label:before { background-color: #fff; border-color: var(--light-border-color) !important; }
.radio-custom > input:first-child:checked + label:after { /* height: 12px; top: -2px; left: -1px; */ border-color: transparent; border-radius: 50%; transform:inherit; top: 4px; left: 4px; width: 12px; height: 12px; background-color: var(--blue-color); }
.radio-custom.click-disable { pointer-events: none; cursor: default; -moz-user-select: none; -ms-user-select: none; user-select: none; }

/* Pink Radiobox */
/* .icheck-pink.radio-custom > input:first-child:not(:checked):not(:disabled):hover + label:before,
.icheck-pink.radio-custom > input:first-child:not(:checked):not(:disabled):focus + label:before { border-color: var(--pink-color) !important; box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); } */
.icheck-pink.radio-custom > input:first-child:checked + label:after { background-color: var(--pink-color); }

/* Green Radiobox */
.icheck-green.radio-custom > input:first-child:checked + label:after { background-color: var(--green-color); }

/* Pink2 Radiobox */
.icheck-pink2.radio-custom > input:first-child:checked + label:after { background-color: var(--pink2-color); }

/* Switch */
.switch-main { display: inline-flex; margin: -1px 0 0 0; padding: 0; width: auto; vertical-align: middle; cursor: pointer; }
.switch-main > div { display: inline-flex; }
.switch-main .label-text { display: inline-flex; white-space: nowrap; line-height: 20px; padding-right: 10px; color: var(--black-color); font-size: 14px; font-weight: 500; }
.switch-main .react-switch-bg { background: var(--blue-color) !important; height: 20px !important; width: 40px !important; }
.switch-main .switch-disable .react-switch-bg { background: #bac1e7 !important; }
.switch-main .react-switch-bg > div { height: 20px !important; width: 20px !important; background: url(../images/switch-check.svg) center center no-repeat; background-size: 14px 14px; }
.switch-main .react-switch-bg > div svg { opacity: 0; }
.switch-main .switch-disable .react-switch-bg > div { background-image: url(../images/switch-x.svg); }
.switch-main .react-switch-handle { width: 12px !important; height: 12px !important;/*  box-shadow: none !important; */ top: 4px !important; transform: translateX(24px) !important; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.33) !important; }
.switch-main .switch-disable .react-switch-handle { transform: translateX(4px) !important; box-shadow: 0px 1px 4px 0px rgba(38, 61, 183, 0.33) !important; }

.switch-main.lock-switch,
.switch-main.lock-switch .switch-active { cursor: default; pointer-events: none; }
.switch-main.lock-switch .react-switch-bg { background: var(--light-bg-hvr-color) !important; cursor: default; pointer-events: none; }
.switch-main.lock-switch .react-switch-bg > div { height: 20px !important; width: 20px !important; background: url(../images/switch-lock.svg) 4px 50% no-repeat; background-size: 16px 16px; }

/* New */
body .switch { padding: 0; margin: 0; width: 40px; min-width: 40px; height: 20px; display: inline-flex; vertical-align: middle; }
body .slider.round { background: #bac1e7; }
body input:checked + .slider.round { background: var(--blue-color); }
body input:checked + .slider.round:before { left: -2px; }
body .switch .slider.round:before { width: 12px; height: 12px; left: 4px; box-shadow: 0 1px 4px 0 rgba(38,61,183,.33) !important; }
body .slider.round:after { background: url(../images/switch-x.svg) center center no-repeat; background-size: 14px 14px; width:14px; height:14px; position: absolute; right: 4px; top: 3px; content: ''; -webkit-transition: .4s; transition: .4s; }
body input:checked + .slider.round:after { background-image: url(../images/switch-check.svg); left:4px; right:auto; }
body .switch-lock input:checked + .slider.round:after { background-image: url(../images/switch-lock.svg); left:4px; right:auto; }
body .switch-lock input:checked + .slider.round { background: var(--light-bg-hvr-color); pointer-events: none !important; cursor: auto !important; user-select: none !important; }
body .switch-lock input + .slider.round:after { background-image: url(../images/switch-lock.svg); right:4px; left:auto; }
body .switch-lock input + .slider.round { background: var(--light-bg-hvr-color); pointer-events: none !important; cursor: auto !important; user-select: none !important; }
body .switch-lock { pointer-events: none !important; cursor: auto !important; user-select: none !important; }

/* Toast Message */
.Toastify__toast--success .Toastify__toast-icon svg { fill: var(--green-color) !important; }
.Toastify__toast--success .Toastify__progress-bar--success { background: var(--green-color); }

.Toastify__toast-container { width: 100%; max-width: 420px; }
.Toastify__toast-icon { width: 32px; height: 32px; margin-right: 10px; background: url(../images/done-green.svg) center center no-repeat; background-size: 32px 32px; position: absolute; left: 0; top: 0; }
.Toastify__toast-icon svg { opacity: 0; }
.Toastify__toast { padding: 5px 45px 13px 5px; border-radius: 6px; background: #262626; min-height: 50px; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); }

.Toastify__toast-body { padding: 4px 0 4px 44px; min-height: 32px; margin: 0; font-family: 'DM Sans', sans-serif; font-weight:500; font-size: 16px; line-height: 21px; color: #fff; display: block; position: relative; }
.Toastify__close-button { width: 32px; height: 32px; position: absolute; right: 3px; top: 3px; background: url(../images/x-white.svg) center center no-repeat; background-size: 20px; opacity: 0.66; }
.Toastify__close-button svg { opacity: 0; }
.Toastify__close-button:hover { opacity: 1; }
body .Toastify__toast .Toastify__progress-bar,
.Toastify__progress-bar { border-radius: 2px !important; height: 4px; bottom: 3px; left: 3px; width: calc(100% - 6px); }

.Toastify__toast--error .Toastify__toast-icon { background-image: url(../images/alert-red.svg); }
.Toastify__progress-bar--error { background: var(--danger-color); }

/* New */
body .jq-toast-wrap { width: 100%; max-width: 415px; }
body .jq-toast-single { padding: 9px 45px 20px 50px; border-radius: 6px; background: #262626; min-height: 50px; border-left:5px solid #262626; border-right:5px solid #262626; box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); font-family: 'DM Sans', sans-serif; font-weight:500; font-size: 16px; line-height: 21px; color: #fff; }
body .jq-toast-single:before { width: 32px; height: 32px; background: url(../images/done-green.svg) center center no-repeat; background-size: 32px 32px; position: absolute; left: 5px; top: 5px; content: ''; }
body .jq-toast-single .jq-toast-loader { top:auto; bottom: 3px; height: 4px; border-radius: 4px; /* left:5px; width: calc(100% - 10px); */ }
body .jq-toast-single .close-jq-toast-single { width: 32px; height: 32px; position: absolute; right: 3px; top: 3px; background: url(../images/x-white.svg) center center no-repeat; background-size: 20px; opacity: 0.66; font-size: 0; }
body .jq-toast-single .close-jq-toast-single:hover,
body .jq-toast-single .close-jq-toast-single:active { opacity: 1; }
body .jq-toast-single.jq-icon-success .jq-toast-loader { background-color: var(--green-color) !important; }
body .jq-toast-single.jq-icon-warning .jq-toast-loader { background-color: var(--danger-color) !important; }
body .jq-toast-single.jq-icon-warning:before { background-image: url(../images/alert-red.svg); }

/* Tooltip */
/* Start Tooltip */
body .tooltip { font-size: 14px; line-height: 18px; font-family: 'DM Sans', sans-serif; font-weight: 500; opacity: 1 !important; z-index: 9999; }
body .tooltip .tooltip-inner { background-color: var(--black-color); padding: 2px 8px; overflow-wrap: break-word; word-wrap: break-word; font-family: 'DM Sans', sans-serif; font-weight: 500; white-space: nowrap; max-width: inherit; }
body .tooltip.bottom { margin-top: 2px; /* Arrow Remove */ /* padding: 0; */ }
body .tooltip.bottom .tooltip-arrow { /* border-bottom-color:var(--black-color); */ /* Arrow Remove */ /* display: none; */ }
body .tooltip.bottom .tooltip-arrow { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-225deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; top: 1px; margin-left: -4px; }

/* Top */
body .tooltip.top { margin-bottom: 2px; margin-top: 0; /* Arrow Remove */ /* padding: 0; */ }
body .tooltip.top .tooltip-arrow { /* border-top-color: var(--black-color); */ /* Arrow Remove */ /* display: none; */ }
body .tooltip.top .tooltip-arrow { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-45deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; bottom: 1px; margin-left: -4px; }

/* Right */
body .tooltip.right { margin-left:2px; margin-right: 0; /* Arrow Remove */ /* padding: 0; */ }
body .tooltip.right .tooltip-arrow { border-right-color:var(--black-color); /* Arrow Remove */ /* display: none; */ }
body .tooltip.right .tooltip-arrow { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(45deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; left: 1px; margin-top: -4px; }

/* Left */
body .tooltip.left { margin-right:2px; margin-left: 0; /* Arrow Remove */ /* padding: 0; */ }
body .tooltip.left .tooltip-arrow { border-left-color:var(--black-color); /* Arrow Remove */ /* display: none; */ }
body .tooltip.left .tooltip-arrow { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-135deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; right: 1px; margin-top: -4px; }

body .tooltip-custom300 ~ .tooltip .tooltip-inner { max-width: 300px; text-align: left; }


/* body .my-tooltip { background: var(--black-color); border-radius: 6px; font-size: 14px; line-height: 18px; font-weight: 500; padding: 1px 8px; font-family: 'DM Sans', sans-serif; z-index: 9999 !important; white-space: nowrap; } */
body .my-tooltip .pro-dsc-tip { padding: 8px 8px; }
body .my-tooltip .pro-dsc-tip p { margin: 0 0 3px 0; }
body .my-tooltip .cancel-re-dsc-tip { padding: 3px 3px; }

body .my-tooltip.big-tooltip { width: 100%; max-width: 555px; padding: 10px 15px; word-wrap: break-word; white-space: normal; }
body .my-tooltip.big-tooltip.w300 { max-width: 300px; }
body .my-tooltip.big-tooltip.w360 { max-width: 360px; }
body .my-tooltip.big-tooltip.w480 { max-width: 480px; }
body .my-tooltip.big-tooltip.w900 { max-width: 900px; }
body .my-tooltip.big-tooltip.w1000 { max-width: 1000px; }
/*body .my-tooltip.big-tooltip.w-auto { width: auto; max-width: 555px; }*/
body .my-tooltip.big-tooltip.w-auto { max-width: 400px; }
body .my-tooltip.big-tooltip.w-auto2 { max-width: 400px; }
body .my-tooltip.big-tooltip.w-auto-300 { width: auto; max-width: 300px; }
body .my-tooltip.chk25-charcter { width: 100%; max-width: 400px; padding: 5px 10px; word-wrap: break-word; white-space: normal; }
body .my-tooltip p { padding: 0; margin: 0 0 10px 0; }
/* body .my-tooltip p:last-child { margin-bottom: 0; } */
body .my-tooltip ul { padding: 0px 0 10px 0; margin: 0; width: 100%; }
body .my-tooltip ul li { font-size: 14px; color: #fff; line-height: 20px; font-weight: 500; padding: 0px 0 0px 9px; margin: 0; display: block; vertical-align: middle; position: relative; }
body .my-tooltip ul li:before { content: '•'; position: absolute; left: 0; }
body .my-tooltip ul.numeric-list { counter-reset: num -1; }
body .my-tooltip ul.numeric-list li { padding-left: 15px; }
body .my-tooltip ul.numeric-list li:before { counter-increment: num; content: counter(num) ". "; }
body .my-tooltip ul li .tip-right-arrow { top: -1px; position: relative; } 
body .my-tooltip ul li.no-bull { padding-left: 0; }
body .my-tooltip ul li.no-bull:before { opacity: 0; }
body .my-tooltip ul.no-bull li { padding-left: 0; }
body .my-tooltip ul.no-bull li:before { opacity: 0; }

body .my-tooltip.user-tooltip { width: auto; }
body .my-tooltip.user-tooltip ul { padding: 0; margin: 0; }
body .my-tooltip.user-tooltip ul li { font-size: 15px; line-height: 20px; font-weight: 500; color: #fff; padding : 0 0 7px 0 !important; margin: 0; padding:0; }
body .my-tooltip.user-tooltip ul li.top-line { border-top: 2px dotted rgba(255, 255, 255, 0.2); padding-top: 8px !important; }
body .my-tooltip.user-tooltip ul li:last-child { padding-bottom: 0 !important; }
body .my-tooltip.user-tooltip ul li:before { opacity:0; }

body .my-tooltip.contact-tooltip { width: 100%; max-width: 360px; padding: 15px; white-space: inherit; }
body .my-tooltip.billing-shipping-address-tooltip { width: 100%; max-width: 300px; padding: 15px; white-space: inherit; }
body .my-tooltip .billing-shipping-address { padding: 0; }
body .my-tooltip .billing-shipping-address li { color: #fff; font-size: 15px; line-height: 21px; padding: 0 0 11px 0; }
body .my-tooltip .billing-shipping-address li:last-child { padding-bottom: 0; }
body .my-tooltip .billing-shipping-address li.icon { padding-left: 25px; min-height: 21px; }
body .my-tooltip .billing-shipping-address li a { color: #fff; }
body .my-tooltip .billing-shipping-address li a:hover { color: #bebebe; }
body .my-tooltip .billing-shipping-address li:before { opacity: 0; }
body .my-tooltip .billing-shipping-address li.icon .feather { color: #bebebe; }

body .my-tooltip.place-bottom { margin-top: 0px; }
body .my-tooltip.show { opacity: 1; }
body .my-tooltip.place-bottom:before { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-225deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; top: -5px; margin-left: -4px; }
body .my-tooltip.place-bottom:after { opacity: 0; }

body .my-tooltip.place-top { margin-top: -2px; }
body .my-tooltip.place-top:before { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-45deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; bottom: -5px; margin-left: -4px; }
body .my-tooltip.place-top:after { opacity: 0; }

body .my-tooltip.place-left { margin-left: -2px; }
body .my-tooltip.place-left:before { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-135deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; right: -5px; margin-top: -4px; }
body .my-tooltip.place-left:after { opacity: 0; }

body .my-tooltip.place-right { margin-left: 0; }
body .my-tooltip.place-right:before { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(45deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; left: -5px; margin-top: -4px; }
body .my-tooltip.place-right:after { opacity: 0; }

/* Tooltip shared base styles */
.c-tooltip { position: absolute; z-index: 2; overflow: hidden; clip: rect(0,0,0,0); box-sizing: border-box; width: 0; height: 0; padding: 0; cursor: default; color: #fff; font-size: 14px; line-height: 18px; font-weight: 500; font-family: 'DM Sans', sans-serif; text-align: center; white-space: nowrap; background-color: var(--black-color); opacity: 0; transition: opacity .3s ease-in .3s; border-radius: 6px; }

.c-tooltip .c-tooltip-inn { position: relative; padding-left: 20px; text-align: left; margin: 2px 0; }
.c-tooltip .c-tooltip-inn .feather { width: 16px; height: 16px; position: absolute; left: 0; top: -3px; }

.c-tooltip .c-tooltip-inn.copied { display: none; visibility: hidden; }
.c-my-tooltip.show .c-tooltip .c-tooltip-inn.copied { display: inline-block; visibility: visible; }
.c-my-tooltip.show .c-tooltip .c-tooltip-inn.copy { display: none; visibility: hidden; }

/* Tooltip visibility class toggled by jQuery */
.c-my-tooltip { position: relative; }
.c-my-tooltip:active .c-tooltip,
.c-my-tooltip:hover .c-tooltip { overflow: visible; clip: auto; width: auto; height: auto; padding: 1px 8px; opacity: 1; }

/* Tooltip positioning */
/** Common styles: Horizontally Centered **/
.c-tooltip, /*** Default is equivalent to .tip-bottom ***/
.c-tooltip.tip-bottom,
.c-tooltip.tip-top { left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); }
/** Common styles: Bottom positions **/
.c-tooltip, /*** Default is equivalent to .tip-bottom ***/
.c-tooltip.tip-bottom,
.c-tooltip.tip-bottom-left,
.c-tooltip.tip-bottom-right { top: 110%; top: calc(100% + 5px); }
/** Common styles: Top positions **/
.c-tooltip.tip-top,
.c-tooltip.tip-top-left,
.c-tooltip.tip-top-right { top: auto; bottom: 110%; bottom: calc(100% + 5px); }
/** Common styles: Corner positions **/
.c-tooltip.tip-bottom-left,
.c-tooltip.tip-bottom-right,
.c-tooltip.tip-top-left,
.c-tooltip.tip-top-right { -webkit-transform: none; -ms-transform: none; transform: none; }
/** Common styles: Left corner positions **/
.c-tooltip.tip-bottom-left,
.c-tooltip.tip-top-left { right: 50%; left: auto; margin-right: -25px; }
/** Common styles: Right corner positions **/
.c-tooltip.tip-bottom-right,
.c-tooltip.tip-top-right { margin-left: -25px; }
/** Common styles: Vertically Centered **/
.c-tooltip.tip-left,
.c-tooltip.tip-right { top: 50%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); }
/** Left position only **/
.c-tooltip.tip-left { right: 110%; right: calc(100% + 5px); left: auto; }
/** Right position only **/
.c-tooltip.tip-right { left: 110%; left: calc(100% + 5px); }
/* Tooltip arrow shared base styles */
.c-tooltip:after { content: ' '; display: block; position: absolute; width: 0; height: 0; border-width: 6px; border-style: solid; pointer-events: none; }
/** Common styles: Horizontally Centered, Up/Down arrows **/
.c-tooltip:after, /*** Default is equivalent to .tip-bottom:after; ***/
.c-tooltip.tip-bottom:after,
.c-tooltip.tip-top:after { left: 50%; margin-left: -6px; }
/** Common styles: Up arrow **/
.c-tooltip:after, /*** Default is equivalent to .tip-bottom:after; ***/
.c-tooltip.tip-bottom:after,
.c-tooltip.tip-bottom-left:after,
.c-tooltip.tip-bottom-right:after { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-225deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; top: -4px; margin-left: -4px; }
/** Common styles: Down arrow **/
.c-tooltip.tip-top:after,
.c-tooltip.tip-top-left:after,
.c-tooltip.tip-top-right:after { width: 8px; height: 8px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(-45deg) !important; border-radius: 0 0 0 5px; background: var(--black-color); position: absolute; content: ''; border: none; top: auto; bottom: -4px; margin-left: -4px; }
/** Common styles: Left-/Right-aligned, Up/Down arrows **/
.c-tooltip.tip-bottom-left:after,
.c-tooltip.tip-bottom-right:after,
.c-tooltip.tip-top-left:after,
.c-tooltip.tip-top-right:after { margin-left: 0; }
/** Common styles: Right-aligned, Up/Down arrows **/
.c-tooltip.tip-bottom-left:after,
.c-tooltip.tip-top-left:after { right: 15px; left: auto; }
/** Common styles: Left-aligned, Up/Down arrows **/
.c-tooltip.tip-bottom-right:after,
.c-tooltip.tip-top-right:after { left: 15px; }
/** Common styles: Vertically Centered, Left/Right arrows **/
.c-tooltip.tip-left:after,
.c-tooltip.tip-right:after { top: 50%; margin-top: -6px; margin-left: auto; }
/** Right arrow **/
.c-tooltip.tip-left:after { right: -12px; left: auto; border-color: transparent transparent transparent var(--black-color); }
/** Left arrow **/
.c-tooltip.tip-right:after { left: -12px; border-color: transparent var(--black-color) transparent transparent; }


/* Custom Tooltip */
.custom-tooltip { display: inline-block; max-width: 555px !important; white-space: pre-wrap !important; }
.custom-tooltip .dropdown-menu { transform:inherit; inset:inherit !important; border: none; box-shadow: none; margin-top: -10px !important; border-radius: 6px; background: var(--tundora-bg); min-width: 300px; transform: translate(26px, -50%) !important; transition: inherit !important; font-size: 14px; line-height: 18px; font-weight: 500; font-family: 'DM Sans', sans-serif; }
.custom-tooltip .dropdown-menu p { padding: 0; margin: 0 0 10px 0; }
.custom-tooltip .dropdown-menu.max-w300 { max-width: 300px; }
.custom-tooltip .dropdown-menu:before { width: 10px; height: 10px; clip-path: polygon(0% 0%, 100% 100%, 0% 100%); transform: rotate(45deg) !important; border-radius: 0 0 0 5px; background: var(--tundora-bg); position: absolute; content: ''; border: none; left: -5px; margin-top: -5px; top: 50%; }

.custom-tooltip .dropdown-menu[x-placement="bottom-end"],
.custom-tooltip .dropdown-menu[x-placement="top-end"] { transform: translate(-50%, -50%) !important; margin-left: -150px !important; }
.custom-tooltip .dropdown-menu[x-placement="bottom-end"]:before,
.custom-tooltip .dropdown-menu[x-placement="top-end"]:before { transform: rotate(-135deg) !important; left: auto; right: -5px; }

.custom-tooltip .dropdown-menu[x-placement="bottom-start"] { transform: translate(0%, 12px) !important; margin-left: -140px !important; }
.custom-tooltip .dropdown-menu[x-placement="bottom-start"]:before { transform: rotate(135deg) !important; left: 50%; margin-left: -5px; top: 0px; }

.custom-tooltip .dropdown-menu ul.billing-shipping-address { padding: 15px; margin: 0; width: 100%; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li { color: #fff; font-size: 15px; line-height: 21px; padding: 0 0 10px 0; margin: 0; position: relative; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li:last-child { padding-bottom: 0; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li.address { padding-bottom: 7px; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li.icon { padding-left: 25px; min-height: 21px; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li.icon .feather { position: absolute; left: 0; color: #bebebe; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li a { color: #fff; }
.custom-tooltip .dropdown-menu ul.billing-shipping-address li a:hover { color: #bebebe; }

.custom-tooltip .tab-content>.tab-pane { padding: 10px 0px 15px 0px; }
.custom-tooltip .tab-content>.tab-pane ul.billing-shipping-address { padding: 0; }

.custom-tooltip:hover .dropdown-menu,
.custom-tooltip:active .dropdown-menu { opacity: 1; visibility: visible; display: block !important; }

.tipsm { max-width: 100px; }

.react-confirm-alert-overlay { z-index: 1001; }
.react-confirm-alert-body { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-radius:6px; border:1px solid var(--light-border-color); padding: 15px; text-align: center; font-size: 15px; font-family: 'DM Sans', sans-serif; font-weight:500; color: #707d8a; }
.react-confirm-alert-body h1 { padding-bottom: 2px; font-size: 20px; }
.react-confirm-alert-button-group { justify-content: center; margin-top: 15px; }
.react-confirm-alert-button-group > button { background: var(--blue-color); color: #fff; padding:6px 15px 6px 15px; margin:0 10px 5px 0; font-size:14px; font-weight: 500; border-radius:4px; line-height:18px; border:none; box-shadow:none !important; display: inline-block; float: none; }
.react-confirm-alert-button-group > button:hover { background: var(--blue-bg-hvr-color); }

/* Tab Menu */
.react-tabs__tab-list { width: 100%; border-bottom: 2px solid var(--catskill-white); padding: 0 15px; display: table; margin: 0; }
.react-tabs__tab-list li { display: table-cell; text-align: center; padding: 8px 12px; margin: 0; bottom: -2px; border-radius: 0; color: #707d8a; font-weight: 500; line-height: 18px; font-size: 15px; border: none; /* border-bottom: 2px solid var(--catskill-white); */ box-shadow: none !important; vertical-align: middle; }
.react-tabs__tab-list li:before { width: 0; height: 2px; content: ''; background: var(--blue-color); position: absolute; left: 0; bottom: 0; -webkit-transition: width 0.5s, height 4s; transition: width 0.5s, height 4s; }
.react-tabs__tab-list li.react-tabs__tab--selected:before { width: 100%; }
.react-tabs__tab-list li.react-tabs__tab--selected { /* border-bottom-color: var(--blue-color); */ color: #495057; }
.react-tabs__tab-panel { padding: 15px 0 0 0; }

/*  */
/* .tab-menu2 {  } */
.tab-menu2 .nav { width: 100%; display: flex; flex-direction: inherit !important; background: var(--athens-gray); border-radius: 6px; padding: 5px !important; margin: 0; /* max-width: 500px; overflow: auto; flex-wrap: nowrap; */ }
.tab-menu2 .nav.no-wprap { flex-wrap: nowrap; }
/* .tab-menu2 .nav::-webkit-scrollbar { width: 0px; height: 0px; } */
.tab-menu2 .horizontal-menu { display: flex; flex-direction: inherit !important; background: var(--athens-gray); border-radius: 6px; padding: 0 5px; margin: 0; }
.tab-menu2 .horizontal-menu .scroll-menu-arrow { padding: 0; }
.tab-menu2 .horizontal-menu .scroll-menu-arrow.scroll-menu-arrow--disabled { pointer-events: none; cursor: default; opacity: 0.5; }
.tab-menu2 .horizontal-menu .scroll-menu-arrow .slider-arrow { width: 24px; border-radius: 6px; height: 30px; color: var(--light-color); padding: 5px 2px; }
.tab-menu2 .horizontal-menu .scroll-menu-arrow .slider-arrow:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }

.tab-menu2 .horizontal-menu .menu-wrapper { display: flex; padding: 0 10px; }
.tab-menu2 .horizontal-menu .menu-wrapper--inner { text-align: center !important; }
.tab-menu2 .horizontal-menu .menu-item-wrapper { padding: 5px 0; }
.tab-menu2 .horizontal-menu .menu-item { margin: 0; border-radius: 6px; font-size: 14px; color: var(--light-color); font-weight: 500; padding: 2px 5px; min-width: 180px; text-align: center; border: none; }
.tab-menu2 .horizontal-menu .menu-item:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }
.tab-menu2 .horizontal-menu .menu-item.active { background: #fff; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); }
.tab-menu2 .horizontal-menu .menu-item span { padding: 3px 10px; position: relative; display: inline-block; }
.tab-menu2 .horizontal-menu .menu-item span:before { opacity: 0; height: 3px; background: var(--sky-color); content: ''; width: 2px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: 0; transition: width 0.5s, height 4s; border-radius: 2px 2px 0 0; }
.tab-menu2 .horizontal-menu .menu-item.active span:before { width: 100%; opacity: 1; }

.tab-menu2.month-tab-accordion .horizontal-menu .menu-item { min-width: 121px; }
.tab-menu2.month-tab-accordion .horizontal-menu { border-radius: 0; }

.tab-menu2 .nav .nav-item { flex-grow: 1; vertical-align: middle; padding: 0; margin: 0; text-align: center; border: none !important; }
.tab-menu2 .nav .nav-item .nav-link { display: block; border-radius: 4px; font-size: 14px; line-height: 16px; color: var(--light-color); font-weight: 500; padding: 4px 5px; }
.tab-menu2 .nav .nav-item .nav-link:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }
.tab-menu2 .nav .nav-item .nav-link.active,
.tab-menu2 .nav .nav-item .nav-link.active:focus { box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12) !important; background: #fff; color: var(--black-color); }
.tab-menu2 .nav .nav-item .nav-link span { padding: 3px 10px; position: relative; display: inline-block; }
.tab-menu2 .nav .nav-item.nav-icon .nav-link span { padding-left: 38px; }
.tab-menu2 .nav .nav-item.nav-icon .nav-link span .feather { position: absolute; left: 10px; width: 20px; top: 2px; }
.tab-menu2 .nav .nav-item.nav-icon .nav-link span .feather svg { width: 20px; }
.tab-menu2 .nav.col-2-item .nav-item { width: 50%; }
.tab-menu2 .nav .nav-item .nav-link span:before { opacity: 0; height: 3px; background: var(--sky-color); content: ''; width: 3px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: -2px; transition: width 0.5s, height 4s; border-radius: 2px 2px 0 0; }
.tab-menu2 .nav .nav-item .nav-link.active span:before { width: 100%; opacity: 1; }

.tab-menu2.tab-menu-small .nav { padding: 4px; }
.tab-menu2.tab-menu-small .nav .nav-item .nav-link { padding-top: 0; padding-bottom: 0; }
.tab-menu2.tab-menu-small .nav .nav-item.disabled .nav-link,
.tab-menu2.tab-menu-small .nav .nav-item.disabled { pointer-events: none; }
.tab-menu2.tab-menu-small .nav .nav-item .nav-link span { padding-left: 5px; padding-right: 5px; }
.tab-menu2.tab-menu-small .nav .nav-item .nav-link span:before { height: 2px; border-radius: 0; bottom: 1px; }

.tab-menu2.month-tab-accordion .horizontal-menu { display: inherit; padding: 0; }
/* .tab-menu2.month-tab-accordion .slick-list { padding: 0 35px; } */
.tab-menu2.month-tab-accordion .slick-slider { padding: 0 35px; }
.tab-menu2.month-tab-accordion .tab-menu-arrow { position: absolute; left: 5px; top: 5px; z-index: 3; width: 24px; height: 30px; background: var(--aqua-haze-bg-color) !important; color: #363740 !important; }
.tab-menu2.month-tab-accordion .tab-menu-arrow.tab-menu-arrow-right { left: auto; right: 5px; }
.tab-menu2.month-tab-accordion .tab-menu-arrow.slick-disabled { pointer-events: none; color: var(--light-border-color) !important; }
.tab-menu2.month-tab-accordion .tab-menu-arrow:hover { background: var(--geyser-gray) !important; }

/* tab-menu3 */
.tab-menu3 { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; background: var(--athens-gray); border-radius: 6px; padding: 0 5px; margin: 0; }
.tab-menu3 .react-tabs__tab { flex: 1 1 auto; margin: 5px 0px; border-radius: 6px; font-size: 14px; color: var(--light-color); font-weight: 500; padding: 2px 5px; text-align: center; border: none; }
.tab-menu3 .react-tabs__tab:hover,
.tab-menu3 .react-tabs__tab:active { background: var(--aqua-haze-bg-color); color: var(--black-color); }
.tab-menu3 .react-tabs__tab.react-tabs__tab--selected { background: #fff; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); }
.tab-menu3 .react-tabs__tab span { padding: 3px 10px; position: relative; display: inline-block; }
.tab-menu3 .react-tabs__tab span:before { opacity: 0; height: 3px; background: var(--sky-color); content: ''; width: 2px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: 0; transition: width 0.5s, height 4s; border-radius: 2px 2px 0 0; }
.tab-menu3 .react-tabs__tab.react-tabs__tab--selected span:before { width: 100%; opacity: 1; }
.main-tab-menu3 .react-tabs__tab-panel { margin: 0; }

/* tab-menu4 */
.tab-menu4 { padding: 0 15px; }
.tab-menu4 .nav { width: 100%; display: flex; flex-direction: inherit !important; background: none; border-radius: 0px; padding: 0px; margin: 0; /* max-width: 500px; overflow: auto; flex-wrap: nowrap; */ border-bottom: 2px solid rgba(255, 255, 255, 0.10); }
.tab-menu4 .nav.no-wprap { flex-wrap: nowrap; }

.tab-menu4 .nav .nav-item { flex-grow: 1; vertical-align: middle; padding: 0; margin: 0; text-align: center; border: none !important; }
.tab-menu4 .nav .nav-item .nav-link { display: block; border-radius: 0px; font-size: 14px; line-height: 16px; color: rgba(255, 255, 255, 0.33); font-weight: 500; padding: 8px 12px; position: relative; }
.tab-menu4 .nav .nav-item .nav-link:hover { color: #fff; }
.tab-menu4 .nav .nav-item .nav-link.active { background: none; color: #fff; }
.tab-menu4 .nav .nav-item .nav-link span { padding: 0; position: relative; display: inline-block; }
.tab-menu4 .nav .nav-item .nav-link:before { opacity: 0; height: 2px; background: #fff; content: ''; width: 3px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: -2px; transition: width 0.5s, height 4s; /* border-radius: 2px 2px 0 0; */ }
.tab-menu4 .nav .nav-item .nav-link.active:before { width: 100%; opacity: 1; }

/* Accordian */
.accordion-menu1 .accordion-item { border: none; }
/* .accordion-menu3 .accordion-item .accordion-button { background-color: transparent; border-radius: 0 !important; color: var(--black-color); font-size: 16px; font-weight: 500; padding: 7px 50px 7px 33px; min-height: 40px; position: relative; width: 100%; border: none; outline: none; text-align: left; border-bottom: 1px solid var(--light-border-color); box-shadow: none; } */
.accordion-menu1 .accordion-item .accordion-button { background-color: transparent; border-radius: 0 !important; width: 100%; text-align: left; border: 0; box-shadow: none; padding: 9px 15px 9px 42px; font-size: 16px; font-weight: 500; color: var(--black-color); position: relative; border: none; outline: none; text-align: left; border-bottom: 1px solid var(--light-border-color); box-shadow: none; }
.accordion-menu1 .accordion-item .accordion-button:after { display: none; }
.accordion-menu1 .accordion-item .accordion-button .feather { position: absolute; left: 15px; top: 12px; }
.accordion-menu1 .accordion-item .accordion-button .chevron-down { display: none; }

.accordion-menu1 .accordion-item .accordion-button:not(.collapsed) .chevron-right { /* Open */ display: none; }
.accordion-menu1 .accordion-item .accordion-button:not(.collapsed) .chevron-down { display: inline-flex; }

.accordion-menu1 .accordion-collapse { position:relative; height:0; transition:height .35s ease; }
.accordion-menu1 .accordion-collapse.show { height: auto; }
.accordion-menu1 .accordion-body { background: var(--aqua-haze-bg-color); padding: 10px 15px 1px 15px; }

.settings-main .accordion-body > .card { box-shadow: none; }
/*  */
/* .accordion-menu2 {  } */
.accordion-menu2 .accordion-item { border:2px solid transparent; margin-bottom: 15px; background:#fff; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); border-radius: 10px; }
.accordion-menu2 .accordion-item.show { border-color: var(--sky-color); }
.accordion-menu2 .accordion-item.active { border-color: var(--sky-color); }
.accordion-menu2 .accordion-item .accordion-button { box-shadow: none; background: none; border-radius: 6px 6px 0 0; border: 1px solid transparent; border-bottom: 1px dotted var(--light-border-color); min-height: 48px; padding: 9px 40px 9px 19px; font-size: 16px; font-weight: 500; color: var(--blue-color); position: relative; width: 100%; text-align: left; }
.accordion-menu2 .accordion-item .accordion-button.collapsed { border-color: transparent; }
.accordion-menu2 .accordion-item .accordion-button:after { display: none; }
.accordion-menu2 .accordion-item .accordion-button .up-down-icon { position: absolute; right: 15px; top: 13px; color: var(--light-color); }
.accordion-menu2 .accordion-item .accordion-button .chevron-down { display: none; }

.accordion-menu2 .accordion-item .accordion-button.collapsed .chevron-up { display: none; }
.accordion-menu2 .accordion-item .accordion-button.collapsed .chevron-down { display: inline-flex; }

.accordion-menu2 .accordion-collapse { position:relative; height:0; /* overflow:hidden; */ transition:height .35s ease; border: 1px solid transparent; border-top: none; border-radius: 0 0 6px 6px; }
.accordion-menu2 .accordion-collapse.show { height: auto; border-color: transparent; }
.accordion-menu2 .accordion-body { background:none; padding: 0; }

/* Custom */
.accordion-menu2-custom .accordion-header { position: relative; }
.accordion-menu2-custom .accordian-right-btn { top: 10px; }
.accordion-menu2-custom .accordian-right-btn:after { opacity: 0; }
.accordion-menu2-custom .accordion-item .accordion-collapse { height:0; max-height: 0; overflow: hidden; transition: max-height .9s cubic-bezier(0, 1, 0, 1); /* transition:max-height .35s ease; */ }
/* .accordion-menu2-custom .accordion-item.show .accordion-collapse { height: auto; max-height: 9999px; transition-timing-function: cubic-bezier(0.5, 0, 1, 0);  transition-delay: 0s; } */
.accordion-menu2-custom .accordion-item.show .accordion-collapse { height: auto; max-height: 9999px; transition: all 2.8s ease-in-out;}

.accordion-menu2-custom .accordion-item .accordion-button { border-bottom-color: transparent; }
.accordion-menu2-custom .accordion-item.show .accordion-button { border-bottom-color: var(--light-border-color); }
.accordion-menu2-custom .accordion-item .accordion-button .chevron-down { display: block; }

/* .accordion-menu3 */
.accordion-menu3 .accordion-item { border-radius: 0; border-color: transparent; border: none; box-shadow: none; margin: 0; /* border-bottom: 1px solid var(--light-border-color); */ }
.accordion-menu3 .accordion-item + .accordion-item { margin-top: 0; }
.accordion-menu3 .accordion-item.border-bottom-none { border-bottom-color: transparent; }
.accordion-menu3 .accordion-header { font-size: 16px; font-weight: 500; padding: 0; border: none !important; background: none; }
.accordion-menu3 .accordion-item .accordion-button { background-color: transparent; border-radius: 0 !important; color: var(--black-color); font-size: 16px; font-weight: 500; padding: 7px 50px 7px 33px; min-height: 40px; position: relative; width: 100%; border: none; outline: none; text-align: left; border-bottom: 1px solid var(--light-border-color); box-shadow: none; }
.accordion-menu3 .accordion-item .accordion-button:before { width: 3px; height: 20px; border-radius: 1.5px; content: ''; left: 15px; position: absolute; top: 0; bottom: 0; margin: auto 0; background: var(--sky-color); }
.accordion-menu3 .accordion-item.pink2-title>.accordion-header>.accordion-button:before { background: var(--pink2-color) !important; }
.accordion-menu3 .accordion-item.green-title>.accordion-header>.accordion-button:before { background: var(--green-color) !important; }
.accordion-menu3 .accordion-item .accordion-button:after {  content: ''; width: 120px; height: 1px; position: absolute; left: 0; bottom: -1px; transform:none; opacity: 0;
background: -moz-linear-gradient(left,  rgba(198,203,207,1) 0%, rgba(195,200,204,0) 100%);
background: -webkit-linear-gradient(left,  rgba(198,203,207,1) 0%,rgba(195,200,204,0) 100%);
background: linear-gradient(to right,  rgba(198,203,207,1) 0%,rgba(195,200,204,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c6cbcf', endColorstr='#00c3c8cc',GradientType=1 ); }
.accordion-menu3 .accordion-item .accordion-button:not(.collapsed):after { opacity: 1; }
.accordion-menu3 .accordion-item .accordion-button:not(.collapsed) { border-bottom: 1px dashed var(--light-border-color); }
.accordion-menu3 .accordion-item .accordion-button .accordion-status-count { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; width: 100%; }

.accordion-menu3 .accordion-item .accordion-button .up-down-icon { position: absolute; right: 15px; top: 10px; color: var(--light-color); }
.accordion-menu3 .accordion-item .accordion-button .chevron-down { display: none; }
.accordion-menu3 .accordion-item .accordion-button.collapsed .chevron-up { display: none; }
.accordion-menu3 .accordion-item .accordion-button.collapsed .chevron-down { display: inline-flex; }
.accordion-menu3 .accordion-item .accordion-button.collapsed { /* border-bottom: 1px solid var(--light-border-color); */ }

.accordion-menu3 .accordion-item.border-bottom-none .accordion-button.collapsed { border-bottom-color: transparent; }

.accordion-menu3 .accordion-collapse { position:relative; /* height:auto !important; */ transition:height .35s ease; display: block !important; border: none; border-bottom: 1px solid transparent; border-radius: 0 !important; overflow: hidden; }
.accordion-menu3 .accordion-collapse.in { /* height: 0 !important; */ border-bottom-color: var(--light-border-color); overflow: inherit; /* display: block !important; */ }
/* .accordion-menu3.sub-accordion .sub-accordion-container { border-bottom-color: #0000; } */
.accordion-menu3.sub-accordion .sub-accordion-container { padding-left: 15px !important; padding-right: 15px !important; }
/* .accordion-menu3.sub-accordion .sub-accordion-container .accordion:last-child .accordion-collapse {  border-bottom-color: #0000;  } */
/* .accordion-menu3.sub-accordion .sub-accordion-container .accordion .accordion-item { margin-bottom: -3px; } */
.accordion-menu3.sub-accordion .sub-accordion-container .accordion:last-child .accordion-item { margin-bottom: -3px; }
.accordion-menu3.sub-accordion .sub-accordion-container .accordion:last-child .accordion-item:has(.accordion-collapse.in) { margin-bottom: -2px !important; }
.accordion-menu3.sub-accordion .sub-accordion-container .accordion .accordion-item .accordion-collapse { margin-bottom: 1px; }
.accordion-menu3 .accordion-item.border-bottom-none .accordion-collapse { border-width: 0; }
.accordion-menu3 .accordion-body { padding: 0; }
.accordion-menu3 .accordion-body-inn { padding: 15px 15px 0 15px; }

/* Sub Accordian Start */
.sub-accordion-main { padding-left: 15px; padding-right: 15px; width: 100%; }
.sub-accordion-main .sub-accordion1 .accordion-collapse { position: relative; }
.sub-accordion-main .sub-accordion1 .accordion-collapse:before { width: 2px; height: 0; content: ''; left: -15px; bottom: 0; margin: auto 0; top: -40px; background: var(--sky-color); position: absolute; transition: height 0.2s ease; }
.sub-accordion-main .sub-accordion1 .accordion-collapse.collapse:before { height: calc(100% + 40px); transition: height 0.2s ease; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button:not(.collapsed) { border-bottom-width: 1px; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button:after { opacity: 0; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button:before { opacity: 0; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button { padding-left: 44px; padding-right: 0; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button .accordion-up-down-btn { width: 32px; height: 24px; position: absolute; left: 0; top: 7.5px; background: var(--sky-color); color: #fff; border-radius: 6px; display: inline-flex; justify-content: center; align-items: center; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button.collapsed .accordion-up-down-btn { background: none; color: var(--light-color); }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button .accordion-up-down-btn .up-down-icon { position: relative; right: auto; top: auto; color: #fff; }
.accordion-menu3 .accordion-item.sub-accordion1 .accordion-button.collapsed .accordion-up-down-btn .up-down-icon { color: var(--light-color); }
.accordion-menu3 .sub-accordion1 .accordian-right-btn { right: 0; }


body .c-single-accordion-button { width: 30px; height: 20px; background: var(--sky-color); color: #fff; border-radius: 6px; display: inline-flex; justify-content: center; align-items: center; border: none; margin: 0; padding: 0; }
body .c-single-accordion-button .feather.chevron-up { display: none; }
body .c-single-accordion-button.showBtn .feather.chevron-up { display: inherit; }
body .c-single-accordion-button.showBtn .feather.chevron-down { display: none; }
/* Sub Accordian End */

.total-count { width: 40px; height: 26px; font-weight: 700; color: var(--blue-color); background: var(--aqua-haze-bg-color); border-radius: 5px; font-size: 12px; line-height: 26px; text-align: center; display: inline-block; margin-left: 10px; }

.accordian-right-btn { position: absolute; right: 50px; top: -38px; z-index: 3; padding-right: 5px; }
.accordion-menu3 .accordian-right-btn { position: absolute; right: 50px; top: 50%; transform: translateY(-50%); z-index: 3; padding-right: 5px; }
.accordian-right-btn:after { width: 1px; height: 18px; content: ''; background: var(--light-border-color); position: absolute; right: 0; top: 5px; }
.accordian-right-btn.none { padding-right: 0; }
.accordian-right-btn.none:after { opacity: 0; }
.all-settings-tab-accordion .card { box-shadow: none; }

.accordion-menu3 .accordion-item .accordion-button.accordian-detail-main { display: flex; align-items: center; justify-content: space-between; padding-right: 44px; }
.accordian-detail { font-size: 14px; line-height: 20px; color: var(--black-color); font-weight: 500; display: flex; }
.accordian-detail .list { position: relative; padding-right: 20px; }
.accordian-detail .list:before { background: var(--light-border-color); content: ''; position: absolute; right: 10px; width: 2px; height: 12px; top:4px; }
.accordian-detail .list:last-child { padding-right: 0; }
.accordian-detail .list:last-child:before { opacity: 0; }
.accordian-detail .name { color: var(--light-color); font-weight: 500; padding-right: 5px; }

.setting-table { position: absolute; top: 7px; right: 15px; z-index: 1003; /* z-index: 1056; */ background: #fff; }
.setting-table .dropdown-toggle:after { display: none; }
body .setting-table .dropdown-menu { left: auto !important; right: 0 !important; top: 0px !important; padding: 0px 0px; }

.right-btn-top { display: inline-flex; vertical-align: middle; }
.right-btn-top .list-btn { display: inline-flex; align-items: center; padding: 0 7px 0 13px; position: relative; }
.right-btn-top .list-btn:before { background: var(--ghost-gray); width: 1px; height: 18px; position: absolute; right: -1px; top: 7px; /* bottom: 0; margin: auto 0; */ content: ''; }
.right-btn-top.small .list-btn:before { top: 5px; }
.right-btn-top .list-btn.none { padding-right: 0; }
.right-btn-top .list-btn.none:before { opacity: 0; }

body .export-list .dropdown-menu { top: 32px !important; padding: 8px 2px; left: auto !important; right: 0 !important; transform:inherit !important; transform-style:inherit !important; }
body .export-list.left-drop .dropdown-menu { left: 0 !important; right: auto !important; }
body .export-list .dropdown-menu .btn.btn-light:hover,
body .export-list .dropdown-menu .btn.btn-light.highlighted { background: var(--light-bg-color) !important; color: var(--black-color); }
body .export-list .dropdown-menu .btn.highlight-selected,
body .export-list .dropdown-menu .btn.highlight-selected:hover { background: var(--blue-color) !important; color: #fff; }
body .export-list .dropdown-menu .btn { padding-left: 13px; padding-right: 13px; }
body .export-list .dropdown-menu .btn.btn-icon { padding-left: 40px; }

/* Start Loader */
body .hide-loader,
body div.hide-loader { display: none !important; }
[data-loader='circle-side'] { position: relative; width: 24px; height: 24px; -webkit-animation: circle infinite 0.8s linear; -moz-animation: circle infinite 0.8s linear; -o-animation: circle infinite 0.8s linear; animation: circle infinite 0.8s linear; border: 2.4px solid rgba(0, 163, 239, 0.1); border-top-color: #00a3ef; border-right-color: #00a3ef; border-bottom-color: #00a3ef; border-radius: 100%; }
@-webkit-keyframes circle
{
    0%
    { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
    100%
    { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-moz-keyframes circle
{
    0%
    { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
    100%
    { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@-o-keyframes circle
{
    0%
    { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
    100%
    { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes circle
{
    0%
    { -webkit-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); }
    100%
    { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); }
}

/* 2 */
[data-loader='ball-auto']
{ width: 8px; height: 8px; animation: ball-auto 2.5s infinite linear; border-radius: 100%; box-shadow: 0 -20px 0 -3px #263db8, 20px 0 0 -3px #00a3ef, 0 20px 0 -3px #ff68d6, -20px 0 0 -3px #ff7e00; }
@-webkit-keyframes ball-auto
{
    0%
    { transform: rotate(0); }
    45%
    { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #263db8, 20px 0 0 10px #00a3ef, 0 20px 0 10px #ff68d6, -20px 0 0 10px #ff7e00; }
    100%
    { transform: rotate(720deg); }
}
@-moz-keyframes ball-auto
{
    0%
    { transform: rotate(0); }
    45%
    { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #263db8, 20px 0 0 10px #00a3ef, 0 20px 0 10px #ff68d6, -20px 0 0 10px #ff7e00; }
    100%
    { transform: rotate(720deg); }
}
@-o-keyframes ball-auto
{
    0%
    { transform: rotate(0); }
    45%
    { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #263db8, 20px 0 0 10px #00a3ef, 0 20px 0 10px #ff68d6, -20px 0 0 10px #ff7e00; }
    100%
    { transform: rotate(720deg); }
}
@keyframes ball-auto
{
    0%
    { transform: rotate(0); }
    45%
    { transform: rotate(360deg); border-radius: 100%; box-shadow: 0 -20px 0 10px #263db8, 20px 0 0 10px #00a3ef, 0 20px 0 10px #ff68d6, -20px 0 0 10px #ff7e00; }
    100%
    { transform: rotate(720deg); }
}
/* 3 */
.loader-main-big{ width:64px; height: 64px; position: relative; animation: spinner 3s infinite linear; /* background-color:red; */ }
.loader-main-big div { width:6px; height:6px; border-radius: 6px; position: absolute; top:32px; animation: spinner 2s infinite cubic-bezier(.34,.76,.80,.100); transform-origin: 32px 0px; background-color: green; outline: none; border: none; }

@keyframes spinner{
    0%{ transform: rotate(0deg); }
    100%{ transform: rotate(360deg); }
}

.loader-main-big div:nth-child(5) { background-color: #263db8; animation-delay: 0.1s; }
.loader-main-big div:nth-child(4) { background-color: #00a3ef; animation-delay: 0.2s; }
.loader-main-big div:nth-child(3) { background-color: #ff68d6; animation-delay: 0.3s; }
.loader-main-big div:nth-child(2) { background-color: #ff7e00; animation-delay: 0.4s; }
.loader-main-big div:nth-child(1) { background-color: #ffcc00; animation-delay: 0.5s; }
/* End Loader */

/* Table CSS */
.top-btn-table { width: 100%; display: table; padding-bottom: 5px; }
.top-btn-table .list { display: table-cell; vertical-align: middle; padding: 0; margin: 0; }
.add-page-btn:after { display: none; }

/* Top Search */
.table-top-search { width: 100%; display: table; /* padding: 10px 10px 11px 10px; */ position: relative; margin-bottom: 7px; }
.table-top-search .dataTables_filter  {  margin-left: 0 !important; }
.table-top-search:before { width: calc(100% - 20px); left: 10px; bottom: 0; height: 1px; content: ''; position: absolute; border-bottom: 1px dashed var(--light-border-color); }
.table-top-search .list { display: table-cell; vertical-align: middle; }
.table-top-search .list.table-search .input-group { max-width: 400px; }
.table-top-search .form-group.search-select { min-width: 85px; }
/* .table-top-search .list.table-tab { width: 175px; padding-right: 10px; } */
.table-top-search .list.table-tab { width: fit-content; padding-right: 10px; }
.table-tab.tab-menu2 .nav .nav-item { white-space: nowrap; }

body .table-top-search .list.top-summary-btn .btn.btn-outline.btn-light { box-shadow: none !important; background: #fff !important; position: relative; }
.top-summary-btn .btn.dot:before { content: ''; position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--light-border-color); display: inline-block; top: 3px; right: 3px; }
.top-summary-btn .btn.dot.active:before { background: var(--sky-color); }
body .table-top-search .list.top-summary-btn .btn.btn-outline.btn-light.active { color: var(--black-color); border-color: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; }
body .table-top-search .list.top-summary-btn .btn.btn-outline.btn-light.active .feather { color: var(--black-color); }

.table-main { width: 100%; padding: 0; position: relative; }
.table-main .fixed-headers { padding: 0 10px 15px 10px; }
.responsive-table { width: 100%; overflow: inherit; overflow-y: inherit; overflow-x: auto; position: relative; }
.responsive-table.custom-dropdown-open {overflow-x: inherit;}
.responsive-table.overflow-inherit { overflow: inherit; }
.responsive-table.overflow-auto { overflow: auto; }
.responsive-table.overflow-hidden { overflow: hidden; }

body .table-main .mCSB_scrollTools { margin: 0 !important; }

.responsive-table.show .table-loader,
.show.table-loader { opacity: 1; visibility: visible; height: 100%; }
.table-loader { position: absolute; left: 0; top: 0; width: 100%; height: 0; background: rgba(255, 255, 255, 0.80); z-index: 9; min-height: 300px; opacity: 0; visibility: hidden; z-index: 12; }
.table-loader .circle-table-loader { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin: -24px 0 0 -24px; }
.right-filter-loader.table-loader { opacity: 1; visibility: visible; height: 100%; }

.add-page-loader { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.80); z-index: 9; min-height: 100px; border-radius: 0 0 8px 8px; /* opacity: 0; visibility: hidden; */ }
.add-page-loader .circle-table-loader { width: 40px; height: 40px; position: absolute; left: 50%; top: 50%; margin: -24px 0 0 -24px; }


.responsive-table .dataTables_wrapper .dataTables_filter { float: left; width: 50%; position: relative; padding: 10px 10px 10px 0; margin: 0 0 7px 0; }
.responsive-table .dataTables_wrapper .dataTables_filter:before { border-bottom: 1px dashed var(--light-border-color); bottom: 0; content: ""; height: 1px; left: 0; position: absolute; width: 100%; /* width: calc(100% - 10px); */ }
.responsive-table .dataTables_wrapper .dataTables_filter label { font-size: 0; padding: 0; margin: 0; width: 100%; display: inherit; float: left; max-width: 400px; }
.responsive-table .dataTables_wrapper .dataTables_filter label input { padding:0 7px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; outline: none !important; box-shadow: none !important; height: 30px; color: var(--black-color); text-shadow: none; display: block; width: 100%; margin: 0; float: left; margin: 0 !important; max-width: 400px; background:#fff url(../images/search-icon.svg) 6px 50% no-repeat; background-size: 20px 20px; padding-left: 35px; }
.responsive-table .dataTables_wrapper .dataTables_filter label input:focus { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; font-weight: 500; }

.responsive-table.no-pagination .dataTables_wrapper .dataTables_filter { width: 100%; }

.responsive-table .dataTables_wrapper .dataTables_length { float: right; width: 50%; position: relative; padding: 10px 0 10px 0px; margin: 0 0 7px 0; }
.responsive-table .dataTables_wrapper .dataTables_length:before { border-bottom: 1px dashed var(--light-border-color); bottom: 0; content: ""; height: 1px; left: 0; position: absolute; width: 100%; /* width: calc(100% - 10px); */ }
.responsive-table .dataTables_wrapper .dataTables_length label { font-size: 0; padding: 0; margin: 0; width: 100%; float: left; }
.responsive-table .dataTables_wrapper .dataTables_length .select2-container { max-width: 85px; float: right; min-width: 85px; }
.responsive-table .dataTables_wrapper .dataTables_info { padding: 15px 0 0 0; color: var(--light-color); font-size: 14px; line-height: 30px; font-weight: 500; float: left; width: 175px; }
.responsive-table .dataTables_wrapper .dataTables_info b { color: var(--black-color); font-weight: 500; }

/* Pagination Datatable */
.responsive-table .dataTables_wrapper .dataTables_paginate { width: calc(100% - 350px); float: left; padding: 15px 0 0 0; text-align: center; display: inline-flex; vertical-align: middle; justify-content: center; }
.responsive-table .dataTables_wrapper .dataTables_paginate span { display: inline-block; }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button { display: inline-block; width: 30px; height: 22px; line-height: 22px; font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500; color: var(--light-color); box-shadow: none !important; text-align: center; border-radius: 4px !important; padding: 1px 0 0 0; margin: 4px 2px; position: relative; border: none !important; background: none; }

.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button:before { content: ''; position: absolute; left: 0px; right: 0; margin: 0 auto; bottom: -4px; background: var(--sky-color); width: 0; height: 2px; border-radius: 1px 1px 1px 1px; transition: width 0.5s, height 4s; }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.current:before { width: calc(100% - 10px); }
.pagination li.page-item a.page-link:hover { background: var(--light-bg-color) !important; color: var(--black-color); }
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {  background: var(--light-bg-color) !important; color: var(--black-color) !important;  }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.disabled { cursor: default; opacity: .5; pointer-events: none; }

.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.previous { font-size: 0; background: url(../images/chevron-left-hvr.svg) 50% 50% no-repeat; background-size: 20px 20px; }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover,
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.previous:active {  background: url(../images/chevron-left-hvr.svg) var(--aqua-haze-bg-color) 50% 50% no-repeat !important; background-size: 20px 20px; }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.next { font-size: 0; background: url(../images/chevron-right-hvr.svg) 50% 50% no-repeat; background-size: 20px 20px; }
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.next:hover,
.responsive-table .dataTables_wrapper .dataTables_paginate .paginate_button.next:active {  background: url(../images/chevron-right-hvr.svg) var(--aqua-haze-bg-color) 50% 50% no-repeat !important; background-size: 20px 20px; }

.goto-page-main { width: 85px; float: right; margin-top: -30px; }

/* Data Table Loader */
.responsive-table .dataTables_wrapper { min-height: 130px; }
.responsive-table .dataTables_wrapper .dataTables_processing { color:#fff; padding:0px; font-size:14px; /* Ex */ min-height: 130px; background: unset; background-size: 150px 150px; height: 100%; left: 0; top: 0; margin: 0; z-index: 1; font-size: 0; border-radius: 6px; z-index: 3; }
.responsive-table .dataTables_wrapper .dataTables_processing img { position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; opacity: 0; }

table.table-design { width: 100%;    padding: 0; /* border: 1px solid var(--catskill-white); */ border-radius: 6px; border-collapse: separate; border-spacing: 0px; border: none !important; }
table.table-design tr > th,
table.table-design tr > td { font-size: 13px; padding: 5px 12px !important; font-family: 'DM Sans', sans-serif !important; font-weight:500; color: var(--black-color); vertical-align: middle; position: relative; min-height: 30px; /* border: 1px solid var(--catskill-white); */ border: none !important; background: #fff !important; white-space: nowrap; }
table.table-design tr > th.td-word-break,
table.table-design tr > td.td-word-break { white-space: normal; }
table.table-design tr > th:first-child,
/* table.table-design tr > td:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; padding-left: 10px !important; } */
table.table-design tr > td:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
table.table-design tr > th:last-child,
table.table-design tr > td:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; /* padding-right: 10px !important; */ }
table.table-design thead tr > th { border-radius: 0px !important; }
table.table-design tr > td.td-input { padding-top: 3px !important; padding-bottom: 3px !important; }
table.table-design tr > th { font-weight: 500; padding-top: 10px !important; padding-bottom: 10px !important; font-weight: 500 !important; color: var(--light-color-op6); background: #fff !important; overflow: inherit; width: 30px; }
table.table-design tr > th:last-child,
table.table-design tr > td:last-child { width: auto; }
table.table-design tr > th.cols-pan-bg { padding: 0px 4px; }
table.table-design tr > th.cols-pan-bg .bg { background: var(--aqua-haze-bg-color); border-radius: 6px; padding: 3px 8px; color: var(--light-color); }
table.table-design tr > th .checkbox-custom label.label-text { color: var(--light-color-op6); }
table.table-design tr > th.table-th-filter-btn { padding-right: 45px !important; position: relative; }
table.table-design tr > th.table-th-filter-btn .btn { position: absolute; right: 0px; top: 5px; }

table.table-design tr > th.current-resize { padding-right: 12px; }
table.table-design tr > th.no-resize > .th-resize-div { display: none; }
table.table-design tr > th.current-resize > .th-resize-div { background: url(../images/move-th.svg) center center no-repeat; background-size: 24px 24px; width: 24px !important; opacity: 0; color: inherit !important; }
table.table-design tr > th.current-resize:hover > .th-resize-div { opacity: 1; cursor: col-resize !important; }

table.table-design tbody > tr > td { background-color: #fff !important; }
table.table-design tbody > tr:nth-of-type(2n+1) > td { background-color: var(--aqua-haze-bg-color) !important; }
table.table-design tbody > tr.even > td { background-color: var(--aqua-haze-bg-color); }
table.table-design tbody > tr.odd > td { background-color: #fff; }
table.table-design tbody > tr:hover > td { background-color: var(--light-bg-color) !important; }

/* Even Odd Dynamic */
/* table.table-design tbody > tr.even > td { background-color: var(--aqua-haze-bg-color) !important; }
table.table-design tbody > tr.odd > td { background-color: #fff !important; }
table.table-design tbody > tr.even:hover > td,
table.table-design tbody > tr.odd:hover > td { background-color: var(--light-bg-color) !important; } */

table.table-design tbody > tr.tr-edit td { background-color: var(--light-bg-color) !important; }

table.table-design tbody > tr.active > td { border-bottom: 1px solid var(--sky-color); border-top: 1px solid var(--blue-color); background-color: var(--light-bg-color); }
table.table-design tbody > tr.active > td:first-child { border-left: 1px solid var(--sky-color); }
table.table-design tbody > tr.active > td:last-child { border-right: 1px solid var(--sky-color); }

table.table-design tbody > tr.tr-spacer td { height: 10px; background-color: transparent !important; }
table.table-design tbody > tr.tr-total-amount > td { background: #fff !important; }
table.table-design tbody > tr.tr-total-amount > td .total { display: inline-block; background: var(--aqua-haze-bg-color); padding: 3px 8px; border-radius: 6px; }
table.table-design tbody > tr.tr-total-amount > td .total-green { display: inline-block; background: var(--peppermint-color); color: var(--green-color); padding: 3px 8px; border-radius: 6px; font-weight: 500; }

table.table-design tbody > tr.tr-td-white > td { background-color:#fff !important; }
table.table-design tbody > tr.tr-td-blue > td { background-color:#e5f6fd !important; }

table.table-design tbody .so-title .title,
table.table-design thead .so-title .title { background: #fff !important; position: relative; text-align: left; }
table.table-design tbody .so-title .title:before,
table.table-design thead .so-title .title:before { position: absolute; left: 0; top: 6px; height: calc(100% - 12px); content: ''; width: 2px; background: var(--sky-color); border-radius: 1px; }

table.table-design4 tbody .so-title4 .title { background: #fff !important; position: relative; text-align: left; color: var(--black-color); padding: 0 0 0 10px; margin: 0; font-family: 'DM Sans', sans-serif; font-weight:500; }
table.table-design4 tbody .so-title4 .title:before { position: absolute; left: 0; top: 0px; bottom: 0; margin: auto 0; height: 18px; content: ''; width: 2px; background: var(--sky-color); border-radius: 1px; }

table.table-design tr > th .info-label,
table.table-design tr > td .info-label { margin-top: -1px; position: relative; }

/* Accordian Table */
table.table-design tbody > tr > td.details-control-td { position: relative; width: 30px; }
table.table-design tbody > tr > td.details-control-td .right-down-chevron { display: block; width: 30px; height: 20px; border-radius: 6px; color: var(--light-color); text-align: center; cursor: pointer; }
table.table-design tbody > tr > td.details-control-td.group-accordian-active .right-down-chevron .chevron-right,
table.table-design tbody > tr > td.details-control-td .right-down-chevron .chevron-down { display: none; visibility: hidden; }
table.table-design tbody > tr > td.details-control-td.group-accordian-active .right-down-chevron .chevron-down { display: inline-flex; visibility: visible; }
table.table-design tbody > tr > td.details-control-td.group-accordian-active .right-down-chevron { background: var(--sky-color); color: #fff; }
table.table-design tbody > tr.sub-table-main > td { background-color: transparent !important; padding: 0 !important; position: relative; }
table.table-design tbody > tr.sub-table-main > td:before { position: absolute; left: -10px; top: -24px; background: var(--sky-color); content: ''; height: calc(100% + 18px); width: 2px; border-radius: 1px; }

table.table-design thead > tr > th:first-child { position: relative; }
table.table-design thead > tr > th:first-child:before { position: absolute; left: -10px; top: 0; background: #fff; content: ''; height: 100%; width: 2px; opacity: 1; }
table.table-design table.table-design thead > tr > th:first-child:before { opacity: 0; }

/* Accordian Sub Level Table */
table.table-design tbody > tr > td.td-level { position: relative; padding-left: 36px; }
table.table-design tbody > tr > td.td-level:before { position: absolute; left: 0; top: 6px; height: calc(100% - 12px); content: ''; width: 2px; background: var(--sky-color); border-radius: 0px; }
table.table-design tbody > tr > td.td-level.td-level-sub:before { height: 100%; top: -6px; }
table.table-design tbody > tr > td.td-level .plus-minus-circle { width: 20px; height: 20px; position: absolute; left: 8px; top: 6px; cursor: pointer; color: var(--light-color); }
table.table-design tbody > tr > td.td-level .plus-minus-circle:hover { color: var(--black-color); }
table.table-design tbody > tr > td.td-level .plus-minus-circle .feather { position: absolute; left: 0; top: 0; }
table.table-design tbody > tr > td.td-level .plus-minus-circle .minus-circle { opacity: 0; }
table.table-design tbody > tr > td.td-level.group-accordian-active .plus-minus-circle .minus-circle { opacity: 1; }
table.table-design tbody > tr > td.td-level.group-accordian-active .plus-minus-circle .plus-circle { opacity: 0; }

/* Level 2 */
table.table-design tbody > tr > td.td-level.td-level-2 { padding-left: 53px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-2:before { left: 16px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-2 .plus-minus-circle { left: 24px; /* +16 */ }

/* Level 3 */
table.table-design tbody > tr > td.td-level.td-level-3 { padding-left: 70px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-3:before { left: 32px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-3 .plus-minus-circle { left: 40px; /* +16 */ }

/* Level 4 */
table.table-design tbody > tr > td.td-level.td-level-4 { padding-left: 87px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-4:before { left: 48px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-4 .plus-minus-circle { left: 56px; /* +16 */ }

/* Level 5 */
table.table-design tbody > tr > td.td-level.td-level-5 { padding-left: 104px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-5:before { left: 64px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-5 .plus-minus-circle { left: 72px; /* +16 */ }

/* Level 6 */
table.table-design tbody > tr > td.td-level.td-level-6 { padding-left: 121px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-6:before { left: 80px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-6 .plus-minus-circle { left: 88px; /* +16 */ }

/* Level 7 */
table.table-design tbody > tr > td.td-level.td-level-7 { padding-left: 138px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-7:before { left: 96px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-7 .plus-minus-circle { left: 104px; /* +16 */ }

/* Level 8 */
table.table-design tbody > tr > td.td-level.td-level-8 { padding-left: 145px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-8:before { left: 112px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-8 .plus-minus-circle { left: 120px; /* +16 */ }

/* Level 9 */
table.table-design tbody > tr > td.td-level.td-level-9 { padding-left: 162px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-9:before { left: 128px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-9 .plus-minus-circle { left: 136px; /* +16 */ }

/* Level 10 */
table.table-design tbody > tr > td.td-level.td-level-10 { padding-left: 179px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-10:before { left: 144px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-10 .plus-minus-circle { left: 152px; /* +16 */ }

/* Level 11 */
table.table-design tbody > tr > td.td-level.td-level-11 { padding-left: 196px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-11:before { left: 160px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-11 .plus-minus-circle { left: 168px; /* +16 */ }

/* Level 12 */
table.table-design tbody > tr > td.td-level.td-level-12 { padding-left: 213px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-12:before { left: 176px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-12 .plus-minus-circle { left: 184px; /* +16 */ }

/* Level 13 */
table.table-design tbody > tr > td.td-level.td-level-13 { padding-left: 230px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-13:before { left: 192px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-13 .plus-minus-circle { left: 200px; /* +16 */ }

/* Level 14 */
table.table-design tbody > tr > td.td-level.td-level-14 { padding-left: 247px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-14:before { left: 208px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-14 .plus-minus-circle { left: 216px; /* +16 */ }

/* Level 15 */
table.table-design tbody > tr > td.td-level.td-level-15 { padding-left: 264px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-15:before { left: 224px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-15 .plus-minus-circle { left: 232px; /* +16 */ }

/* Level 16 */
table.table-design tbody > tr > td.td-level.td-level-16 { padding-left: 281px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-16:before { left: 240px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-16 .plus-minus-circle { left: 248px; /* +16 */ }

/* Level 17 */
table.table-design tbody > tr > td.td-level.td-level-17 { padding-left: 298px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-17:before { left: 256px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-17 .plus-minus-circle { left: 264px; /* +16 */ }

/* Level 18 */
table.table-design tbody > tr > td.td-level.td-level-18 { padding-left: 298px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-18:before { left: 256px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-18 .plus-minus-circle { left: 264px; /* +16 */ }

/* Level 18 */
table.table-design tbody > tr > td.td-level.td-level-18 { padding-left: 315px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-18:before { left: 272px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-18 .plus-minus-circle { left: 280px; /* +16 */ }

/* Level 19 */
table.table-design tbody > tr > td.td-level.td-level-19 { padding-left: 332px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-19:before { left: 288px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-19 .plus-minus-circle { left: 296px; /* +16 */ }

/* Level 20 */
table.table-design tbody > tr > td.td-level.td-level-20 { padding-left: 349px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-20:before { left: 304px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-20 .plus-minus-circle { left: 312px; /* +16 */ }

/* Level 21 */
table.table-design tbody > tr > td.td-level.td-level-21 { padding-left: 366px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-21:before { left: 320px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-21 .plus-minus-circle { left: 328px; /* +16 */ }

/* Level 22 */
table.table-design tbody > tr > td.td-level.td-level-22 { padding-left: 383px; /* +17 */ }
table.table-design tbody > tr > td.td-level.td-level-22:before { left: 336px; /* +16 */ }
table.table-design tbody > tr > td.td-level.td-level-22 .plus-minus-circle { left: 344px; /* +16 */ }

/* Start Level Finance */
table.table-design.level-finance tbody tr td.td-level-1 { /* padding-left: 15px !important; */ position: relative; }
body table.table-design.level-finance tbody tr td.td-level-2 { padding-left: 20px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-3 { padding-left: 30px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-4 { padding-left: 40px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-5 { padding-left: 50px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-6 { padding-left: 60px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-7 { padding-left: 70px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-8 { padding-left: 80px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-9 { padding-left: 90px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-10 { padding-left: 100px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-11 { padding-left: 110px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-12 { padding-left: 120px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-13 { padding-left: 130px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-14 { padding-left: 140px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-15 { padding-left: 150px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-16 { padding-left: 160px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-17 { padding-left: 170px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-18 { padding-left: 180px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-19 { padding-left: 190px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-20 { padding-left: 200px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-21 { padding-left: 210px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-22 { padding-left: 220px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-23 { padding-left: 230px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-24 { padding-left: 240px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-25 { padding-left: 250px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-26 { padding-left: 260px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-27 { padding-left: 270px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-28 { padding-left: 280px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-29 { padding-left: 290px !important; position: relative; }
body table.table-design.level-finance tbody tr td.td-level-30 { padding-left: 300px !important; position: relative; }

table.table-design.level-finance tbody tr td.td-level-1:before,
table.table-design.level-finance tbody tr td.td-level-2:before,
table.table-design.level-finance tbody tr td.td-level-3:before,
table.table-design.level-finance tbody tr td.td-level-4:before,
table.table-design.level-finance tbody tr td.td-level-5:before,
table.table-design.level-finance tbody tr td.td-level-6:before,
table.table-design.level-finance tbody tr td.td-level-7:before,
table.table-design.level-finance tbody tr td.td-level-8:before,
table.table-design.level-finance tbody tr td.td-level-9:before,
table.table-design.level-finance tbody tr td.td-level-10:before,
table.table-design.level-finance tbody tr td.td-level-11:before,
table.table-design.level-finance tbody tr td.td-level-12:before,
table.table-design.level-finance tbody tr td.td-level-13:before,
table.table-design.level-finance tbody tr td.td-level-14:before,
table.table-design.level-finance tbody tr td.td-level-15:before,
table.table-design.level-finance tbody tr td.td-level-16:before,
table.table-design.level-finance tbody tr td.td-level-17:before,
table.table-design.level-finance tbody tr td.td-level-18:before,
table.table-design.level-finance tbody tr td.td-level-19:before,
table.table-design.level-finance tbody tr td.td-level-20:before,
table.table-design.level-finance tbody tr td.td-level-21:before,
table.table-design.level-finance tbody tr td.td-level-22:before,
table.table-design.level-finance tbody tr td.td-level-23:before,
table.table-design.level-finance tbody tr td.td-level-24:before,
table.table-design.level-finance tbody tr td.td-level-25:before,
table.table-design.level-finance tbody tr td.td-level-26:before,
table.table-design.level-finance tbody tr td.td-level-27:before,
table.table-design.level-finance tbody tr td.td-level-28:before,
table.table-design.level-finance tbody tr td.td-level-29:before,
table.table-design.level-finance tbody tr td.td-level-30:before { position: absolute; left:0; top:0; width:2px; height:100%; content:''; background:#00c0ef; }
table.table-design.level-finance tbody tr td.td-level-no-line:before { opacity: 0; }
table.table-design.level-finance tbody tr td.td-level-2:before { left: 10px; background: #0073b7; }
table.table-design.level-finance tbody tr td.td-level-3:before { left: 20px; background: #f15690; }
table.table-design.level-finance tbody tr td.td-level-4:before { left: 30px; background: #f7941d; }
table.table-design.level-finance tbody tr td.td-level-5:before { left: 40px; background: #f15a56; }
table.table-design.level-finance tbody tr td.td-level-6:before { left: 50px; background: #d744ce; }
table.table-design.level-finance tbody tr td.td-level-7:before { left: 60px; background: #8d41e2; }
table.table-design.level-finance tbody tr td.td-level-8:before { left: 70px; background: #4d57a6; }
table.table-design.level-finance tbody tr td.td-level-9:before { left: 80px; background: #ab68ff; }
table.table-design.level-finance tbody tr td.td-level-10:before { left: 90px; background: #2bcbba; }
table.table-design.level-finance tbody tr td.td-level-11:before { left: 100px; background: #10cc3d; }
table.table-design.level-finance tbody tr td.td-level-12:before { left: 110px; background: #ebca12; }
table.table-design.level-finance tbody tr td.td-level-13:before { left: 120px; background: #698fa6; }
table.table-design.level-finance tbody tr td.td-level-14:before { left: 130px; background: #009cff; }
table.table-design.level-finance tbody tr td.td-level-15:before { left: 140px; background: #00a65a; }
table.table-design.level-finance tbody tr td.td-level-16:before { left: 150px; background: #8aaf0b; }
table.table-design.level-finance tbody tr td.td-level-17:before { left: 160px; background: #e29578; }
table.table-design.level-finance tbody tr td.td-level-18:before { left: 170px; background: #5f0f40; }
table.table-design.level-finance tbody tr td.td-level-19:before { left: 180px; background: #9d8189; }
table.table-design.level-finance tbody tr td.td-level-20:before { left: 190px; background: #c1121f; }
table.table-design.level-finance tbody tr td.td-level-21:before { left: 200px; }
table.table-design.level-finance tbody tr td.td-level-22:before { left: 210px; }
table.table-design.level-finance tbody tr td.td-level-23:before { left: 220px; }
table.table-design.level-finance tbody tr td.td-level-24:before { left: 230px; }
table.table-design.level-finance tbody tr td.td-level-25:before { left: 240px; }
table.table-design.level-finance tbody tr td.td-level-26:before { left: 250px; }
table.table-design.level-finance tbody tr td.td-level-27:before { left: 260px; }
table.table-design.level-finance tbody tr td.td-level-28:before { left: 270px; }
table.table-design.level-finance tbody tr td.td-level-29:before { left: 280px; }
table.table-design.level-finance tbody tr td.td-level-30:before { left: 290px; }
/* End Level Finance */

table.table-design tr th.move { cursor: move; }
/* Sorting */
table.table-design tr th.sorting:after,
table.table-design tr th.sorting_asc:after,
table.table-design tr th.sorting_desc:after { display: none; }
table.table-design tr th.sorting,
table.table-design tr th.sorting_asc,
table.table-design tr th.sorting_desc { cursor: pointer; }

table.table-design tr th.sorting_asc:before,
table.table-design tr th.sorting_desc:before { position: absolute; left: 4px; top: 2px; height: 3px; width: calc(100% - 8px); content: ''; background: var(--sky-color); border-radius: 0 0 2px 2px; }
table.table-design tr th.sorting_desc:before { top: auto; bottom: 2px; border-radius: 2px 2px 0 0; }

table.table-design tr th.sorting_asc:last-child:before,
table.table-design tr th.sorting_desc:last-child:before { max-width: 200px; }

/* table-design2 */
table.table-design2 { width: 100%; }
table.table-design2 tr > th,
table.table-design2 tr > td { font-size: 14px; color: var(--black-color); font-weight: 500; border-bottom: 1px dashed var(--light-border-color); padding: 5px 7px; max-height: 30px; }
table.table-design2 tr > th { color: var(--light-color); }
table.table-design2 tr.border-bottom-solid > th,
table.table-design2 tr.border-bottom-solid > td { border-bottom-style: solid; }
table.table-design2 tr.border-bottom-none > th,
table.table-design2 tr.border-bottom-none > td { border-bottom-color: transparent; }

/* table-design3 */
table.table-design3 { width: 100%; }
table.table-design3 tr > th,
table.table-design3 tr > td { font-size: 14px; color: var(--black-color); font-weight: 500; padding: 3px 7px; min-height: 36px; height: 36px; }
table.table-design3 tr > th:first-child,
table.table-design3 tr > td:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; padding-left: 10px; }
table.table-design3 tr > th:last-child,
table.table-design3 tr > td:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; padding-right: 10px; }
table.table-design3 tr.active > th,
table.table-design3 tr.active > td,
table.table-design3 tr:hover > th,
table.table-design3 tr:hover > td { background: var(--athens3-gray3); }

/* table-design4 */
table.table-design4 { width: 100%; }
table.table-design4 tr > th,
table.table-design4 tr > td { font-size: 14px; color: var(--black-color); font-weight: 500; border-bottom: 1px dashed var(--light-border-color); padding: 5px 7px; max-height: 30px; }
table.table-design4 tr > th { color: var(--light-color); }
table.table-design4 tr.border-bottom-solid > th,
table.table-design4 tr.border-bottom-solid > td { border-bottom-style: solid; }
table.table-design4 tr.border-bottom-none > th,
table.table-design4 tr.border-bottom-none > td { border-bottom-color: transparent; }

table.table-design tr > th.sorting_asc,
table.table-design tr > th.sorting_desc,
table.table-design tr > th.sorting { padding-top: 0 !important; padding-bottom: 0 !important; }
table.table-design tr > th.sorting_asc .sorting-count,
table.table-design tr > th.sorting_desc .sorting-count,
table.table-design tr > th.sorting .sorting-count { padding-top: 10px; padding-bottom: 10px; width: 100%; display: block; }

.sorting-count { white-space: nowrap; }
.sorting-count .count { background: var(--aqua-haze-bg-color) url(../images/caret-down.svg) 90% 50% no-repeat; background-size: 10px 10px; border-radius: 6px; width: auto; height: 20px; display: inline-block; padding: 0 6px; padding-right: 17px; color: var(--blue-color); font-size: 12px; margin-left: 5px; position: relative; }
.sorting_asc .sorting-count .count { background-image: url(../images/caret-up.svg); }
.sorting_dsc .sorting-count .count { background-image: url(../images/caret-down.svg); }
.sorting-count .count:empty { display: none; }
.sorting-count .count .feather { position: absolute; right: 3px; top: 3px; }

body .alert { border-radius: 8px; font-size: 15px; line-height: 20px; font-weight: 500; padding: 5px 15px; position: relative; }
body .alert b { font-weight: 500; }
body .alert .close { position: absolute; right: 1px; top: 1px; width: 30px; height: 30px; font-size: 0; background: url(../images/x.svg) 50% 50% no-repeat; background-size: 20px 20px; }

/* .sorting-count .count .caret-down { opacity: 0; }
.sorting-desc .sorting-count .count .caret-down { opacity: 1; }
.sorting-desc .sorting-count .count .caret-up { opacity: 0; } */
/* table.table-design.no-label-responsive {  } */

.table-info-main { width: 100%; display: table; padding: 5px 10px 10px 10px; }
.table-info-main .info-list { display: table-cell; vertical-align: middle; width: 33.3%; padding: 0 15px; font-size: 14px; font-weight: 500; color: var(--light-color); }
.table-info-main .info-list.table-records { padding-left: 0; }
.table-info-main .info-list .info-list-sub { display: table-cell; vertical-align: middle; }
.table-info-main .info-list b { font-weight: 500; color: var(--black-color); }
.table-info-main .info-list.pagination-main { text-align: center; }
.table-info-main .info-list.goto-page-main { text-align: right; padding-right: 0; }
.table-info-main .pagination { width: auto; display: inline-flex; }

/* Table Bottom Summary */
.bottom-summary { width: 100%; position: relative; display: flex; flex-wrap: wrap; justify-content: center; }
.bottom-summary:before { position: absolute; left: 10px; top: 0; content: ''; width: calc(100% - 20px); height: 1px; border-top: 1px dashed var(--light-border-color); }
.bottom-summary.border-bottom1:after { position: absolute; left: 10px; bottom: -1px; content: ''; width: calc(100% - 20px); height: 1px; border-bottom: 1px dashed var(--light-border-color); }

.bottom-summary.full { margin-left: -10px; margin-right: -10px; width: calc(100% + 20px); }

.bottom-summary.border-top-none:before { opacity: 0; }
.bottom-summary .summary-item { flex-grow: 1; padding: 0 5px; max-width: 185px; white-space: nowrap; }
.bottom-summary.summary-col6 .summary-item { width: 16.6%; max-width: 100%; }
.bottom-summary.summary-col7 .summary-item { width: 14.2%; max-width: 100%; }
.bottom-summary .summary-item .summary-inn { width: 100%; padding: 4px 6px; position: relative; font-size: 14px; line-height: 18px; font-weight: 500; color: var(--light-color);
background: -moz-linear-gradient(top,  rgba(118,102,215,0) 0%, rgba(118,102,215,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(118,102,215,0) 0%,rgba(118,102,215,0.06) 100%);
background: linear-gradient(to bottom,  rgba(118,102,215,0) 0%,rgba(118,102,215,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007666d7', endColorstr='#0f7666d7',GradientType=0 ); }
.bottom-summary .summary-item .summary-inn:before { content: ''; position: absolute; left: 6px; bottom: 0; width: calc(100% - 12px); height: 2px; background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); border-radius: 1.5px; }
.bottom-summary .summary-item .top-summary,
.bottom-summary .summary-item .middle-summary { display: flex; flex-shrink: 0; align-items: flex-start; justify-content: space-between; }
.bottom-summary .summary-item .summary { font-size: 15px; color: var(--black-color); padding-top: 1px; }
.bottom-summary .summary-item .summary sup { top: -3px; font-size: 13px; font-family: 'Roboto', sans-serif; font-weight: 400; }
.bottom-summary .summary-item .count { position: relative; font-size: 13px; line-height: 13px; color: var(--black-color); padding: 3px 6px 2px 6px; }
.bottom-summary .summary-item .count:before { width: 100%; height: 100%; content: ''; position: absolute; left: 0; top: 0; background: var(--violet-bg); border-radius: 9px; opacity: 0.12; }

.bottom-summary .summary-item.summary-item-w250 { max-width: 250px; }

/* Color 2 */
.bottom-summary .summary-item.color2 .summary-inn { background: -moz-linear-gradient(top,  rgba(38,61,184,0) 0%, rgba(38,61,184,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(38,61,184,0) 0%,rgba(38,61,184,0.06) 100%);
background: linear-gradient(to bottom,  rgba(38,61,184,0) 0%,rgba(38,61,184,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00263db8', endColorstr='#0f263db8',GradientType=0 ); }
.bottom-summary .summary-item.color2 .count:before,
.bottom-summary .summary-item.color2 .summary-inn:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }

/* Color 3 */
.bottom-summary .summary-item.color3 .summary-inn { background: -moz-linear-gradient(top,  rgba(0,163,239,0) 0%, rgba(0,163,239,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(0,163,239,0) 0%,rgba(0,163,239,0.06) 100%);
background: linear-gradient(to bottom,  rgba(0,163,239,0) 0%,rgba(0,163,239,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0000a3ef', endColorstr='#0f00a3ef',GradientType=0 ); }
.bottom-summary .summary-item.color3 .count:before,
.bottom-summary .summary-item.color3 .summary-inn:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }

/* Color 4 */
.bottom-summary .summary-item.color4 .summary-inn { background: -moz-linear-gradient(top,  rgba(255,104,214,0) 0%, rgba(255,104,214,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(255,104,214,0) 0%,rgba(255,104,214,0.06) 100%);
background: linear-gradient(to bottom,  rgba(255,104,214,0) 0%,rgba(255,104,214,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ff68d6', endColorstr='#0fff68d6',GradientType=0 ); }
.bottom-summary .summary-item.color4 .count:before,
.bottom-summary .summary-item.color4 .summary-inn:before { background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }

/* Color 5 */
.bottom-summary .summary-item.color5 .summary-inn { background: -moz-linear-gradient(top,  rgba(238,70,70,0) 0%, rgba(238,70,70,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(238,70,70,0) 0%,rgba(238,70,70,0.06) 100%);
background: linear-gradient(to bottom,  rgba(238,70,70,0) 0%,rgba(238,70,70,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ee4646', endColorstr='#0fee4646',GradientType=0 ); }
.bottom-summary .summary-item.color5 .count:before,
.bottom-summary .summary-item.color5 .summary-inn:before { background: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }

/* Color 6 */
.bottom-summary .summary-item.color6 .summary-inn { background: -moz-linear-gradient(top,  rgba(255,126,0,0) 0%, rgba(255,126,0,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(255,126,0,0) 0%,rgba(255,126,0,0.06) 100%);
background: linear-gradient(to bottom,  rgba(255,126,0,0) 0%,rgba(255,126,0,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ff7e00', endColorstr='#0fff7e00',GradientType=0 ); }
.bottom-summary .summary-item.color6 .count:before,
.bottom-summary .summary-item.color6 .summary-inn:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }

/* Color 7 */
.bottom-summary .summary-item.color7 .summary-inn { background: -moz-linear-gradient(top,  rgba(255,204,0,0) 0%, rgba(255,204,0,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(255,204,0,0) 0%,rgba(255,204,0,0.06) 100%);
background: linear-gradient(to bottom,  rgba(255,204,0,0) 0%,rgba(255,204,0,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffcc00', endColorstr='#0fffcc00',GradientType=0 ); }
.bottom-summary .summary-item.color7 .count:before,
.bottom-summary .summary-item.color7 .summary-inn:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }

/* Color 8 */
.bottom-summary .summary-item.color8 .summary-inn { background: -moz-linear-gradient(top,  rgba(81,184,72,0) 0%, rgba(81,184,72,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(81,184,72,0) 0%,rgba(81,184,72,0.06) 100%);
background: linear-gradient(to bottom,  rgba(81,184,72,0) 0%,rgba(81,184,72,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0051b848', endColorstr='#0f51b848',GradientType=0 ); }
.bottom-summary .summary-item.color8 .count:before,
.bottom-summary .summary-item.color8 .summary-inn:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }

/* Opation 1 */
.bottom-summary.option1 .summary-item .summary-inn:before { box-shadow: none; }
/* Opation 2 */
.bottom-summary.option2 .summary-item { padding: 0; }
.bottom-summary.option2 .summary-item .summary-inn { background: none; padding-left: 12px; padding-right: 10px; }
.bottom-summary.option2 .summary-item .summary-inn:before { left: 0; width: 3px; top: 5px; bottom: auto; height: calc(100% - 9px); }

/* Opation 3 */
.bottom-summary.option3 .summary-item { padding: 0 4px; }
.bottom-summary.option3 .summary-item .summary-inn { background: none; }
.bottom-summary.option3 .summary-item .summary-inn:before { box-shadow: none; }

/* Opation 4 */
.bottom-summary.option4 { justify-content: flex-start; padding-top: 2px; }
.bottom-summary.option4 .summary-item { max-width: 155px; background: none !important; flex-grow: inherit; }
.bottom-summary.option4 .summary-item.total { min-width: 58px; max-width: 58px; }
.bottom-summary.option4 .summary-item.total .summary-inn { padding-left: 0; padding-top: 13px; }
.bottom-summary.option4 .summary-item.total .summary-inn:before { opacity: 0; }
.bottom-summary.option4 .summary-item .summary-inn { background: none; padding: 4px 10px 4px 13px; }
.bottom-summary.option4 .summary-item .summary-inn:before { width: 3px; height: 36px; border-radius: 1.5px; left: 0; top: 4px; }
.bottom-summary .summary-item.pink .summary-inn:before { background: var(--pink-color);  box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.bottom-summary .summary-item.blue .summary-inn:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.bottom-summary .summary-item.sky-blue .summary-inn:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.bottom-summary .summary-item.green .summary-inn:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.bottom-summary .summary-item.green2 .summary-inn:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
.bottom-summary .summary-item.orange .summary-inn:before { background: var(--orange-color);  box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.bottom-summary .summary-item.red .summary-inn:before { background: var(--danger-color);  box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.bottom-summary .summary-item.light .summary-inn:before { background: var(--light-color);  box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
.bottom-summary .summary-item.yellow .summary-inn:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.bottom-summary .summary-item.violet .summary-inn:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
.bottom-summary .summary-item.dark-pink .summary-inn:before { background: var(--dark-pink-bg); box-shadow: 0px 1px 4px 0px rgba(214, 109, 248, 0.33); }
.bottom-summary .summary-item.swo-color .summary-inn:before { background: #0673ed; box-shadow: 0px 1px 4px 0px rgba(6, 115, 237, 0.33); }
.bottom-summary .summary-item.swd-color .summary-inn:before { background: #a55ff4; box-shadow: 0px 1px 4px 0px rgba(165, 95, 244, 0.33); }

/* Start Card Matric */
.card-matric-summary { justify-content: left; }
.card-matric-summary:before { opacity: 0; }

.card-matric-summary .summary-item-main { width: 100%; padding: 10px 15px 15px 15px; }
.modal-card-matric-summary.card-matric-summary .summary-item-main { margin-top: 3px; }
.card-matric-summary .summary-item { padding: 0; max-width: 100%; }
.card-matric-summary .summary-item.full { white-space: normal; text-align: left; }
.card-matric-summary .summary-item .summary-inn { padding: 10px 15px; }
.card-matric-summary .summary-item .count { font-size: 15px; line-height: 15px; font-weight: 500; }
.card-matric-summary .summary-item .summary-inn:before { left: 15px; width: calc(100% - 30px); }

.card-matric-summary.option1 .summary-item-main { padding-top: 0; padding-left: 0; padding-right: 0; }
.card-matric-summary.option1 .summary-item .summary-inn:before { height: 3px; box-shadow: none !important; }

.card-matric-summary.option2 .summary-item-main { padding-top: 8px; padding-bottom: 10px; }
.card-matric-summary.option2 .summary-item .summary-inn { padding-top: 5px; padding-bottom: 5px; padding-left: 15px; padding-right: 0; background: none !important; }
.card-matric-summary.option2 .summary-item .summary-inn:before { box-shadow: none !important; }

.card-matric-summary.option3 .summary-item-main { padding-top: 0; padding-left: 0; padding-right: 0; }
.card-matric-summary.option3 .summary-item { padding: 0; }
.card-matric-summary.option3 .summary-item .summary-inn { background: none !important; }
.card-matric-summary.option3 .summary-item .summary-inn:before { height: 3px; box-shadow: none !important; }

.card-matric-summary.option4 .summary-item-main {  }
.card-matric-summary.option4 .summary-item { max-width: 100%; }
.card-matric-summary.option4 .summary-item .summary-inn { padding: 0 0 0 15px; background: none !important; }
.card-matric-summary.option4 .summary-item .summary-inn:before { height: 100%; top: 0; }

.card-matric-summary .summary-item.full .top-summary { flex-direction: column; }
.card-matric-summary .summary-item.full .summary { padding-bottom: 5px; color: var(--light-color); font-size: 14px; }
.card-matric-summary .summary-item.full .count { padding: 0; line-height: 18px; }
.card-matric-summary .summary-item.full .count:before { opacity: 0; }
.card-matric-summary.option2 .summary-item.full .count,
.card-matric-summary.option4 .summary-item.full .count { padding-bottom: 2px; }

.dashboard-configure .card-matric-summary .summary-item-main { padding: 0; }
.dashboard-configure .card-matric-summary.option2 .summary-item-main,
.dashboard-configure .card-matric-summary.option4 .summary-item-main { padding-left: 15px; padding-right: 15px; }

/* Color 1 */
.card-matric-summary .summary-item.color1 .summary-inn { background: -moz-linear-gradient(top,  rgba(38,61,184,0) 0%, rgba(38,61,184,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(38,61,184,0) 0%,rgba(38,61,184,0.06) 100%);
background: linear-gradient(to bottom,  rgba(38,61,184,0) 0%,rgba(38,61,184,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00263db8', endColorstr='#0f263db8',GradientType=0 ); }
.card-matric-summary .summary-item.color1 .summary-inn:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.card-matric-summary .summary-item.color1 .count:before { background: var(--blue-color); }

/* Color 2 */
.card-matric-summary .summary-item.color2 .summary-inn { background: -moz-linear-gradient(top,  rgba(0,163,239,0) 0%, rgba(0,163,239,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(0,163,239,0) 0%,rgba(0,163,239,0.06) 100%);
background: linear-gradient(to bottom,  rgba(0,163,239,0) 0%,rgba(0,163,239,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0000a3ef', endColorstr='#0f00a3ef',GradientType=0 ); }
.card-matric-summary .summary-item.color2 .summary-inn:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.card-matric-summary .summary-item.color2 .count:before { background: var(--sky-color); }

/* Color 3 */
.card-matric-summary .summary-item.color3 .summary-inn { background: -moz-linear-gradient(top,  rgba(255,104,214,0) 0%, rgba(255,104,214,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(255,104,214,0) 0%,rgba(255,104,214,0.06) 100%);
background: linear-gradient(to bottom,  rgba(255,104,214,0) 0%,rgba(255,104,214,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ff68d6', endColorstr='#0fff68d6',GradientType=0 ); }
.card-matric-summary .summary-item.color3 .summary-inn:before { background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.card-matric-summary .summary-item.color3 .count:before { background: var(--pink-color); }

/* Color 4 */
.card-matric-summary .summary-item.color4 .summary-inn { background: -moz-linear-gradient(top,  rgba(238,70,70,0) 0%, rgba(238,70,70,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(238,70,70,0) 0%,rgba(238,70,70,0.06) 100%);
background: linear-gradient(to bottom,  rgba(238,70,70,0) 0%,rgba(238,70,70,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ee4646', endColorstr='#0fee4646',GradientType=0 ); }
.card-matric-summary .summary-item.color4 .summary-inn:before { background: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.card-matric-summary .summary-item.color4 .count:before { background: var(--danger-color); }

/* Color 5 */
.card-matric-summary .summary-item.color5 .summary-inn { background: -moz-linear-gradient(top,  rgba(255,126,0,0) 0%, rgba(255,126,0,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(255,126,0,0) 0%,rgba(255,126,0,0.06) 100%);
background: linear-gradient(to bottom,  rgba(255,126,0,0) 0%,rgba(255,126,0,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ff7e00', endColorstr='#0fff7e00',GradientType=0 ); }
.card-matric-summary .summary-item.color5 .summary-inn:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.card-matric-summary .summary-item.color5 .count:before { background: var(--orange-color); }

/* Color 6 */
.card-matric-summary .summary-item.color6 .summary-inn { background: -moz-linear-gradient(top,  rgba(255,204,0,0) 0%, rgba(255,204,0,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(255,204,0,0) 0%,rgba(255,204,0,0.06) 100%);
background: linear-gradient(to bottom,  rgba(255,204,0,0) 0%,rgba(255,204,0,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffcc00', endColorstr='#0fffcc00',GradientType=0 ); }
.card-matric-summary .summary-item.color6 .summary-inn:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.card-matric-summary .summary-item.color6 .count:before { background: var(--yellow-color); }

/* Color 7 */
.card-matric-summary .summary-item.color7 .summary-inn { background: -moz-linear-gradient(top,  rgba(118,102,215,0) 0%, rgba(118,102,215,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(118,102,215,0) 0%,rgba(118,102,215,0.06) 100%);
background: linear-gradient(to bottom,  rgba(118,102,215,0) 0%,rgba(118,102,215,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007666d7', endColorstr='#0f7666d7',GradientType=0 ); }
.card-matric-summary .summary-item.color7 .summary-inn:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
.card-matric-summary .summary-item.color7 .count:before { background: var(--violet-bg); }

/* Color 8 */
.card-matric-summary .summary-item.color8 .summary-inn { background: -moz-linear-gradient(top,  rgba(81,184,72,0) 0%, rgba(81,184,72,0.06) 100%);
background: -webkit-linear-gradient(top,  rgba(81,184,72,0) 0%,rgba(81,184,72,0.06) 100%);
background: linear-gradient(to bottom,  rgba(81,184,72,0) 0%,rgba(81,184,72,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0051b848', endColorstr='#0f51b848',GradientType=0 ); }
.card-matric-summary .summary-item.color8 .summary-inn:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.card-matric-summary .summary-item.color8 .count:before { background: var(--green-color); }

/* Color 1 */
/* .card-matric-summary .summary-item.color1 .summary-inn { background: -moz-linear-gradient(top, rgba(38,61,184,0) 0%, rgba(38,61,184,0.06) 100%);
background: -webkit-linear-gradient(top, rgba(38,61,184,0) 0%,rgba(38,61,184,0.06) 100%);
background: linear-gradient(to bottom, rgba(38,61,184,0) 0%,rgba(38,61,184,0.06) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007666d7', endColorstr='#0f7666d7',GradientType=0 ); }
.card-matric-summary .summary-item.color1 .summary-inn:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.card-matric-summary .summary-item.color1 .count:before { background: var(--blue-color); } */

/* Sticky Table */
.table-scroll { display: inline-block; max-height: calc(100vh - 400px); max-width: 100%; min-height: 200px; outline-offset: -1px; overflow: auto; position: relative; width: 100%; }
.table-scroll-inn { display: inline-block; position: relative; outline-offset: -1px; max-width: 100%; overflow: auto; width: 100%; /* max-height: calc(100vh - 400px); */ min-height: 200px; /* max-height: calc(100vh - 250px); min-height: 300px; height: calc(100vh - 250px); */ overflow: auto; overflow-y: auto; overflow-x: auto; }
.fixed-headers { border-collapse: separate; border-spacing: 0; width: 100%; }
.fixed-headers th { position: -webkit-sticky !important; position: sticky !important; left: 0; }
.fixed-headers .sub-table-main th { position: -webkit-static !important; position: static !important; }
/* .fixed-headers tbody td:nth-child(1) { position: -webkit-sticky !important; position: sticky !important; left: 0; z-index: 1; } */
.fixed-headers thead th { z-index: 1; top: 0; left: auto; /* resize: horizontal; */ overflow: auto; vertical-align: baseline; }

/* Start Pivot Table 2 */
.pivot-table2 #wdr-pivot-view .wdr-fields-view-wrap #wdr-btn-open-fields { border-color: var(--light-border-color); width: 36px; height: 36px; padding: 7px; }
.pivot-table2 #wdr-pivot-view .wdr-fields-view-wrap #wdr-btn-open-fields:before { color: var(--black-color); font-size: 20px; }
.pivot-table2 #wdr-pivot-view .wdr-fields-view-wrap #wdr-btn-open-fields:hover { background: var(--aqua-haze-bg-color); }

.pivot-table2 { width: 100%; padding: 10px; }
.pivot-table2 > .wdr-ui-element { height: calc(100vh - 140px) !important; min-height: 500px; }
.pivot-table2 .wdr-credits { display: none; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-window .wdr-popup-subtitle { color: var(--blue-color); }

.pivot-table2 #wdr-toolbar-wrapper #wdr-toolbar .wdr-dropdown-content { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-color: var(--light-border-color); border-radius: 6px; padding: 8px 2px; }
.pivot-table2 #wdr-toolbar-wrapper #wdr-toolbar .wdr-dropdown-content:before { border-color: transparent transparent var(--light-border-color); }
.pivot-table2 #wdr-toolbar-wrapper #wdr-toolbar .wdr-dropdown-content a { height: auto; border-radius: 6px; }
.pivot-table2 #wdr-toolbar-wrapper #wdr-toolbar .wdr-dropdown-content .wdr-svg-icon svg { width: 24px; height: 24px; fill: var(--black-color); }
.pivot-table2 #wdr-toolbar-wrapper #wdr-toolbar .wdr-dropdown-content .wdr-svg-icon svg path { fill: var(--black-color); }

.pivot-table2 #wdr-pivot-view .wdr-ui-btns-row .wdr-ui-btn,
.pivot-table2 #wdr-toolbar-wrapper .wdr-ui-btns-row .wdr-ui-btn { height: auto; }

.pivot-table2 #wdr-pivot-view a.wdr-ui-btn,
.pivot-table2 #wdr-toolbar-wrapper a.wdr-ui-btn { background: var(--light-bg-color); color: var(--light-color); font-size: 14px; line-height: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; text-transform: inherit; }
.pivot-table2 #wdr-pivot-view a.wdr-ui-btn:hover,
.pivot-table2 #wdr-toolbar-wrapper a.wdr-ui-btn:hover { background: var(--light-bg-hvr-color); color: var(--black-color); }

.pivot-table2 #wdr-pivot-view a.wdr-ui-btn-light,
.pivot-table2 #wdr-toolbar-wrapper a.wdr-ui-btn-light { border-color: var(--light-border-color); padding: 9px 15px; }
.pivot-table2 #wdr-pivot-view a.wdr-ui-btn,
.pivot-table2 #wdr-toolbar-wrapper a.wdr-ui-btn { padding: 8px 20px; }

.pivot-table2 #wdr-pivot-view a.wdr-ui-btn-dark,
.pivot-table2 #wdr-toolbar-wrapper a.wdr-ui-btn-dark { background: var(--blue-color); color: #fff; }
.pivot-table2 #wdr-pivot-view a.wdr-ui-btn-dark:hover,
.pivot-table2 #wdr-toolbar-wrapper a.wdr-ui-btn-dark:hover { background: var(--blue-bg-hvr-color); color: #fff; }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-header #wdr-btn-add-measure:before { color: var(--blue-color); }

.pivot-table2 #wdr-pivot-view div.wdr-ui-window { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-color: var(--light-border-color); border-radius: 6px; padding: 15px; }
.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view.wdr-ui-window { z-index: 1003; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-ui-window { z-index: 1004; }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap { border-color: transparent; /* border-radius: 6px; overflow: hidden; */ }


.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-header span.wdr-ui-label { color: var(--light-color); }
.pivot-table2 #wdr-pivot-view span.wdr-ui-label { font-size: 15px; font-family: 'DM Sans', sans-serif; font-weight:500; }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-header .wdr-list-header-label-wrap { padding: 0; }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content li { border-bottom-color: transparent; padding: 8px 0; height: auto; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content li:last-child { border-bottom: none; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content #wdr-lst-hierarchies li.wdr-unchecked:not(.wdr-level-folder) #wdr-icon-display { width: 20px; height: 20px; border-radius: 4px; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); border-color: var(--light-border-color); }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content #wdr-lst-hierarchies li.wdr-checked:not(.wdr-level-folder) #wdr-icon-display { width: 20px; height: 20px; border-radius: 4px; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); background: var(--blue-color); }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content #wdr-lst-hierarchies li.wdr-checked:not(.wdr-level-folder) #wdr-icon-display:before { left: 2px; top: 2px; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content li #wdr-text-display { font-size: 14px; line-height: 20px; font-family: 'DM Sans', sans-serif; font-weight:500; color: var(--black-color); }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content #wdr-lst-hierarchies li #wdr-text-display { left: 65px; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content li #wdr-drag-handle { position: absolute; left: 30px;  color: var(--light-color-op6); cursor: grab; width: 24px; height: 24px; background: url(../images/move-dot.svg) center center no-repeat; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content li #wdr-drag-handle:before { opacity: 0; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-content #wdr-lst-hierarchies li.wdr-measure:not(.wdr-calculated):after { color: var(--light-color-op6); }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-prompt { color: var(--light-color-op6); }
.pivot-table2 #wdr-pivot-view .wdr-drop-indicator { background: var(--blue-color); }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap .wdr-list-header { border-bottom-color: var(--light-border-color); background: transparent; padding: 0 0 0 0; margin-bottom: 10px; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-flat-fields .wdr-popup-content .wdr-list-wrap .wdr-list-header .wdr-ui-checkbox { margin-bottom: 12px; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-flat-fields .wdr-popup-content .wdr-list-wrap .wdr-list-header .wdr-ui-checkbox.wdr-selected { font-weight: 500; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-flat-fields .wdr-popup-content .wdr-list-wrap .wdr-list-header .wdr-ui-checkbox span.wdr-ui-label { padding-left: 30px; color: var(--black-color); }

.pivot-table2 #wdr-pivot-view a.wdr-ui-checkbox .wdr-ui-label:before { border-radius: 4px; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); border-color: var(--light-border-color); width: 20px; height: 20px; }
.pivot-table2 #wdr-pivot-view a.wdr-ui-checkbox.wdr-selected .wdr-ui-label:before { background: var(--blue-color); }
.pivot-table2 #wdr-pivot-view a.wdr-ui-checkbox .wdr-ui-label:after { left: 2px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-header-drop-indicator { background-color: var(--blue-color); }

.pivot-table2 #wdr-pivot-view a.wdr-ui-checkbox.wdr-ui-semi-selected .wdr-ui-label:after { background: var(--blue-color); top: 10px; left: 5px; opacity: 0; }

.pivot-table2 #wdr-pivot-view .wdr-helper { border: 1px dashed var(--light-border-color); background: #fff; border-radius: 4px; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; color: var(--black-color); padding: 10px 15px; z-index: 1004 !important; }

.pivot-table2 #wdr-pivot-view #wdr-aggregations-view { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-color: var(--light-border-color); border-radius: 6px; }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view .wdr-arrow:before { border-color: transparent transparent transparent var(--light-border-color); }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view .wdr-arrow:after { border-color: transparent transparent transparent #fff; }

.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list { border-radius: 6px; }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li { border-bottom: none; padding: 6px 15px; }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li span.wdr-ui-label { font-weight: 400; color: var(--light-color); }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li:hover { background: var(--light-bg-color); }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li:hover span.wdr-ui-label { color: var(--black-color); }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li.wdr-selected { background: var(--blue-color); }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li.wdr-selected span.wdr-ui-label { color: #fff; }
.pivot-table2 #wdr-pivot-view #wdr-aggregations-view ul.wdr-ui-list li.wdr-selected:before { color: #fff; top: 6px; }

.pivot-table2 #wdr-pivot-view div.wdr-ui-window .wdr-popup-header .wdr-popup-title,
.pivot-table2 #wdr-pivot-view div.wdr-ui-window .wdr-popup-header .wdr-popup-subtitle { display: none; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-window .wdr-popup-header .wdr-ui-btns-row { right: 15px; }

.pivot-table2 #wdr-pivot-view .wdr-fields-view-wrap.wdr-fields-opened { z-index: 1002; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-pivot-fields { left: auto !important; right: 0; top: 0; width: 100%; max-width: 780px; position: fixed !important; height: 100vh; overflow: auto; }
.pivot-table2 #wdr-pivot-view #wdr-calculated-view { z-index: 1002; }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-ui-col-3 { width: 100%; margin: 0 0 20px 0; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap-pages,
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-content .wdr-list-wrap-cols { margin-bottom: 20px; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-layout-mobile #wdr-wrap-pages,
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-layout-mobile #wdr-wrap-columns { margin-bottom: 20px; }

.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-layout-mobile #wdr-wrap-pages,
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-layout-mobile #wdr-wrap-columns,
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-layout-mobile #wdr-wrap-measures,
.pivot-table2 #wdr-pivot-view #wdr-fields-view.wdr-layout-mobile #wdr-wrap-rows { height: calc(50% - 10px); }

.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-header { position: absolute; bottom: 0; width: 100%; z-index: 2; left: 0; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-header .wdr-ui-btns-row { width: 100%; right: 0; padding: 0 15px; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view .wdr-popup-header .wdr-ui-btns-row .wdr-ui-btn-dark { float: left; }
.pivot-table2 #wdr-pivot-view #wdr-fields-view { padding-bottom: 70px; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-popup-header { margin-bottom: 10px; position: absolute; width: 100%; left: 0; bottom: 0; z-index: 9; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-popup-header .wdr-ui-btns-row { width: 100%; right: 0; padding: 0 15px; box-sizing:border-box; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-popup-header .wdr-ui-btns-row .wdr-ui-btn:last-child { float: right; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table.wdr-ft-contentheight-220 .wdr-filters-table-content { margin-bottom: 50px; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-popup-header + .wdr-ui-element { padding: 15px; padding-bottom: 0; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view { padding: 0; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filter-pages-layout .wdr-popup-header + .wdr-ui-row { display: none; }

/* popup */
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-sort-label { display: none; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns,
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-sort-btns { margin-bottom: 15px; padding: 4px; background: var(--athens-gray); border-radius: 6px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns { width: 133px; }
#wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-top-measures-dropdown { width: calc(100% - 223px); }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns a.wdr-ui-toggle-btn.wdr-topx-btn,
.pivot-table2 #wdr-pivot-view #wdr-filter-view a.wdr-ui-toggle-btn.wdr-sort-btn { color: var(--light-color); font-size: 14px; font-weight: 500; border-radius: 6px; border-color: transparent; background: transparent; line-height: 20px; position: relative; width: auto; padding: 0 10px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns a.wdr-ui-toggle-btn.wdr-topx-btn:before,
.pivot-table2 #wdr-pivot-view #wdr-filter-view a.wdr-ui-toggle-btn.wdr-sort-btn:before { opacity: 0; height: 2px; background: var(--sky-color); content: ''; width: 3px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: 1px; transition: width 0.5s, height 4s; border-radius: 2px 2px 0 0; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns a.wdr-ui-toggle-btn.wdr-topx-btn.wdr-selected:before,
.pivot-table2 #wdr-pivot-view #wdr-filter-view a.wdr-ui-toggle-btn.wdr-sort-btn.wdr-selected:before { opacity: 1; width: 28px; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns a.wdr-ui-toggle-btn.wdr-topx-btn:hover,
.pivot-table2 #wdr-pivot-view #wdr-filter-view a.wdr-ui-toggle-btn.wdr-sort-btn:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns a.wdr-ui-toggle-btn.wdr-topx-btn.wdr-selected,
.pivot-table2 #wdr-pivot-view #wdr-filter-view a.wdr-ui-toggle-btn.wdr-sort-btn.wdr-selected { background: #fff; color: var(--black-color); box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12) !important; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns a.wdr-ui-toggle-btn.wdr-topx-btn { width: auto; padding: 0 12px; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-filters-topx-view #wdr-topx-btns { margin-bottom: 0; text-align: center; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn { margin-bottom: 14px; font-weight: 500; padding: 0 47px 0 9px; line-height: 28px; border-radius: 6px; border-color: var(--light-border-color); background: #fff; color: var(--black-color); font-size: 14px; width: auto; text-transform: inherit; position: relative; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn:before { width: 1px; height: 14px; content: ''; background: var(--light-border-color); position: absolute; top: 0; bottom: 0; margin: auto 0; right: 30px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn:after { width: 24px; height: 24px; content: ''; position: absolute; right: 3px; top: 2px; background: url(../images/chevron-down-select.svg) center center no-repeat; background-size: 20px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn.wdr-selected:after { background-image: url(../images/chevron-up-black-select.svg); }

.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn:hover { background: #fff; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn .wdr-btn-canceltopx { color: #fff; right: 7px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view #wdr-top10-btn .wdr-btn-canceltopx:before { left: -2px; top: 1px; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-subview { background: #fff; border: 1px solid var(--light-border-color); margin-bottom: 0px; padding: 10px 0px; border-left-color: transparent; border-right-color: transparent; border-bottom-color: transparent; margin-top: -3px; width: calc(100% - 30px); margin-left: 15px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-subview:before { border-color: transparent transparent var(--light-border-color) transparent; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-subview:after { border-color: transparent transparent #fff transparent; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap { border-color: transparent; margin-top: 9px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-search-btn { font-size: 0; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-search-btn .wdr-icon-act_search { color: var(--light-color); right: 0; top: 3px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-icon-act_close { color: var(--light-color); }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-search-btn .wdr-icon-act_search:before { font-size: 30px; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-search-inp { border:1px solid var(--light-border-color) !important; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; color: var(--black-color); font-style: normal; padding-left: 9px; padding-right: 40px; height: 30px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-search-inp:focus { border-color: var(--sky-color) !important; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header .wdr-search-wrap .wdr-icon-act_close:before { top: 2px; }

.pivot-table2 #wdr-pivot-view input[type="text"].wdr-ui-text-input,
.pivot-table2 #wdr-pivot-view input[type="number"].wdr-ui-text-input { padding:0 9px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:500; outline: none !important; box-shadow: none !important; height: 30px; color: var(--light-color); text-shadow: none; }
.pivot-table2 #wdr-pivot-view input[type="number"].wdr-ui-text-input { background:#fff url(../images/number-count.png) right center no-repeat; -webkit-appearance: none; padding-right: 35px; }
.pivot-table2 #wdr-pivot-view input[type="number"].wdr-ui-text-input::-webkit-inner-spin-button,
.pivot-table2 #wdr-pivot-view input[type="number"].wdr-ui-text-input::-webkit-outer-spin-button { -webkit-appearance: none; }
.pivot-table2 #wdr-pivot-view input[type="text"].wdr-ui-text-input:focus,
.pivot-table2 #wdr-pivot-view input[type="number"].wdr-ui-text-input:focus { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; }

.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-btn { padding:5px 40px 6px 9px; border-radius:6px !important; border:1px solid var(--light-border-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight:400; outline: none !important; box-shadow: none !important; height: 30px; color: var(--light-color); text-shadow: none; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-btn .wdr-ui-label { font-size: 14px; font-weight:500; color: var(--black-color); }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-btn.wdr-selected { border-color: var(--sky-color); color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33) !important; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-btn:after { color: #ccc; content: ''; width: 20px; height: 20px; background: url(../images/chevron-down-select.svg) center center no-repeat; background-size: 20px; right: 5px; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-btn.wdr-selected:after { background-image: url(../images/chevron-up-black-select.svg); }

.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-btn:before { width: 1px; height: 14px; content: ''; background: var(--light-border-color); position: absolute; top: 0; bottom: 0; margin: auto 0; right: 30px; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-color: var(--light-border-color); border-radius: 6px; padding: 8px 2px; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list:before,
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list:after { opacity: 0; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul { width: 100% !important; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li { padding: 5px 10px 2px 10px; border-radius: 4px; border-color: transparent; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li.wdr-selected { background: var(--aqua-haze-bg-color); }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li.wdr-selected:after { color: var(--blue-color); opacity:0; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li .wdr-ui-label { font-size: 14px; color: var(--black-color); font-weight: 500; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li:hover { background: var(--blue-color); }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li:hover .wdr-ui-label { color: #fff; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-dropdown .wdr-ui-dropdown-list ul li:hover:after { color: #fff; }

.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table { border-color: transparent; border-top: 1px solid var(--light-border-color); padding: 15px; padding-top: 2px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header { background: transparent; padding: 14px 0 14px 0; border-bottom-color: var(--light-border-color); height: auto; min-height: 40px; margin-bottom: 10px; }
.pivot-table2 #wdr-pivot-view div.wdr-ui-vlist ul.wdr-ui-list { top: 0 !important; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-content #wdr-members-filter-list li { border-bottom-color: transparent; padding: 8px 0; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-content #wdr-members-filter-list li span.wdr-ui-label { position: relative; white-space: normal; color: var(--black-color); display: inline-block; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-content #wdr-members-filter-list li span.wdr-ui-label:after { top: 10px; }
.pivot-table2 #wdr-pivot-view #wdr-filter-view .wdr-filters-table .wdr-filters-table-header #wdr-select-counter { color: var(--light-color); font-size: 14px; }


.pivot-table2 #wdr-toolbar-wrapper div.wdr-popup { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-color: var(--light-border-color); border-radius: 6px; padding: 15px; }
.pivot-table2 #wdr-toolbar-wrapper div.wdr-panel .wdr-panel-content .wdr-title-bar { margin-bottom: 10px; }
.pivot-table2 #wdr-toolbar-wrapper div.wdr-panel .wdr-panel-content .wdr-title-bar .wdr-title-text { font-size: 16px; color: var(--black-color); font-family: 'DM Sans', sans-serif; font-weight: 500; text-align: left; }
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui .wdr-radio-wrap label { font-family: 'DM Sans', sans-serif; font-weight: 500; font-size: 14px; color: var(--black-color); }
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui .wdr-radio-wrap input:checked + label { font-weight: 500; }

.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui .wdr-radio-wrap label:before { width: 20px; height: 20px; border: 1px solid var(--light-border-color); background: #fff; box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); }
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui .wdr-radio-wrap input:checked + label:before { background: var(--blue-color); border-color: var(--blue-color); }
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui .wdr-radio-wrap label:after { width: 7px; height: 12px; border: 2px solid #fff; border-left: none; border-top: none; transform: translate(7.75px,4.5px) rotate(45deg); background: transparent; top: 0px; left: -1px; border-radius: inherit; }

.pivot-table2 #wdr-toolbar-wrapper div.wdr-panel .wdr-toolbox { margin-top: 10px; text-align: left; }
.pivot-table2 #wdr-toolbar-wrapper div.wdr-panel .wdr-toolbox .wdr-ui-btn { height: 36px; }

/* Table */
.pivot-table2 #wdr-pivot-view .wdr-ui,
.pivot-table2 #wdr-pivot-view .wdr-ui span,
.pivot-table2 #wdr-pivot-view .wdr-ui div,
.pivot-table2 #wdr-pivot-view .wdr-ui p,
.pivot-table2 #wdr-pivot-view .wdr-ui a,
.pivot-table2 #wdr-pivot-view .wdr-ui table,
.pivot-table2 #wdr-pivot-view .wdr-ui table th,
.pivot-table2 #wdr-pivot-view .wdr-ui table tr,
.pivot-table2 #wdr-pivot-view .wdr-ui table td,
.pivot-table2 #wdr-pivot-view .wdr-ui ul,
.pivot-table2 #wdr-pivot-view .wdr-ui li,
.pivot-table2 #wdr-pivot-view .wdr-ui input,
.pivot-table2 #wdr-pivot-view .wdr-ui textarea,
.pivot-table2 #wdr-pivot-view .wdr-ui select,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui span,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui div,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui p,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui a,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui table,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui table th,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui table tr,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui table td,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui ul,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui li,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui input,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui textarea,
.pivot-table2 #wdr-toolbar-wrapper .wdr-toolbar-ui select { font-family: 'DM Sans', sans-serif; }

.pivot-table2 #wdr-pivot-view { border-color: var(--light-bg-color); border-radius: 6px; overflow: hidden; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-sheet-header,
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters div.wdr-sheet-header { background: #fff; color: var(--light-color-op6); border-color: transparent; font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight: 500; }

.pivot-table2 .separator-td { margin: 0 8px !important; color: transparent !important; }
.pivot-table2 .separator-td:before { top: 1px; }
.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view .wdr-details-container .separator-td:before { top: 4px; }

/* Level Start */
.pivot-table2 #wdr-pivot-view .wdr-grid-layout.wdr-compact-view .wdr-header-r.wdr-level-1 { padding-left: 8px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout.wdr-compact-view .wdr-header-r.wdr-level-2 { padding-left: 8px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout.wdr-compact-view .wdr-header-r.wdr-level-3 { padding-left: 8px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout.wdr-compact-view .wdr-header-r.wdr-level-4 { padding-left: 8px; }
/* Level End */

.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-cell { color: var(--black-color); font-size: 14px; font-family: 'DM Sans', sans-serif; font-weight: 500; border-color: var(--light-bg-color); padding: 6px 8px; border-top-color: transparent; border-bottom-color: transparent; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-cell.wdr-header { color: var(--light-color-op6); transform: none; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles#wdr-rows-resize .wdr-handle { height: 24px; margin-top: -12px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles .wdr-handle:hover { background: url(../images/move-th-v.svg) center center no-repeat; background-size: 24px 24px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles .wdr-handle.wdr-active { background: url(../images/move-th-v.svg) center center no-repeat; background-size: 24px 24px; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles#wdr-cols-resize .wdr-handle { width: 24px; margin-left: -12px; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles#wdr-cols-resize .wdr-handle:hover { background-image: url(../images/move-th.svg); }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles#wdr-cols-resize .wdr-handle.wdr-active { background-image: url(../images/move-th.svg); background-color: transparent; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-resize-handles .wdr-indicator { background-color: var(--light-border-color); }

.pivot-table2 #wdr-pivot-view #wdr-context-menu { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border-color: var(--light-bg-color); border-radius: 6px; padding: 8px 2px; }
.pivot-table2 #wdr-pivot-view #wdr-context-menu .wdr-ui-list li { font-size: 14px; font-weight: 500; font-family: 'DM Sans', sans-serif; color: var(--black-color); border-radius: 6px; padding: 7px 10px; border-bottom: transparent; }
.pivot-table2 #wdr-pivot-view #wdr-context-menu .wdr-ui-list li span.wdr-ui-label { font-size: 14px; }
.pivot-table2 #wdr-pivot-view #wdr-context-menu .wdr-ui-list li:hover { background-color: var(--aqua-haze-bg-color); }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-sheet-header { /* padding: 4px 8px; */ padding: 0; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters div.wdr-sheet-header { padding: 0; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-filter-header { padding-top: 5px; padding-bottom: 5px; text-transform: none; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-filter-header,
.pivot-table2 #wdr-pivot-view .wdr-grid-layout a.wdr-filter-header { padding-right: 20px; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-cell.wdr-v-sort,
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-cell.wdr-h-sort { padding-right: 20px; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters .wdr-header,
.pivot-table2 #wdr-pivot-view .wdr-grid-layout.wdr-flat-view .wdr-header { border-right: 1px solid var(--light-bg-color); border-bottom: 1px solid var(--light-bg-color); background: #fff; text-transform: inherit; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout #wdr-data-sheet { border-color: var(--light-bg-color); }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout div.wdr-header { background: #fff; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filter-header i.wdr-filter-icon:before { color: var(--light-color); }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout i.wdr-icon:before { color: var(--light-color); }

.pivot-table2 #wdr-pivot-view #wdr-rows-sheet .wdr-cell[data-n="even"]:not(.wdr-empty),
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-cell[data-n="even"]:not(.wdr-empty):not(.wdr-header) { background: var(--aqua-haze-bg-color); }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-row:hover div.wdr-cell { background: var(--light-bg-color) !important; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-row div.wdr-cell.wdr-header { background: #fff !important; color: var(--light-color-op6); }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-auto-calculation-bar { background: var(--blue-color); }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-auto-calculation-bar .wdr-auto-calculation-bar-content-results { font-weight: 500; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters { background-color: transparent; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout #wdr-cols-filter { border-color: transparent; }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-sheet-selection-canvas {  background-color: rgba(230, 233, 237, 0.2); border-color: var(--blue-color);  }
/*#wdr-pivot-view .wdr-grid-layout .wdr-sheet-selection-header {  border-remove  }*/

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters#wdr-page-filter { background: #fff; border-bottom-color: var(--light-bg-color); }

.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters#wdr-page-filter a.wdr-filter-header { font-size: 14px; font-weight: 500 !important; font-family: 'DM Sans', sans-serif; margin: 0; color: var(--light-color-op6); background-color: transparent; }
.pivot-table2 #wdr-pivot-view .wdr-grid-layout .wdr-filters a.wdr-filter-header .wdr-filter-desc { font-weight: 500 !important; color: var(--light-color-op6); }

/* Sub Drop */
.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view .wdr-grid-container { border-color: var(--light-bg-color); border-radius: 6px; overflow: hidden; }
.pivot-table2 #wdr-pivot-view span.wdr-ui-label-light { color: var(--blue-color); }
.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view .wdr-details-container .wdr-ui-label b { color: var(--black-color); }
.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view .wdr-details-container { margin-bottom: 15px; position: absolute; top: 52px; padding-left: 70px; width: 100%; }

.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view .wdr-header-container { margin: 10px 0; }
.pivot-table2 #wdr-pivot-view #wdr-drillthrough-view .wdr-ui-btn-close { padding: 5px; z-index: 2; display: none; }
.pivot-table2 #wdr-pivot-view a.wdr-ui-btn.wdr-ui-btn-close:before { font-size: 20px; }

/* Modal Backdrop */
.pivot-table2 #wdr-pivot-view div.wdr-ui-modal-overlay,
.pivot-table2 #wdr-pivot-view div.wdr-ui-modal-overlay.wdr-overlay-preloader { opacity: 0; }
/* Loader */
.pivot-table2 #wdr-pivot-view .wdr-ui-window#wdr-preloader-view { padding: 0; background: none; box-shadow: none; border-color: transparent; height: 50px; width: 50px; }
.pivot-table2 #wdr-pivot-view #wdr-preloader-view #wdr-spinner:before { color: var(--blue-color); }
.pivot-table2 #wdr-pivot-view #wdr-preloader-view #wdr-message-label,
.pivot-table2 #wdr-pivot-view #wdr-preloader-view #wdr-details-label { display: none; }
/* wdr-details-label */

#wdr-drillthrough-view .pivot-modal-header { margin: -15px -15px 0 -15px !important; width: calc(100% + 30px) !important; }
#wdr-fields-view .pivot-modal-header { margin: -15px -15px 15px -15px !important; width: calc(100% + 30px) !important; }

.pivot-modal-header { background: var(--light-bg-color); border-radius: 6px 6px 0 0 !important; display: flex; align-items: center; justify-content: space-between; padding: 5px !important; }
body .pivot-modal-header .btn.pivot-move.bg-none { background: url(../images/move-grey.svg) center center no-repeat !important; background-size: 20px 20px !important; min-width: 28px; }
body .pivot-modal-header .btn.pivot-move.bg-none:hover,
body .pivot-modal-header .btn.pivot-move.bg-none:not([disabled]):not(.disabled):active { background: url(../images/move.svg) center center no-repeat !important; background-size: 20px 20px !important; background-color: var(--light-bg-hvr-color) !important; }

body .pivot-modal-header .btn.pivot-close.bg-none { background: url(../images/x-grey.svg) center center no-repeat !important; background-size: 20px 20px !important; min-width: 28px; }
body .pivot-modal-header .btn.pivot-close.bg-none:hover,
body .pivot-modal-header .btn.pivot-close.bg-none:not([disabled]):not(.disabled):active { background: url(../images/x.svg) center center no-repeat !important; background-size: 20px 20px !important; background-color: var(--light-bg-hvr-color) !important; }
.pivot-modal-header .pivot-title { font-size: 16px !important; color: var(--black-color); text-align: center; width: 100%; padding: 2px 10px; font-family: 'DM Sans', sans-serif !important; font-weight: 500 !important; }

/*body .react-draggable .pivot-modal-header {  }*/
body .react-draggable { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12),0px 1px 48px 0px rgba(0, 0, 0, 0.06); border: 1px solid var(--light-border-color) !important; border-radius: 6px; overflow: hidden; }
body .react-draggable .body { padding: 8px 2px; }
body .react-draggable ul { padding: 0; margin: 0; overflow: auto; max-height: 240px !important; }
body .react-draggable ul li { font-size: 14px; color: var(--black-color); font-weight: 500; border-radius: 4px; padding: 5px 10px; cursor: pointer; }
body .react-draggable ul li:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }
body .react-draggable ul li.li-active { background: var(--blue-color); color: #fff; }

.pivot-modal-open .pivot-table2 #wdr-pivot-view,
.pivot-modal-open .main-content { overflow: initial; }
.pivot-modal-open .page-content-main { overflow-y:initial; }

#hideSettingBtn #wdr-pivot-view .wdr-fields-view-wrap #wdr-btn-open-fields { display: none; }
/* End Pivot Table 2 */

/* Start HR */
.leave-duration { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; }
.leave-duration .duration { font-size: 14px; line-height: 18px; color: var(--light-color); font-weight: 500; }
.leave-duration .duration b { font-size: 16px; color: var(--black-color); font-weight: 500; }
.leave-duration .duration .duration-inn { display: flex; align-items: center; }

.leave-duration-row.row { margin-left: -15px; margin-right: -15px; }
.leave-duration-row.row>* { padding-left: 15px; padding-right: 15px; }

.duration-column-main { display: flex; }

/* Task List Table Sticky */
table.table-design.task-list-table tr > th.td-sticky,
table.table-design.task-list-table tr > td.td-sticky { z-index: 7; position: sticky !important; }
table.table-design.task-list-table thead tr > th.td-sticky { z-index: 8; }

table.table-design.task-list-table tr > th.td-1,
table.table-design.task-list-table tr > td.td-1 { border-left: 0px solid var(--light-border-color) !important; right: 0 !important; min-width: 160px !important; width: 160px !important; }

table.table-design.task-list-table tr > th.td-1:before { width: 100% !important; height: 10px !important; position: absolute; bottom: -10px; left: 0 !important; right: auto !important; top: auto !important; content: ''; opacity: 0.059; z-index: 9;
background: -moz-linear-gradient(top,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%) !important;
background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%) !important;
background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%) !important;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 ) !important; }
table.table-design.task-list-table tr > th.td-1:after,
table.table-design.task-list-table tr > td.td-1:before { position: absolute; left: -10px; top: 0; width: 10px;  height: 100%; content: ''; opacity: 0.06;
background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); }

table.table-design.task-list-table tr td.td-input-w,
table.table-design.task-list-table tr th.td-input-w { min-width: 200px; width: 100% !important; white-space: break-spaces; }
table.table-design.task-list-table tr td.td-textarea-w,
table.table-design.task-list-table tr th.td-textarea-w { min-width: 400px; width: 100% !important; white-space: break-spaces; }

/* Start Table 1 */
.scrolling-lock-table-wrapper-hr-at-monthly-report { position: relative; padding-left: 10px; padding-right: 10px; }
.scrolling-lock-table-wrapper-hr-at-monthly-report:before { position: absolute; left: 0; top: 0; content: ''; width: 100%; height: 100%; border-radius: 6px; background: var(--danger-color); z-index: 9; opacity: 0.5; }
.scrolling-lock-table-wrapper-hr-at-monthly-report:after { position: absolute; left: 0; top: 50%; content: 'No Use This Monthly Report'; font-size: 40px; font-weight: 500; line-height: 100%; text-align: center; width: 100%; color: #fff; z-index: 99; font-family: 'DM Sans', sans-serif; }
.scrolling-lock-table-wrapper-hr-at-monthly-report .table-scroll { padding-left: 350px !important; padding-right: 218px; }
.scrolling-lock-table-wrapper-hr-at-monthly-report .fixed-headers { overflow-x:scroll; overflow-y:visible; width: 100%; padding-bottom: 0 !important; }

table.table-design.hr-at-monthly-report-table thead tr > th { height: 58px; padding-top: 9px !important; padding-bottom: 9px !important; }
table.table-design.hr-at-monthly-report-table thead tr > th.secondsec-td { padding-top: 6px !important; padding-bottom: 8px !important; }
table.table-design.hr-at-monthly-report-table tbody tr > td { height: 30px !important; }
table.table-design.hr-at-monthly-report-table tr > th.secondsec-td,
table.table-design.hr-at-monthly-report-table tr > td.secondsec-td { padding-left: 4px !important; padding-right: 4px !important; }
table.table-design.hr-at-monthly-report-table tbody tr > td.secondsec-td,
table.table-design.hr-at-monthly-report-table tbody tr > td.thirdsec-td { padding-top: 4px !important; padding-bottom: 4px !important; }
table.table-design.hr-at-monthly-report-table tr > th .date-box-table,
table.table-design.hr-at-monthly-report-table tr > td .date-box-table { border-radius: 6px; width: 30px; height: 22px; line-height: 22px; margin: 0 auto 2px auto; display: block; }
table.table-design.hr-at-monthly-report-table tr > th.active-day .date-box-table,
table.table-design.hr-at-monthly-report-table tr > td.active-day .date-box-table { background: var(--sky-color); color: #fff; }

table.table-design.hr-at-monthly-report-table tr > th .punch-b,
table.table-design.hr-at-monthly-report-table tr > td .punch-b { width: 40px; padding-left: 5px; border: 1px solid var(--light-border-color); border-radius: 6px; background: #fff !important; font-size: 12px; font-weight: 500; line-height: 20px; color: var(--black-color); z-index: 1; position: relative; text-align: center; text-transform: uppercase; }
table.table-design.hr-at-monthly-report-table tr > th:hover .punch-b,
table.table-design.hr-at-monthly-report-table tr > td:hover .punch-b,
table.table-design.hr-at-monthly-report-table tr > th:active .punch-b,
table.table-design.hr-at-monthly-report-table tr > td:active .punch-b { border-color: var(--sky-color); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.clicked,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.clicked { border-color: var(--blue-color); outline: 1px solid var(--blue-color); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.clicked:after,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.clicked:after { width: 12px; height: 12px; position: absolute; right: 0; top: 0; content: ''; border-width: 0 12px 12px 0; border-color: transparent var(--blue-color) transparent transparent; border-style: solid; }
table.table-design.hr-at-monthly-report-table tr > th .punch-b:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b:before { background: var(--light-border-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.33); width: 3px; height: 14px; border-radius: 1.5px; content: ''; position: absolute; left: 2px; top: 3px; }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.pink:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.pink:before { background: var(--pink-color);  box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.blue:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.sky-blue:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.green:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.green2:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.orange:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.orange:before { background: var(--orange-color);  box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.red:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.red:before { background: var(--danger-color);  box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.light:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.light:before { background: var(--light-color);  box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.yellow:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.violet:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.cyan:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

table.table-design.hr-at-monthly-report-table tr > th .punch-b.leave,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.leave { padding-left: 0; }
table.table-design.hr-at-monthly-report-table tr > th .punch-b.leave:before,
table.table-design.hr-at-monthly-report-table tr > td .punch-b.leave:before { opacity: 0; }

table.table-design.hr-at-monthly-report-table tr:hover > th .punch-b.leave.green,
table.table-design.hr-at-monthly-report-table tr:hover > td .punch-b.leave.green,
table.table-design.hr-at-monthly-report-table tr:active > th .punch-b.leave.green,
table.table-design.hr-at-monthly-report-table tr:active > td .punch-b.leave.green { background: #eaf6e9 !important; border-color: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
table.table-design.hr-at-monthly-report-table tr:hover > th .punch-b.leave.orange,
table.table-design.hr-at-monthly-report-table tr:hover > td .punch-b.leave.orange,
table.table-design.hr-at-monthly-report-table tr:active > th .punch-b.leave.orange,
table.table-design.hr-at-monthly-report-table tr:active > td .punch-b.leave.orange { background: #ffefe0 !important; border-color: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
table.table-design.hr-at-monthly-report-table tr:hover > th .punch-b.leave.red,
table.table-design.hr-at-monthly-report-table tr:hover > td .punch-b.leave.red,
table.table-design.hr-at-monthly-report-table tr:active > th .punch-b.leave.red,
table.table-design.hr-at-monthly-report-table tr:active > td .punch-b.leave.red { background: #fde9e9 !important; border-color: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
table.table-design.hr-at-monthly-report-table tr:hover > th .punch-b.leave.yellow,
table.table-design.hr-at-monthly-report-table tr:hover > td .punch-b.leave.yellow,
table.table-design.hr-at-monthly-report-table tr:active > th .punch-b.leave.yellow,
table.table-design.hr-at-monthly-report-table tr:active > td .punch-b.leave.yellow { background: #fff9e0 !important; border-color: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
table.table-design.hr-at-monthly-report-table tr:hover > th .punch-b.leave.violet,
table.table-design.hr-at-monthly-report-table tr:hover > td .punch-b.leave.violet,
table.table-design.hr-at-monthly-report-table tr:active > th .punch-b.leave.violet,
table.table-design.hr-at-monthly-report-table tr:active > td .punch-b.leave.violet { background: #eeecfa !important; border-color: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }

table.table-design.hr-at-monthly-report-table tr > th .leave-box-table,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table { width: 40px; height: 40px; border-radius: 6px; color: var(--black-color); line-height: 32px; border: 1px solid var(--light-border-color); background: #fff !important; position: relative; }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table:before { background: var(--light-border-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.33); width: calc(100% - 6px); height: 3px; border-radius: 1.5px; content: ''; position: absolute; left: 3px; bottom: 3px; }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.pink:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.pink:before { background: var(--pink-color);  box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.blue:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.sky-blue:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.green:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.green2:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.orange:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.orange:before { background: var(--orange-color);  box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.red:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.red:before { background: var(--danger-color);  box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.light:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.light:before { background: var(--light-color);  box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.yellow:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.violet:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
table.table-design.hr-at-monthly-report-table tr > th .leave-box-table.cyan:before,
table.table-design.hr-at-monthly-report-table tr > td .leave-box-table.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

table.table-design.hr-at-monthly-report-table tr > th.td-sticky.firstsec-td,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.firstsec-td { position: absolute !important; left: 0; min-width: 200; width: 200px; height: 29px; }

table.table-design.hr-at-monthly-report-table thead tr > th.td-sticky.firstsec-td { top: 28px; padding-right: 18px !important; }
table.table-design.hr-at-monthly-report-table thead tr > th.td-sticky.firstsec-td.col3-td { min-width: 350px; width: 350px; height: 29px; top: 0; }
table.table-design.hr-at-monthly-report-table thead tr > th.td-sticky.firstsec-td.col3-td:after { position: absolute; right: 0px; top: 0; width: 1px; height: 100%; content: ''; background: var(--light-border-color); }
table.table-design.hr-at-monthly-report-table thead tr > th.td-sticky.firstsec-td.col3-td:before{ position: absolute; right: -10px; top: 0; width: 10px;  height: 100%; content: ''; opacity: 0.06; z-index: 99;
background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); }

table.table-design.hr-at-monthly-report-table tr > th.td-sticky.firstsec-td.td-2,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.firstsec-td.td-2 { position: absolute; left: 200px; min-width: 150px; width: 150px; }
table.table-design.hr-at-monthly-report-table tr > th.firstsec-td.firstsec-last-td:after,
table.table-design.hr-at-monthly-report-table tr > td.firstsec-td.firstsec-last-td:after { position: absolute; right: 0px; top: 0; width: 1px; height: 100%; content: ''; background: var(--light-border-color); }
table.table-design.hr-at-monthly-report-table tr > th.firstsec-td.firstsec-last-td:before,
table.table-design.hr-at-monthly-report-table tr > td.firstsec-td.firstsec-last-td:before{ position: absolute; right: -10px; top: 0; width: 10px;  height: 100%; content: ''; opacity: 0.06; z-index: 9;
background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); }

table.table-design.hr-at-monthly-report-table tr > th.secondsec-td,
table.table-design.hr-at-monthly-report-table tr > td.secondsec-td { position: relative; text-align: center; }
table.table-design.hr-at-monthly-report-table tr > th.secondsec-td:nth-of-type(2n+0):after,
table.table-design.hr-at-monthly-report-table tr > td.secondsec-td:nth-of-type(2n+0):after { background: var(--light-border-color); opacity: 0.2; left: 0; top: 0; position: absolute; content: ''; width: 100%; height: 100%; }
table.table-design.hr-at-monthly-report-table tr > th.secondsec-td.active-day:after,
table.table-design.hr-at-monthly-report-table tr > td.secondsec-td.active-day:after { background: var(--sky-color); opacity: 0.059; }

table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td { z-index: 2; position: absolute !important; right: 0; width: 120px; padding-left: 1px !important; padding-right: 1px !important; }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.third-first-td,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.third-first-td { padding-left: 10px !important; border-left: 1px solid var(--light-border-color); }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.third-first-td:before,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.third-first-td:before { position: absolute; left: -10px; top: 0; width: 10px;  height: 100%; content: ''; opacity: 0.06;
background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.third-last-td,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.third-last-td { padding-right: 10px !important; }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.td-1,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.td-1 { width: 52px; right: 177px; }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.td-2,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.td-2 { width: 42px; right: 135px; }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.td-3,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.td-3 { width: 42px; right: 93px; }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.td-4,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.td-4 { width: 42px; right: 51px; }
table.table-design.hr-at-monthly-report-table tr > th.td-sticky.thirdsec-td.td-5,
table.table-design.hr-at-monthly-report-table tr > td.td-sticky.thirdsec-td.td-5 { width: 51px; right: 0px; }
/* End Table 1 */

/* Start Table 2 */
.scrolling-lock-table-wrapper-hr-at-monthly-report2 { padding: 0 10px 0px 10px; position: relative; }
.scrolling-lock-table-wrapper-hr-at-monthly-report2 .responsive-table { min-height: 300px; max-height: 300px; }

.scrolling-lock-table-wrapper-hr-at-monthly-report2:before,
.scrolling-lock-table-wrapper-hr-at-monthly-report2:after { width: 10px; height: 10px; position: absolute; left: 0; top: 60px; content: ''; opacity: 0.059; z-index: 9;
background: -moz-linear-gradient(top,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 );
/* background: #ff7e00; opacity: 1; */ }
.scrolling-lock-table-wrapper-hr-at-monthly-report2:after { left: auto; right: 0; }

table.table-design.hr-at-monthly-report-table2 thead tr { position: relative; z-index: 9; }
table.table-design.hr-at-monthly-report-table2 thead tr > th { height: 42px; top: 0; z-index: 3; position: sticky !important; padding-top: 5px !important; padding-bottom: 5px !important; border-radius: 0 !important; }
table.table-design.hr-at-monthly-report-table2 thead tr > th.thirdsec-td { z-index: 4; padding-top: 9px !important; padding-bottom: 9px !important; }
table.table-design.hr-at-monthly-report-table2 thead tr > th.secondsec-td { padding-top: 6px !important; padding-bottom: 8px !important; }
table.table-design.hr-at-monthly-report-table2 thead tr > th:before { width: 100% !important; height: 10px !important; position: absolute; bottom: -10px; left: 0 !important; right: auto !important; top: auto !important; content: ''; opacity: 0.059; z-index: 9;
background: -moz-linear-gradient(top,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%) !important;
background: -webkit-linear-gradient(top,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%) !important;
background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%) !important;
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=0 ) !important; }
table.table-design.hr-at-monthly-report-table2 tr > th.secondsec-td,
table.table-design.hr-at-monthly-report-table2 tr > td.secondsec-td { padding-left: 4px !important; padding-right: 4px !important; }
table.table-design.hr-at-monthly-report-table2 tbody tr > td { height: 20px !important; }
table.table-design.hr-at-monthly-report-table2 tbody tr > td.secondsec-td,
table.table-design.hr-at-monthly-report-table2 tbody tr > td.thirdsec-td { padding-top: 4px !important; padding-bottom: 4px !important; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-date,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-date { position: relative; z-index: 1; }
table.table-design.hr-at-monthly-report-table2 tr > th .date-box-table,
table.table-design.hr-at-monthly-report-table2 tr > td .date-box-table { border-radius: 6px; width: 30px; height: 22px; line-height: 22px; margin: 0 auto 2px auto; display: block; }
table.table-design.hr-at-monthly-report-table2 tr > th.active-day .date-box-table,
table.table-design.hr-at-monthly-report-table2 tr > td.active-day .date-box-table { background: var(--sky-color); color: #fff; }

table.table-design.hr-at-monthly-report-table2 tr > th .punch-b,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b { width: 40px; padding-left: 5px; border: 1px solid var(--light-border-color); border-radius: 6px; background: #fff !important; font-size: 12px; font-weight: 500; line-height: 20px; color: var(--black-color); z-index: 1; position: relative; text-align: center; text-transform: uppercase; margin: 0 auto; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.no-attendance,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.no-attendance { background: none !important; height: 22px; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.no-attendance:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.no-attendance:before { opacity: 0; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.no-attendance.clicked,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.no-attendance.clicked { background: #fff !important; }
table.table-design.hr-at-monthly-report-table2 tr > th.secondsec-td:hover .punch-b,
table.table-design.hr-at-monthly-report-table2 tr > td.secondsec-td:hover .punch-b,
table.table-design.hr-at-monthly-report-table2 tr > th.secondsec-td:active .punch-b,
table.table-design.hr-at-monthly-report-table2 tr > td.secondsec-td:active .punch-b { border-color: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); cursor: pointer; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.clicked,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.clicked { border-color: var(--blue-color) !important; outline: 1px solid var(--blue-color); box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12) !important; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.clicked:after,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.clicked:after { width: 12px; height: 12px; position: absolute; right: 0; top: 0; content: ''; border-width: 0 12px 12px 0; border-color: transparent var(--blue-color) transparent transparent; border-style: solid; }

table.table-design.hr-at-monthly-report-table2 tr > th .punch-b:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b:before { background: var(--light-border-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.33); width: 3px; height: 14px; border-radius: 1.5px; content: ''; position: absolute; left: 2px; top: 3px; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.pink:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.pink:before { background: var(--pink-color);  box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.blue:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.sky-blue:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.green:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.green2:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.orange:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.orange:before { background: var(--orange-color);  box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.red:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.red:before { background: var(--danger-color);  box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.light:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.light:before { background: var(--light-color);  box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.yellow:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.violet:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.cyan:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.leave,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.leave { padding-left: 0; }
table.table-design.hr-at-monthly-report-table2 tr > th .punch-b.leave:before,
table.table-design.hr-at-monthly-report-table2 tr > td .punch-b.leave:before { opacity: 0; }

table.table-design.hr-at-monthly-report-table2 tr:hover > th .punch-b.leave.green,
table.table-design.hr-at-monthly-report-table2 tr:hover > td .punch-b.leave.green,
table.table-design.hr-at-monthly-report-table2 tr:active > th .punch-b.leave.green,
table.table-design.hr-at-monthly-report-table2 tr:active > td .punch-b.leave.green { background: #eaf6e9 !important; border-color: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr:hover > th .punch-b.leave.orange,
table.table-design.hr-at-monthly-report-table2 tr:hover > td .punch-b.leave.orange,
table.table-design.hr-at-monthly-report-table2 tr:active > th .punch-b.leave.orange,
table.table-design.hr-at-monthly-report-table2 tr:active > td .punch-b.leave.orange { background: #ffefe0 !important; border-color: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr:hover > th .punch-b.leave.red,
table.table-design.hr-at-monthly-report-table2 tr:hover > td .punch-b.leave.red,
table.table-design.hr-at-monthly-report-table2 tr:active > th .punch-b.leave.red,
table.table-design.hr-at-monthly-report-table2 tr:active > td .punch-b.leave.red { background: #fde9e9 !important; border-color: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr:hover > th .punch-b.leave.yellow,
table.table-design.hr-at-monthly-report-table2 tr:hover > td .punch-b.leave.yellow,
table.table-design.hr-at-monthly-report-table2 tr:active > th .punch-b.leave.yellow,
table.table-design.hr-at-monthly-report-table2 tr:active > td .punch-b.leave.yellow { background: #fff9e0 !important; border-color: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr:hover > th .punch-b.leave.violet,
table.table-design.hr-at-monthly-report-table2 tr:hover > td .punch-b.leave.violet,
table.table-design.hr-at-monthly-report-table2 tr:active > th .punch-b.leave.violet,
table.table-design.hr-at-monthly-report-table2 tr:active > td .punch-b.leave.violet { background: #eeecfa !important; border-color: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }

table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table { width: 40px; height: 40px; border-radius: 6px; color: var(--black-color); line-height: 32px; border: 1px solid var(--light-border-color); background: #fff !important; position: relative; }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table:before { background: var(--light-border-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.33); width: calc(100% - 6px); height: 3px; border-radius: 1.5px; content: ''; position: absolute; left: 3px; bottom: 3px; }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.pink:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.pink:before { background: var(--pink-color);  box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.blue:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.blue:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.sky-blue:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.sky-blue:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.green:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.green:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.green2:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.green2:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.orange:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.orange:before { background: var(--orange-color);  box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.red:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.red:before { background: var(--danger-color);  box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.light:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.light:before { background: var(--light-color);  box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.yellow:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.yellow:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.violet:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.violet:before { background: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
table.table-design.hr-at-monthly-report-table2 tr > th .leave-box-table.cyan:before,
table.table-design.hr-at-monthly-report-table2 tr > td .leave-box-table.cyan:before { background: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }

table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.firstsec-td,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.firstsec-td { position: sticky !important; left: 0; top: 30px; min-width: 200px; width: 200px; height: 20px; z-index: 4; }
table.table-design.hr-at-monthly-report-table2 thead tr > th.td-sticky.firstsec-td { z-index: 5; }

table.table-design.hr-at-monthly-report-table2 thead tr > th.td-sticky.firstsec-td.col3-td { top: 0; }
table.table-design.hr-at-monthly-report-table2 thead tr > th.td-sticky.firstsec-td.col3-td:after { position: absolute; right: 0px; top: 0; width: 1px; height: 100%; content: ''; background: var(--light-border-color); }
table.table-design.hr-at-monthly-report-table2 thead tr > th.td-sticky.firstsec-td.col3-td:before{ position: absolute; right: -10px; top: 0; width: 10px;  height: 100%; content: ''; opacity: 0.06;
background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); }

table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.firstsec-td.td-2,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.firstsec-td.td-2 { position: sticky; left: 200px; min-width: 150px; width: 150px; }
table.table-design.hr-at-monthly-report-table2 tr > th.firstsec-td.firstsec-first-td:after,
table.table-design.hr-at-monthly-report-table2 tr > td.firstsec-td.firstsec-first-td:after { position: absolute; right: 0px; top: 0; width: 1px; height: 100%; content: ''; background: var(--light-border-color); }
table.table-design.hr-at-monthly-report-table2 tr > th.firstsec-td.firstsec-first-td:before,
table.table-design.hr-at-monthly-report-table2 tr > td.firstsec-td.firstsec-first-td:before{ position: absolute; right: -10px; top: -10px; width: 10px;  height: 100%; content: ''; opacity: 0.06;
background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); }

table.table-design.hr-at-monthly-report-table2 tr > th.secondsec-td,
table.table-design.hr-at-monthly-report-table2 tr > td.secondsec-td { position: relative; text-align: center; }
table.table-design.hr-at-monthly-report-table2 tr > th.secondsec-td.odd:after,
table.table-design.hr-at-monthly-report-table2 tr > td.secondsec-td.odd:after { background: var(--light-border-color); opacity: 0.2; left: 0; top: 0; position: absolute; content: ''; width: 100%; height: 100%; }
table.table-design.hr-at-monthly-report-table2 tr > th.secondsec-td.active-day:after,
table.table-design.hr-at-monthly-report-table2 tr > td.secondsec-td.active-day:after { background: var(--sky-color); opacity: 0.059; left: 0; top: 0; position: absolute; content: ''; width: 100%; height: 100%; }

table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td { z-index: 4; position: sticky !important; right: 0; width: 120px; padding-left: 1px !important; padding-right: 1px !important; }
table.table-design.hr-at-monthly-report-table2 thead tr > th.td-sticky.thirdsec-td { z-index: 5; }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.third-first-td,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.third-first-td { padding-left: 10px !important; border-left: 1px solid var(--light-border-color); }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.third-first-td:before,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.third-first-td:before { position: absolute; left: -10px; top: 0; width: 10px;  height: 100%; content: ''; opacity: 0.06;
background: -moz-linear-gradient(left,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(left,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 ); }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.third-last-td,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.third-last-td { padding-right: 10px !important; }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.td-1,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.td-1 { width: 52px; right: 177px; }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.td-2,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.td-2 { width: 42px; right: 135px; }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.td-3,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.td-3 { width: 42px; right: 93px; }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.td-4,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.td-4 { width: 42px; right: 51px; }
table.table-design.hr-at-monthly-report-table2 tr > th.td-sticky.thirdsec-td.td-5,
table.table-design.hr-at-monthly-report-table2 tr > td.td-sticky.thirdsec-td.td-5 { width: 51px; right: 0px; }
/* End Table 1 */

.attendance-top-filter { width: 100%; display: flex; align-items: flex-start; }
.attendance-top-filter .list .separator { font-size: 13px; line-height: 24px; margin-left: 10px; font-weight: 500; color: var(--light-border-color); display: inline-block; margin-top: 1px; }

/* Start Attendance Regularization */
.emp-slide { white-space: nowrap; display: flex; font-size: 13px; line-height: 30px; color: var(--light-color); font-weight: 500; }
.emp-slide .emp-current { color: var(--black-color); padding: 0 4px; min-width: 17px; position: relative; text-align: center; }
.emp-slide .emp-current:before { position: absolute; left: 0; bottom: 0; content: ''; width: 100%; height: 2px; background: var(--sky-color); border-radius: 2px 2px 0 0; }
.emp-slide .separator { padding: 0 4px; color: var(--light-border-color); }

.calendar-prev-next-btn { min-width: 62px; }
body .calendar-prev-next-btn .btn.btnic { border-radius: 6px; width: 24px; color: var(--light-border-color); }
body .calendar-prev-next-btn .btn.btn-light.bg-none:hover,
body .calendar-prev-next-btn .btn.btn-light.bg-none:not([disabled]):not(.disabled):active { background: var(--aqua-haze-bg-color) !important; color: var(--black-color); }

/* .calender-attendance { min-height: calc(100vh - 180px); } */
.calender-attendance { min-height: calc(100vh - 200px); }
.calender-attendance .fc-theme-standard td,
.calender-attendance .fc-theme-standard th { border:1px solid var(--light-border-color); }
.calender-attendance .fc-theme-standard thead th { border-right: none; }
.calender-attendance .fc .fc-scrollgrid-section > * { border-top-width: 0; border-left-width: 0; }

.calender-attendance .fc .fc-toolbar-title { font-size: 14px; font-weight: 500; color: var(--black-color); padding: 0; }
.calender-attendance .fc .fc-toolbar.fc-header-toolbar { margin: 0; padding: 5px; }
.calender-attendance .fc .fc-button.fc-prev-button,
.calender-attendance .fc .fc-button.fc-next-button { width: 24px; height: 30px; border-radius: 6px; background: url(../images/chevron-left-light.svg) center center no-repeat; background-size: 20px; border: none; }
.calender-attendance .fc .fc-button.fc-next-button { background-image: url(../images/chevron-right-light.svg); }
.calender-attendance .fc .fc-button.fc-prev-button span,
.calender-attendance .fc .fc-button.fc-next-button span { opacity: 0; }
.calender-attendance .fc .fc-button.fc-prev-button:hover,
.calender-attendance .fc .fc-button.fc-next-button:hover,
.calender-attendance .fc .fc-button.fc-prev-button:active,
.calender-attendance .fc .fc-button.fc-next-button:active { background-image: url(../images/chevron-left-hvr.svg); background-color: var(--aqua-haze-bg-color); }
.calender-attendance .fc .fc-button.fc-next-button:hover,
.calender-attendance .fc .fc-button.fc-next-button:active { background-image: url(../images/chevron-right-hvr.svg); }

.calender-attendance .fc-theme-standard .fc-scrollgrid { border: none; }
.calender-attendance .fc .fc-daygrid-event { /* pointer-events: none; */ cursor: default; text-decoration: none; }
.calender-attendance .fc-theme-standard th.fc-day { border: none !important; border-bottom: 1px solid var(--light-border-color); }
.calender-attendance .fc-theme-standard th .fc-day .fc-scrollgrid-sync-inner { background: var(--aqua-haze-bg-color); border-radius: 6px; margin: 0 5px 5px 5px; width: calc(100% - 10px); }
.calender-attendance .fc-theme-standard th .fc-day .fc-scrollgrid-sync-inner .fc-col-header-cell-cushion { font-size: 13px; line-height: 22px; font-weight: 500; color: var(--light-color); display: block; padding: 0; }
.calender-attendance .fc-theme-standard th .fc-day .fc-scrollgrid-sync-inner:hover { background: var(--light-bg-color); }
.calender-attendance .fc-theme-standard th .fc-day .fc-scrollgrid-sync-inner:hover .fc-col-header-cell-cushion { color: var(--black-color); }

.calender-attendance .fc .fc-daygrid-day-top { padding: 3px 3px 0 0; }
.calender-attendance .fc .fc-daygrid-day.fc-day-today { background: #f0fafe; }
.calender-attendance .fc .fc-daygrid-day-number { width: 30px; height: 22px; line-height: 22px; padding: 0; border-radius: 6px; padding: 0; text-align: center; font-size: 13px; font-weight: 500; color: var(--black-color); cursor: default; }
.calender-attendance .fc .fc-day-today .fc-daygrid-day-number { background: var(--sky-color); color: #fff; }
.calender-attendance .fc .fc-day-other .fc-daygrid-day-top { opacity: 1; }
/* .calender-attendance .fc .fc-day-past .fc-daygrid-day-number, */
.calender-attendance .fc .fc-day-other .fc-daygrid-day-number { background: var(--aqua-haze-bg-color); color: var(--light-color); }
.calender-attendance .fc-day-other .fc-event-main { opacity: 0; }

.calender-attendance .fc-h-event { background-color: transparent; border: none; padding: 0; margin: 0; }
.calender-attendance .fc-direction-ltr .fc-daygrid-event.fc-event-end,
.calender-attendance .fc-direction-rtl .fc-daygrid-event.fc-event-start { margin-right: 0; }
.calender-attendance .fc-direction-ltr .fc-daygrid-event.fc-event-start,
.calender-attendance .fc-direction-rtl .fc-daygrid-event.fc-event-end { margin-left: 0; }
.calender-attendance .fc-event .fc-event-main { padding: 5px 5px 5px 5px; }
.calender-attendance .fc-event-main .checkbox-custom { position: absolute; top: -21px; opacity: 0; }
.calender-attendance .fc-day:hover .fc-event-main .checkbox-custom,
.calender-attendance .fc-day:active .fc-event-main .checkbox-custom { opacity: 1; }

.calender-attendance .fc-theme-standard td.fc-day { height: 130px; }
.calender-attendance .fc-theme-standard td.fc-day.clicked { outline: 1px solid var(--sky-color); outline-offset: -1px; /* border-color: var(--sky-color); */ box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.calender-attendance .fc-theme-standard td.fc-day.clicked .fc-event-main .checkbox-custom { opacity: 1; }

.calender-attendance .calendar-punch-regularization { max-height: inherit !important; min-height: inherit !important; }
/* .calender-attendance .fc .fc-scroller.fc-scroller-liquid-absolute { overflow: inherit !important; height: calc(100vh - 348px) !important; min-height: 770px; } */
.calender-attendance .fc .fc-scroller.fc-scroller-liquid-absolute { /* overflow: inherit !important; */ height: calc(100%) !important; /* min-height: 770px; */ }
/* .calender-attendance .fc .fc-view-harness.fc-view-harness-active { height: 770px !important; height: calc(100vh - 320px) !important; min-height: 770px; } */
/*.calender-attendance .fc .fc-scrollgrid-section table.fc-scrollgrid-sync-table { height: 650px !important; }*/
.calender-attendance table tbody .fc-scroller-harness .fc-scroller { overflow-x: hidden !important; overflow-y: auto !important; }

.calender-attendance .fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events { /* min-height: 164px; */ min-height: 90px; }
.calender-attendance .punch-regularization-list-main { /* min-height: 164px; */ min-height: 90px; margin-top: 0; display: flex; flex-wrap: wrap; height: 100%; width: 100%; align-items: center; position: relative; }
.calender-attendance .punch-regularization-list-main:before { position: absolute; left: 0; top: 0; width: 3px; height: 100%; border-radius: 1.5px; content: ''; background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.calender-attendance .no-status .punch-regularization-list-main:before { opacity: 0; }
.calender-attendance .greenBox .punch-regularization-list-main:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.calender-attendance .green2Box .punch-regularization-list-main:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
.calender-attendance .redBox .punch-regularization-list-main:before { background: var(--danger-color); box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.calender-attendance .skyblueBox .punch-regularization-list-main:before { background: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.calender-attendance .yellowBox .punch-regularization-list-main:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.calender-attendance .pinkBox .punch-regularization-list-main:before { background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.calender-attendance .blueBox .punch-regularization-list-main:before { background: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.calender-attendance .orangeBox .punch-regularization-list-main:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.calender-attendance .swoBox .punch-regularization-list-main:before { background: #0673ed; box-shadow: 0px 1px 4px 0px rgba(6, 115, 237, 0.33); }
.calender-attendance .swdBox .punch-regularization-list-main:before { background: #a55ff4; box-shadow: 0px 1px 4px 0px rgba(165, 95, 244, 0.33); }

.calender-attendance .punch-regularization-list { width: 100%; align-self: stretch; display: flex; align-items: center; position: relative; font-size: 13px; line-height: 16px; font-weight: 500; color: var(--black-color); flex-wrap: wrap; padding-left: 13px !important; }

.calender-attendance .punch-regularization-list.pinkBox,
.calender-attendance .punch-regularization-list.yellowBox,
.calender-attendance .punch-regularization-list.green2Box,
.calender-attendance .punch-regularization-list.greenBox,
.calender-attendance .punch-regularization-list.orangeBox { background: #fff; padding-top: 3px !important; padding-bottom: 3px !important; align-self: auto; }
.calender-attendance .punch-regularization-list.pinkBox .hour-name-main,
.calender-attendance .punch-regularization-list.yellowBox .hour-name-main,
.calender-attendance .punch-regularization-list.green2Box .hour-name-main,
.calender-attendance .punch-regularization-list.greenBox .hour-name-main,
.calender-attendance .punch-regularization-list.orangeBox .hour-name-main { padding-top: 15px; }
.calender-attendance .punch-regularization-list.pinkBox:before,
.calender-attendance .punch-regularization-list.yellowBox:before,
.calender-attendance .punch-regularization-list.green2Box:before,
.calender-attendance .punch-regularization-list.greenBox:before,
.calender-attendance .punch-regularization-list.orangeBox:before { position: absolute; left: 0; top: 3px; width: 3px; height: calc(100% - 6px); border-radius: 0px; content: ''; background: var(--pink-color); box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.calender-attendance .punch-regularization-list.yellowBox:before { background: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.calender-attendance .punch-regularization-list.green2Box:before { background: var(--green2-color); box-shadow: 0px 1px 4px 0px rgba(37, 140, 28, 0.33); }
.calender-attendance .punch-regularization-list.greenBox:before { background: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.calender-attendance .punch-regularization-list.orangeBox:before { background: var(--orange-color); box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }

.calender-attendance .punch-regularization-list .hour-name-main { width: 100%; }
.calender-attendance .punch-regularization-list .hour { display: block; width: 100%; }
.calender-attendance .punch-regularization-list .hour .feather { position: relative; top: 5px; }
.calender-attendance .punch-regularization-list .name { display: block; width: 100%; color: var(--light-color); white-space: normal; }
.calender-attendance .punch-regularization-list.status { padding: 15px 0 0 0; }
.calender-attendance .punch-regularization-list .attendance-status-top { position: absolute; left: 0; top: 0; width: 100%; color: var(--black-color); font-weight: 500; padding-left: 13px; white-space: nowrap; white-space: wrap; display: flex; align-items: center; }
.calender-attendance .punch-regularization-list .attendance-status-top .holiday-name { padding-left: 10px; overflow: hidden; text-overflow: ellipsis; width: 100%; position: absolute; left: 0; top: 0; padding-left: 35px }
.calender-attendance .punch-regularization-list.msp .attendance-status-top { padding: 3px 0 0 0; position: relative; }
.calender-attendance .punch-regularization-list.msp .attendance-status-top .feather { position: relative; top: 3px; }

.calender-attendance .punch-regularization-list-main.two-event { align-items: flex-start; }
.calender-attendance .two-event .punch-regularization-list.status { padding-top: 0 !important; }

.calender-attendance .fc-direction-ltr .fc-h-event:not(.fc-event-selected) .fc-event-resizer-end,
.calender-attendance .fc-direction-rtl .fc-h-event:not(.fc-event-selected) .fc-event-resizer-start { cursor: default; }

.bottom-summary.option4.calender-attendance-summary .summary-item { max-width: inherit; }
/* End Attendance Regularization */

/* End HR */
.not-use-this { position: relative; width: 100%; }
.not-use-this:before { position: absolute; left: 0; top: 0; content: ''; width: 100%; height: 100%; border-radius: 6px; background: var(--danger-color); z-index: 9; opacity: 0.5; }
.not-use-this:after { position: absolute; left: 0; top: 50%; margin-top: -10px; content: 'Not Use This'; font-size: 20px; font-weight: 500; line-height: 100%; text-align: center; width: 100%; color: #fff; z-index: 99; font-family: 'DM Sans', sans-serif; }

/* Start Grid View */
.grid-view-main { overflow: auto; margin-bottom: 5px; }
.grid-view-container { display: flex; flex-wrap: wrap; padding: 0 4px 0px 4px; }
.grid-view-item { border: 1px solid var(--light-border-color); border-radius: 6px; margin: 8px; width: 375px; min-width: 375px; flex-basis: 375px; flex-grow: 1; }
.grid-view-item.active { border-color: var(--sky-color); box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.grid-view-item.placeholder-item { border-color: transparent; margin-top: 0; margin-bottom: 0; height: 1px; }

.grid-view-not-found { padding: 0 5px; width: 100%; }
.grid-view-not-found .not-found-in-bg { border-radius: 6px; /* background-color: var(--light-bg-color); */ border: 1px solid var(--light-border-color); text-align: center; width: 100%; font-size: 13px; line-height: 18px; padding: 7px 12px 5px 12px; font-family: 'DM Sans', sans-serif; font-weight: 500; color: var(--black-color); vertical-align: middle; position: relative; white-space: nowrap; }

body .grid-view-item .btn.info-label { margin-top: -1px; }

.grid-view-item .form-text { margin-bottom: 6px; }
.grid-view-item .form-text label.control-label { width: 100%; padding: 0; margin: 0 0 8px 0; font-size: 13px; line-height: 13px; color: var(--light-color); font-weight: 500; }
.grid-view-item .form-text .control-text { width: 100%; font-weight: 500; font-size: 14px; line-height: 14px; color: var(--black-color); margin-top: -3px; }
.grid-view-item .form-text .control-text.font16 { font-size: 16px; line-height: 21px; }
.grid-view-item .form-text .control-text.font18 { font-size: 18px; line-height: 18px; }
.grid-view-item .form-text .control-text sup { top: -3px; font-size: 11px; font-family: 'Roboto', sans-serif; font-weight: 400; }
.grid-view-item .form-text .control-text.font18 sup { font-size: 13px; top: -3px; }

.grid-view-item .grid-header { width: 100%; display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; min-height: 34px; margin-bottom: 6px; }
.grid-view-item .grid-header .header-left { padding: 0px 10px; }
.grid-view-item .grid-header .header-right { padding: 0 7px; }
.grid-view-item .grid-header .checkbox-custom { margin-top: 3px !important; margin-bottom: 3px !important; }
.grid-view-item .grid-middle { width: 100%; height: calc(100% - 75px); margin-top: -1px;  display: flex; flex-shrink: 0; align-items: flex-start; justify-content: space-between; min-height: 40px; padding: 0 10px 3px 10px; }
.grid-view-item .grid-middle .middle-left { padding-right: 10px; /* width: 60%; */ }
.grid-view-item .grid-middle .middle-right { text-align: right; /* width: 40%; */ }
.grid-view-item .grid-footer { width: 100%; display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; border-top: 1px dashed var(--light-border-color); font-size: 14px; color: var(--black-color); font-weight: 500; padding: 7px 0; min-height: 36px; }
.grid-view-item .grid-footer .footer-left { padding: 0 10px 0 10px; }
.grid-view-item .grid-footer .footer-right { padding: 0 10px 0 10px; }
.grid-view-item .icon-list { display: inline-block; position: relative; padding-left: 25px; }
.grid-view-item .icon-list .feather { color: var(--light-color); position: absolute; left: 0; min-height: 20px; }
/* End Grid View */

/* Status */
.status-div { display: inline-flex; border-radius: 10px; background: #fff !important; border: 1px solid var(--light-border-color); position: relative; margin: 3px; padding: 0 7px 0 15px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--black-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); }
.status-div.status-div-input { margin: 0 3px 3px 0; }
.status-div.status-div-td { margin: 0 3px 0 0; }
.status-div:before { width: 8px; height: 8px; border-radius: 50%; position: absolute; left: 3px; top: 5px; content: ''; background: var(--blue-bg-color-2); }
.status-div.pink:before { background: var(--pink-color); }
.status-div.blue:before { background: var(--blue-color); }
.status-div.sky-blue:before { background: var(--sky-color); }
.status-div.green:before { background: var(--green-color); }
.status-div.orange:before { background: var(--orange-color); }
.status-div.orange2:before { background: var(--orange2-color); }
.status-div.red:before { background: var(--danger-color); }
.status-div.light:before { background: var(--light-color); }
.status-div.yellow:before { background: var(--yellow-color); }
.status-div.violet:before { background: var(--violet-bg); }
.status-div.cyan:before { background: var(--cyan-color); }
.status-div.null:before { background: var(--danger-color); }
.status-div.null:after { content: 'Color Null'; position: relative; left: 5px; top: 0; background: #fff; width: calc(100% - 10px); margin-right: 5px; }

.total-field-fill-status { border: 1px solid var(--light-border-color); box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.12); /* width: 58px; */ width: auto; text-align: center; padding: 0 9px; border-radius: 6px; font-size: 15px; line-height: 20px; white-space: nowrap; color: var(--light-color); display: inline-block; background: #fff; }
.total-field-fill-status .current { color: var(--black-color); }
.total-field-fill-status .sep { padding: 0 4px; color: var(--light-border-color); }
.total-field-fill-status.pink { background: var(--pink-color-op12) !important; border-color: var(--pink-color);  box-shadow: 0px 1px 4px 0px rgba(255, 104, 214, 0.33); }
.total-field-fill-status.pink .sep { color: var(--pink-color); }
.total-field-fill-status.blue { background: var(--blue-color-op12) !important; border-color: var(--blue-color); box-shadow: 0px 1px 4px 0px rgba(38, 61, 184, 0.33); }
.total-field-fill-status.blue .sep { color: var(--blue-color); }
.total-field-fill-status.sky-blue { background: var(--sky-color-op12); border-color: var(--sky-color);  box-shadow: 0px 1px 4px 0px rgba(0, 163, 239, 0.33); }
.total-field-fill-status.sky-blue .sep { color: var(--sky-color); }
.total-field-fill-status.green { background: var(--green-color-op12) !important; border-color: var(--green-color); box-shadow: 0px 1px 4px 0px rgba(81, 184, 72, 0.33); }
.total-field-fill-status.green .sep { color: var(--green-color); }
.total-field-fill-status.orange { background: var(--orange-color-op12) !important;  border-color: var(--orange-color);  box-shadow: 0px 1px 4px 0px rgba(255, 126, 0, 0.33); }
.total-field-fill-status.orange .sep { color: var(--orange-color); }
.total-field-fill-status.red { background: var(--danger-color-op12) !important; border-color: var(--danger-color);  box-shadow: 0px 1px 4px 0px rgba(238, 70, 70, 0.33); }
.total-field-fill-status.red .sep { color: var(--danger-color); }
.total-field-fill-status.light { background: var(--light-color-op12) !important; border-color: var(--light-color);  box-shadow: 0px 1px 4px 0px rgba(108, 108, 108, 0.33); }
.total-field-fill-status.light .sep { color: var(--light-color); }
.total-field-fill-status.yellow { background: var(--yellow-color-op12) !important; border-color: var(--yellow-color); box-shadow: 0px 1px 4px 0px rgba(255, 204, 0, 0.33); }
.total-field-fill-status.yellow .sep { color: var(--yellow-color); }
.total-field-fill-status.violet { background: var(--violet-bg-op12) !important; border-color: var(--violet-bg); box-shadow: 0px 1px 4px 0px rgba(118, 102, 215, 0.33); }
.total-field-fill-status.violet .sep { color: var(--violet-bg); }
.total-field-fill-status.cyan { background: var(--cyan-color-op12) !important; border-color: var(--cyan-color); box-shadow: 0px 1px 4px 0px rgba(130, 189, 217, 0.33); }
.total-field-fill-status.cyan .sep { color: var(--cyan-color); }

.leave-type-status { width: 100%; border: 1px solid #ffbe7f; background: #fff2e5; color: var(--black-color); font-size: 14px; line-height: 18px; font-weight: 500; text-align: center; padding: 5px 15px; border-radius: 6px; }

.form-text { width: 100%; margin: 0 0 12px 0; }
.form-text label.control-label { width: 100%; padding: 0; margin: 0 0 2px 0; font-size: 14px; line-height: 18px; color: var(--light-color); font-weight: 500; }
.form-text label.control-label .label-lock { display: inline-block; position: relative; top: 4px; color: var(--light-color); }
.form-text label.control-label span { color: var(--danger-color); }
.form-text label.control-label span.sub-text { color: var(--light-color); font-size: 12px; margin-left: 8px; }
.form-text label.control-label .special-tag {/*  margin-top: -1px; margin-bottom: -1px;  */display: inline-block; }
.form-text .control-text { width: 100%; font-weight: 500; font-size: 14px; line-height: 20px; color: var(--black-color); margin-top: 0px; }
.form-text .control-text.check-box { padding-left: 22px; position: relative; }
.form-text .control-text.check-box .feather { position: absolute; left: 0; }

/* Pagination */
.pagination { padding: 0; margin: 0; }
.pagination li.page-item { display: inline-block; text-align: center; padding: 0 2px; margin: 0; }
.pagination li.page-item.disabled { pointer-events: none; cursor: default; opacity: 0.5; }
.pagination li.page-item a.page-link { display: block; width: 30px; height: 22px; line-height: 22px; font-size: 13px; font-weight: 500; color: var(--light-color); box-shadow: none !important; text-align: center; border-radius: 4px !important; padding: 1px 0 0 0; margin: 4px 0; position: relative; }
.pagination li.page-item a.page-link:before { content: ''; position: absolute; left: 0px; right: 0; margin: 0 auto; bottom: -4px; background: var(--sky-color); width: 0; height: 2px; border-radius: 1px 1px 1px 1px; transition: width 0.5s, height 4s; }
.pagination li.page-item.active a.page-link:before { width: calc(100% - 10px); }
.pagination li.page-item a.page-link:hover { background: var(--light-bg-color); color: var(--black-color); }
.pagination li.page-item.active a.page-link,
.pagination li.page-item.active a.page-link:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }

/* .pagination li.page-item.prev-arrow { padding-right: 10px; }
.pagination li.page-item.next-arrow { padding-left: 10px; } */
.pagination li.page-item.prev-arrow a.page-link,
.pagination li.page-item.next-arrow a.page-link { padding: 1px 0; color: var(--light-color); }
.pagination li.page-item.prev-arrow a.page-link:hover,
.pagination li.page-item.next-arrow a.page-link:hover { background: var(--aqua-haze-bg-color); color: var(--black-color); }

.list-01 { padding: 0; margin: 0; }
.list-01 li { padding: 0 0 5px 20px; margin: 0; position: relative; font-size: 14px; line-height: 20px; color: var(--black-color); font-weight: 500; }
.list-01 li:before { position: absolute; left: 0; top: 6px; content: ''; background: var(--black-color); width: 7px; height: 7px; border-radius: 50%; opacity: 0.3; }

/* Go to Page */
.goto-page { width: 85px; position: relative; margin: 0; display: inline-flex; }
.goto-page .control-label { position: absolute; left: 0; top: -10px; font-size: 12px; margin: 0; padding: 0 10px; }
.goto-page .control-label span { display: inline-block; background: #fff; padding: 0 5px; color: var(--light-color); }
.goto-page .form-control { padding-right: 45px; }
.goto-page .btn { position: absolute; right: 5px; top: 4px; }
.goto-page .btn:before { background: var(--light-border-color); width: 1px; height: 14px; position: absolute; left: -5px; top: 0; bottom: 0; content: ''; margin: auto 0; }
body .goto-page .btn.btnic { width: 30px; height: 22px; border-radius: 4px; }
body .goto-page .btn.btn-light.bg-none:hover,
body .goto-page .btn.btn-light.bg-none:not([disabled]):not(.disabled):active { background: var(--aqua-haze-bg-color) !important; }

.best-screen-preview { position: fixed; width: 100%; height: 100vh; left: 0; top: 0; background: var(--blue-color); z-index: 9999; display: none; visibility: hidden; }
.best-screen-preview:before { content: 'Choosing the Best Screen Resolution for Your Screencasts'; position: absolute; left: 0; top: 50%; margin-top: -10px; font-size: 20px; font-weight: 500; line-height: 100%; text-align: center; width: 100%; color: #fff; z-index: 99; font-family: 'DM Sans', sans-serif; padding:0 15px; }

/* Footer */
.footer { bottom: 0; padding: 15px 20px; position: absolute; right: 0; font-size:14px; color: var(--light-black-color); left:0; height: 50px; background-color: var(--athens-gray); margin-left: 0; display: none; }

.feather { display: inline-flex; }
.feather svg { width: 24px; height: 24px; }
.feather.w-28,
.feather.w-28 svg { width: 28px; height: 28px; }
.feather.w-22,
.feather.w-22 svg { width: 22px; height: 22px; }
.feather.w-20,
.feather.w-20 svg { width: 20px; height: 20px; }
.feather.w-18,
.feather.w-18 svg { width: 18px; height: 18px; }
.feather.w-16,
.feather.w-16 svg { width: 16px; height: 16px; }
.feather.w-15,
.feather.w-15 svg { width: 15px; height: 15px; }
.feather.w-14,
.feather.w-14 svg { width: 14px; height: 14px; }
.feather.w-12,
.feather.w-12 svg { width: 12px; height: 12px; }

body .link { cursor: pointer; color: var(--blue-color); }
body .link:hover { color: var(--black-color); } 

body .link-border { cursor: pointer; color: var(--blue-color); position: relative; font-weight: 500; display: inline-block; }
body .link-border:before { position: absolute; left: 0; bottom: -2px; content: ''; width: 100%; height: 2px; border-bottom: 2px dotted var(--light-border-color); }
body .link-border:hover { color: var(--blue-color); } 
body .link-border:hover:before { border-color: var(--sky-color); }

body .link2 { cursor: pointer; color: var(--light-color); }
body .link2:hover { color: var(--blue-color); }

body .link2.icon { position: relative; padding-right: 28px; }
body .link2.icon.icon-left { padding-left: 28px; padding-right: 0; }
body .link2.icon .feather { position: absolute; right: 0; top: -1px; }
body .link2.icon.icon-left .feather { left: 0; right: auto; }

body .link3 { cursor: pointer; color: var(--light-color); position: relative; font-size: 13px; font-weight: 500; }
body .link3.icon { padding-left: 32px; }
body .link3.icon .feather { color: var(--light-border-color); position: absolute; left: 0; top: -2px; }
body .link3:hover,
body .link3.icon:hover .feather { color: var(--black-color); }

.icon-flag-td:hover,
.icon-flag-td:active { opacity: 0.8; }
body .rotate90 { -ms-transform: rotate(90deg); /* IE 9 */ transform: rotate(90deg); }
body .text-rg { font-weight: 400; }
body .text-md2 { font-weight: 500; }
body .text-bd { font-weight: 700; }
body .text-bd-i { font-weight: 700 !important; }
body .bg-danger { background-color: var(--danger-color) !important; }
body .text-body { color:#626c76 !important; }
body .text-black { color:var(--black-color) !important; }
body .text-blue { color: var(--blue-color) !important; }
body .text-white { color: #fff !important; }
body .text-sky-blue { color: var(--sky-color) !important; }
body .text-red { color: var(--danger-color) !important; }
body .text-green { color: var(--green-color) !important; }
body .text-pink { color: var(--pink-color) !important; }
body .text-pink2 { color: var(--pink2-color) !important; }
body .text-light { color: var(--light-color) !important; }
body .text-orange { color: var(--orange-color) !important; }
body .text-yellow { color: var(--yellow-color); }
body .font-size13 { font-size: 13px !important; }
body .font-size18 { font-size: 18px !important; }
body .font-size17 { font-size: 17px !important; }
body .d-block { display: block !important; }
body .d-inline-block { display: inline-block !important; }
body .d-flex { display: flex !important; }
body .d-inline-flex { display: inline-flex !important; }
body .justify-content-end { justify-content: end !important; }
body .align-items-center { align-items: center !important; }
body .d-inline { display: inline !important; }
body .w-100pecentage { width: 100% !important; }
body .wp-auto { width: auto !important; }
body .disabled-link { pointer-events: none; }
body .w-25 { width: 25px !important; }
body .wp-100 { width: 100px !important; }
body .wp-130 { width: 130px !important; }
body .width-auto { width: auto !important; }
body .text-right { text-align: right !important; }
body .text-left { text-align: left !important; }
body .valign-top { vertical-align: top !important; }

/* Gap */
body .gap-3 { gap: 3px; }
body .gap-8 { gap: 8px; }
body .gap-10 { gap: 10px; }
body .gap-12 { gap: 12px; }


ul.bullet-list { padding: 0; margin: 0; }
ul.bullet-list li { width: 100%; padding: 0 0 12px 30px; margin: 0; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--blue-color); position: relative; }
ul.bullet-list li:last-child { padding-bottom: 0; }
ul.bullet-list li .feather { position: absolute; left: 0; top: 0px; }

/* Border Radius Class */
body .rounded-4 { border-radius: 6px !important; }
body .rounded-top-left-4 { border-top-left-radius: 6px !important; }
body .rounded-top-right-4 { border-top-right-radius: 6px !important; }
body .rounded-bottom-left-4 { border-bottom-left-radius: 6px !important; }
body .rounded-bottom-right-4 { border-bottom-right-radius: 6px !important; }

body .rounded { border-radius: 6px; }
body .rounded-top-left { border-top-left-radius: 6px; }
body .rounded-top-right { border-top-right-radius: 6px; }
body .rounded-bottom-left { border-bottom-left-radius: 6px; }
body .rounded-bottom-right { border-bottom-right-radius: 6px; }

body .rounded-0 { border-radius: 0 !important; }
body .rounded-top-left-0 { border-top-left-radius: 0px !important; }
body .rounded-top-right-0 { border-top-right-radius: 0px !important; }
body .rounded-bottom-left-0 { border-bottom-left-radius: 0px !important; }
body .rounded-bottom-right-0 { border-bottom-right-radius: 0px !important; }

/* Button */
body .btn { display: inline-block; padding:6px 20px 6px 20px; margin:0; color: #495057; font-size:14px; font-weight: 500; border-radius:6px; line-height:18px; border:none; box-shadow:none !important; text-transform: none; cursor: pointer; font-family: 'DM Sans', sans-serif; }
body .btn.click-disable { pointer-events: none; opacity: 0.66; cursor: not-allowed !important; }
body .btn.btn-sm { padding: 1px 10px; font-size: 13px; }
body .btn.small { padding-top: 5px; padding-bottom: 5px; }
body .btn.btn32 { padding-top: 7px; padding-bottom: 7px; }
body .btn.btn36 { padding-top: 9px; padding-bottom: 9px; }

body .btn.btn-primary { background: var(--blue-color) !important; color: #fff; }
body .btn-primary.dropdown-toggle:focus,
body .btn.btn-primary:hover,
body .btn.btn-primary:not([disabled]):not(.disabled):active,
body .show>.btn-primary.dropdown-toggle { background: var(--blue-bg-hvr-color) !important; color: #fff; }

body .btn.btn-sky { background: var(--sky-color) !important; color: #fff; }
body .btn-sky.dropdown-toggle:focus,
body .btn.btn-sky:hover,
body .btn.btn-sky:not([disabled]):not(.disabled):active { background: var(--sky-bg-hvr-color) !important; color: #fff; }

body .btn.btn-red { background: var(--danger-color) !important; color: #fff; }
body .btn-red.dropdown-toggle:focus,
body .btn.btn-red:hover,
body .btn.btn-red:not([disabled]):not(.disabled):active { background: var(--danger2-color) !important; }

body .btn.btn-green { background: var(--green-color) !important; color: #fff; }
body .btn-green.dropdown-toggle:focus,
body .btn.btn-green:hover,
body .btn.btn-green:not([disabled]):not(.disabled):active { background: var(--green-bg-hvr-color) !important; color: #fff !important; }

body .btn.btn-light { background: var(--light-bg-color) !important; color: var(--light-color); }
body .btn.btn-light.active-btn { color: var(--sky-color); background: none; }
body .btn.btn-light:hover,
body .btn.btn-light:not([disabled]):not(.disabled):active { background: var(--light-bg-hvr-color) !important; color: var(--black-color); }
body .btn.btn-primary.dropdown-toggle.btn-light:focus { color: var(--black-color) !important; }

body .btn.bg-none-ic.btn-yellow { background: var(--yellow-color) !important; color: #fff; }
body .btn.btn-yellow:hover,
body .btn.btn-yellow:not([disabled]):not(.disabled):active { background: var(--yellow-bg-hvr-color) !important; color: #fff; }

body .btn.btn-white { background: rgba(255, 255, 255, 0.2) !important; color: #fff; }
body .btn.btn-white:hover,
body .btn.btn-white:not([disabled]):not(.disabled):active { background: rgba(255, 255, 255, 0.4) !important; color: #fff; }

body .btn.btn-white2 { background: rgba(255, 255, 255, 0.2) !important; color: var(--light-color); }
body .btn.btn-white2:hover,
body .btn.btn-white2:not([disabled]):not(.disabled):active { background: rgba(255, 255, 255, 0.4) !important; color: var(--black-color); }

body .btn-primary.btn-white2:not([disabled]):not(.disabled):active,
body .btn-primary.btn-white2:not([disabled]):not(.disabled).active,
body .show>.btn-primary.btn-white2.dropdown-toggle,
body .btn-primary.btn-white2.dropdown-toggle:focus,
body .btn.btn-primary.btn-white2:hover,
body .btn.btn-primary.btn-white2:not([disabled]):not(.disabled):active { background: rgba(255, 255, 255, 0.4) !important; color: var(--black-color) !important; }

body .btn.btn-light2 { background: var(--light-bg2-color) !important; color: var(--light-color); }
body .btn.btn-light2:hover,
body .btn.btn-light2:not([disabled]):not(.disabled):active { background: var(--light-bg-hvr-color) !important; color: var(--black-color); }

body .btn.btn-light.bg-none { background: none !important; }
body .btn.btn-light.bg-none:hover,
body .btn.btn-light.bg-none:not([disabled]):not(.disabled):active { background: #ced5de !important; color: var(--black-color); }

body .btn.btn-red.bg-none { background: none !important; color: var(--danger-color); }
body .btn.btn-red.bg-none:hover,
body .btn.btn-red.bg-none:not([disabled]):not(.disabled):active { background: #ced5de !important; color: var(--danger-color); }

body .btn.btn-sky.bg-none { background: none !important; color: var(--sky-color); }
body .btn.btn-sky.bg-none:hover,
body .btn.btn-sky.bg-none:not([disabled]):not(.disabled):active { background: var(--sky-bg-hvr-color) !important; color: #fff; }

body .btn.bg-none-ic { background: none !important; width: 24px; height: 24px; padding: 0; }
body .btn.bg-none-ic .feather,
body .btn.bg-none-ic .feather svg { width: 24px; height: 24px; }

body .btn.bg-none-ic.btn-yellow { color: var(--yellow-color); }
body .btn.bg-none-ic.btn-yellow:hover,
body .btn.bg-none-ic.btn-yellow:not([disabled]):not(.disabled):active { color: var(--yellow-bg-hvr-color); }

body .btn.bg-none-ic.w16 { background: none !important; width: 16px; height: 16px; padding: 0; }
body .btn.bg-none-ic.w16 .feather,
body .btn.bg-none-ic.w16 .feather svg { width: 16px; height: 16px; }

body .btn.bg-none-ic.small { background: none !important; width: 20px; height: 20px; padding: 0; }
body .btn.bg-none-ic.small .feather,
body .btn.bg-none-ic.small .feather svg { width: 20px; height: 20px; }

body .btn.bg-none-ic.icon16 { width: 16px; height: 16px; padding: 0; }
body .btn.bg-none-ic.icon16 .feather,
body .btn.bg-none-ic.icon16 .feather svg { width: 16px; height: 16px; }

body .btn.bg-none-ic.icon18 { width: 18px; height: 18px; padding: 0; }
body .btn.bg-none-ic.icon18 .feather,
body .btn.bg-none-ic.icon18 .feather svg { width: 18px; height: 18px; }

body .btn.bg-none-ic.icon20 { width: 20px; height: 20px; padding: 0; }
body .btn.bg-none-ic.icon20 .feather,
body .btn.bg-none-ic.icon20 .feather svg { width: 20px; height: 20px; }


body .btn.bg-none-ic:hover,
body .btn.bg-none-ic:not([disabled]):not(.disabled):active { background: none !important; color: var(--black-color); }

body .btn.btn-tool { background: none !important; color: #fff !important; }
body .btn.btn-tool:hover,
body .btn.btn-tool:not([disabled]):not(.disabled):active { background: #fff !important; color: #333 !important; }

body .btn.btn-outline { border: 1px solid transparent;  padding-top: 5px; padding-bottom: 5px; }
body .btn.btn-outline.btn-icon .feather { top: 4px; }
body .btn.btn-outline.btn-light { border-color: var(--light-border-color); background: #fff !important; color: var(--black-color); box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12) !important; }
body .btn.btn-outline.btn-light .feather { color: var(--light-color); }
body .btn.btn-outline.btn-light:hover { /* border-color: var(--light-bg-hvr-color); */ background: var(--light-bg-color) !important; }
body .btn.btn-outline.btn-light:hover .feather { color: var(--black-color); }

body .btn.btn-icon { position: relative; padding-left: 40px; }
body .btn.btn-icon .feather { position: absolute; left: 10px; top: 5px; width: 20px; height: 20px; }
body .btn.btn-icon.btn32 .feather { top: 6px; }
body .btn.btn-icon.small .feather { top: 5px; }
body .btn.btn-icon .feather svg { width: 20px; height: 20px; }

body .btn.btn-text { padding-left: 0; padding-right: 0; padding-top: 0; padding-bottom: 0; background: none !important; }
body .btn.btn-text.btn-icon { padding-left: 28px; }
body .btn.btn-text.btn-icon .feather { left: 0; top: -1px; }
body .btn.btn-text.btn-icon.right-icon { padding-left: 0; padding-right: 28px; }
body .btn.btn-text.btn-icon.right-icon .feather { left: auto; right: 0; }
body .btn.btn-text:hover,
body .btn.btn-text:not([disabled]):not(.disabled):active { background: none !important; color: var(--black-color) !important; }

body .btn.btn-text-icon-bg { background: none !important; padding-left: 42px; padding-right: 0; position: relative; }
body .btn.btn-text-icon-bg:hover,
body .btn.btn-text-icon-bg:not([disabled]):not(.disabled):active { background: none !important; color: var(--black-color); }
body .btn.btn-text-icon-bg .feather { position: absolute; left: 0; top: 0; padding: 8px 0; width: 36px; height: 36px; text-align: center; border-radius: 6px; }
body .btn.btn-text-icon-bg .feather svg { width: 20px; height: 20px; margin: 0 auto; }
body .btn.btn-text-icon-bg.small { padding-left: 34px; }
body .btn.btn-text-icon-bg.small .feather { width: 28px; height: 28px; padding: 4px 0; }
/* body .btn.btn-text-icon-bg  i.feather { width: 28px; height: 28px; } */
/*body .btn.btn-text-icon-bg.btn-light:hover .feather { background: var(--light-bg-hvr-color); }*/

body .btn.btn-link { padding: 0; text-decoration: none; background: none !important; font-size: 15px; }

body .btn.btn-link.btn-primary { color: var(--blue-color); }
body .btn.btn-link.btn-primary:hover,
body .btn.btn-link.btn-primary:not([disabled]):not(.disabled):active{ background: none !important; color: var(--blue-bg-hvr-color); }

body .btn.btn-link.btn-sky { color: var(--sky-color); }
body .btn.btn-link.btn-sky:hover,
body .btn.btn-link.btn-sky:not([disabled]):not(.disabled):active{ background: none !important; color: var(--sky-bg-hvr-color); }

body .btn.btnic { width: 30px; height: 30px; text-align: center; padding: 0; display: inline-flex; align-items: center; }
body .btn.btnic .feather { display: flex; width: 100%; height: 20px; }
body .btn.btnic .feather svg { margin: 0 auto; width: 20px; height: 20px; }

body .btn.btnic.big { width: 48px; height: 30px; padding: 3px; }
body .btn.btnic.big .feather,
body .btn.btnic.big .feather svg { width: 24px; height: 24px; margin: 0 auto; }
body .btn.btnic.big.cwi-18 { padding: 7px; }
body .btn.btnic.big.cwi-18 .feather svg { width: 18px; height: 18px; }

body .btn.btnic.big32 { height: 32px; padding: 4px; }

body .btn.btnic.small { width: 28px; height: 28px; padding: 4px; }
body .btn.btnic.small .feather,
body .btn.btnic.small .feather svg { width: 20px; height: 20px; }

body .btn.btnic.small2 { width: 24px; height: 24px; padding: 3px; }
body .btn.btnic.small2 .feather,
body .btn.btnic.small2 .feather svg { width: 18px; height: 18px; }

body .btn.btnic.bigw36 { width: 36px; padding-left: 8px; padding-right: 8px; }

/* Other Class */
.list-main { width: 100%; display: table; }
.list-main .list { display: table-cell; vertical-align: middle; }
.list-main .list.right-icon-top { position: relative; }
.list-main .list.right-icon-top .icon-top { position: absolute; right: 0; top: 0; }
.list-main .list.v-top { vertical-align: top; }
.list-main .list.w-65 { width: 65px; }

.list-main-no-wrap { display: flex; flex-shrink: 0; justify-content: space-between; flex-wrap: nowrap; }
.list-main-no-wrap.align-items-center { align-items: center; }
/*.list-main-no-wrap .list-no-wrap {  }*/
.list-main-no-wrap .widthp-100 { width: 100%; }

.list-main2 { width: 100%; display: table; }
.list-main2 .list2 { width: 100%; display: table; display: table-cell; vertical-align: top; padding: 0 10px; }
.list-main2 .list2:first-child { padding-left: 0; }
.list-main2 .list2:last-child { padding-right: 0; }

.separator2 { display: inline-block; width: 1px; max-height: 36px; position: relative; }
.separator2.font-size0 { font-size: 0; }
.separator2:before { width: 1px; height: 18px; content: ''; background: var(--ghost-gray); position: absolute; top: 0; bottom: 0; margin: auto 0; }
.separator3 { display: inline-block; width: 1px; /* max-height: 36px; */ position: relative; }
.separator3:before { width: 1px; height: 100%; content: ''; background: var(--ghost-gray); position: absolute; top: 0; bottom: 0; margin: auto 0; }

.separator-td { display: inline-block; width: 2px; min-height: 20px; position: relative; margin: 0 8px; color: transparent; }
.separator-td:before { background: var(--light-border-color); width: 2px; left: 0; top: 4px; height: calc(100% - 8px); content: ''; position: absolute; }

.separator-grid { display: inline-block; width: 2px; min-height: 20px; position: relative; margin: 0 8px; color: transparent !important; }
.separator-grid:before { background: var(--light-border-color); width: 2px; left: 0; top: 2px; height: 12px; content: ''; position: absolute; }
.grid-footer .separator-grid:before { top: 0; bottom: 0; margin: auto 0; }

.round-dot-td { display: inline-block; width: 2px; min-height: 20px; position: relative; margin: 0 11px; color: transparent; }
.round-dot-td:before { background: var(--light-border-color); width: 6px; left: 0px; top: 7px; height: 6px; border-radius: 50%; content: ''; position: absolute; }

body .no-wrap { white-space: nowrap; }
body .white-space-nowrap { white-space: nowrap; }
body .white-space-wrap { white-space: pre-line !important; }
body .word-wrap-break-word { word-wrap: break-word !important; }

body .border { border: 1px solid var(--light-border-color) !important; }
body .border-bottom { border-bottom: 1px solid var(--light-border-color) !important; }
body .border-top { border-top: 1px solid var(--light-border-color) !important; }
body .border-left { border-left: 1px solid var(--light-border-color) !important; }
body .border-right { border-right: 1px solid var(--light-border-color) !important; }
body .border-right-dashed { border-right: 1px dashed var(--light-border-color) !important; }
body .border-left-dashed { border-left: 1px dashed var(--light-border-color) !important; }
body .border-bottom-dashed { border-bottom: 1px dashed var(--light-border-color) !important; }
body .border-top-dashed { border-top: 1px dashed var(--light-border-color) !important; }

body .border-bottom-dashed-left-15,
body .border-bottom-dashed-right-15 { position: relative; }
body .border-bottom-dashed-left-15:before,
body .border-bottom-dashed-right-15:before { position: absolute; left: 0px; bottom: 0; width: 14px; height: 1px; content: ''; border-bottom: 1px dashed var(--light-border-color) !important; }
body .border-bottom-dashed-right-15:before { left: auto; right: 0px; bottom: 0px; }

body .dev-border-yellow { border: 1px dashed var(--yellow-color) !important; border-radius: 6px !important; color: var(--yellow-color) !important; }
body .dev-border-yellow:before,
body .dev-border-yellow:after,
body .dev-border-yellow div:before,
body .dev-border-yellow div:after { border-color: var(--yellow-color) !important; background-color: var(--yellow-color) !important; }
body .dev-border-yellow strong,
body .dev-border-yellow b,
body .dev-border-yellow span,
body .dev-border-yellow button,
body .dev-border-yellow ul,
body .dev-border-yellow li,
body .dev-border-yellow div,
body .dev-border-yellow label,
body .dev-border-yellow input,
body .dev-border-yellow textarea,
body .dev-border-yellow select,
body .dev-border-yellow h1,
body .dev-border-yellow h2,
body .dev-border-yellow h3,
body .dev-border-yellow h4,
body .dev-border-yellow h5,
body .dev-border-yellow h6,
body .dev-border-yellow a,
body .dev-border-yellow button { color: var(--yellow-color) !important; border-color: var(--yellow-color) !important; }
body .dev-border-yellow a,
body .dev-border-yellow button { background: var(--yellow-color) !important; }

body .cursor-pointer { cursor: pointer !important; }
.bg1 { background: var(--aqua-haze-bg-color); }

/* Margin Class Start */
body .mg-0 { margin: 0px; }
body .mg-3 { margin: 3px; }
body .mg-5 { margin: 5px; }
body .mg-10 { margin: 10px; }
body .mg-15 { margin: 15px; }
body .mg-20 { margin: 20px; }
body .mgt-0 { margin-top: 0px; }
body .mgr-0 { margin-right: 0px; }
body .mgl-0 { margin-left: 0px; }
body .mgb-0 { margin-bottom: 0px; }
body .mgb-0-i { margin-bottom: 0px !important; }
body .mgt-3 { margin-top: 3px; }
body .mgt-3-i { margin-top: 3px !important; }
body .mgr-3 { margin-right: 3px; }
body .mgl-3 { margin-left: 3px; }
body .mgb-3 { margin-bottom: 3px; }
body .mgt-4 { margin-top: 4px; }
body .mgt-4-i { margin-top: 4px !important; }
body .mgr-4 { margin-right: 4px; }
body .mgl-4 { margin-left: 4px; }
body .mgb-4 { margin-bottom: 4px; }
body .mgt-5 { margin-top: 5px; }
body .mgr-5 { margin-right: 5px; }
body .mgl-5 { margin-left: 5px; }
body .mgb-5 { margin-bottom: 5px; }
body .mgt-8 { margin-top: 8px; }
body .mgr-8 { margin-right: 8px; }
body .mgl-8 { margin-left: 8px; }
body .mgl-8-i { margin-left: 8px !important; }
body .mgb-8 { margin-bottom: 8px; }
body .mgt-10 { margin-top: 10px; }
body .mgt-10-i { margin-top: 10px !important; }
body .mgr-10 { margin-right: 10px; }
body .mgl-10 { margin-left: 10px; }
body .mgl-10-i { margin-left: 10px !important; }
body .mgb-10 { margin-bottom: 10px; }
body .mgb-10-i { margin-bottom: 10px !important; }
body .mgt-12 { margin-top: 12px; }
body .mgr-12 { margin-right: 12px; }
body .mgl-12 { margin-left: 12px; }
body .mgb-12 { margin-bottom: 12px; }
body .mgt-15 { margin-top: 15px; }
body .mgr-15 { margin-right: 15px; }
body .mgl-15 { margin-left: 15px; }
body .mgl-15-i { margin-left: 15px !important; }
body .mgb-15 { margin-bottom: 15px; }
body .mgt-20 { margin-top: 20px; }
body .mgr-20 { margin-right: 20px; }
body .mgl-20 { margin-left: 20px; }
body .mgb-20 { margin-bottom: 20px; }
body .mgt-65 { margin-top: 65px; }
body .mgr-65 { margin-right: 65px; }
body .mgl-65 { margin-left: 65px; }
body .mgb-65 { margin-bottom: 65px; }
/* Margin Class End */

/* Padding Class Start */
body .pd-0 { padding: 0px !important; }
body .pd-5 { padding: 5px !important; }
body .pd-10 { padding: 10px !important; }
body .pd-15 { padding: 15px !important; }
body .pd-20 { padding: 20px !important; }
body .pdt-0 { padding-top: 0px !important; }
body .pdr-0 { padding-right: 0px !important; }
body .pdl-0 { padding-left: 0px !important; }
body .pdb-0 { padding-bottom: 0px !important; }
body .pdt-3 { padding-top: 3px !important; }
body .pdr-3 { padding-right: 3px !important; }
body .pdl-3 { padding-left: 3px !important; }
body .pdb-3 { padding-bottom: 3px !important; }
body .pdt-5 { padding-top: 5px !important; }
body .pdr-5 { padding-right: 5px !important; }
body .pdl-5 { padding-left: 5px !important; }
body .pdb-5 { padding-bottom: 5px !important; }
body .pdt-6 { padding-top: 6px !important; }
body .pdr-6 { padding-right: 6px !important; }
body .pdl-6 { padding-left: 6px !important; }
body .pdb-6 { padding-bottom: 6px !important; }
body .pdt-7 { padding-top: 7px !important; }
body .pdr-7 { padding-right: 7px !important; }
body .pdl-7 { padding-left: 7px !important; }
body .pdb-7 { padding-bottom: 7px !important; }
body .pdt-8 { padding-top: 8px !important; }
body .pdr-8 { padding-right: 8px !important; }
body .pdl-8 { padding-left: 8px !important; }
body .pdb-8 { padding-bottom: 8px !important; }
body .pdt-10 { padding-top: 10px !important; }
body .pdr-10 { padding-right: 10px !important; }
body .pdl-10 { padding-left: 10px !important; }
body .pdb-10 { padding-bottom: 10px !important; }
body .pdt-13 { padding-top: 13px !important; }
body .pdr-13 { padding-right: 13px !important; }
body .pdl-13 { padding-left: 13px !important; }
body .pdb-13 { padding-bottom: 13px !important; }
body .pdt-15 { padding-top: 15px !important; }
body .pdr-15 { padding-right: 15px !important; }
body .pdl-15 { padding-left: 15px !important; }
body .pdb-15 { padding-bottom: 15px !important; }
body .pdt-20 { padding-top: 20px !important; }
body .pdr-20 { padding-right: 20px !important; }
body .pdl-20 { padding-left: 20px !important; }
body .pdb-20 { padding-bottom: 20px !important; }
body .pdt-30 { padding-top: 30px !important; }
body .pdr-30 { padding-right: 30px !important; }
body .pdl-30 { padding-left: 30px !important; }
body .pdb-30 { padding-bottom: 30px !important; }
body .pdt-40 { padding-top: 40px !important; }
body .pdr-40 { padding-right: 40px !important; }
body .pdl-40 { padding-left: 40px !important; }
body .pdb-40 { padding-bottom: 40px !important; }
body .pdt-50 { padding-top: 50px !important; }
body .pdr-50 { padding-right: 50px !important; }
body .pdl-50 { padding-left: 50px !important; }
body .pdb-50 { padding-bottom: 50px !important; }
body .pdt-60 { padding-top: 60px !important; }
body .pdr-60 { padding-right: 60px !important; }
body .pdl-60 { padding-left: 60px !important; }
body .pdb-60 { padding-bottom: 60px !important; }
body .pdt-70 { padding-top: 70px !important; }
body .pdr-70 { padding-right: 70px !important; }
body .pdl-70 { padding-left: 70px !important; }
body .pdb-70 { padding-bottom: 70px !important; }
body .pdt-80 { padding-top: 80px !important; }
body .pdr-80 { padding-right: 80px !important; }
body .pdl-80 { padding-left: 80px !important; }
body .pdb-80 { padding-bottom: 80px !important; }
body .pdt-90 { padding-top: 90px !important; }
body .pdr-90 { padding-right: 90px !important; }
body .pdl-90 { padding-left: 90px !important; }
body .pdb-90 { padding-bottom: 90px !important; }
body .pdt-100 { padding-top: 100px !important; }
body .pdr-100 { padding-right: 100px !important; }
body .pdl-100 { padding-left: 100px !important; }
body .pdb-100 { padding-bottom: 100px !important; }
/* Padding Class End */

.extraClass { font-size: 20px !important; pointer-events: auto !important; }
.extraClass:hover { visibility: visible !important; opacity: 1 !important; }

.user-profile-main { display: flex; align-items: center; }
.user-profile-main .user-profile { width: 30px; height: 30px; min-width: 30px; border-radius: 6px; display: flex; justify-content: center; align-items: center; color: #fff; margin-right: 10px; text-transform: uppercase; font-size: 14px; font-weight: 500; }
.user-profile-main .user-profile.blue { background: var(--blue-color); }
.user-profile-main .user-profile.green { background: var(--green-color); }
.user-profile-main .user-profile.yellow { background: var(--yellow-color); color: var(--black-color); }
.user-profile-main .user-profile.orange { background: var(--orange-color); }
.user-profile-main .user-profile.sky-blue { background: var(--sky-color); }
.user-profile-main .user-profile.red { background: var(--danger-color); }
.user-profile-main .user-profile.pink { background: var(--pink-color); }
.user-profile-main .user-profile.violet { background: var(--violet-bg); }

/* Task */
.task-update { width: 100%; color: var(--black-color); font-family: 'DM Sans', sans-serif; font-weight: 500; font-size: 15px; line-height: 20px; }
.task-update b {color: var(--light-color); font-weight: 500; }
.task-update .today-date { padding-bottom: 10px; }
.task-update .task-list { padding: 0; margin: 0; }
.task-update .task-list .task { padding: 10px; margin: 0 0 15px 0; background: var(--aqua-haze-bg-color); border-radius: 6px; }
.task-update .task-list .task .list { padding: 0 0 5px 0; }
.task-update .task-list .task .list:last-child { padding-bottom: 0; }

@media only screen and (max-width: 1600px) {
.company-welcome { padding-left: 0; }
}

@media only screen and (max-width: 560px) {
.not-preview .best-screen-preview { display: block; visibility: visible; }

}

@media only screen and (max-width: 1400px) {
.all-configuration-page .company-header { padding: 20px 20px 0 20px; }
.configuration-content { padding-left: 20px; }
.configuration-content .list { display: block; width: 100%; height: auto; }
.configuration-content .left-configuration { padding-right: 0; }
.configuration-content .left-configuration-inn { max-width: 100%; }
.configuration-content .configuration-left-scroll { max-height: inherit; overflow-y:inherit; }
.configuration-content .configuration-right-scroll { max-height: inherit; overflow-y:inherit; padding: 0; }
.configuration-content .middle-configuration .back-page { left: 0; }
.need-help.need-help-sales-setup { right: 10px; bottom: 10px; position: fixed; }

.need-help { position: fixed; right: 15px; bottom: 15px; }
.company-main-content { max-height: calc(100vh - 110px); margin: 50px 0 0 0; overflow: auto; flex-flow: wrap; }
.company-onboarding .company-left-welcome { width: 100%; padding: 0 0 30px 0; text-align: center; }
.company-welcome { margin-top: 0; }
.company-welcome .welcome-text { background-position: 50% 100%; }
.company-page { width: 60%; min-width: inherit; max-width: 100%; }
.company-onboarding .company-right-menu { width: 40%; }
.company-page .company-page-scroll { min-height: inherit; max-height: inherit; }
.sales-setup-page .sales-setup-page-scroll { min-height: calc(100vh - 285px); max-height: calc(100vh - 285px); }
/* New Css */
.three-input-main { max-width: 100% !important; width: 100% !important; }
}

@media only screen and (max-width: 1365px) {
.vertical-nav { height: calc(100vh - 175px) !important; }
.vertical-nav ul.nav-sidebar > li.all-settings { padding: 0 12px; }

}

@media only screen and (max-width: 1200px) {
.col-md-1 { width: 8.3%; }
.col-md-2 { width: 16.6%; }
.col-md-3 { width: 25%; }
.col-md-4 { width: 33.3%; }
.col-md-5 { width: 41.6%; }
.col-md-6 { width: 50%; }
.col-md-7 { width: 58.3%; }
.col-md-8 { width: 66.6%; }
.col-md-9 { width: 75%; }
.col-md-10 { width: 83.3%; }
.col-md-11 { width: 91.6%; }
.col-md-12 { width: 100%; }
}

@media only screen and (max-width: 1100px) {
.login-header { padding: 20px; }
.login-content .list.left-login { display: none; }
.login-content .list { display: block; width: 100%; height: auto; padding: 20px 20px; }
.login-content .list.middle-login { padding-top: 40px; }
.login-content .list.right-login { padding-top: 0; padding-bottom: 0; }
.login-content .quote { padding-top: 90px; }
.login-content .quote .name { padding-top: 5px; }
.login-footer { bottom: 20px; }
.login-page2 { padding: 60px 0 60px 0; }
.login-content-main { height: calc(100vh - 120px); }
}

@media only screen and (max-width: 991px) {
.col-sm-1 { width: 8.3%; }
.col-sm-2 { width: 16.6%; }
.col-sm-3 { width: 25%; }
.col-sm-4 { width: 33.3%; }
.col-sm-5 { width: 41.6%; }
.col-sm-6 { width: 50%; }
.col-sm-7 { width: 58.3%; }
.col-sm-8 { width: 66.6%; }
.col-sm-9 { width: 75%; }
.col-sm-10 { width: 83.3%; }
.col-sm-11 { width: 91.6%; }
.col-sm-12 { width: 100%; }

body .top-navbar-right > li.top-serch-toggle .dropdown-menu.show,
body .top-navbar-right > li .top-serch-toggle .dropdown-menu.show { min-width:300px; }

.module-list { padding-top: 0; }
.module-list li { width: 100%; }
.module-list li:nth-child(2n+1) { margin-top: 0; }

.company-page { width: 100%; }
.company-onboarding .company-right-menu { width: 100%; padding-left: 6px; min-height: inherit; }
.company-right-menu .vertical-nav { padding: 20px 0 0 0; max-width: 100%; }

}

@media only screen and (max-width: 767px) {
.col-xs-1 { width: 8.3%; }
.col-xs-2 { width: 16.6%; }
.col-xs-3 { width: 25%; }
.col-xs-4 { width: 33.3%; }
.col-xs-5 { width: 41.6%; }
.col-xs-6 { width: 50%; }
.col-xs-7 { width: 58.3%; }
.col-xs-8 { width: 66.6%; }
.col-xs-9 { width: 75%; }
.col-xs-10 { width: 83.3%; }
.col-xs-11 { width: 91.6%; }
.col-xs-12 { width: 100%; }

.navbar-header .navbar-list { width: auto; }
.breadcrumb li.page-name { padding-right: 0; }
.breadcrumb li.breadcrumb-item { display: none; }

.login-box { padding: 0 20px 30px 20px; }
.login-content .quote { padding-top: 65px; font-size: 20px; line-height: 24px; }
.login-content .quote:before { width: 60px; height: 60px; background-size: 30px 30px; }
.login-content .quote .name { font-size: 15px; }
.login-box .welcome-text { padding-bottom: 20px; }

.modal-dialog { margin: 0; }
.navbar-nav .open .dropdown-menu .dropdown-header, .navbar-nav .open .dropdown-menu>li>a { padding: 8px 20px 8px 44px !important; }
body .dropdown-menu { box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.12), 0px 1px 48px 0px rgba(0, 0, 0, 0.06) !important; background: #fff !important; border: 1px solid var(--light-border-color) !important; }

.user-dropdown .dropdown-menu { position: absolute !important; right: 0 !important; }

}

@media only screen and (max-width: 599px) {
.mobile-width { width: 100%; }

.top-navbar-right > li.top-notification { display: none; }
.top-navbar-right > li.user-dropdown { padding-right:0; }
.top-navbar-right > li.full-screen { display: none; }

body .top-navbar-right > li.top-serch-toggle .dropdown-menu.show,
body .top-navbar-right > li .top-serch-toggle .dropdown-menu.show { min-width:220px; }

}

@media only screen and (max-width: 550px) {
.user-profile .image { display: none; }
.user-profile .info { padding-right: 25px; }
.user-profile .info .feather { top:50%; transform: translateY(-50%); }

}



/* 17-05-2024 */
.horizontal-menu.slider-container { align-items: center; display: flex; user-select: none; }
.horizontal-menu.slider-container .menu-wrapper { overflow: hidden; user-select: none; }
.horizontal-menu.slider-container .menu-wrapper .menu-wrapper--inner { transform: translate3d(0px, 0px, 0px); transition: transform 0.4s ease 0s; white-space: nowrap; text-align: left; }
.horizontal-menu.slider-container .menu-wrapper .menu-wrapper--inner .menu-item-wrapper  { display: inline-block; }
/* .select2-drop { min-width: 200px; } */
.select2-drop { min-width: 77px; }
.tip { white-space: wrap !important; }

.readonly, input[readonly] { pointer-events: none !important; }

.parentDiv { position: relative; display: flex; align-items: center; margin-bottom: 7px; }
.responsive-table .dataTables_wrapper .parentDiv .dataTables_length { float: left !important; width: auto; order: 2; margin-bottom: 0; }
.responsive-table .dataTables_wrapper .parentDiv .dataTables_filter { order: 1; width: auto; margin-left: 10px; margin-right: auto; margin-bottom: 0; max-width: 400px; width: 100%; }
.responsive-table .dataTables_wrapper .parentDiv .dataTables_length .select2-container { float: left;  }
.responsive-table .dataTables_wrapper .parentDiv .dataTables_filter:before { display: none; }
.responsive-table .dataTables_wrapper .parentDiv .dataTables_length:before { display: none; }
.responsive-table .dataTables_wrapper .parentDiv:before { border-bottom: 1px dashed var(--light-border-color); bottom: 0; content: ""; height: 1px; left: 0; position: absolute; width: 100%; }
.datatableLowerData { position: relative; }
.responsive-table .dataTables_wrapper .datatableLowerData .dataTables_paginate { padding: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.responsive-table .dataTables_wrapper .datatableLowerData .dataTables_info { padding: 0; }
.responsive-table .dataTables_wrapper .datatableLowerData .goto-page-main { margin-top: 0; }
.responsive-table .dataTables_wrapper .datatableLowerData .datatableLowerDataFirst { display: flex; align-items: center; }
.datatableLowerData { display: flex; align-items: center; justify-content: space-between; }
.three-input-main { max-width: 75%; width: 100% }
.height-auto { height: auto !important; }

.datatable-parent { position: relative; justify-content: space-between; margin-top: 15px; }
.datatable-parent, .datatable-child{ display:flex; align-items: center; }
.datatable-child .dataTables_info{ padding-top:0px !important;}
.datatable-parent .dataTables_paginate{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding-top:0px !important; width: auto !important; }
.datatable-parent .goto-page-main{ margin-top:0px !important;}

.custom-icon { fill: currentColor !important; stroke: none !important; }
.flatpickr-input[readonly] { pointer-events: unset !important; }
.flatpickr-current-month .cur-month { font-size: 16px; font-weight: 400 !important; color: var(--black-color); }
.flatpickr-current-month .cur-month:hover { background-color: transparent !important; }

table.table-design tr > td.details-control:before {width: 30px;height: 20px;position: absolute;left: 12px;top: 0;bottom: 0;content: '';background: url(../images/chevron-right.svg) 50% 50% no-repeat;background-size: 16px;border-radius: 6px;margin: auto 0; }
table.table-design tr.details > td.details-control:before { background: var(--sky-color) url(../images/chevron-down-white.svg) 50% 50% no-repeat;background-size: 16px; }
table.table-design tr > td.details-control { position: relative; cursor: pointer; font-size: 0; max-width: 50px; min-width: 50px; width: 50px; }

.accordion-menu1 .accordion-collapse { height: 0; transition: all 0.3s ease-in-out; }
.accordion-menu1 .accordion-collapse.in { height: auto; transition: all 0.3s ease-in-out; }
.accordion-menu2 .accordion-collapse { height: 0; transition: all 0.3s ease-in-out; }
.accordion-menu2 .accordion-collapse.in { height: auto; transition: all 0.3s ease-in-out; }
.accordion-menu3 .accordion-collapse { height: 0; transition: all 0.3s ease-in-out; }
.accordion-menu3 .accordion-collapse.in { height: auto; transition: all 0.3s ease-in-out; }

.panel-group { margin-bottom: 0; }

.three-input-main-container .select2-choice { border: 0 !important; }
.custom-file-label { position: absolute; top: 0; right: 0; left: 0; }


.custom-multi-btn-input .custom-file { position: relative; width: 100%; }
.custom-multi-btn-input .custom-file-label { border: 1px solid #c7ccd0; border: 1px solid var(--light-border-color); border-radius: 6px !important; color: #292a33; color: var(--black-color); font-family: DM Sans, sans-serif; font-size: 14px; font-weight: 500; height: 30px; line-height: 22px; margin: 0; overflow: inherit; padding: 3px 9px; width: calc(100% - 104px); }
.custom-multi-btn-input .input-group { flex-wrap: inherit !important; }

#pieces { width: 100%; }

.img-flag { width: 20px; height: 20px; margin-right: 8px; vertical-align: middle; }

.dropdown-item-btn { width: 100%; text-align: left; }


/* Custom arrow size */
/* .tippy-box[data-placement^='top'] > .tippy-arrow { width: 4px; height: 4px; }
.tippy-box[data-placement^='bottom'] > .tippy-arrow { width: 4px; height: 4px; }
.tippy-box[data-placement^='left'] > .tippy-arrow { width: 4px; height: 4px; }
.tippy-box[data-placement^='right'] > .tippy-arrow { width: 4px; height: 4px; }
.tippy-arrow::before { border-width: 2px; } */
.tippy-box[data-placement^=right]>.tippy-arrow:before { left: -5px !important; border-width: 5px 5px 5px 0 !important; top: 50% !important; transform: translateY(-50%) !important; }
.tippy-box[data-placement^=top]>.tippy-arrow:before { left: 50% !important; transform: translateX(-50%) !important; bottom: -4px !important; border-width: 5px 5px 0 !important; }
.tippy-box[data-placement^=left]>.tippy-arrow:before { border-width: 5px 0 5px 5px !important; right: -4px !important; transform: translateY(-50%) !important; top: 50% !important; }
.tippy-box[data-placement^=bottom]>.tippy-arrow:before { left: 50% !important; transform: translateX(-50%) !important; border-width: 0 5px 5px !important; top: -4px !important; }

/* .calendar3 { position: relative; } */
/* .flatpickr-calendar { position: fixed !important; } */
.flatpickr-wrapper { width: 100%; }
.cur-year { font-size: 14px; color: var(--black-color); }

.main-ttl { position: relative; background: #fff !important; }
.main-ttl:hover { background: #fff !important; }
.main-ttl::after { background: var(--sky-color) !important; border-radius: 1px !important; content: "" !important; height: 18px !important; left: 0 !important; position: absolute !important; top: 5px !important; width: 2px !important; }
.sub-line { padding: 0 !important; background-color: #0000 !important; }
.sub-line .select2-result-label { border-bottom: 1px solid var(--light-border-color); height: 1px; width: 100%;}
/* 
.sub-ttl:nth-child(even) { background-color: var(--aqua-haze-bg-color) !important; } */

/* Custom Select2 */
.cust-select2-small { min-width: 94px; }
/* .cust-select2-md { min-width: 150px; } */
.cust-select2-lg { min-width: 250px; }
.cust-select2-xlg { min-width: 290px; width: 290px !important; }

/* Tippy Tooltip */
.tippy-content { position: relative; padding: 2px 6px !important; z-index: 1; }
.btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary:hover { color: unset; }


/* Custom Select2 */
.select2-search.select2-search--inline:nth-last-child(2) { display: none !important; }
.select2-search__field { margin-top: 0 !important; }
.more-tags { background-color: #e4e4e4; border: 1px solid #aaa; border-radius: 4px; cursor: default; float: left; margin-right: 5px; margin-top: 5px; padding: 0 5px; }
.select2-results { margin: 0 !important; }
.select2-results__options { height: auto !important; overflow: unset !important; }
.more-tags-count { color: #fff !important; padding-left: 8px !important; padding-right: 8px !important; background-color: var(--blue-color) !important; }
/* .select2-result-label span { display: flex; align-items: center; } */
.select2-result-label span .country-code { margin-left: 5px; }


.checkFlag { display: flex; align-items: center; }

.preloader-main-container { width:100%; height: 100%; background-color: #fff; z-index: 9999; position: absolute; border-radius: 6px; }

.sidebar-mini .vertical-nav { padding: 0 12px 15px 12px; overflow-x: hidden; -ms-overflow-style: none; scrollbar-width: none; }
/* .sidebar-mini .vertical-nav:hover,
.sidebar-mini .vertical-nav:active { width: 330px; } */
/* .sidebar-mini .vertical-nav.expanded { width: 330px; } */
/* .sidebar-mini .vertical-nav { width: 60px; overflow: hidden; background-color: red; } */
.sidebar-mini .vertical-nav .nav-item { max-height: 36px; max-width: 36px; background-color: #0000 !important; float: unset; margin-left: 0; }
.sidebar-mini .vertical-nav .nav-item .nav-link { max-width: 36px; float: unset; display: flex; margin-bottom: 0 !important; display: flex; align-items: center; justify-content: center; max-height: 32px; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link:hover,
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link:active { max-width: 280px; width: 70px; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link .menu-name { max-width: 36px; margin-left: 0; overflow: hidden; }
.sidebar-mini .vertical-nav ul.nav-sidebar > li:hover > a.nav-link .menu-name,
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link:hover .menu-name,
.sidebar-mini .vertical-nav ul.nav-sidebar > li > a.nav-link:active .menu-name { max-width: 280px; margin-left: 58px; }
.sidebar-mini .vertical-nav .nav-item:hover,
.sidebar-mini .vertical-nav .nav-item:active { width: 70px; max-width: 70px; }
.sidebar-mini .vertical-nav .nav-item:hover .nav-link,
.sidebar-mini .vertical-nav .nav-item:active .nav-link { max-width: auto; }

.min-width-250 { min-width: 250px;}
.accordion-menu3 .accordion-header { position: relative; }

/* .modal { display: none; } */
.modal.fade .modal-dialog { transform: translate(0,-8%); }
.modal.in .modal-dialog { transform: translate(0, 0%); }
/* .dValidTillDate-group .error { display : block; } */

/* .custom_hidden_input { position: absolute; top: 0; left: 0; opacity: 0; visibility: hidden; pointer-events: none; } */

.AttedCalendar { max-height: calc(100vh - 120px); min-height: calc(100vh - 120px); }
.AttedCalendar .bottom-summary { margin-top: auto; }
.fc-daygrid-day-events { margin-bottom: 20px; }
.fc-today-button { display: none !important; }
thead .fc-scroller-harness .fc-scroller { overflow: unset !important; }
.fc-view-harness { overflow: auto; }
.fc-view-harness thead { position: sticky; top: 0; z-index: 2; background-color: #fff; }
.fc-day-disabled { background: #fff !important; }
/* .fc-view-harness { height: calc(100dvh - 1000px) !important; } */
/* .fc-view-harness { height: calc(100dvh - 1px) !important; } */
/* .fc-view-harness tbody tr:last-child td { border-bottom: 1px solid var(--light-border-color); } */

.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 1 !important; }
.mCSB_scrollTools { /* z-index: 9999; */ }
.mCSB_dragger { display: flex; justify-content: center; border-radius: 10px; }
.mScrollMaster-dark .mCSB_dragger_bar { margin: 0 2.5px !important; background: rgba(10, 41, 55, 0.40) !important; border-radius: 10px; }
.mScrollMaster-light .mCSB_dragger_bar { margin: 0 2.5px !important; border-radius: 10px; }
.select2-results .mCSB_dragger_bar { margin: 0 2.5px !important; background: rgba(10, 41, 55, 0.40) !important; border-radius: 10px; }

.all-module-drop-down .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #54555c; }
.all-module-drop-down .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.all-module-drop-down .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar { background-color: #54555c; }

.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: rgba(76,80,102,0.5); }
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar { background-color: rgba(76,80,102,0.5); }
.mCS-minimal.mCSB_scrollTools.mCSB_scrollTools_horizontal { height: 6px; }
.mCS-minimal.mCSB_scrollTools.mCSB_scrollTools_vertical { right: 5px !important; width: 6px !important; }
.responsive-table .mCS-minimal.mCSB_scrollTools.mCSB_scrollTools_vertical { right: -8px !important; right: -0px !important; }
.responsive-table .dataTables_scrollBody { overflow: inherit !important; border-bottom: none !important; }
.responsive-table .dataTables_scrollBody table.table-design > thead { opacity: 0; }
.responsive-table .dataTables_scrollBody table.table-design > thead tr th { height: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; }

/* .responsive-table .dataTables_scrollBody table.table-design .sub-table-main2 table.table-new-design thead { opacity: 1; }
.responsive-table .dataTables_scrollBody table.table-design .sub-table-main2 table.table-new-design thead tr th { height: auto !important; padding-top: 5px !important; padding-bottom: 5px !important; } */
.responsive-table .dataTables_wrapper .dataTables_scroll { position: relative; overflow: auto; }
.responsive-table.c-scroll-table .dataTables_wrapper .dataTables_scroll { position: relative; overflow: inherit; }
.responsive-table .dataTables_wrapper .dataTables_scroll .dataTables_scrollHead,
.responsive-table .dataTables_wrapper .dataTables_scroll .dataTables_scrollBody { overflow: visible !important; }

.history-scroll.even { background-color: var(--aqua-haze-bg-color); }
.history-scroll.odd { background-color: #fff; }
.history-scroll:hover { background-color: var(--light-bg-color) !important; }



/********************************************* Ai Chat Bot Design Start  *********************************************************************/

.tooltip-c { position: absolute; z-index: 2; overflow: hidden; clip: rect(0,0,0,0); box-sizing: border-box; width: 0; height: 0; padding: 0; cursor: default; color: #fff; font-family:'Roboto', sans-serif; font-weight: 500; font-size: 14px; line-height: 18px; text-align: center; white-space: nowrap; background-color: #000; opacity: 0; transition: opacity .3s ease-in .3s; border-radius: 12px; box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.18); }

.tooltip-c.min-300 { min-width: 300px; white-space: wrap; }


body .chatbox-main .btn { font-size: 14px; line-height: 20px; }
body .chatbox-main .btn.btnic { width: 32px; height: 32px; border-radius: 7px; padding: 7px; text-align: center; display: inline-flex; align-items: center; justify-content: center; }
body .chatbox-main .btn.rounded16-i { border-radius: 16px !important; }
body .chatbox-main .btn.btnic .feather { left: auto; top: auto; }

.chatbot-btn { position: fixed; bottom: 72px; right: 35px; width: 52px; height: 52px; display: flex !important; justify-content: center; align-items: center; cursor: pointer; z-index: -9999; transition: transform 0.3s ease; padding: 0; opacity: 0; }
.chatbot-btn.show { z-index: 9999; opacity: 1; }


/* Chat Box */
.chatbox-main { position: fixed; bottom: 20px; right: 20px; width: 100%; max-width: 780px; height: calc(100dvh - 80px); display: none; flex-direction: column; /* overflow: hidden; */ z-index: -9999; border-radius: 0 24px 24px 24px; display: flex !important; opacity: 0; }
.chatbox-main.show { z-index: 1031; opacity: 1; }
.chatbox-main:before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; z-index: 1; background: linear-gradient(217.34deg, #00C0EF 5.64%, #F7941E 50.25%, #E72F8A 94.86%); filter: blur(80px); border-radius: 0 24px 24px 24px; opacity: 0.30; }
.chatbox-main .chatbox-inn { position: relative; width: 100%; z-index: 3; border-radius: 0 24px 24px 24px; height: 500px; width: 100%; box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.18); box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.25) inset; height: calc(100dvh - 80px); padding-right: 1px; background: rgba(255, 255, 255, 0.87); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); -moz-backdrop-filter: blur(4px); border-radius: 0 24px 24px 24px; }
.chatbox-main .chatbox-inn:before { opacity: 1; content: ''; /* left: 0; top: 0; width: 100%; height: 100%; */ display: block; position: absolute; inset: 0; z-index: 2; border: 1px solid transparent; background: linear-gradient(216.91deg, #00C0EF 0%, #F7941E 50%, #E72F8A 100%) border-box; -webkit-mask: linear-gradient(oklch(100% 0 0) 0 0) padding-box, linear-gradient(oklch(100% 0 0) 0 0); mask: linear-gradient(oklch(100% 0 0) 0 0) padding-box, linear-gradient(oklch(100% 0 0) 0 0); -webkit-mask-composite: xor; mask-composite: exclude; border-radius: 0 24px 24px 24px; }
.chatbox-main .chatbox-inn:after { opacity: 1; content: ''; /* left: 0; top: 0; width: 100%; height: 100%; */ display: block; position: absolute; inset: 0; z-index: 3; border: 2px solid transparent; background: linear-gradient(216.5deg, rgba(255, 255, 255, 0) 0.63%, #FFFFFF 68.9%, rgba(255, 255, 255, 0.5) 75.4%, #FFFFFF 89.23%, rgba(255, 255, 255, 0) 100%) border-box; -webkit-mask: linear-gradient(oklch(100% 0 0) 0 0) padding-box, linear-gradient(oklch(100% 0 0) 0 0); mask: linear-gradient(oklch(100% 0 0) 0 0) padding-box, linear-gradient(oklch(100% 0 0) 0 0); -webkit-mask-composite: xor; mask-composite: exclude; border-radius: 0 24px 24px 24px; }

/* Ai Header */
.chatbox-header-main {  width: 90px; padding: 0 15px; position: absolute; left: -90px; top: 0; z-index: 9; }
.chatbox-header-main .chatbox-profile { width: 100%; }
.chatbox-header-main .chatbox-profile img { display: flex; margin: 0 auto; width: 60px; height: 60px; box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.18); border-radius: 50%; /* background: #252E8B; */ }
.chatbox-header-main .chatbox-icon-close { display: flex; align-items: center; flex-direction: column; padding: 12px 0 0 0; width: 100%; }
body .chatbox-header-main .chatbox-icon-close .btn.close-btn { border: 1px solid rgba(0, 0, 0, 0.16); background: rgba(0, 0, 0, 0.16); backdrop-filter: blur(4px); }
body .chatbox-header-main .chatbox-icon-close .btn.close-btn .feather { width: 20px; height: 20px; min-width: 20px; color: #fff; position: absolute; z-index: 2; }
body .chatbox-header-main .chatbox-icon-close .btn.close-btn .feather.v2 { color: rgba(0, 0, 0, 0.16); z-index: 1; stroke-width: 4px; }
body .chatbox-header-main .chatbox-icon-close .btn.close-btn:hover,
body .chatbox-header-main .chatbox-icon-close .btn.close-btn:active,
body .chatbox-header-main .chatbox-icon-close .btn.close-btn:focus { border-color: rgba(0, 0, 0, 0.20) !important; background: rgba(0, 0, 0, 0.20) !important; }

.chatbox-main .chatbox-header { width: 100%; padding: 0; display: flex; justify-content: space-between; height: 75px; height: 32px; cursor: move; position: relative; z-index: 8; }
.chatbox-main .chatbox-header-inn { position: relative; z-index: 3; display: flex; position: relative; justify-content: space-between; align-items: center; width: 100%; border: none; }
.chatbox-main .chatbox-header-inn:before { background: #97C6B6; width: 48px; height: 3px; border-radius: 10px; position: absolute; left: 0; right: 0; margin: 0 auto; content: ''; top: 15px; }
.chatbox-main .chatbox-header .title { font-size: 15px; line-height: 20px; font-weight: 500; color: #475266; position: relative; z-index: 2; font-size: 0; }

/* Ai Footer */
.chatbox-main .chatbox-footer { width: 100%; padding: 15px 15px; margin: 0; position: relative; z-index: 8; /*background: rgba(255, 255, 255, 0.55);*/ /* backdrop-filter: blur(7px); */ border-radius: 0 0 24px 24px; }
.chatbox-main .chatbox-footer:before { position: absolute; left: 0; top: -35px; width: 100%; content: ''; height: 35px; background: linear-gradient(to bottom,  rgba(255,255,255,0.0) 0%,rgba(255,255,255,0.55) 50%,rgba(255,255,255,1) 100%); backdrop-filter: blur(7px); z-index: 3; display: none; }
.chatbox-main .chatbox-footer-inn { display: flex; width: 100%; align-items: center; border: 1px solid #CAD3D8; border-radius: 20px; /* background: #FFF; */ box-shadow: 0px 3px 1px 0px rgba(255, 255, 255, 1) inset;box-shadow: 0px 3px 6px 1px rgba(0, 0, 0, 0.08); padding: 3px 3px 3px 10px; }

.chatbox-footer.form-group ::-webkit-input-placeholder,
.chatbox-footer.form-group ::-webkit-textarea-placeholder { /* Chrome/Opera/Safari */ color: #475266; opacity: 1; font-family:'Roboto', sans-serif; font-weight: 400; }
.chatbox-footer.form-group ::-moz-placeholder { /* Firefox 19+ */ color: #475266; opacity: 1; font-family:'Roboto', sans-serif; font-weight: 400; }
.chatbox-footer.form-group :-ms-input-placeholder,
.chatbox-footer.form-group :-ms-textarea-placeholder { /* IE 10+ */ color: #475266; opacity: 1; font-family:'Roboto', sans-serif; font-weight: 400; }
.chatbox-footer.form-group :-moz-placeholder { /* Firefox 18- */ color: #475266; opacity: 1; font-family:'Roboto', sans-serif; font-weight: 400; }
.chatbox-footer.form-group input.form-control { border-width: 0 !important; color: rgba(0, 0, 0, 0.87) !important; box-shadow: none !important; outline: none !important; padding: 0 0 0 5px; background: none !important; font-size: 14px; font-weight: 400; background: #fff; height: 32px; line-height: 32px; }
.chatbox-footer.form-group input.form-control.disabled { opacity: 0.5; }
body .chatbox-footer .btn.btnic { box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.18) !important; box-shadow: 0px -4px 4px 0px rgba(30, 49, 73, 0.87) inset !important; background: #252E8B; }
body .chatbox-footer .btn.btnic.d-none { display: none !important; }
body .chatbox-footer .btn.btnic.cursor-default { cursor: default !important; }
body .chatbox-footer .btn.btnic.btn-ask .feather { stroke: none; fill: #fff; min-width: 24px; height: 24px; width: 24px; }
body .chatbox-footer .btn.btnic:hover,
body .chatbox-footer .btn.btnic:active,
body .chatbox-footer .btn.btnic:focus { background: #1e256f !important; }
body .chatbox-footer .btn.btnic.btn-stop .feather { fill: #fff; }
/* body .chatbox-footer .btn.btnic.btn-stop { background: rgba(37, 46, 139, 0.4); box-shadow: none !important; }
body .chatbox-footer .btn.btnic.btn-stop .feather { fill: #fff; }
body .chatbox-footer .btn.btnic.btn-stop:hover,
body .chatbox-footer .btn.btnic.btn-stop:active,
body .chatbox-footer .btn.btnic.btn-stop:focus { background: rgba(37, 46, 139, 0.6); } */
body .chatbox-footer .btn.btnic[disabled] { opacity: 1; background: rgba(37, 46, 139, 0.4); box-shadow: none !important; pointer-events: none; }

.chatbox-main .blank-space-chat { width: 100%; height: 48px; }

.response-come.chatbox-main .blank-space-chat { display: none; visibility: hidden; }
.chatbox-main .moving-latter { width: 100%; padding: 0 25px; position: absolute; left: 0; top: 19px; z-index: 4; transform: translateY(0); transition: opacity 0.6s ease, transform 0.6s ease; }
.response-come.chatbox-main .moving-latter { opacity: 0; /* z-index: -9999; */ transform: translateY(-10px); pointer-events: none; }
.chatbox-main .moving-latter .text1 { display: inline-flex; padding: 0; margin: 0; font-size: 18px; line-height: 24px; font-weight: normal; /* background: url(../images/greetings-from-finix-text-bg.png) 50% 50% no-repeat; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; */ }
.chatbox-main .moving-latter .text2,
.chatbox-main .moving-latter .text3 { padding: 0; margin: 0; font-size: 15px; line-height: 20px; font-weight: normal; display: flex; align-items: center; opacity: 0; filter: blur(10px); transform: translateY(10px);  transition: opacity 0.6s ease, filter 0.6s ease, transform 0.6s ease; }
.chatbox-main .moving-latter .text2.show,
.chatbox-main .moving-latter .text3.show { opacity: 1; filter: blur(0px); transform: translateY(0); display: flex !important; }
.chatbox-main .moving-latter .text2 .smile { width: 15px; height: 20px; font-size: 0; background: url(../images/smile.png) 50% 50% no-repeat; background-size: 15px 15px; display: inline-flex; margin: 0 4px; }
.chatbox-main .moving-latter .text2 .hand { width: 15px; height: 20px; font-size: 0; background: url(../images/hand.png) 50% 50% no-repeat; background-size: 15px 15px; display: inline-flex; margin: 0 4px; }
.chatbox-main .moving-latter .text3 { filter: blur(0px); margin: 4px 0 0 0; color: rgba(27, 29, 31, 0.7); }
.moving-latter .text1 .char { background: url(../images/greetings-from-finix-text-bg.png) 50% 50% no-repeat; background-clip: text; -webkit-background-clip: text; color: transparent; }
.moving-latter .text1 .char:nth-child(1) { background-position: 0px 50%; }
.moving-latter .text1 .char:nth-child(2) { background-position:  -8.10px 50%; }
.moving-latter .text1 .char:nth-child(3) { background-position: -16.19px 50%; }
.moving-latter .text1 .char:nth-child(4) { background-position: -24.29px 50%; }
.moving-latter .text1 .char:nth-child(5) { background-position: -32.38px 50%; }
.moving-latter .text1 .char:nth-child(6) { background-position: -40.48px 50%; }
.moving-latter .text1 .char:nth-child(7) { background-position: -48.57px 50%; }
.moving-latter .text1 .char:nth-child(8) { background-position: -56.67px 50%; }
.moving-latter .text1 .char:nth-child(9) { background-position: -64.76px 50%; }
.moving-latter .text1 .char:nth-child(10) { background-position: -72.86px 50%; }
.moving-latter .text1 .char:nth-child(11) { background-position: -80.95px 50%; }
.moving-latter .text1 .char:nth-child(12) { background-position: -89.05px 50%; }
.moving-latter .text1 .char:nth-child(13) { background-position: -97.14px 50%; }
.moving-latter .text1 .char:nth-child(14) { background-position: -105.24px 50%; }
.moving-latter .text1 .char:nth-child(15) { background-position: -113.33px 50%; }
.moving-latter .text1 .char:nth-child(16) { background-position: -121.43px 50%; }
.moving-latter .text1 .char:nth-child(17) { background-position: -129.52px 50%; }
.moving-latter .text1 .char:nth-child(18) { background-position: -137.62px 50%; }
.moving-latter .text1 .char:nth-child(19) { background-position: -145.71px 50%; }
.moving-latter .text1 .char:nth-child(20) { background-position: -153.81px 50%; }
.moving-latter .text1 .char:nth-child(21) { background-position: -161.90px 50%; }
.moving-latter .text1 .char:nth-child(22) { background-position: -170px 50%; }

.chatbox-main .moving-latter .char,
.chatbox-main .moving-latter .smile,
.chatbox-main .moving-latter .hand,
.chatbox-main .moving-latter .space { display: inline-block; opacity: 0; filter: blur(10px); /* transform: translateY(8px); */ animation: blurIn 0.35s ease forwards; }
.moving-latter .space { width: 4px; }
@keyframes blurIn {
  0% { opacity: 0; filter: blur(10px); /* transform: translateY(8px); */ }
  100% { opacity: 1; filter: blur(0px); /* transform: translateY(0); */ }
}
.moving-latter .hand + .char,
.moving-latter .smile + .char { display: none; }

/* Ai Body */
.chatbox-main .chatbox-message-body { flex: 1; padding: 0px 15px 0 15px; overflow-y: auto; height: calc(100dvh - 227px); height: calc(100dvh - 185px); position: relative; z-index: 8; }

.main-message h1,
.main-message h2,
.main-message h3,
.main-message h4,
.main-message h5,
.main-message h6 { padding: 0 0 10px 0; margin: 0; font-size: 15px; color: rgba(0, 0, 0, 0.87); font-weight: 500; line-height: 20px; }
.main-message hr { border: none; border-bottom: 1px solid rgba(0, 0, 0, 0.12); width: 100%; padding: 0; /* margin: 0 0 10px 0; */ margin-bottom: 10px; height: 1px; background: none; }

body .main-message .btn.btn-no-op { background: rgba(37, 46, 139, 0.12); color: #252E8B; }
body .main-message .btn.btn-no-op:hover,
body .main-message .btn.btn-no-op:active,
body .main-message .btn.btn-no-op:focus { background: rgba(37, 46, 139, 0.20); color: #252E8B; }

.chatbox-main .main-message { width: 100%; margin-bottom: 15px; }
.chatbox-main .main-message:last-child { margin-bottom: 0; }
.main-message .chat-message-profile { width: 40px; min-width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; border-radius: 50%; outline: 1px solid rgba(255,255,255,0.20); outline-offset: -1px; font-size: 15px; line-height: 20px; font-weight: 500; color: #fff; text-transform: uppercase; margin-right: 15px; display: none; }
.main-message .chat-message-profile img { object-fit: cover; object-position: 50% 50%; width: 40px; height: 40px; min-width: 40px; border-radius: 50%; }
.main-message .chat-message-main { display: flex; }
.main-message .chat-message { width: 100%; max-width: 100%; }
.main-message .chat-message .chat-message-inn { display: inline-block; /* background: rgba(0, 0, 0, 0.08); */ border-radius: 20px; font-size: 15px; line-height: 20px; font-weight: 400; color: #000; padding: 0; white-space: normal; overflow-wrap: anywhere; word-wrap: break-word; word-break: break-word; width: 100%; }
.main-message .message-author { padding: 6px 0 0 55px; display: flex; font-weight: 500; font-size: 13px; line-height: 18px; font-weight: 500; color: #1b1d1f; display: none; visibility: hidden; }
.main-message .message-author .message-droper-name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 101px; }
.main-message .message-drop-time { padding-left: 8px; opacity: 0.5; }

.main-message .bot-html { padding: 12px 0 0 0; font-size: 14px; line-height: 20px; font-weight: 400; color: #475266; }
.main-message .caption-chat {  }
.main-message .chatbot-table { /* padding: 1px 10px 10px 10px; background: rgb(255, 255, 255, 0.40); */ margin: 15px 0 5px 0; border-radius: 12px; }
.main-message .chatbot-table table.table-new-design { width: 100% !important; margin: 0 !important; }
.main-message .chatbot-table table.table-new-design thead th { border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important; font-size: 12px !important; }
.main-message .chatbot-table table.table-new-design th,
.main-message .chatbot-table table.table-new-design td { font-size: 14px !important; line-height: 20px !important; border-radius: 0 !important; color: rgba(0, 0, 0, 0.87) !important; background: none !important; padding-top: 5px !important; padding-bottom: 5px !important; }
.main-message .chatbot-table table.table-new-design th:first-child,
.main-message .chatbot-table table.table-new-design td:first-child { padding-left: 0 !important; }
.main-message .chatbot-table table.table-new-design th:last-child,
.main-message .chatbot-table table.table-new-design td:last-child { padding-right: 0 !important; }
.main-message .chatbot-table table.table-new-design tbody td { border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important; }
.main-message .chatbot-table table.table-new-design tbody tr:last-child td { border-bottom-width: 0px !important; }

/* Ai User Message */
.main-message.message-user .chat-message-main { justify-content: end; }
.main-message.message-user .chat-message-profile { order: 2; margin-right: 0; margin-left: 15px; background: #0073b6; background: url(../images/chatbot-bg-icon.png) 50% 50% no-repeat; background-size: cover; }
.main-message.message-user .chat-message { display: flex; justify-content: end; max-width: 85%; }
.main-message.message-user .chat-message .chat-message-inn { background: rgba(0, 0, 0, 0.08); color: rgba(0, 0, 0, 0.87); padding: 8px 12px; width: auto; }
.main-message.message-user .message-author { padding-left: 0; padding-right: 55px; justify-content: end; }

/* Ai Message */
.main-message.alert-danger-message .chat-message .chat-message-inn { /* background: rgb(251, 106, 106, 0.16); */ color: #fb6a6a; /* padding: 8px 12px; */ width: auto; }

/* Typing dots animation */
.main-message .typing-dots { display: inline-block; vertical-align: middle; }
.main-message .typing-dots span { display: inline-block; width: 5px; height: 5px; background: rgba(0, 0, 0, 0.12); border-radius: 50%; margin: 0 2px; animation: typing 1s infinite ease-in-out; }
.main-message .typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.main-message .typing-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typing { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
/* End Ai Chat */
.text-warning {
    color: var(--yellow-color) !important; 
}