:root{--code-line-height:1.4;--scroll-bar-color:#182945;--scroll-bar-bg-color:#f6f6f6}
*{scrollbar-width:thin;scrollbar-color:var(--scroll-bar-color) var(--scroll-bar-bg-color);-ms-touch-action:manipulation;touch-action:manipulation}
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:var(--scroll-bar-bg-color)}
::-webkit-scrollbar-thumb{background-color:var(--scroll-bar-color);border-radius:20px;border:3px solid var(--scroll-bar-bg-color)}
html,body,iframe{min-height:100%;margin:0}
body.light{--primary:#1A2E40;--dark:#1A2E40;--very-dark:#fff;--blue:#2A8Ef6;--grey:#e1eefc;--fill:#eaf3ff;--fill-transparent:rgba(24,41,69,.6);--gradient:linear-gradient(45deg,#09C6F9 0%,#045DE9 100%)}
body.dark{--primary:#BFDCEE;--dark:#1A2E40;--very-dark:#0F1925;--blue:#2A8Ef6;--grey:#627F9D;--fill:#182945;--fill-transparent:rgba(24,41,69,.6);--gradient:linear-gradient(135deg,#8576f6 0%,#2a8ef6 100%)}
body{font-family:'Quicksand',sans-serif;font-weight:400;overflow-x:hidden;background:url(../images/bg.svg);background-size:cover;background-attachment:fixed;color:var(--dark)}
body.dashboard{background-image:url(../images/bg.svg);background-color:var(--very-dark)}
body.modal-open main,body.modal-open .navbar,body.modal-open .footer-grid{-webkit-filter:blur(8px);-moz-filter:blur(8px);-o-filter:blur(8px);-ms-filter:blur(8px);filter:blur(8px)}
h1{font-size:2.7em;margin-bottom:25px;font-weight:300}
h2{font-size:2em;margin-bottom:9px;font-weight:300}
h3{font-size:1.8em;margin-bottom:20px;line-height:38px}
h4{font-size:1.5em;margin-bottom:5px;font-weight:300}
h5{font-size:1.35em}
h6{font-size:1.2em;margin-bottom:0}
hr{margin-top:0}
a{color:#444}
b{font-weight:500}
a:hover{color:#000}
.vh-95{overflow-y:auto;height:95vh}
.fa-15x{font-size:1.7em}
.text-blue{color:var(--blue)}
select{position:relative}
.select2-selection--multiple:before,select:before{content:"";position:absolute;right:7px;top:42%;border-top:5px solid var(--primary);border-left:4px solid transparent;border-right:4px solid transparent}
.btn:focus,input:focus,select:focus{outline:none!important;box-shadow:none!important}
main{padding-top:50px;margin-top:50px;min-height:calc(100vh - 120px)}
main.login-bg{padding-top:0;margin-top:0;min-height:38vh}
.text-primary{color:#fff!important}
header nav{background-image:url(../images/header.svg);background-size:100%;background-position:bottom}
header .logo{width:2em}
header .btn{border-radius:15px;background:rgba(255,255,255,.8);border:2px solid rgba(255,255,255,.6)}
header .btn i{color:#2A8EF6}
header.login{background-image:url(../images/header-login.svg);background-size:100% 100%;position:relative;padding-top:1.5em}
header.login h1{color:var(--primary);padding:.6em 0}
header.login .logo{width:10%;height:10%}
header.login .avatar{text-align:center;margin-top:-1em;margin-left:auto;margin-right:auto;width:5em;background-color:var(--dark);color:var(--primary);padding:1em;border-radius:50%}
.modal-open .modal{overflow-y:scroll}
.modal-content{border-radius:20px}
.footer-bg{background-color:var(--dark);color:var(--primary)}
.footer-bg a{color:var(--primary)}
.text-light{color:var(--primary)!important}
.form-control{border-radius:20px;background:#fff;color:#0F1925;text-align:center}
.btn-primary{background-color:var(--blue);color:#fff;border:2px solid var(--blue);border-radius:20px;text-align:center}
.btn-primary:hover{background-color:#fff;color:var(--dark);border:2px solid var(--dark)}
.btn-success{background-color:var(--dark);border:2px solid var(--dark);border-radius:20px}
.btn-success:hover,.btn-success:focus,.btn-success:active{border:2px solid var(--dark);background-color:var(--primary);color:var(--dark)}
.btn-green{background-color:#2161a4;color:#fff;border:none;padding:.1em 1em}
.btn-pdf{background-color:var(--blue);color:#fff;border:none;padding:.1em 1em}
#dropdown-customer .cust-name{width:300px;margin-bottom:-6px;white-space:nowrap;overflow:hidden;display:inherit;text-overflow:ellipsis;color:#fff}
#dropdown-customer{position:relative;background:var(--blue);color:var(--primary);font-weight:600;border-radius:20px;font-size:.9em}
.select2-container .select2-search--inline .select2-search__field{height:auto!important}
.select2-search.select2-search--inline{text-align:center}
.select2-selection{height:3em}
.vsb-main{border-radius: 20px;}
.vsb-main button{background-color: var(--blue);border-radius: 20px;color: #fff;text-align: center;border:none}
.customer-list{max-height:70vh;width:calc(100% - 40px)!important;overflow-y:auto;padding:1em;background:var(--fill);color:var(--primary);border-radius:0 0 20px 20px;width:calc(100% - 40px)!important;left:20px!important;text-align:center}
.customer-list .single-cust{cursor:pointer;color:var(--primary)}
.customer-list .single-cust:hover{background-color:var(--blue)}
.card{border-radius:20px;border:none;background-color:transparent}
.card-title{color:#fff}
.preloader{position:fixed;left:0;top:0;z-index:9999999;width:100%;height:100%;overflow:visible;background:rgba(255,255,255,.8) url(../images/preloader.gif) no-repeat center center}
.btn-info{background:var(--blue);color:#fff;border-radius:20px;border:none}
.close{border:none;border-radius:50%;padding:0 .5em;font-size:1.3em}
.card-header{background-color:var(--blue);color:var(--primary);border-radius:20px 20px 0 0!important;padding:1em}
.card-header .btn-check+.btn-primary{border-radius:10px;background-color:var(--grey);color:var(--primary);border:none;padding:0 1.5em;font-weight:700}
.card-header .btn-check:checked+.btn-primary{background-color:var(--dark);color:#fff}
.filter-card .card-body{background:var(--fill);border-radius:0 0 20px 20px}
.report-card{background:var(--fill);border-radius:20px;padding:1em}
.report-card .report-item{padding:10px;color:var(--primary)}
.report-card .report-item .report-img{background:var(--gradient);color:#fff;border-radius:10px;text-align:center;padding:8px 0}
.report-card .report-item h5{margin-bottom:0}
.nav-pills{border-bottom:none}
.nav-pills .nav-item button{background-color:var(--grey);border-radius:20px;padding:.1em 3em;margin:0 1em;color:var(--primary);font-size:1.3em;font-weight:700}
.nav-pills .nav-item button.active{background-color:var(--blue)}
.filter-sidebar .select2-selection{color:#fff;background-color:var(--blue)!important;border-radius:20px!important}
.filter-sidebar ::placeholder,.select2-selection__rendered{color:#FFF;text-align:center}
.select2-container .select2-search--inline .select2-search__field{font-family:'Quicksand'!important}
.report-name{position:relative}
.report-name h6{font-weight:700}
.report-name .btn{position:absolute;right:0;top:0;border-radius:20px;padding:1px 5px;background:var(--blue);color:#fff}
.arrow-div{position:absolute;right:0;top:0;border-radius:20px;padding:1px 5px;font-size: 1.5em;}
#menuItems .dropdown-item small{font-size:80%}
#menuItems .dropdown-item{border-bottom:1px solid #59ADF1;line-height:13px;padding:10px 5px;font-weight:500;font-size:.8em;text-align:left}
#customerCount{color:#fff}
.card-graph .card-content,.apexcharts-canvas > svg{background-color:var(--fill)!important}
.card-graph .card-header{position:relative}
.card-graph .card-header .btn{position:absolute;top:30%;right:1em;border-radius:20px;padding:1px 5px;background:var(--blue);color:#fff}
.card-graph .card-content label{color:var(--primary)}
.status{position:absolute;color:#333!important;font-weight:700;width:200px;top:44px;text-align:center;left:-86px}
.pace{-webkit-pointer-events:none;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}
.pace-inactive{display:none}
.progress-bar{width:calc(100% - 6px);background:#e0e0e0;padding:3px;border-radius:3px;box-shadow:inset 0 1px 3px rgba(0,0,0,.2)}
.progress-bar-fill{display:block;height:5px;background:#659cef;border-radius:3px;transition:width 250ms ease-in-out}
.pace-inactive{display:none}
.progress-bar-container{width:250px;top:60%;margin:auto;left:0;right:0;text-align:center;position:absolute}
.progress-bar2{width:calc(100% - 6px);background:#e0e0e0;padding:3px;border-radius:3px;box-shadow:inset 0 1px 3px rgba(0,0,0,.2)}
.progress-bar-fill2{display:block;height:5px;background:#659cef;border-radius:3px;transition:width 250ms ease-in-out}
.pace .pace-progress{background:#29d;position:fixed;z-index:2000;top:0;right:100%;width:100%;height:2px}
.pace .pace-progress-inner{display:block;position:absolute;right:0;width:100px;height:100%;box-shadow:0 0 10px #29d,0 0 5px #29d;opacity:1;-webkit-transform:rotate(3deg) translate(0px,-4px);-moz-transform:rotate(3deg) translate(0px,-4px);-ms-transform:rotate(3deg) translate(0px,-4px);-o-transform:rotate(3deg) translate(0px,-4px);transform:rotate(3deg) translate(0px,-4px)}
.pace .pace-activity{display:block;position:fixed;z-index:2000;top:15px;right:15px;width:14px;height:14px;border:solid 2px transparent;border-top-color:#29d;border-left-color:#29d;border-radius:10px;-webkit-animation:pace-spinner 400ms linear infinite;-moz-animation:pace-spinner 400ms linear infinite;-ms-animation:pace-spinner 400ms linear infinite;-o-animation:pace-spinner 400ms linear infinite;animation:pace-spinner 400ms linear infinite}
.clickable{cursor:pointer}
.analytic-card{background-color:var(--fill);color:var(--primary);border-bottom-left-radius:10px;border-bottom-right-radius:10px}
.analytic-card td,.analytic-card th{color:var(--primary)}
.page-link{background-color:var(--primary)}
.btn-logout{font-size:.9em;padding:.2em 1.2em!important;font-weight:700;background:var(--dark)!important}
#modal1 .modal-header,#modal3 .modal-header,#modal-edit-product .modal-header{display:block;position:absolute;z-index:9;right:0;border-bottom:none}
.modal-body{padding:0!important}
