diff --git a/packages/Webkul/Admin/publishable/assets/css/admin.css b/packages/Webkul/Admin/publishable/assets/css/admin.css
index 96d973a03..5f53235d3 100644
--- a/packages/Webkul/Admin/publishable/assets/css/admin.css
+++ b/packages/Webkul/Admin/publishable/assets/css/admin.css
@@ -1 +1 @@
-@import url(https://fonts.googleapis.com/css?family=Montserrat:400,500);.dark-mode{background-color:#04101b}.dark-mode,.dark-mode .read-all{color:hsla(0,0%,100%,.8)}.dark-mode .navbar-top{background-color:#051e37}.dark-mode .navbar-top .navbar-top-left{background-color:#071e37;border-bottom:1px solid hsla(0,0%,63.5%,.2)}.dark-mode .navbar-top .profile-info .app-version{padding:10px 20px 0;margin-bottom:-10px;display:block;cursor:default;color:#a2a2a2}.dark-mode .navbar-top .profile-info .name{color:hsla(0,0%,100%,.8)!important}.dark-mode .navbar-top .profile-info .dropdown-list{right:0;bottom:inherit!important;border:1px solid #24384c}.dark-mode .navbar-left{background-color:#051e37;border-right:1px solid #051e37}.dark-mode .navbar-left ul.menubar li.menu-item>a{padding:5px 2px;display:block;color:#000;width:100%}.dark-mode .navbar-left ul.menubar li.menu-item>a .icon{display:inline-block;vertical-align:middle;transform:scale(.7)}.dark-mode .navbar-left ul.menubar li.menu-item>a .menu-label{display:none;color:#b0bec5}.dark-mode .navbar-left ul.menubar li.menu-item>a .arrow-icon{display:none}.dark-mode .navbar-left ul.menubar li.menu-item>a.active,.dark-mode .navbar-left ul.menubar li.menu-item>a:hover{padding:5px 2px;background-color:rgba(1,10,20,.5)}.dark-mode .navbar-left ul.menubar li.menu-item.active>a{background-color:rgba(1,10,20,.5)}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar{background:#031425;box-shadow:none;border:1px solid #24384c}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item .menu-label{color:#fff!important}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active,.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item:hover{background-color:#020f1c}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active .menu-label,.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item:hover .menu-label{color:#fff!important}.dark-mode .navbar-left.open ul.menubar li.menu-item a .menu-label{font-size:14px;font-weight:200;display:inline-block;color:#b0bec5}.dark-mode .navbar-left.open ul.menubar li.menu-item a .arrow-icon{display:inline-block}.dark-mode .navbar-left.open ul.menubar li.menu-item ul.sub-menubar{display:none;position:unset;background-color:transparent;border-radius:0;box-shadow:unset;border:0}.dark-mode .navbar-left.open ul.menubar li.menu-item ul.sub-menubar li.sub-menu-item a{padding-left:52px}.dark-mode .navbar-left.open ul.menubar li.menu-item.active{background:#051e37;width:calc(100% - 1px)}.dark-mode .navbar-left.open ul.menubar li.menu-item.active .menu-label{color:#fff}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar{display:block;background-color:#031425;border:none!important}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item .menu-label{color:#b0bec5}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active,.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover{background-color:rgba(1,10,20,.5)}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active .menu-label,.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover .menu-label{color:#fff!important}.dark-mode .navbar-left.open ul.menubar li.menu-item:hover{background:#051e37}.dark-mode .navbar-left.open ul.menubar li.menu-item:hover .menu-label{color:#fff}.dark-mode .navbar-left .menubar-bottom{background-color:#051e37}.dark-mode .nav-container .nav-top{background:#051e37}.dark-mode .nav-container .nav-top .pro-info .profile-info-desc{display:inline-block;margin-left:40px}.dark-mode .nav-container .nav-top .pro-info .profile-info-desc .name,.dark-mode .nav-container .nav-top .pro-info .profile-info-desc .role{color:#fff}.dark-mode .nav-container .nav-items{background:#051e37}.dark-mode .nav-container .nav-items .nav-item a{color:#fff;display:block;padding:5px}.dark-mode .nav-container .nav-items .nav-item ul .navbar-child.active,.dark-mode .nav-container .nav-items .nav-item ul .navbar-child:hover{background-color:rgba(1,10,20,.5)}.dark-mode .nav-container .nav-items .nav-item.active{background-color:#031425}.dark-mode .nav-container .nav-items .nav-item.active>a,.dark-mode .nav-container .nav-items .nav-item:hover>a{background-color:rgba(1,10,20,.5)}.dark-mode .content-container .content .page-header,.dark-mode .content-container .inner-section .content-wrapper .page-header{background-color:#04101b;border-bottom:1px solid #24384c}.dark-mode .table{background-color:#04101b}.dark-mode .table table thead th{background-color:rgba(7,30,55,.2)!important;color:hsla(0,0%,100%,.8)}.dark-mode .table table tbody td{color:hsla(0,0%,100%,.8);border-bottom:1px solid hsla(0,0%,63.5%,.2)}.dark-mode .modal-container{background:#04101b}.dark-mode .modal-container .modal-header h3{display:inline-block;font-size:20px;color:hsla(0,0%,100%,.8);margin:0}.dark-mode .accordian .accordian-header,.dark-mode .accordian div[slot*=header],.dark-mode accordian .accordian-header,.dark-mode accordian div[slot*=header]{color:#3a3a3a;border-top:1px solid hsla(0,0%,63.5%,.2);border-bottom:1px solid hsla(0,0%,63.5%,.2)}@media only screen and (max-width:1300px){.dark-mode .table table tbody tr td{background-color:#04101b}}.dark-mode .grid-dropdown-header{background-color:#000;border:1px solid #24384c}.dark-mode .dropdown-list{background-color:#000}.dark-mode .dropdown-list .dropdown-container{background-color:#02080d;color:hsla(0,0%,100%,.8)}.dark-mode .dropdown-list .dropdown-container label,.dark-mode .dropdown-list .dropdown-container ul li a{color:hsla(0,0%,100%,.8)}.dark-mode .dropdown-list .dropdown-container ul li a:hover{color:#fff}.dark-mode .notification{background-color:#000}.dark-mode .notification .dropdown-container{color:hsla(0,0%,100%,.8);border:1px solid #232d36}.dark-mode .notification .dropdown-container label{color:hsla(0,0%,100%,.8)}.dark-mode .notification .dropdown-container ul .read{background-color:#02080d;border-bottom:1px solid #24384c;color:hsla(0,0%,100%,.5)}.dark-mode .notification .dropdown-container ul .read .notif-content>a{text-decoration:none;color:hsla(0,0%,100%,.5)}.dark-mode .notification .dropdown-container ul .read .notif-content>a:hover{color:hsla(0,0%,100%,.5)}.dark-mode .notification .dropdown-container ul li{background-color:#02080d;border-bottom:1px solid #24384c;color:#fff}.dark-mode .notification .dropdown-container ul li .notif-content>a{text-decoration:none;color:#fff}.dark-mode .notification .dropdown-container ul li .notif-content>a:hover{color:#fff}.dark-mode .notification .dropdown-container ul .bottom-li a{display:initial;color:hsla(0,0%,100%,.8)!important}.dark-mode .control-container .control{background:#000}.dark-mode select.control{border:1px solid #24384c}.dark-mode .search-filter .control{background-color:#02080d;color:hsla(0,0%,100%,.8);border:1px solid #24384c}.dark-mode .search-filter .icon-wrapper{border:1px solid #24384c}.dark-mode .control-group label,.dark-mode h1{color:hsla(0,0%,100%,.8)}.dark-mode .control-group .control{border:1px solid #24384c}.dark-mode .grid-container .grid-top .datagrid-filters .dropdown-filters.per-page .control-group label{color:hsla(0,0%,100%,.8)}.dark-mode .tabs ul{border-bottom:1px solid #24384c}.dark-mode .tabs ul li a{color:hsla(0,0%,100%,.8)}.dark-mode .accordian .accordian-header,.dark-mode .accordian div[slot*=header],.dark-mode accordian .accordian-header,.dark-mode accordian div[slot*=header]{background-color:#02080d;color:hsla(0,0%,100%,.5)}.dark-mode .accordian .accordian-content,.dark-mode .accordian div[slot*=body],.dark-mode accordian .accordian-content,.dark-mode accordian div[slot*=body]{background-color:#000;border-bottom:1px solid #24384c}.dark-mode .accordian.active>.accordian-content,.dark-mode accordian.active>.accordian-content{background-color:#02080d}.dark-mode .accordian.active>.accordian-header,.dark-mode accordian.active>.accordian-header{background-color:#000}.dark-mode .sale-container .sale .sale-section .secton-title{color:hsla(0,0%,100%,.8);border-bottom:1px solid #24384c}.dark-mode .control-group .label,.dark-mode .sale-container .sale .sale-section .section-content .row .title,.dark-mode .sale-container .sale .sale-section .section-content .row .value,.dark-mode .sale-container .summary-comment-container .comment-container .comment-list li p{color:hsla(0,0%,100%,.8)}.dark-mode .control-group .control{background-color:#02080d;color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .card{background:#071e37;box-shadow:0 5px 10px 2px rgba(0,0,0,.8)}.dark-mode .dashboard .card .card-title{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .card .card-info ul li .description{margin-top:10px}.dark-mode .dashboard .card .card-info ul li .description .name{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .card .card-info ul li .description .info{color:hsla(0,0%,100%,.8);margin-top:5px}.dark-mode .dashboard .card .card-info .no-result-found p{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .dashboard-stats .dashboard-card{background:#071e37;box-shadow:0 5px 10px 2px rgba(0,0,0,.8)}.dark-mode .dashboard .dashboard-stats .dashboard-card .title{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .dashboard-stats .dashboard-card .data{color:#fff}.dark-mode .dashboard .dashboard-stats .dashboard-card .data .progress{color:hsla(0,0%,100%,.8)}.dark-mode .pagination .page-item{background:#000;border:0 solid;color:#fff}.dark-mode .pagination .page-item.active{background-color:rgba(40,69,100,.2)!important;color:#fff;border-color:rgba(2,57,83,.2)!important}.dark-mode .filter-tag .wrapper{background:#02080d;border:1px solid #02080d;color:hsla(0,0%,100%,.8)}.dark-mode .notif{background-color:#02080d}.dark-mode .notif .read{background-color:#212121!important;color:hsla(0,0%,100%,.5)}.dark-mode .notif .read .notif-content>a{text-decoration:none;color:hsla(0,0%,100%,.5)}.dark-mode .notif li{border:1px solid #24384c;color:#fff}.dark-mode .notif li .notif-content>a{text-decoration:none;color:#fff}.dark-mode #notif-title{height:50px;padding:14px 10px;border-bottom:1px solid #232d36;cursor:default}.dark-mode .flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;-webkit-animation:none;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:307.875px;box-sizing:border-box;touch-action:manipulation;background-color:#02080d;box-shadow:1px 0 0 #000,-1px 0 0 #000,0 1px 0 #000,0 -1px 0 #000,0 3px 13px rgba(0,0,0,.08)}.dark-mode .flatpickr-months .flatpickr-month,.dark-mode .flatpickr-weekdays .flatpickr-weekdaycontainer,.dark-mode span.flatpickr-weekday{color:#fff}.dark-mode .flatpickr-day.flatpickr-disabled,.dark-mode .flatpickr-day.flatpickr-disabled:hover,.dark-mode .flatpickr-day.nextMonthDay,.dark-mode .flatpickr-day.notAllowed,.dark-mode .flatpickr-day.notAllowed.nextMonthDay,.dark-mode .flatpickr-day.notAllowed.prevMonthDay,.dark-mode .flatpickr-day.prevMonthDay{color:hsla(0,0%,100%,.8);background:transparent;border-color:transparent;cursor:default}.dark-mode .flatpickr-day,.dark-mode .flatpickr-weekwrapper span.flatpickr-day,.dark-mode .flatpickr-weekwrapper span.flatpickr-day:hover{color:#fff}.dark-mode .flatpickr-months .flatpickr-next-month,.dark-mode .flatpickr-months .flatpickr-prev-month{color:#fff;fill:#fff}.dark-mode .flatpickr-day.endRange,.dark-mode .flatpickr-day.endRange.inRange,.dark-mode .flatpickr-day.endRange.nextMonthDay,.dark-mode .flatpickr-day.endRange.prevMonthDay,.dark-mode .flatpickr-day.endRange:focus,.dark-mode .flatpickr-day.endRange:hover,.dark-mode .flatpickr-day.selected,.dark-mode .flatpickr-day.selected.inRange,.dark-mode .flatpickr-day.selected.nextMonthDay,.dark-mode .flatpickr-day.selected.prevMonthDay,.dark-mode .flatpickr-day.selected:focus,.dark-mode .flatpickr-day.selected:hover,.dark-mode .flatpickr-day.startRange,.dark-mode .flatpickr-day.startRange.inRange,.dark-mode .flatpickr-day.startRange.nextMonthDay,.dark-mode .flatpickr-day.startRange.prevMonthDay,.dark-mode .flatpickr-day.startRange:focus,.dark-mode .flatpickr-day.startRange:hover{background:#051e37!important;color:#fff;border-color:#051e37!important}.dark-mode .flatpickr-day.inRange,.dark-mode .flatpickr-day.nextMonthDay.inRange,.dark-mode .flatpickr-day.nextMonthDay.today.inRange,.dark-mode .flatpickr-day.nextMonthDay:focus,.dark-mode .flatpickr-day.nextMonthDay:hover,.dark-mode .flatpickr-day.prevMonthDay.inRange,.dark-mode .flatpickr-day.prevMonthDay.today.inRange,.dark-mode .flatpickr-day.prevMonthDay:focus,.dark-mode .flatpickr-day.prevMonthDay:hover,.dark-mode .flatpickr-day.today.inRange,.dark-mode .flatpickr-day:focus,.dark-mode .flatpickr-day:hover{cursor:pointer;outline:0;background:#24384c!important;border-color:#24384c!important}.dark-mode .control-group .slider{top:-2px!important;right:-2px!important;background-color:#000!important;border:1px solid #24384c!important}.dark-mode .control-group input:checked+.slider{background-color:#000!important}body{margin:0;color:#3a3a3a;font-family:Montserrat,sans-serif;font-size:14px;font-weight:500;height:100%;width:100%;background-color:#fff}.dark-mode-button{background:#0041ff;border:none;padding:10px 30px;width:95%;margin-left:3%;border-radius:5px;color:#fff;font-size:16px;margin-bottom:10px}.navbar-top{background-color:#fff;font-size:0;border-bottom:1px solid hsla(0,0%,63.5%,.2);position:fixed;left:0;top:0;right:0;z-index:8}.navbar-top,.navbar-top .navbar-top-left{display:flex;justify-content:space-between;height:60px}.navbar-top .navbar-top-left{align-items:center}.navbar-top .navbar-top-left .hamburger{display:block;width:48px;height:48px}.navbar-top .navbar-top-left .hamburger:before{content:"";width:24px;height:24px;background-color:#639;background-image:url(../assets/image/Icon-Sortable.svg);display:block}.navbar-top .navbar-top-left .brand-logo{margin-left:8px}.navbar-top .navbar-top-right{height:60px;text-align:right;display:inline-block;vertical-align:middle}.navbar-top .navbar-top-right .profile-info{display:inline-block;vertical-align:middle;text-align:left;min-width:50px;padding:11px 16px;font-size:15px;cursor:pointer;position:relative;border-left:1px solid hsla(0,0%,63.5%,.2)}.navbar-top .navbar-top-right .profile-info .app-version{padding:10px 20px 0;margin-bottom:-10px;display:block;cursor:default;color:#a2a2a2}.navbar-top .navbar-top-right .profile-info .profile-info-div{display:flex}.navbar-top .navbar-top-right .profile-info .profile-info-div .profile-info-icon{height:31px;width:30px;background:#3c41ff;padding:6px;text-align:center;font-size:17px;font-weight:600;color:#fff;border-radius:50%;margin-right:6px;margin-top:3px}.navbar-top .navbar-top-right .profile-info .dropdown-list{top:63px;right:0;bottom:inherit!important}.navbar-top .navbar-top-right .profile-info .name{color:#000311;display:block;text-align:left}.navbar-top .navbar-top-right .profile-info .role{font-size:12px;color:#8e8e8e;display:block;text-align:left}.navbar-top .navbar-top-right .notifications{display:inline-block;vertical-align:middle;text-align:left;min-width:50px;padding:11px 16px;font-size:15px;cursor:pointer;position:relative;border-left:1px solid hsla(0,0%,63.5%,.2)}.navbar-top .navbar-top-right .notifications .dropdown-list{top:63px;right:0;bottom:inherit!important}.navbar-top .navbar-top-right .notifications .name{color:#000311;display:block;text-align:left}.navbar-top .navbar-top-right .notifications .role{font-size:12px;color:#8e8e8e;display:block;text-align:left}.navbar-top .navbar-top-right .notifications i.icon{margin-left:10px}.navbar-top .navbar-top-right .store{display:inline-block;vertical-align:middle;text-align:left;min-width:50px;padding:15px 16px;font-size:15px;cursor:pointer;position:relative;border-left:1px solid hsla(0,0%,63.5%,.2)}.navbar-left{left:0;bottom:0;top:60px;z-index:6;width:56px;height:100vh!important;position:fixed;background-color:#fff;border-right:1px solid #ececec}.navbar-left ul.menubar li.menu-item{font-size:12px;position:relative;overflow:hidden}.navbar-left ul.menubar li.menu-item>a{padding:5px 2px;display:block;color:#000;width:100%}.navbar-left ul.menubar li.menu-item>a .icon{display:inline-block;vertical-align:middle;transform:scale(.7)}.navbar-left ul.menubar li.menu-item>a .menu-label{display:none;color:#b0bec5}.navbar-left ul.menubar li.menu-item>a .arrow-icon{display:none}.navbar-left ul.menubar li.menu-item>a.active,.navbar-left ul.menubar li.menu-item>a:hover{padding:5px 2px}.navbar-left ul.menubar li.menu-item span{display:block;margin:auto}.navbar-left ul.menubar li.menu-item ul.sub-menubar{display:none;min-width:200px;position:absolute;top:0;left:56px;background-color:#fff;box-shadow:2px 1px 3px #cdcecf;border:1px solid #eee;border-left:0;border-radius:0 3px 3px 0}.navbar-left ul.menubar li.menu-item ul.sub-menubar li.sub-menu-item a{display:block;padding:8px 12px;color:#000;font-size:12px}.navbar-left ul.menubar li.menu-item:hover{overflow:visible}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar{display:block}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item .menu-label{color:#000}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active{background-color:#e6e6e6}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active .menu-label,.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item:hover .menu-label{color:#0041ff}.navbar-left.open{width:200px}.navbar-left.open ul.menubar{height:86vh;overflow-y:auto}.navbar-left.open ul.menubar::-webkit-scrollbar{width:0!important}.navbar-left.open ul.menubar li.menu-item a .menu-label{font-size:14px;font-weight:200;display:inline-block;color:#000}.navbar-left.open ul.menubar li.menu-item a .arrow-icon{display:inline-block}.navbar-left.open ul.menubar li.menu-item ul.sub-menubar{display:none;position:unset;background-color:transparent;border-radius:0;box-shadow:unset;border:0}.navbar-left.open ul.menubar li.menu-item ul.sub-menubar li.sub-menu-item a{padding-left:52px}.navbar-left.open ul.menubar li.menu-item.active{background:#fff;width:calc(100% - 1px)}.navbar-left.open ul.menubar li.menu-item.active .menu-label{color:#000}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar{display:block;background-color:#fff;border:none!important}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item .menu-label{color:#000}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active,.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover{background-color:#e6e6e6}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active .menu-label,.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover .menu-label{color:#000!important}.navbar-left.open ul.menubar li.menu-item:hover .menu-label{color:#000}.navbar-left .menubar-bottom{padding:12px;cursor:pointer;position:fixed;bottom:0;background-color:#fff;width:56px}.control-container{display:flex;flex-direction:row;align-items:flex-start;width:750px}.control-container .control{background:#fff;border:1px solid #c7c7c7;border-radius:3px;width:150px;height:36px;display:inline-block;vertical-align:middle;transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px}.control-container .control:focus{border-color:#0041ff}.control-container .icon:hover{cursor:pointer}.control-container .control-group::last-child{margin-right:0}.boolean-control-container{display:flex;flex-direction:row;justify-content:flex-start;width:750px}.boolean-control-container .control-group{width:200px}.control-group label{width:auto}.control-group label .locale{float:right;color:#8e8e8e}.control-group .mce-tinymce{margin-top:10px;margin-bottom:5px}.ticket-list .control-group.date:after{left:unset;right:10px;top:34px}.ticket-list .control-group.has-error.date:after{top:47px}.variant-image .image-item{height:100px!important;width:100px!important;background-size:100px 100px!important}.variant-image .trash-icon{position:absolute;cursor:pointer;margin-top:25%}.btn.add-image{display:inline-block;width:auto}.rtl .ticket-list .control-group.has-error.date:after{top:47px;right:100%!important}.content-container{padding-left:56px;height:calc(100% - 60px);width:100%;margin-top:60px}.content-container .inner-section{height:100%}.content-container .content-wrapper{margin-top:1px}.content-container .content .page-header{display:inline-block;width:100%;padding:16px 10px 15px 16px;position:-webkit-sticky;position:sticky;top:60px;z-index:3;background-color:#fff;box-shadow:0 3px 6px 0 rgba(0,0,0,.05)}.content-container .content .page-header .page-title{float:left}.content-container .content .page-header .page-title .back-link{float:left;margin-right:10px;width:24px;height:24px;cursor:pointer;margin-top:5px}.content-container .content .page-header .page-title h1{margin-bottom:0;vertical-align:middle;display:inline-block;line-height:normal}.content-container .content .page-header .page-action{float:right;margin-top:-5px}.content-container .content .page-header .page-action *{display:inline-block}.content-container .content .page-header .page-action a{margin-left:10px}.content-container .content .page-header .control-group{width:180px;display:inline-block;margin-bottom:0;margin-left:20px}.content-container .content .page-header .control{width:100%;margin:0}.content-container .content .page-content{width:100%;display:inline-block;padding:8px 16px}.notif{background-color:#fff}.notif li{padding:10px;border-bottom:1px solid #c7c7c7;position:relative}.notif li .notif-icon{position:absolute;height:40px;width:40px;left:12px;border-radius:5px}.notif li .notif-icon span{position:absolute;background-repeat:no-repeat;background-size:cover;top:5px;left:5px}.notif li .notif-content>a{text-decoration:none;color:#3a3a3a}.notif li .pending{background-color:#f2c94c}.notif li .processing{background-color:#399cdb}.notif li .canceled{background-color:red}.notif li .closed{background-color:#eb5757}.notif li .completed{background-color:#42c067}.notif li .notif-content{margin-left:50px}.notif .read{color:rgba(58,58,58,.5)}.notif .read .notif-content>a{text-decoration:none;color:rgba(58,58,58,.5)}.notification-badge{position:absolute;right:13px;top:6px;background:red;color:#fff;width:20px;text-align:center;border-radius:10px;font-size:11px;font-weight:900}#search-icon{position:absolute;margin-top:6px;margin-left:151px}.notif-filter{margin-top:0!important}.read{background-color:#e8e8e8}.page-item.active .page-link{color:#fff!important}.switch-dark{width:75%}.read-all{color:#3a3a3a;background:none;border:none}#notif-title{height:50px;padding:14px 10px;border-bottom:1px solid #c7c7c7;cursor:default}@media only screen and (min-width:768px){.navbar-left{display:block}.navbar-top .navbar-top-right .profile .profile-info{display:inline-block}#search-icon{position:absolute;margin-top:6px;margin-left:151px}.notif-filter{margin-top:0!important}.switch-dark{width:75%}}@media only screen and (max-width:768px){h1{font-size:18px}.btn.btn-lg{padding:4px 6px}.navbar-top .navbar-top-left .hamburger{display:block}.navbar-top .navbar-top-right .profile .profile-info{display:none}.navbar-left{left:0;display:none}.content-container{padding-left:0;position:absolute;margin-top:60px;top:0;right:0;left:0;bottom:0;height:calc(100% - 60px);width:100%}.content-container .aside-nav{display:none}.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}.content-container .content .page-header .page-title{float:left;width:100%}.content-container .content .page-header .page-title .back-link{margin-top:0;margin-right:-1px;height:22px!important;width:22px!important}.content-container .content .page-header .page-action{position:absolute;right:10px;margin-top:0}.content-container .content .page-header .page-action .export-import{margin-top:-15px}.content-container .content .page-header .page-action *{display:inline-block}.content-container .content-wrapper{margin-left:0;margin-top:1px}#search-icon{position:absolute;margin-top:6px;right:16px}.notif-filter{margin-top:12px!important}.switch-dark{width:100%}}@media only screen and (max-width:411px){.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}}@media only screen and (max-width:385px){.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}}@media only screen and (max-width:320px){.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}}.nav-container{position:relative;display:none;max-width:31px-25px 10px;max-height:31px-25px 10px;overflow:visible;outline:none}.nav-container.is-active .nav-toggle:after,.nav-container.is-active .nav-toggle:before{box-shadow:none}.nav-container.is-active .nav-items,.nav-container.is-active .nav-top{transform:translate(0)}.nav-container.is-active .overlay{display:block}.nav-container .overlay{background-color:rgba(0,0,0,.8);position:fixed;top:0;left:0;height:100vh;width:100vh;display:none;z-index:1}.nav-container .nav-toggle{background-image:url(../images/hamburger.svg);background-repeat:no-repeat;background-size:cover;position:relative;top:8px;width:31px;height:31px;margin:-25px 10px;z-index:1}.nav-container .nav-toggle:hover{cursor:pointer}.nav-container .close{position:absolute;right:13px;top:15px;width:32px;height:32px}.nav-container .close:hover{opacity:1}.nav-container .close:before{transform:rotate(45deg)}.nav-container .close:after,.nav-container .close:before{position:absolute;left:15px;content:" ";height:28px;width:2px;background-color:#8184ab}.nav-container .close:after{transform:rotate(-45deg)}.nav-container .nav-top{position:fixed;top:0;left:0;min-width:300px;max-width:25vw;width:100vw;height:60px;z-index:1;padding:50px 0 0;transition:transform .3s ease;transform:translate(calc(-100% - 50px));background:#fff;display:grid;grid-template-columns:1fr;align-content:start;box-shadow:0 0 50px rgba(0,0,0,.3);text-decoration:none}.nav-container .nav-top .pro-info{width:100%;padding:15px;position:absolute}.nav-container .nav-top .pro-info .profile-info-icon{position:absolute;display:inline-block;background:#3c41ff;height:30px;width:30px;text-align:center;border-radius:50%}.nav-container .nav-top .pro-info .profile-info-icon>span{display:block;margin:6px;font-size:18px;color:#fff}.nav-container .nav-top .pro-info .profile-info-desc{display:inline-block;margin-left:40px}.nav-container .nav-top .pro-info .profile-info-desc .name{font-size:18px;color:#000}.nav-container .nav-top .pro-info .profile-info-desc .role{font-size:10px;color:#000}.nav-container .nav-items{position:fixed;top:60px;left:0;min-width:300px;max-width:25vw;width:100vw;height:92vh;z-index:1;padding-bottom:10px;transition:transform .3s ease;transform:translate(calc(-100% - 50px));background:#fff;display:grid;grid-template-columns:1fr;align-content:start;box-shadow:0 0 50px rgba(0,0,0,.3);overflow-y:scroll;text-decoration:none}.nav-container .nav-items::-webkit-scrollbar{display:none}.nav-container .nav-items .nav-item{transition:background-color .3s ease;font-size:16px;text-transform:capitalize;text-decoration:none}.nav-container .nav-items .nav-item a{color:#000;display:block;padding:5px}.nav-container .nav-items .nav-item ul{display:none}.nav-container .nav-items .nav-item ul .navbar-child{text-transform:capitalize;padding:15px}.nav-container .nav-items .nav-item ul .navbar-child.active,.nav-container .nav-items .nav-item ul .navbar-child:hover{background-color:#e6e6e6}.nav-container .nav-items .nav-item .display-block{display:block!important}.nav-container .nav-items .nav-item.active{background-color:#e6e6e6}.nav-container .nav-items .nav-item.active>a,.nav-container .nav-items .nav-item:hover>a{background-color:#ddd}@media only screen and (max-width:768px){.nav-container{display:inline-block}.destop-logo{display:none}.content-container{padding-left:0!important}}.dashboard .page-header{margin-bottom:0!important;padding-bottom:15px;border-bottom:1px solid hsla(0,0%,63.5%,.2)}.dashboard .page-header .control-group span{width:100%}.dashboard .page-header .control-group.date:after{margin-top:-13px;left:100%}.dashboard .page-content{margin-top:15px}.dashboard .card{height:445px;background-color:#fff;border:1px solid hsla(0,0%,63.5%,.2);box-shadow:0 5px 10px 2px hsla(0,0%,63.5%,.2);border-radius:.25rem;padding:20px 0 0 20px;overflow:auto}.dashboard .card .card-title{font-size:14px;color:#3a3a3a;letter-spacing:-.26px;text-transform:uppercase}.dashboard .card .card-info{width:100%;display:inline-block}.dashboard .card .card-info.center{text-align:center}.dashboard .card .card-info ul li{border-bottom:1px solid hsla(0,0%,63.5%,.2);width:100%;display:inline-block;padding:10px 0;position:relative}.dashboard .card .card-info ul li .image{height:60px;width:60px;float:left;margin-right:15px}.dashboard .card .card-info ul li .image.product{background:#f2f2f2}.dashboard .card .card-info ul li .image img{width:100%}.dashboard .card .card-info ul li .description{margin-top:10px}.dashboard .card .card-info ul li .description .name{color:#3a3a3a}.dashboard .card .card-info ul li .description .info{color:#3a3a3a;margin-top:5px}.dashboard .card .card-info ul li .icon.angle-right-icon{position:absolute;right:30px;top:50%;margin-top:-8px}.dashboard .card .card-info ul li:last-child{border-bottom:0}.dashboard .card .card-info .no-result-found{margin-top:146px}.dashboard .card .card-info .no-result-found p{margin:0;color:#3a3a3a}.dashboard .dashboard-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));grid-auto-rows:auto;grid-column-gap:30px;grid-row-gap:15px}.dashboard .dashboard-stats .dashboard-card{height:100px;background:#fff;border:1px solid hsla(0,0%,63.5%,.2);box-shadow:0 5px 10px 2px hsla(0,0%,63.5%,.2);border-radius:5px;position:relative;padding:15px}.dashboard .dashboard-stats .dashboard-card .title{font-size:14px;color:#3a3a3a;text-transform:uppercase}.dashboard .dashboard-stats .dashboard-card .data{padding-top:13px;font-size:32px;color:#0041ff}.dashboard .dashboard-stats .dashboard-card .data .progress{font-size:14px;color:#8e8e8e;float:right;margin-top:-2px}.dashboard .dashboard-stats .dashboard-card .data .progress .icon{vertical-align:middle}.dashboard .graph-stats{margin-top:30px;width:100%;display:inline-block}.dashboard .graph-stats .left-card-container{float:left;width:75%;padding-right:9px}.dashboard .graph-stats .right-card-container{float:left;width:25%;padding-left:21px}.dashboard .sale-stock{width:100%;display:inline-block;display:grid;grid-template-columns:repeat(auto-fill,minmax(435px,1fr));grid-auto-rows:auto;grid-column-gap:30px;grid-row-gap:15px;margin-top:30px}#calender-destop{display:block}#calender-mobile{position:relative;display:none}#calender-mobile span{background-image:url(../images/Icon-Calendar.svg);width:24px;height:24px;vertical-align:middle;cursor:pointer;position:absolute;top:0;right:4px}#date-start{margin-top:40px}#date-end,#date-start,#date-submit{display:block;width:337px}#date-submit{margin-top:15px}.rtl .dashboard .page-header .control-group.date:after{margin-top:-13px!important;right:100%}@media only screen and (max-width:770px){.dashboard .card{padding:10px 0 0 15px;overflow:auto;margin-bottom:20px}.dashboard .sale-stock{display:block;margin-top:30px;margin-bottom:10px}.dashboard .graph-stats .left-card-container{float:left;width:100%;padding-right:0;margin-bottom:10px}.dashboard .graph-stats .right-card-container{float:left;width:100%;padding-left:0}#calender-mobile{display:block}#calender-destop{display:none}}.configuration-image{position:relative;height:33px;width:33px;top:15px;border-radius:3px;margin-right:5px}.download{position:relative;height:24px!important;width:24px!important;top:12px;margin-right:10px}.aside-nav-toggle{height:48px;width:100%;padding-top:15px;border-top:1px solid hsla(0,0%,63.5%,.2)}.aside-nav-toggle .close-icon,.aside-nav-toggle .open-icon{position:absolute;cursor:pointer;left:45%}.aside-nav-toggle.open{display:none}.linked-product-search-result{box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);z-index:10;text-align:left;border-radius:3px;background-color:#fff;width:70%;max-height:200px;overflow-y:auto}.linked-product-search-result li{padding:10px;border-bottom:1px solid #e8e8e8;cursor:pointer}.cart-rule-conditions,.catalog-rule-conditions{display:flex;-moz-column-gap:10px;column-gap:10px}.cart-rule-conditions .attribute,.cart-rule-conditions .operator,.cart-rule-conditions .value,.catalog-rule-conditions .attribute,.catalog-rule-conditions .operator,.catalog-rule-conditions .value{width:25%;padding-left:0}.cart-rule-conditions .attribute .control-group .control,.cart-rule-conditions .operator .control-group .control,.cart-rule-conditions .value .control-group .control,.catalog-rule-conditions .attribute .control-group .control,.catalog-rule-conditions .operator .control-group .control,.catalog-rule-conditions .value .control-group .control{width:100%!important}.cart-rule-conditions .attribute .date:after,.cart-rule-conditions .operator .date:after,.cart-rule-conditions .value .date:after,.catalog-rule-conditions .attribute .date:after,.catalog-rule-conditions .operator .date:after,.catalog-rule-conditions .value .date:after{top:30%!important}.cart-rule-conditions .attribute .cross-icon,.cart-rule-conditions .operator .cross-icon,.cart-rule-conditions .value .cross-icon,.catalog-rule-conditions .attribute .cross-icon,.catalog-rule-conditions .operator .cross-icon,.catalog-rule-conditions .value .cross-icon{top:35%!important}.cart-rule-conditions .actions,.catalog-rule-conditions .actions{width:44px}.cart-rule-conditions .actions .icon,.catalog-rule-conditions .actions .icon{margin-top:15px}@media only screen and (max-width:770px){.cart-rule-conditions,.catalog-rule-conditions{display:block;border:1px solid #e8e8e8;padding:10px}.cart-rule-conditions .attribute,.cart-rule-conditions .operator,.cart-rule-conditions .value,.catalog-rule-conditions .attribute,.catalog-rule-conditions .operator,.catalog-rule-conditions .value{width:100%;padding-left:0}.cart-rule-conditions .attribute .control-group .control,.cart-rule-conditions .operator .control-group .control,.cart-rule-conditions .value .control-group .control,.catalog-rule-conditions .attribute .control-group .control,.catalog-rule-conditions .operator .control-group .control,.catalog-rule-conditions .value .control-group .control{width:100%!important;margin-top:0!important;margin-bottom:0!important}.cart-rule-conditions .attribute .date:after,.cart-rule-conditions .operator .date:after,.cart-rule-conditions .value .date:after,.catalog-rule-conditions .attribute .date:after,.catalog-rule-conditions .operator .date:after,.catalog-rule-conditions .value .date:after{top:18%!important}.cart-rule-conditions .attribute .cross-icon,.cart-rule-conditions .operator .cross-icon,.cart-rule-conditions .value .cross-icon,.catalog-rule-conditions .attribute .cross-icon,.catalog-rule-conditions .operator .cross-icon,.catalog-rule-conditions .value .cross-icon{top:20%!important}.cart-rule-conditions .actions,.catalog-rule-conditions .actions{width:44px}.cart-rule-conditions .actions .icon,.catalog-rule-conditions .actions .icon{margin:0}}.sale-container .sale{display:flex;-moz-column-gap:20px;column-gap:20px}.sale-container .sale .sale-section{font-size:16px;width:50%}.sale-container .sale .sale-section .secton-title{font-size:18px;color:#8e8e8e;padding:15px 0;border-bottom:1px solid hsla(0,0%,63.5%,.2)}.sale-container .sale .sale-section .section-content{display:block;padding:20px 0}.sale-container .sale .sale-section .section-content .row{display:block;padding:7px 0}.sale-container .sale .sale-section .section-content .row .title{width:200px;color:#3a3a3a;letter-spacing:-.26px;display:inline-block}.sale-container .sale .sale-section .section-content .row .value{color:#3a3a3a;letter-spacing:-.26px;display:inline-block}.sale-container .table .qty-row{display:block;margin-bottom:5px}.sale-container .table .qty-row:last-child{margin-bottom:0}.sale-container .table .radio{margin:0}.sale-container .summary-comment-container .comment-container{margin-top:20px;float:left}.sale-container .summary-comment-container .comment-container .comment-list{margin-top:40px}.sale-container .summary-comment-container .comment-container .comment-list li{margin-bottom:20px}.sale-container .summary-comment-container .comment-container .comment-list li:last-child{margin-bottom:0}.sale-container .summary-comment-container .comment-container .comment-list li p{margin:5px 0 0;color:#8e8e8e}.sale-container .sale-summary{margin-top:20px;height:130px;float:right}.sale-container .sale-summary tr td{padding:5px 8px;vertical-align:text-bottom}.sale-container .sale-summary tr.bold{font-weight:600;font-size:15px}.sale-container .sale-summary tr.border td{border-bottom:1px solid hsla(0,0%,63.5%,.2)}.stars{margin-top:5px}.stars .icon{width:16px;height:16px}.export-import{cursor:pointer}.export-import .export-icon,.export-import .import-icon{position:relative;top:10px}.export-import span{margin-left:2px}@media only screen and (max-width:768px){.sale-container .sale{display:block}.sale-container .sale .sale-section,.sale-container .summary-comment-container .comment-container,.sale-container .summary-comment-container .comment-container form .control-group{width:100%}}.rtl{direction:rtl}.rtl .form-container{text-align:right!important}.rtl .navbar-top .navbar-top-right{text-align:left}.rtl .navbar-top .navbar-top-right .profile-info{margin:0 30px 0 25px}.rtl .navbar-top .navbar-top-right .profile-info i.icon{margin-left:0;margin-right:10px}.rtl .navbar-left{border-left:1px solid hsla(0,0%,63.5%,.2);border-right:none;background-color:#fff}.rtl .content-container{padding-right:90px;padding-left:0}.rtl .content-container .content .page-header .page-title{float:right}.rtl .content-container .content .page-header .page-action{float:left}.rtl .content-container .content .page-header .page-action a{margin-left:0}.rtl .content-container .content .page-header .control-group{margin-right:20px;margin-left:0}.rtl .content-container .content-wrapper{padding:25px;margin-right:280px;margin-left:0}.rtl .content-container .aside-nav .active i{float:left;transform:rotate(180deg)}.rtl .content-container .aside-nav:not(.active)+.content-wrapper{margin-right:0}.rtl .dashboard .dashboard-stats .dashboard-card .data span{float:left}.rtl .dashboard .card{padding:20px 20px 0 0}.rtl .dashboard .card .card-info ul li .image{float:right;margin-right:0;margin-left:15px}.rtl .dashboard .card .card-info ul li .icon.angle-right-icon{left:30px;right:auto;transform:rotate(180deg)}.rtl .dashboard .graph-stats .left-card-container{float:right;padding-right:0}.rtl .dashboard .graph-stats .right-card-container{float:right;padding-left:0;padding-right:30px}.rtl .sale-container .sale-summary{float:left}.rtl .grid-container .table tbody td.action a:first-child{margin-left:10px;margin-right:0}.rtl .table table{text-align:right}.rtl .table table .massaction-remove{margin-right:5px!important;margin-left:10px}.rtl .table table .btn.btn-primary{margin-right:10px!important}.rtl .dropdown-list.bottom-right{left:0;right:auto!important}.rtl .dropdown-list .dropdown-container{text-align:right}.rtl .accordian .accordian-header .icon{float:left}.rtl .tree-container .tree-item{padding-right:30px}.rtl .tree-container .tree-item .expand-icon,.rtl .tree-container .tree-item .folder-icon{margin-left:10px;margin-right:0}.rtl .tree-container>.tree-item{padding-right:0}.rtl .radio .radio-view{margin-left:5px}.rtl .image-wrapper .image-item{margin-right:0;margin-left:20px}.rtl .image-wrapper .image-item .remove-image{margin-right:0}.rtl .control-group label.required:before{content:"*";color:#fc6868;font-weight:700}.rtl .control-group label.required:after{content:none}.rtl .control-group label .locale{float:left}.rtl .multiselect{text-align:unset}.rtl .accordian-left-icon,.rtl .accordian-right-icon,.rtl .pagination .page-item .icon{transform:rotate(180deg)}.accordian-header{background-color:#fbfbfb}.btn.btn-primary{background:#0041ff}.btn.btn-danger{background:red}.fixed-action{top:108px}.fixed-action,.fixed-action-slight{position:fixed;right:32px;z-index:20}.fixed-action-slight{top:94px}.pagination{margin-top:30px}.flatpickr-day.endRange,.flatpickr-day.endRange.inRange,.flatpickr-day.endRange.nextMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.endRange:focus,.flatpickr-day.endRange:hover,.flatpickr-day.selected,.flatpickr-day.selected.inRange,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.selected:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange,.flatpickr-day.startRange.inRange,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.startRange:focus,.flatpickr-day.startRange:hover{background:#0041ff!important;box-shadow:none;color:#fff;border-color:#0041ff!important}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.do-not-cross-arrow{width:85%}.linked-product-filter-tag{text-transform:capitalize;margin-top:10px;margin-right:0;justify-content:flex-start;height:100%}.linked-product-wrapper{margin-left:0!important;margin-right:10px!important;height:100%!important}.do-not-cross-linked-product-arrow{width:95%}
\ No newline at end of file
+@import url(https://fonts.googleapis.com/css?family=Montserrat:400,500);.dark-mode{background-color:#04101b}.dark-mode,.dark-mode .read-all{color:hsla(0,0%,100%,.8)}.dark-mode .navbar-top{background-color:#051e37}.dark-mode .navbar-top .navbar-top-left{background-color:#071e37;border-bottom:1px solid hsla(0,0%,63.5%,.2)}.dark-mode .navbar-top .profile-info .app-version{padding:10px 20px 0;margin-bottom:-10px;display:block;cursor:default;color:#a2a2a2}.dark-mode .navbar-top .profile-info .name{color:hsla(0,0%,100%,.8)!important}.dark-mode .navbar-top .profile-info .dropdown-list{right:0;bottom:inherit!important;border:1px solid #24384c}.dark-mode .navbar-left{background-color:#051e37;border-right:1px solid #051e37}.dark-mode .navbar-left ul.menubar li.menu-item>a{padding:5px 2px;display:block;color:#000;width:100%}.dark-mode .navbar-left ul.menubar li.menu-item>a .icon{display:inline-block;vertical-align:middle;transform:scale(.7)}.dark-mode .navbar-left ul.menubar li.menu-item>a .menu-label{display:none;color:#b0bec5}.dark-mode .navbar-left ul.menubar li.menu-item>a .arrow-icon{display:none}.dark-mode .navbar-left ul.menubar li.menu-item>a.active,.dark-mode .navbar-left ul.menubar li.menu-item>a:hover{padding:5px 2px;background-color:rgba(1,10,20,.5)}.dark-mode .navbar-left ul.menubar li.menu-item.active>a{background-color:rgba(1,10,20,.5)}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar{background:#020f1c;box-shadow:none;border:1px solid #24384c}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item .menu-label{color:#fff!important}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active,.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item:hover{background-color:#020f1c}.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active .menu-label,.dark-mode .navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item:hover .menu-label{color:#fff!important}.dark-mode .navbar-left.open ul.menubar li.menu-item a .menu-label{font-size:14px;font-weight:200;display:inline-block;color:#b0bec5}.dark-mode .navbar-left.open ul.menubar li.menu-item a .arrow-icon{display:inline-block}.dark-mode .navbar-left.open ul.menubar li.menu-item ul.sub-menubar{display:none;position:unset;background-color:transparent;border-radius:0;box-shadow:unset;border:0}.dark-mode .navbar-left.open ul.menubar li.menu-item ul.sub-menubar li.sub-menu-item a{padding-left:52px}.dark-mode .navbar-left.open ul.menubar li.menu-item.active{background:#051e37;width:100%}.dark-mode .navbar-left.open ul.menubar li.menu-item.active .menu-label{color:#fff}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar{display:block;background-color:#020f1c;border:none!important}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item .menu-label{color:#b0bec5}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active,.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover{background-color:rgba(1,10,20,.5)}.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active .menu-label,.dark-mode .navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover .menu-label{color:#fff!important}.dark-mode .navbar-left.open ul.menubar li.menu-item:hover{background:#051e37}.dark-mode .navbar-left.open ul.menubar li.menu-item:hover .menu-label{color:#fff}.dark-mode .navbar-left .menubar-bottom{background-color:#051e37}.dark-mode .nav-container .nav-top{background:#051e37}.dark-mode .nav-container .nav-top .pro-info .profile-info-desc{display:inline-block;margin-left:40px}.dark-mode .nav-container .nav-top .pro-info .profile-info-desc .name,.dark-mode .nav-container .nav-top .pro-info .profile-info-desc .role{color:#fff}.dark-mode .nav-container .nav-items{background:#051e37}.dark-mode .nav-container .nav-items .nav-item a{color:#fff;display:block;padding:5px}.dark-mode .nav-container .nav-items .nav-item ul .navbar-child.active,.dark-mode .nav-container .nav-items .nav-item ul .navbar-child:hover{background-color:rgba(1,10,20,.5)}.dark-mode .nav-container .nav-items .nav-item.active{background-color:#020f1c}.dark-mode .nav-container .nav-items .nav-item.active>a,.dark-mode .nav-container .nav-items .nav-item:hover>a{background-color:rgba(1,10,20,.5)}.dark-mode .content-container .content .page-header,.dark-mode .content-container .inner-section .content-wrapper .page-header{background-color:#04101b;border-bottom:1px solid #24384c}.dark-mode .table{background-color:#04101b}.dark-mode .table table thead th{background-color:rgba(7,30,55,.2)!important;color:hsla(0,0%,100%,.8)}.dark-mode .table table tbody td{color:hsla(0,0%,100%,.8);border-bottom:1px solid hsla(0,0%,63.5%,.2)}.dark-mode .modal-container{background:#04101b}.dark-mode .modal-container .modal-header h3{display:inline-block;font-size:20px;color:hsla(0,0%,100%,.8);margin:0}.dark-mode .accordian .accordian-header,.dark-mode .accordian div[slot*=header],.dark-mode accordian .accordian-header,.dark-mode accordian div[slot*=header]{color:#3a3a3a;border-top:1px solid hsla(0,0%,63.5%,.2);border-bottom:1px solid hsla(0,0%,63.5%,.2)}@media only screen and (max-width:1300px){.dark-mode .table table tbody tr td{background-color:#04101b}}.dark-mode .grid-dropdown-header{background-color:#000;border:1px solid #24384c}.dark-mode .dropdown-list{background-color:#000}.dark-mode .dropdown-list .dropdown-container{background-color:#02080d;color:hsla(0,0%,100%,.8)}.dark-mode .dropdown-list .dropdown-container label,.dark-mode .dropdown-list .dropdown-container ul li a{color:hsla(0,0%,100%,.8)}.dark-mode .dropdown-list .dropdown-container ul li a:hover{color:#fff}.dark-mode .notification{background-color:#000}.dark-mode .notification .dropdown-container{color:hsla(0,0%,100%,.8);border:1px solid #232d36}.dark-mode .notification .dropdown-container label{color:hsla(0,0%,100%,.8)}.dark-mode .notification .dropdown-container ul .read{background-color:#02080d;border-bottom:1px solid #24384c;color:hsla(0,0%,100%,.5)}.dark-mode .notification .dropdown-container ul .read .notif-content>a{text-decoration:none;color:hsla(0,0%,100%,.5)}.dark-mode .notification .dropdown-container ul .read .notif-content>a:hover{color:hsla(0,0%,100%,.5)}.dark-mode .notification .dropdown-container ul li{background-color:#02080d;border-bottom:1px solid #24384c;color:#fff}.dark-mode .notification .dropdown-container ul li .notif-content>a{text-decoration:none;color:#fff}.dark-mode .notification .dropdown-container ul li .notif-content>a:hover{color:#fff}.dark-mode .notification .dropdown-container ul .bottom-li a{display:initial;color:hsla(0,0%,100%,.8)!important}.dark-mode .control-container .control{background:#000}.dark-mode select.control{border:1px solid #24384c}.dark-mode .search-filter .control{background-color:#02080d;color:hsla(0,0%,100%,.8);border:1px solid #24384c}.dark-mode .search-filter .icon-wrapper{border:1px solid #24384c}.dark-mode .control-group label,.dark-mode h1{color:hsla(0,0%,100%,.8)}.dark-mode .control-group .control{border:1px solid #24384c}.dark-mode .grid-container .grid-top .datagrid-filters .dropdown-filters.per-page .control-group label{color:hsla(0,0%,100%,.8)}.dark-mode .tabs ul{border-bottom:1px solid #24384c}.dark-mode .tabs ul li a{color:hsla(0,0%,100%,.8)}.dark-mode .accordian .accordian-header,.dark-mode .accordian div[slot*=header],.dark-mode accordian .accordian-header,.dark-mode accordian div[slot*=header]{background-color:#02080d;color:hsla(0,0%,100%,.5)}.dark-mode .accordian .accordian-content,.dark-mode .accordian div[slot*=body],.dark-mode accordian .accordian-content,.dark-mode accordian div[slot*=body]{background-color:#000;border-bottom:1px solid #24384c}.dark-mode .accordian.active>.accordian-content,.dark-mode accordian.active>.accordian-content{background-color:#02080d}.dark-mode .accordian.active>.accordian-header,.dark-mode accordian.active>.accordian-header{background-color:#000}.dark-mode .sale-container .sale .sale-section .secton-title{color:hsla(0,0%,100%,.8);border-bottom:1px solid #24384c}.dark-mode .control-group .label,.dark-mode .sale-container .sale .sale-section .section-content .row .title,.dark-mode .sale-container .sale .sale-section .section-content .row .value,.dark-mode .sale-container .summary-comment-container .comment-container .comment-list li p{color:hsla(0,0%,100%,.8)}.dark-mode .control-group .control{background-color:#02080d;color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .card{background:#071e37;box-shadow:0 5px 10px 2px rgba(0,0,0,.8)}.dark-mode .dashboard .card .card-title{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .card .card-info ul li .description{margin-top:10px}.dark-mode .dashboard .card .card-info ul li .description .name{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .card .card-info ul li .description .info{color:hsla(0,0%,100%,.8);margin-top:5px}.dark-mode .dashboard .card .card-info .no-result-found p{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .dashboard-stats .dashboard-card{background:#071e37;box-shadow:0 5px 10px 2px rgba(0,0,0,.8)}.dark-mode .dashboard .dashboard-stats .dashboard-card .title{color:hsla(0,0%,100%,.8)}.dark-mode .dashboard .dashboard-stats .dashboard-card .data{color:#fff}.dark-mode .dashboard .dashboard-stats .dashboard-card .data .progress{color:hsla(0,0%,100%,.8)}.dark-mode .pagination .page-item{background:#000;border:0 solid;color:#fff}.dark-mode .pagination .page-item.active{background-color:rgba(40,69,100,.2)!important;color:#fff;border-color:rgba(2,57,83,.2)!important}.dark-mode .filter-tag .wrapper{background:#02080d;border:1px solid #02080d;color:hsla(0,0%,100%,.8)}.dark-mode .notif{background-color:#02080d}.dark-mode .notif .read{background-color:#212121!important;color:hsla(0,0%,100%,.5)}.dark-mode .notif .read .notif-content>a{text-decoration:none;color:hsla(0,0%,100%,.5)}.dark-mode .notif li{border:1px solid #24384c;color:#fff}.dark-mode .notif li .notif-content>a{text-decoration:none;color:#fff}.dark-mode #notif-title{height:50px;padding:14px 10px;border-bottom:1px solid #232d36;cursor:default}.dark-mode .flatpickr-calendar{background:transparent;opacity:0;display:none;text-align:center;visibility:hidden;padding:0;-webkit-animation:none;animation:none;direction:ltr;border:0;font-size:14px;line-height:24px;border-radius:5px;position:absolute;width:307.875px;box-sizing:border-box;touch-action:manipulation;background-color:#02080d;box-shadow:1px 0 0 #000,-1px 0 0 #000,0 1px 0 #000,0 -1px 0 #000,0 3px 13px rgba(0,0,0,.08)}.dark-mode .flatpickr-months .flatpickr-month,.dark-mode .flatpickr-weekdays .flatpickr-weekdaycontainer,.dark-mode span.flatpickr-weekday{color:#fff}.dark-mode .flatpickr-day.flatpickr-disabled,.dark-mode .flatpickr-day.flatpickr-disabled:hover,.dark-mode .flatpickr-day.nextMonthDay,.dark-mode .flatpickr-day.notAllowed,.dark-mode .flatpickr-day.notAllowed.nextMonthDay,.dark-mode .flatpickr-day.notAllowed.prevMonthDay,.dark-mode .flatpickr-day.prevMonthDay{color:hsla(0,0%,100%,.8);background:transparent;border-color:transparent;cursor:default}.dark-mode .flatpickr-day,.dark-mode .flatpickr-weekwrapper span.flatpickr-day,.dark-mode .flatpickr-weekwrapper span.flatpickr-day:hover{color:#fff}.dark-mode .flatpickr-months .flatpickr-next-month,.dark-mode .flatpickr-months .flatpickr-prev-month{color:#fff;fill:#fff}.dark-mode .flatpickr-day.endRange,.dark-mode .flatpickr-day.endRange.inRange,.dark-mode .flatpickr-day.endRange.nextMonthDay,.dark-mode .flatpickr-day.endRange.prevMonthDay,.dark-mode .flatpickr-day.endRange:focus,.dark-mode .flatpickr-day.endRange:hover,.dark-mode .flatpickr-day.selected,.dark-mode .flatpickr-day.selected.inRange,.dark-mode .flatpickr-day.selected.nextMonthDay,.dark-mode .flatpickr-day.selected.prevMonthDay,.dark-mode .flatpickr-day.selected:focus,.dark-mode .flatpickr-day.selected:hover,.dark-mode .flatpickr-day.startRange,.dark-mode .flatpickr-day.startRange.inRange,.dark-mode .flatpickr-day.startRange.nextMonthDay,.dark-mode .flatpickr-day.startRange.prevMonthDay,.dark-mode .flatpickr-day.startRange:focus,.dark-mode .flatpickr-day.startRange:hover{background:#051e37!important;color:#fff;border-color:#051e37!important}.dark-mode .flatpickr-day.inRange,.dark-mode .flatpickr-day.nextMonthDay.inRange,.dark-mode .flatpickr-day.nextMonthDay.today.inRange,.dark-mode .flatpickr-day.nextMonthDay:focus,.dark-mode .flatpickr-day.nextMonthDay:hover,.dark-mode .flatpickr-day.prevMonthDay.inRange,.dark-mode .flatpickr-day.prevMonthDay.today.inRange,.dark-mode .flatpickr-day.prevMonthDay:focus,.dark-mode .flatpickr-day.prevMonthDay:hover,.dark-mode .flatpickr-day.today.inRange,.dark-mode .flatpickr-day:focus,.dark-mode .flatpickr-day:hover{cursor:pointer;outline:0;background:#24384c!important;border-color:#24384c!important}.dark-mode .control-group .slider{top:-2px!important;right:-2px!important;background-color:#000!important;border:1px solid #24384c!important}.dark-mode .control-group input:checked+.slider{background-color:#000!important}body{margin:0;color:#3a3a3a;font-family:Montserrat,sans-serif;font-size:14px;font-weight:500;height:100%;width:100%;background-color:#fff}.dark-mode-button{background:#0041ff;border:none;padding:10px 30px;width:95%;margin-left:3%;border-radius:5px;color:#fff;font-size:16px;margin-bottom:10px}.navbar-top{background-color:#fff;font-size:0;border-bottom:1px solid hsla(0,0%,63.5%,.2);position:fixed;left:0;top:0;right:0;z-index:8}.navbar-top,.navbar-top .navbar-top-left{display:flex;justify-content:space-between;height:60px}.navbar-top .navbar-top-left{align-items:center}.navbar-top .navbar-top-left .hamburger{display:block;width:48px;height:48px}.navbar-top .navbar-top-left .hamburger:before{content:"";width:24px;height:24px;background-color:#639;background-image:url(../assets/image/Icon-Sortable.svg);display:block}.navbar-top .navbar-top-left .brand-logo{margin-left:8px}.navbar-top .navbar-top-right{height:60px;text-align:right;display:inline-block;vertical-align:middle}.navbar-top .navbar-top-right .profile-info{display:inline-block;vertical-align:middle;text-align:left;min-width:50px;padding:11px 16px;font-size:15px;cursor:pointer;position:relative;border-left:1px solid hsla(0,0%,63.5%,.2)}.navbar-top .navbar-top-right .profile-info .app-version{padding:10px 20px 0;margin-bottom:-10px;display:block;cursor:default;color:#a2a2a2}.navbar-top .navbar-top-right .profile-info .profile-info-div{display:flex}.navbar-top .navbar-top-right .profile-info .profile-info-div .profile-info-icon{height:31px;width:30px;background:#3c41ff;padding:6px;text-align:center;font-size:17px;font-weight:600;color:#fff;border-radius:50%;margin-right:6px;margin-top:3px}.navbar-top .navbar-top-right .profile-info .dropdown-list{top:63px;right:0;bottom:inherit!important}.navbar-top .navbar-top-right .profile-info .name{color:#000311;display:block;text-align:left}.navbar-top .navbar-top-right .profile-info .role{font-size:12px;color:#8e8e8e;display:block;text-align:left}.navbar-top .navbar-top-right .notifications{display:inline-block;vertical-align:middle;text-align:left;min-width:50px;padding:11px 16px;font-size:15px;cursor:pointer;position:relative;border-left:1px solid hsla(0,0%,63.5%,.2)}.navbar-top .navbar-top-right .notifications .dropdown-list{top:63px;right:0;bottom:inherit!important}.navbar-top .navbar-top-right .notifications .name{color:#000311;display:block;text-align:left}.navbar-top .navbar-top-right .notifications .role{font-size:12px;color:#8e8e8e;display:block;text-align:left}.navbar-top .navbar-top-right .notifications i.icon{margin-left:10px}.navbar-top .navbar-top-right .store{display:inline-block;vertical-align:middle;text-align:left;min-width:50px;padding:15px 16px;font-size:15px;cursor:pointer;position:relative;border-left:1px solid hsla(0,0%,63.5%,.2)}.navbar-left{left:0;bottom:0;top:60px;z-index:6;width:56px;height:100vh!important;position:fixed;background-color:#fff;border-right:1px solid #ececec}.navbar-left ul.menubar li.menu-item{font-size:12px;position:relative;overflow:hidden}.navbar-left ul.menubar li.menu-item>a{padding:5px 2px;display:block;color:#000;width:100%}.navbar-left ul.menubar li.menu-item>a .icon{display:inline-block;vertical-align:middle;transform:scale(.7)}.navbar-left ul.menubar li.menu-item>a .menu-label{display:none;color:#b0bec5}.navbar-left ul.menubar li.menu-item>a .arrow-icon{display:none}.navbar-left ul.menubar li.menu-item>a.active,.navbar-left ul.menubar li.menu-item>a:hover{padding:5px 2px}.navbar-left ul.menubar li.menu-item span{display:block;margin:auto}.navbar-left ul.menubar li.menu-item ul.sub-menubar{display:none;min-width:200px;position:absolute;top:0;left:56px;background-color:#fff;box-shadow:2px 1px 3px #cdcecf;border:1px solid #eee;border-left:0;border-radius:0 3px 3px 0}.navbar-left ul.menubar li.menu-item ul.sub-menubar li.sub-menu-item a{display:block;padding:8px 12px;color:#000;font-size:12px}.navbar-left ul.menubar li.menu-item:hover{overflow:visible;background:#f8f8f8}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar{display:block}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item .menu-label{color:#000}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active{background-color:#e6e6e6}.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item.active .menu-label,.navbar-left ul.menubar li.menu-item:hover ul.sub-menubar .sub-menu-item:hover .menu-label{color:#0041ff}.navbar-left.open{width:200px}.navbar-left.open ul.menubar{height:86vh;overflow-y:auto}.navbar-left.open ul.menubar::-webkit-scrollbar{width:0!important}.navbar-left.open ul.menubar li.menu-item a .menu-label{font-size:14px;font-weight:200;display:inline-block;color:#000}.navbar-left.open ul.menubar li.menu-item a .arrow-icon{display:inline-block}.navbar-left.open ul.menubar li.menu-item ul.sub-menubar{display:none;position:unset;background-color:transparent;border-radius:0;box-shadow:unset;border:0}.navbar-left.open ul.menubar li.menu-item ul.sub-menubar li.sub-menu-item a{padding-left:52px}.navbar-left.open ul.menubar li.menu-item.active{background:#fff;width:100%}.navbar-left.open ul.menubar li.menu-item.active .menu-label{color:#000}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar{display:block;background-color:#f8f8f8;border:none!important}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item .menu-label{color:#000}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active,.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover{background-color:#eee}.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item.active .menu-label,.navbar-left.open ul.menubar li.menu-item.active ul.sub-menubar .sub-menu-item:hover .menu-label{color:#000!important}.navbar-left.open ul.menubar li.menu-item:hover .menu-label{color:#000}.navbar-left .menubar-bottom{padding:12px;cursor:pointer;position:fixed;bottom:0;background-color:#fff;width:56px}.control-container{display:flex;flex-direction:row;align-items:flex-start;width:750px}.control-container .control{background:#fff;border:1px solid #c7c7c7;border-radius:3px;width:150px;height:36px;display:inline-block;vertical-align:middle;transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px}.control-container .control:focus{border-color:#0041ff}.control-container .icon:hover{cursor:pointer}.control-container .control-group::last-child{margin-right:0}.boolean-control-container{display:flex;flex-direction:row;justify-content:flex-start;width:750px}.boolean-control-container .control-group{width:200px}.control-group label{width:auto}.control-group label .locale{float:right;color:#8e8e8e}.control-group .mce-tinymce{margin-top:10px;margin-bottom:5px}.ticket-list .control-group.date:after{left:unset;right:10px;top:34px}.ticket-list .control-group.has-error.date:after{top:47px}.variant-image .image-item{height:100px!important;width:100px!important;background-size:100px 100px!important}.variant-image .trash-icon{position:absolute;cursor:pointer;margin-top:25%}.btn.add-image{display:inline-block;width:auto}.rtl .ticket-list .control-group.has-error.date:after{top:47px;right:100%!important}.content-container{padding-left:56px;height:calc(100% - 60px);width:100%;margin-top:60px}.content-container .inner-section{height:100%}.content-container .content-wrapper{margin-top:1px}.content-container .content .page-header{display:inline-block;width:100%;padding:16px 10px 15px 16px;position:-webkit-sticky;position:sticky;top:60px;z-index:3;background-color:#fff;box-shadow:0 3px 6px 0 rgba(0,0,0,.05)}.content-container .content .page-header .page-title{float:left}.content-container .content .page-header .page-title .back-link{float:left;margin-right:10px;width:24px;height:24px;cursor:pointer;margin-top:5px}.content-container .content .page-header .page-title h1{margin-bottom:0;vertical-align:middle;display:inline-block;line-height:normal}.content-container .content .page-header .page-action{float:right;margin-top:-5px}.content-container .content .page-header .page-action *{display:inline-block}.content-container .content .page-header .page-action a{margin-left:10px}.content-container .content .page-header .control-group{width:180px;display:inline-block;margin-bottom:0;margin-left:20px}.content-container .content .page-header .control{width:100%;margin:0}.content-container .content .page-content{width:100%;display:inline-block;padding:8px 16px}.notif{background-color:#fff}.notif li{padding:10px;border-bottom:1px solid #ddd;position:relative}.notif li .notif-icon{position:absolute;height:40px;width:40px;left:12px;border-radius:5px}.notif li .notif-icon span{position:absolute;background-repeat:no-repeat;background-size:cover;top:5px;left:5px}.notif li .notif-content>a{text-decoration:none;color:#3a3a3a}.notif li .pending{background-color:#f2c94c}.notif li .processing{background-color:#399cdb}.notif li .canceled{background-color:red}.notif li .closed{background-color:#eb5757}.notif li .completed{background-color:#42c067}.notif li .notif-content{margin-left:50px}.notif .read{color:rgba(58,58,58,.5)}.notif .read .notif-content>a{text-decoration:none;color:rgba(58,58,58,.5)}.notification-badge{position:absolute;right:13px;top:6px;background:red;color:#fff;width:20px;text-align:center;border-radius:10px;font-size:11px;font-weight:900}#search-icon{position:absolute;margin-top:6px;margin-left:151px}.notif-filter{margin-top:0!important}.read{background-color:#f6f6f6}.page-item.active .page-link{color:#fff!important}.switch-dark{width:75%}.read-all{color:#3a3a3a;background:none;border:none}#notif-title{height:50px;padding:14px 10px;border-bottom:1px solid #c7c7c7;cursor:default}@media only screen and (min-width:768px){.navbar-left{display:block}.navbar-top .navbar-top-right .profile .profile-info{display:inline-block}#search-icon{position:absolute;margin-top:6px;margin-left:151px}.notif-filter{margin-top:0!important}.switch-dark{width:75%}}@media only screen and (max-width:768px){h1{font-size:18px}.btn.btn-lg{padding:4px 6px}.navbar-top .navbar-top-left .hamburger{display:block}.navbar-top .navbar-top-right .profile .profile-info{display:none}.navbar-left{left:0;display:none}.content-container{padding-left:0;position:absolute;margin-top:60px;top:0;right:0;left:0;bottom:0;height:calc(100% - 60px);width:100%}.content-container .aside-nav{display:none}.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}.content-container .content .page-header .page-title{float:left;width:100%}.content-container .content .page-header .page-title .back-link{margin-top:0;margin-right:-1px;height:22px!important;width:22px!important}.content-container .content .page-header .page-action{position:absolute;right:10px;margin-top:0}.content-container .content .page-header .page-action .export-import{margin-top:-15px}.content-container .content .page-header .page-action *{display:inline-block}.content-container .content-wrapper{margin-left:0;margin-top:1px}#search-icon{position:absolute;margin-top:6px;right:16px}.notif-filter{margin-top:12px!important}.switch-dark{width:100%}}@media only screen and (max-width:411px){.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}}@media only screen and (max-width:385px){.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}}@media only screen and (max-width:320px){.content-container .content .page-header .control-group{width:100%!important;display:block;margin-bottom:0;margin-left:0;padding:0;margin-top:40px}}.nav-container{position:relative;display:none;max-width:31px-25px 10px;max-height:31px-25px 10px;overflow:visible;outline:none}.nav-container.is-active .nav-toggle:after,.nav-container.is-active .nav-toggle:before{box-shadow:none}.nav-container.is-active .nav-items,.nav-container.is-active .nav-top{transform:translate(0)}.nav-container.is-active .overlay{display:block}.nav-container .overlay{background-color:rgba(0,0,0,.8);position:fixed;top:0;left:0;height:100vh;width:100vh;display:none;z-index:1}.nav-container .nav-toggle{background-image:url(../images/hamburger.svg);background-repeat:no-repeat;background-size:cover;position:relative;top:8px;width:31px;height:31px;margin:-25px 10px;z-index:1}.nav-container .nav-toggle:hover{cursor:pointer}.nav-container .close{position:absolute;right:13px;top:15px;width:32px;height:32px}.nav-container .close:hover{opacity:1}.nav-container .close:before{transform:rotate(45deg)}.nav-container .close:after,.nav-container .close:before{position:absolute;left:15px;content:" ";height:28px;width:2px;background-color:#8184ab}.nav-container .close:after{transform:rotate(-45deg)}.nav-container .nav-top{position:fixed;top:0;left:0;min-width:300px;max-width:25vw;width:100vw;height:60px;z-index:1;padding:50px 0 0;transition:transform .3s ease;transform:translate(calc(-100% - 50px));background:#fff;display:grid;grid-template-columns:1fr;align-content:start;box-shadow:0 0 50px rgba(0,0,0,.3);text-decoration:none}.nav-container .nav-top .pro-info{width:100%;padding:15px;position:absolute}.nav-container .nav-top .pro-info .profile-info-icon{position:absolute;display:inline-block;background:#3c41ff;height:30px;width:30px;text-align:center;border-radius:50%}.nav-container .nav-top .pro-info .profile-info-icon>span{display:block;margin:6px;font-size:18px;color:#fff}.nav-container .nav-top .pro-info .profile-info-desc{display:inline-block;margin-left:40px}.nav-container .nav-top .pro-info .profile-info-desc .name{font-size:18px;color:#000}.nav-container .nav-top .pro-info .profile-info-desc .role{font-size:10px;color:#000}.nav-container .nav-items{position:fixed;top:60px;left:0;min-width:300px;max-width:25vw;width:100vw;height:92vh;z-index:1;padding-bottom:10px;transition:transform .3s ease;transform:translate(calc(-100% - 50px));background:#fff;display:grid;grid-template-columns:1fr;align-content:start;box-shadow:0 0 50px rgba(0,0,0,.3);overflow-y:scroll;text-decoration:none}.nav-container .nav-items::-webkit-scrollbar{display:none}.nav-container .nav-items .nav-item{transition:background-color .3s ease;font-size:16px;text-transform:capitalize;text-decoration:none}.nav-container .nav-items .nav-item a{color:#000;display:block;padding:5px}.nav-container .nav-items .nav-item ul{display:none}.nav-container .nav-items .nav-item ul .navbar-child{text-transform:capitalize;padding:15px}.nav-container .nav-items .nav-item ul .navbar-child.active,.nav-container .nav-items .nav-item ul .navbar-child:hover{background-color:#e6e6e6}.nav-container .nav-items .nav-item .display-block{display:block!important}.nav-container .nav-items .nav-item.active{background-color:#e6e6e6}.nav-container .nav-items .nav-item.active>a,.nav-container .nav-items .nav-item:hover>a{background-color:#ddd}@media only screen and (max-width:768px){.nav-container{display:inline-block}.destop-logo{display:none}.content-container{padding-left:0!important}}.dashboard .page-header{margin-bottom:0!important;padding-bottom:15px;border-bottom:1px solid hsla(0,0%,63.5%,.2)}.dashboard .page-header .control-group span{width:100%}.dashboard .page-header .control-group.date:after{margin-top:-13px;left:100%}.dashboard .page-content{margin-top:15px}.dashboard .card{height:445px;background-color:#fff;border:1px solid hsla(0,0%,63.5%,.2);box-shadow:0 5px 10px 2px hsla(0,0%,63.5%,.2);border-radius:.25rem;padding:20px 0 0 20px;overflow:auto}.dashboard .card .card-title{font-size:14px;color:#3a3a3a;letter-spacing:-.26px;text-transform:uppercase}.dashboard .card .card-info{width:100%;display:inline-block}.dashboard .card .card-info.center{text-align:center}.dashboard .card .card-info ul li{border-bottom:1px solid hsla(0,0%,63.5%,.2);width:100%;display:inline-block;padding:10px 0;position:relative}.dashboard .card .card-info ul li .image{height:60px;width:60px;float:left;margin-right:15px}.dashboard .card .card-info ul li .image.product{background:#f2f2f2}.dashboard .card .card-info ul li .image img{width:100%}.dashboard .card .card-info ul li .description{margin-top:10px}.dashboard .card .card-info ul li .description .name{color:#3a3a3a}.dashboard .card .card-info ul li .description .info{color:#3a3a3a;margin-top:5px}.dashboard .card .card-info ul li .icon.angle-right-icon{position:absolute;right:30px;top:50%;margin-top:-8px}.dashboard .card .card-info ul li:last-child{border-bottom:0}.dashboard .card .card-info .no-result-found{margin-top:146px}.dashboard .card .card-info .no-result-found p{margin:0;color:#3a3a3a}.dashboard .dashboard-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));grid-auto-rows:auto;grid-column-gap:30px;grid-row-gap:15px}.dashboard .dashboard-stats .dashboard-card{height:100px;background:#fff;border:1px solid hsla(0,0%,63.5%,.2);box-shadow:0 5px 10px 2px hsla(0,0%,63.5%,.2);border-radius:5px;position:relative;padding:15px}.dashboard .dashboard-stats .dashboard-card .title{font-size:14px;color:#3a3a3a;text-transform:uppercase}.dashboard .dashboard-stats .dashboard-card .data{padding-top:13px;font-size:32px;color:#0041ff}.dashboard .dashboard-stats .dashboard-card .data .progress{font-size:14px;color:#8e8e8e;float:right;margin-top:-2px}.dashboard .dashboard-stats .dashboard-card .data .progress .icon{vertical-align:middle}.dashboard .graph-stats{margin-top:30px;width:100%;display:inline-block}.dashboard .graph-stats .left-card-container{float:left;width:75%;padding-right:9px}.dashboard .graph-stats .right-card-container{float:left;width:25%;padding-left:21px}.dashboard .sale-stock{width:100%;display:inline-block;display:grid;grid-template-columns:repeat(auto-fill,minmax(435px,1fr));grid-auto-rows:auto;grid-column-gap:30px;grid-row-gap:15px;margin-top:30px}#calender-destop{display:block}#calender-mobile{position:relative;display:none}#calender-mobile span{background-image:url(../images/Icon-Calendar.svg);width:24px;height:24px;vertical-align:middle;cursor:pointer;position:absolute;top:0;right:4px}#date-start{margin-top:40px}#date-end,#date-start,#date-submit{display:block;width:337px}#date-submit{margin-top:15px}.rtl .dashboard .page-header .control-group.date:after{margin-top:-13px!important;right:100%}@media only screen and (max-width:770px){.dashboard .card{padding:10px 0 0 15px;overflow:auto;margin-bottom:20px}.dashboard .sale-stock{display:block;margin-top:30px;margin-bottom:10px}.dashboard .graph-stats .left-card-container{float:left;width:100%;padding-right:0;margin-bottom:10px}.dashboard .graph-stats .right-card-container{float:left;width:100%;padding-left:0}#calender-mobile{display:block}#calender-destop{display:none}}.configuration-image{position:relative;height:33px;width:33px;top:15px;border-radius:3px;margin-right:5px}.download{position:relative;height:24px!important;width:24px!important;top:12px;margin-right:10px}.aside-nav-toggle{height:48px;width:100%;padding-top:15px;border-top:1px solid hsla(0,0%,63.5%,.2)}.aside-nav-toggle .close-icon,.aside-nav-toggle .open-icon{position:absolute;cursor:pointer;left:45%}.aside-nav-toggle.open{display:none}.linked-product-search-result{box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);z-index:10;text-align:left;border-radius:3px;background-color:#fff;width:70%;max-height:200px;overflow-y:auto}.linked-product-search-result li{padding:10px;border-bottom:1px solid #e8e8e8;cursor:pointer}.cart-rule-conditions,.catalog-rule-conditions{display:flex;-moz-column-gap:10px;column-gap:10px}.cart-rule-conditions .attribute,.cart-rule-conditions .operator,.cart-rule-conditions .value,.catalog-rule-conditions .attribute,.catalog-rule-conditions .operator,.catalog-rule-conditions .value{width:25%;padding-left:0}.cart-rule-conditions .attribute .control-group .control,.cart-rule-conditions .operator .control-group .control,.cart-rule-conditions .value .control-group .control,.catalog-rule-conditions .attribute .control-group .control,.catalog-rule-conditions .operator .control-group .control,.catalog-rule-conditions .value .control-group .control{width:100%!important}.cart-rule-conditions .attribute .date:after,.cart-rule-conditions .operator .date:after,.cart-rule-conditions .value .date:after,.catalog-rule-conditions .attribute .date:after,.catalog-rule-conditions .operator .date:after,.catalog-rule-conditions .value .date:after{top:30%!important}.cart-rule-conditions .attribute .cross-icon,.cart-rule-conditions .operator .cross-icon,.cart-rule-conditions .value .cross-icon,.catalog-rule-conditions .attribute .cross-icon,.catalog-rule-conditions .operator .cross-icon,.catalog-rule-conditions .value .cross-icon{top:35%!important}.cart-rule-conditions .actions,.catalog-rule-conditions .actions{width:44px}.cart-rule-conditions .actions .icon,.catalog-rule-conditions .actions .icon{margin-top:15px}@media only screen and (max-width:770px){.cart-rule-conditions,.catalog-rule-conditions{display:block;border:1px solid #e8e8e8;padding:10px}.cart-rule-conditions .attribute,.cart-rule-conditions .operator,.cart-rule-conditions .value,.catalog-rule-conditions .attribute,.catalog-rule-conditions .operator,.catalog-rule-conditions .value{width:100%;padding-left:0}.cart-rule-conditions .attribute .control-group .control,.cart-rule-conditions .operator .control-group .control,.cart-rule-conditions .value .control-group .control,.catalog-rule-conditions .attribute .control-group .control,.catalog-rule-conditions .operator .control-group .control,.catalog-rule-conditions .value .control-group .control{width:100%!important;margin-top:0!important;margin-bottom:0!important}.cart-rule-conditions .attribute .date:after,.cart-rule-conditions .operator .date:after,.cart-rule-conditions .value .date:after,.catalog-rule-conditions .attribute .date:after,.catalog-rule-conditions .operator .date:after,.catalog-rule-conditions .value .date:after{top:18%!important}.cart-rule-conditions .attribute .cross-icon,.cart-rule-conditions .operator .cross-icon,.cart-rule-conditions .value .cross-icon,.catalog-rule-conditions .attribute .cross-icon,.catalog-rule-conditions .operator .cross-icon,.catalog-rule-conditions .value .cross-icon{top:20%!important}.cart-rule-conditions .actions,.catalog-rule-conditions .actions{width:44px}.cart-rule-conditions .actions .icon,.catalog-rule-conditions .actions .icon{margin:0}}.sale-container .sale{display:flex;-moz-column-gap:20px;column-gap:20px}.sale-container .sale .sale-section{font-size:16px;width:50%}.sale-container .sale .sale-section .secton-title{font-size:18px;color:#8e8e8e;padding:15px 0;border-bottom:1px solid hsla(0,0%,63.5%,.2)}.sale-container .sale .sale-section .section-content{display:block;padding:20px 0}.sale-container .sale .sale-section .section-content .row{display:block;padding:7px 0}.sale-container .sale .sale-section .section-content .row .title{width:200px;color:#3a3a3a;letter-spacing:-.26px;display:inline-block}.sale-container .sale .sale-section .section-content .row .value{color:#3a3a3a;letter-spacing:-.26px;display:inline-block}.sale-container .table .qty-row{display:block;margin-bottom:5px}.sale-container .table .qty-row:last-child{margin-bottom:0}.sale-container .table .radio{margin:0}.sale-container .summary-comment-container .comment-container{margin-top:20px;float:left}.sale-container .summary-comment-container .comment-container .comment-list{margin-top:40px}.sale-container .summary-comment-container .comment-container .comment-list li{margin-bottom:20px}.sale-container .summary-comment-container .comment-container .comment-list li:last-child{margin-bottom:0}.sale-container .summary-comment-container .comment-container .comment-list li p{margin:5px 0 0;color:#8e8e8e}.sale-container .sale-summary{margin-top:20px;height:130px;float:right}.sale-container .sale-summary tr td{padding:5px 8px;vertical-align:text-bottom}.sale-container .sale-summary tr.bold{font-weight:600;font-size:15px}.sale-container .sale-summary tr.border td{border-bottom:1px solid hsla(0,0%,63.5%,.2)}.stars{margin-top:5px}.stars .icon{width:16px;height:16px}.export-import{cursor:pointer}.export-import .export-icon,.export-import .import-icon{position:relative;top:10px}.export-import span{margin-left:2px}@media only screen and (max-width:768px){.sale-container .sale{display:block}.sale-container .sale .sale-section,.sale-container .summary-comment-container .comment-container,.sale-container .summary-comment-container .comment-container form .control-group{width:100%}}.rtl{direction:rtl}.rtl .form-container{text-align:right!important}.rtl .navbar-top .navbar-top-right{text-align:left}.rtl .navbar-top .navbar-top-right .profile-info{margin:0 30px 0 25px}.rtl .navbar-top .navbar-top-right .profile-info i.icon{margin-left:0;margin-right:10px}.rtl .navbar-left{border-left:1px solid hsla(0,0%,63.5%,.2);border-right:none;background-color:#fff}.rtl .content-container{padding-right:90px;padding-left:0}.rtl .content-container .content .page-header .page-title{float:right}.rtl .content-container .content .page-header .page-action{float:left}.rtl .content-container .content .page-header .page-action a{margin-left:0}.rtl .content-container .content .page-header .control-group{margin-right:20px;margin-left:0}.rtl .content-container .content-wrapper{padding:25px;margin-right:280px;margin-left:0}.rtl .content-container .aside-nav .active i{float:left;transform:rotate(180deg)}.rtl .content-container .aside-nav:not(.active)+.content-wrapper{margin-right:0}.rtl .dashboard .dashboard-stats .dashboard-card .data span{float:left}.rtl .dashboard .card{padding:20px 20px 0 0}.rtl .dashboard .card .card-info ul li .image{float:right;margin-right:0;margin-left:15px}.rtl .dashboard .card .card-info ul li .icon.angle-right-icon{left:30px;right:auto;transform:rotate(180deg)}.rtl .dashboard .graph-stats .left-card-container{float:right;padding-right:0}.rtl .dashboard .graph-stats .right-card-container{float:right;padding-left:0;padding-right:30px}.rtl .sale-container .sale-summary{float:left}.rtl .grid-container .table tbody td.action a:first-child{margin-left:10px;margin-right:0}.rtl .table table{text-align:right}.rtl .table table .massaction-remove{margin-right:5px!important;margin-left:10px}.rtl .table table .btn.btn-primary{margin-right:10px!important}.rtl .dropdown-list.bottom-right{left:0;right:auto!important}.rtl .dropdown-list .dropdown-container{text-align:right}.rtl .accordian .accordian-header .icon{float:left}.rtl .tree-container .tree-item{padding-right:30px}.rtl .tree-container .tree-item .expand-icon,.rtl .tree-container .tree-item .folder-icon{margin-left:10px;margin-right:0}.rtl .tree-container>.tree-item{padding-right:0}.rtl .radio .radio-view{margin-left:5px}.rtl .image-wrapper .image-item{margin-right:0;margin-left:20px}.rtl .image-wrapper .image-item .remove-image{margin-right:0}.rtl .control-group label.required:before{content:"*";color:#fc6868;font-weight:700}.rtl .control-group label.required:after{content:none}.rtl .control-group label .locale{float:left}.rtl .multiselect{text-align:unset}.rtl .accordian-left-icon,.rtl .accordian-right-icon,.rtl .pagination .page-item .icon{transform:rotate(180deg)}.accordian-header{background-color:#fbfbfb}.btn.btn-primary{background:#0041ff}.btn.btn-danger{background:red}.fixed-action{top:108px}.fixed-action,.fixed-action-slight{position:fixed;right:32px;z-index:20}.fixed-action-slight{top:94px}.pagination{margin-top:30px}.flatpickr-day.endRange,.flatpickr-day.endRange.inRange,.flatpickr-day.endRange.nextMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.endRange:focus,.flatpickr-day.endRange:hover,.flatpickr-day.selected,.flatpickr-day.selected.inRange,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.selected:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange,.flatpickr-day.startRange.inRange,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.startRange:focus,.flatpickr-day.startRange:hover{background:#0041ff!important;box-shadow:none;color:#fff;border-color:#0041ff!important}.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.do-not-cross-arrow{width:85%}.linked-product-filter-tag{text-transform:capitalize;margin-top:10px;margin-right:0;justify-content:flex-start;height:100%}.linked-product-wrapper{margin-left:0!important;margin-right:10px!important;height:100%!important}.do-not-cross-linked-product-arrow{width:95%}
\ No newline at end of file
diff --git a/packages/Webkul/Admin/publishable/assets/mix-manifest.json b/packages/Webkul/Admin/publishable/assets/mix-manifest.json
index 72b84ace3..673805f49 100755
--- a/packages/Webkul/Admin/publishable/assets/mix-manifest.json
+++ b/packages/Webkul/Admin/publishable/assets/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/admin.js": "/js/admin.js?id=94da304c8b02ad3ba649",
-    "/css/admin.css": "/css/admin.css?id=10abda80f2083f91a493"
+    "/css/admin.css": "/css/admin.css?id=025777d782eb9e678c8e"
 }
diff --git a/packages/Webkul/Admin/src/Resources/assets/sass/_variables.scss b/packages/Webkul/Admin/src/Resources/assets/sass/_variables.scss
index 0a7918e48..c19bfcaf4 100755
--- a/packages/Webkul/Admin/src/Resources/assets/sass/_variables.scss
+++ b/packages/Webkul/Admin/src/Resources/assets/sass/_variables.scss
@@ -24,9 +24,47 @@ $font-size-base: 14px;
 $font-color: #3A3A3A;
 
 $link-color: #a2a2a2;
-$link-active-color: #a2a2a2;
 
 //Switch Color
 $dark-mode-switch-background: #000;
 $dark-mode-switch-border: #24384c;
 
+// Top nav color
+$profile-info-icon: #3c41ff;
+$role-text-color: #8e8e8e;
+$profile-info-name: #000311;
+$control-border-color: #c7c7c7;
+
+// Navbar Color
+$navbar-border-right-color: #ececec;
+$submenu-shadow-color: #CDCECF;
+$submenu-border-color: #eee;
+$menu-item-hover-color: #f8f8f8;
+$submenu-active-color: #e6e6e6;
+
+//Notification Color
+$notification-li-border-color: #ddd;
+$pending-color: #f2c94c;
+$processing-color: #399cdb;
+$closed-color: #eb5757;
+$read-background-color: #f6f6f6;
+$read-all-text-color: #3a3a3a;
+$menu-label-text-color: #B0BEC5;
+
+// Dark Mode Color
+$dark-mode-text-color: rgba(255,255,255,0.8);
+$dark-mode-background-color: #02080d;
+$dark-mode-read-color: rgba(255, 255, 255, 0.5);
+$dark-mode-unread-color: rgba(255, 255, 255, 1);
+$dark-mode-navtop-left-color: #071e37;
+$dark-mode-notification-border-color: #232d36;
+$dark-mode-left-menubar-background-color: rgba(1, 10, 20, .5);
+$dark-mode-left-submenubar-active-background-color: #031425;
+$dark-mode-left-submenubar-background-color: #020f1c;
+$dark-mode-left-menubar-active-background-color: #051e37;
+$dark-mode-body-background-color: #04101b;
+$dark-mode-table-head-backgound-color: rgba(7, 30, 55,0.2);
+$dark-mode-pagination-page-item-active-background-color:rgba(40, 69, 100, 0.2);
+$dark-mode-pagination-page-item-active-border-color:rgba(2, 57, 83, 0.2);
+$flatpickr-day-startRange-hover:rgb(5, 30, 55);
+
diff --git a/packages/Webkul/Admin/src/Resources/assets/sass/partials/_dark.scss b/packages/Webkul/Admin/src/Resources/assets/sass/partials/_dark.scss
index 36445849f..48a46fc9e 100644
--- a/packages/Webkul/Admin/src/Resources/assets/sass/partials/_dark.scss
+++ b/packages/Webkul/Admin/src/Resources/assets/sass/partials/_dark.scss
@@ -1,106 +1,111 @@
-.dark-mode{
-    background-color: #04101b;
-    color: rgba(255,255,255,.8);
+.dark-mode {
+    background-color: $dark-mode-body-background-color;
+    color: $dark-mode-text-color;
 
-    .read-all{
-        color: rgba(255, 255, 255, 0.8);
+    .read-all {
+        color: $dark-mode-text-color;
     }
 
-    .navbar-top{
-        background-color: #051e37;
-        
+    .navbar-top {
+        background-color: $dark-mode-left-menubar-active-background-color;
+
         .navbar-top-left {
-            background-color: #071e37;
+            background-color: $dark-mode-navtop-left-color;
             border-bottom: 1px solid $seprator;
         }
-        
+
         .profile-info {
             .app-version {
                 padding: 10px 20px 0px 20px;
                 margin-bottom: -10px;
                 display: block;
                 cursor: default;
-                color: #a2a2a2;
+                color: $link-color;
             }
+
             .name {
-                color: rgba(255,255,255,.8) !important;
+                color: $dark-mode-text-color !important;
             }
+
             .dropdown-list {
                 right: 0px;
                 bottom: inherit !important;
-                border: 1px solid #24384c;
-                border: 1px solid #24384c;
+                border: 1px solid $dark-mode-switch-border;
+                border: 1px solid $dark-mode-switch-border;
             }
         }
-    } 
-    
-    .navbar-left {          
+    }
+
+    .navbar-left {
         background-color: $dark-bg;
         border-right: 1px solid $dark-bg;
 
         ul.menubar {
-            li.menu-item { 
+            li.menu-item {
 
-                > a {
+                >a {
                     padding: 5px 2px;
                     display: block;
-                    color: #000;
+                    color: $black;
                     width: 100%;
-    
+
                     .icon {
                         display: inline-block;
                         vertical-align: middle;
                         transform: scale(0.7);
                     }
-    
+
                     .menu-label {
                         display: none;
-                        color: #B0BEC5;
+                        color: $menu-label-text-color;
                     }
-    
-                    .arrow-icon{
+
+                    .arrow-icon {
                         display: none;
                     }
-    
-                    &.active,&:hover {
-                        padding: 5px 2px;
-                        background-color: rgba(1, 10, 20, .5);
-                    }
-                }       
-                
-                &.active{  
-                    > a{                 
-                        background-color: rgba(1, 10, 20, .5);
-                    }  
-                }
-                
-                &:hover {               
-    
-                    ul.sub-menubar {   
-                        background: #031425;
-                        box-shadow: none; 
-                        border: 1px solid #24384c;
 
-    
-                        .sub-menu-item {  
+                    &.active,
+                    &:hover {
+                        padding: 5px 2px;
+                        background-color: $dark-mode-left-menubar-background-color;
+                    }
+                }
+
+                &.active {
+                    >a {
+                        background-color: $dark-mode-left-menubar-background-color;
+                    }
+                }
+
+                &:hover {
+
+                    ul.sub-menubar {
+                        background: $dark-mode-left-submenubar-background-color;
+                        box-shadow: none;
+                        border: 1px solid $dark-mode-switch-border;
+
+
+                        .sub-menu-item {
 
                             .menu-label {
-                                color: #fff !important;                                    
+                                color: $white !important;
                             }
-        
-                            &.active, &:hover {
-                                background-color: #020f1c;
+
+                            &.active,
+                            &:hover {
+                                background-color: $dark-mode-left-submenubar-background-color;
+
                                 .menu-label {
-                                    color: #fff !important;                                    
+                                    color: $white !important;
                                 }
-                            }                           
+                            }
                         }
                     }
                 }
             }
-        } 
+        }
 
-        &.open{
+        &.open {
             ul.menubar {
                 li.menu-item {
                     a {
@@ -108,14 +113,14 @@
                             font-size: 14px;
                             font-weight: 200;
                             display: inline-block;
-                            color: #B0BEC5;
+                            color: $menu-label-text-color;
                         }
-    
+
                         .arrow-icon {
                             display: inline-block;
                         }
                     }
-    
+
                     ul.sub-menubar {
                         display: none;
                         position: unset;
@@ -123,484 +128,518 @@
                         border-radius: 0;
                         box-shadow: unset;
                         border: 0;
-                    
+
                         li.sub-menu-item {
                             a {
                                 padding-left: 52px;
                             }
                         }
                     }
-    
+
                     &.active {
-                        background: $dark-bg;
-                        width: calc(100% - 1px);
-    
+                        background: $dark-mode-left-menubar-active-background-color;
+                        width: 100%;
+
                         .menu-label {
-                            color: #fff;
+                            color: $white;
                         }
-    
+
                         ul.sub-menubar {
                             display: block;
-                            background-color: #031425;
-                            border:none !important;
-    
+                            background-color: $dark-mode-left-submenubar-background-color;
+                            border: none !important;
+
                             .sub-menu-item {
                                 .menu-label {
-                                    color: #B0BEC5;
+                                    color: $menu-label-text-color;
                                 }
-    
-                                &.active, &:hover {
-                                    background-color: rgba(1, 10, 20, .5);
+
+                                &.active,
+                                &:hover {
+                                    background-color: $dark-mode-left-menubar-background-color;
+
                                     .menu-label {
-                                        color: #fff !important;                                    
+                                        color: $white !important;
                                     }
                                 }
                             }
                         }
                     }
-    
+
                     &:hover {
-                         background: $dark-bg;
+                        background: $dark-bg;
+
                         .menu-label {
-                            color: #fff;
+                            color: $white;
                         }
                     }
                 }
             }
-    
+
         }
-        
+
         .menubar-bottom {
             background-color: $dark-bg;
         }
-    }  
-    
+    }
+
     .nav-container {
 
         .nav-top {
-           
+
             background: $dark-bg;
-           
-            .pro-info{
-              
-                .profile-info-desc{
-                    display:inline-block;
+
+            .pro-info {
+
+                .profile-info-desc {
+                    display: inline-block;
                     margin-left: 40px;
-            
-                    .name{
-                        color: #fff;
+
+                    .name {
+                        color: $white;
                     }
-            
-                    .role{
-                        color: #fff;
+
+                    .role {
+                        color: $white;
                     }
                 }
             }
-        }  
-        
-        .nav-items{
-          
+        }
+
+        .nav-items {
+
             background: $dark-bg;
-          
+
             .nav-item {
-              
-                a{
-                    color:#fff;
+
+                a {
+                    color: $white;
                     display: block;
                     padding: 5px;
                 }
-        
-                ul{
-                    .navbar-child{ 
-                        &.active,&:hover {
-                          background-color: rgba(1, 10, 20, .5);;
+
+                ul {
+                    .navbar-child {
+
+                        &.active,
+                        &:hover {
+                            background-color: $dark-mode-left-menubar-background-color;
+                            ;
                         }
-                    }          
-                }
-        
-                &.active {
-                    background-color: #031425;
-                    > a{
-                      background-color: rgba(1, 10, 20, .5);
                     }
-                  }
-          
-                 &:hover {
-                   > a{
-                     background-color: rgba(1, 10, 20, .5);
-                   }
-                }                
-            }
-          } 
-            
-    }
-    
-    .content-container{
-        .inner-section{
-            .content-wrapper{
-                .page-header{
-                    background-color: #04101b;
-                    border-bottom: 1px solid #24384c;   
+                }
+
+                &.active {
+                    background-color: $dark-mode-left-submenubar-background-color;
+
+                    >a {
+                        background-color: $dark-mode-left-menubar-background-color;
+                    }
+                }
+
+                &:hover {
+                    >a {
+                        background-color: $dark-mode-left-menubar-background-color;
+                    }
                 }
             }
         }
-        .content{
-            .page-header{
-                background-color: #04101b;
-                border-bottom: 1px solid #24384c;
+
+    }
+
+    .content-container {
+        .inner-section {
+            .content-wrapper {
+                .page-header {
+                    background-color: $dark-mode-body-background-color;
+                    border-bottom: 1px solid $dark-mode-switch-border;
+                }
+            }
+        }
+
+        .content {
+            .page-header {
+                background-color: $dark-mode-body-background-color;
+                border-bottom: 1px solid $dark-mode-switch-border;
             }
         }
     }
 
-    .table{
-        background-color: #04101b;
+    .table {
+        background-color: $dark-mode-body-background-color;
 
         table {
-            thead th {              
-                background-color: rgba(7, 30, 55,0.2) !important;              
-                color: rgba(255,255,255,.8);
-            }        
+            thead th {
+                background-color: $dark-mode-table-head-backgound-color !important;
+                color: $dark-mode-text-color;
+            }
+
             tbody td {
-                color: rgba(255, 255, 255, 0.8);
-                border-bottom: 1px solid $seprator;    
+                color:$dark-mode-text-color;
+                border-bottom: 1px solid $seprator;
             }
         }
     }
 
     .modal-container {
-        background: #04101b;
+        background: $dark-mode-body-background-color;
+
+        .modal-header {
 
-        .modal-header {         
-    
             h3 {
                 display: inline-block;
                 font-size: 20px;
-                color: rgba(255,255,255,.8);
+                color: $dark-mode-text-color;
                 margin: 0;
             }
         }
     }
 
-    .accordian, accordian {       
-        .accordian-header, div[slot*="header"] {
+    .accordian,
+    accordian {
+
+        .accordian-header,
+        div[slot*="header"] {
             color: $font-color;
             border-top: solid 1px $border-color;
             border-bottom: solid 1px $border-color;
-        }       
-    }   
+        }
+    }
 
     @media only screen and (max-width: 1300px) {
         .table {
-            table {               
-    
-                tbody tr td {                   
-                    background-color: #04101b;                   
+            table {
+
+                tbody tr td {
+                    background-color: $dark-mode-body-background-color;
                 }
-    
+
             }
         }
     }
-    
+
     .grid-dropdown-header {
-        background-color: #000;  
-        border: 1px solid #24384c;     
+        background-color: $black;
+        border: 1px solid $dark-mode-switch-border;
     }
 
-    .dropdown-list{
-        background-color: #000;
-        .dropdown-container {
-            background-color: #02080d;
-            color: rgba(255,255,255,.8);
-    
-            label{
-                color: rgba(255,255,255,.8);
-            }            
-            ul{
-                li{
-                    a{
-                        color: rgba(255,255,255,.8);
-                        &:hover{
-                            color: #fff;
-                        }
-                    }
-    
-                }
-            }
-        }        
-    } 
-
-    .notification{
-        background-color: #000;
+    .dropdown-list {
+        background-color: $black;
 
         .dropdown-container {
-           
-            color: rgba(255,255,255,.8);
-            border: 1px solid #232d36;
-    
-            label{
-                color: rgba(255,255,255,.8);
-            }            
-            ul{
-                .read{
-                    background-color: #02080d;
-                    border-bottom: 1px solid #24384c;
-                    color: rgba(255, 255, 255, 0.5);
+            background-color: $dark-mode-background-color;
+            color: $dark-mode-text-color;
 
-                    .notif-content > a{
-                        text-decoration: none;
-                        color: rgba(255, 255, 255, 0.5);
+            label {
+                color: $dark-mode-text-color;
+            }
 
-                        &:hover{
-                            color:rgba(255, 255, 255, 0.5);
+            ul {
+                li {
+                    a {
+                        color: $dark-mode-text-color;
+
+                        &:hover {
+                            color: $white;
                         }
                     }
-    
-                }
 
-                li{
-                    background-color: #02080d;
-                    border-bottom: 1px solid #24384c;
-                    color: rgba(255, 255, 255, 1);
-
-                    .notif-content > a{
-                        text-decoration: none;
-                        color: rgba(255,255,255,1); 
-
-                        &:hover{
-                            color:rgba(255, 255, 255, 1)
-                        }
-                    }
-                }
-
-                .bottom-li{
-    
-                    a{
-                        display: initial;
-                        color:rgba(255, 255, 255, 0.8) !important;
-                    }
                 }
             }
-        }        
-    } 
-
-    .control-container {    
-        .control {
-            background: #000;           
         }
-    } 
-    
-    select.control {       
-        border: 1px solid #24384c;
+    }
+
+    .notification {
+        background-color: $black;
+
+        .dropdown-container {
+
+            color: $dark-mode-text-color;
+            border: 1px solid $dark-mode-notification-border-color;
+
+            label {
+                color: $dark-mode-text-color;
+            }
+
+            ul {
+                .read {
+                    background-color: $dark-mode-background-color;
+                    border-bottom: 1px solid $dark-mode-switch-border;
+                    color: $dark-mode-read-color;
+
+                    .notif-content>a {
+                        text-decoration: none;
+                        color: $dark-mode-read-color;
+
+                        &:hover {
+                            color: $dark-mode-read-color;
+                        }
+                    }
+
+                }
+
+                li {
+                    background-color: $dark-mode-background-color;
+                    border-bottom: 1px solid $dark-mode-switch-border;
+                    color: $dark-mode-unread-color;
+
+                    .notif-content>a {
+                        text-decoration: none;
+                        color: rgba(255, 255, 255, 1);
+
+                        &:hover {
+                            color: $dark-mode-unread-color
+                        }
+                    }
+                }
+
+                .bottom-li {
+
+                    a {
+                        display: initial;
+                        color:$dark-mode-text-color !important;
+                    }
+                }
+            }
+        }
+    }
+
+    .control-container {
+        .control {
+            background: $black;
+        }
+    }
+
+    select.control {
+        border: 1px solid $dark-mode-switch-border;
     }
 
     .search-filter {
-        .control{
-            background-color: #02080d;
-            color: rgba(255,255,255,.8);
-            border: 1px solid #24384c;
+        .control {
+            background-color: $dark-mode-background-color;
+            color: $dark-mode-text-color;
+            border: 1px solid $dark-mode-switch-border;
         }
-        .icon-wrapper{
-            border: 1px solid #24384c;
+
+        .icon-wrapper {
+            border: 1px solid $dark-mode-switch-border;
         }
     }
 
-    h1{
-        color: rgba(255,255,255,.8);
+    h1 {
+        color: $dark-mode-text-color;
     }
 
-    .control-group{
-        label{
-            color:rgba(255, 255, 255, 0.8);
+    .control-group {
+        label {
+            color:$dark-mode-text-color;
         }
-        .control{
-            border: 1px solid #24384c;
+
+        .control {
+            border: 1px solid $dark-mode-switch-border;
         }
     }
 
-    .grid-container {     
-        .grid-top {        
-            .datagrid-filters {     
-                .dropdown-filters {                 
-                    &.per-page {                  
-                        .control-group {                           
+    .grid-container {
+        .grid-top {
+            .datagrid-filters {
+                .dropdown-filters {
+                    &.per-page {
+                        .control-group {
                             label {
-                               color: rgba(255,255,255,.8);
-                            }    
+                                color: $dark-mode-text-color;
+                            }
                         }
                     }
                 }
             }
         }
-    } 
-  
+    }
+
     .tabs {
-        ul { 
-            border-bottom: solid 1px #24384c;       
+        ul {
+            border-bottom: solid 1px $dark-mode-switch-border;
+
             li {
                 a {
-                    color: rgba(255,255,255,.8);
+                    color: $dark-mode-text-color;
                 }
             }
         }
     }
 
-    .accordian, accordian {       
-        .accordian-header, div[slot*="header"] {
-            background-color: #02080d;
-            color: rgba(255,255,255,.5);
+    .accordian,
+    accordian {
+
+        .accordian-header,
+        div[slot*="header"] {
+            background-color: $dark-mode-background-color;
+            color: $dark-mode-read-color;
         }
-        .accordian-content, div[slot*="body"] {
-            background-color: #000;
-            border-bottom: 1px solid #24384c;           
+
+        .accordian-content,
+        div[slot*="body"] {
+            background-color: $black;
+            border-bottom: 1px solid $dark-mode-switch-border;
         }
+
         &.active>.accordian-content {
-            background-color: #02080d;            
+            background-color: $dark-mode-background-color;
         }
+
         &.active>.accordian-header {
-            background-color: #000;
+            background-color: $black;
         }
     }
 
     .sale-container {
-        .sale{
-            .sale-section {          
+        .sale {
+            .sale-section {
                 .secton-title {
-                    color: rgba(255,255,255,.8);
-                    border-bottom: 1px solid #24384c;
-                }    
-                .section-content {          
-                    .row {        
+                    color: $dark-mode-text-color;
+                    border-bottom: 1px solid $dark-mode-switch-border;
+                }
+
+                .section-content {
+                    .row {
                         .title {
-                            color: rgba(255,255,255,.8);
-                        }    
+                            color: $dark-mode-text-color;
+                        }
+
                         .value {
-                            color: rgba(255,255,255,.8);
+                            color: $dark-mode-text-color;
                         }
                     }
                 }
             }
         }
-    
+
         .summary-comment-container {
-            .comment-container {    
-                .comment-list {                    
+            .comment-container {
+                .comment-list {
                     li {
                         p {
-                            color: rgba(255,255,255,.8)
+                            color: $dark-mode-text-color
                         }
                     }
                 }
             }
-        }        
+        }
     }
 
-    .control-group{
-        .label{
-            color: rgba(255,255,255,.8);
+    .control-group {
+        .label {
+            color: $dark-mode-text-color;
         }
+
         .control {
-            background-color: #02080d;
-            color: rgba(255,255,255,.8);            
-        }        
+            background-color: $dark-mode-background-color;
+            color: $dark-mode-text-color;
+        }
     }
-    
-    .dashboard {    
+
+    .dashboard {
         .card {
-            background: #071e37;
-            box-shadow: 0 5px 10px 2px rgb(0 0 0 / 80%);  
+            background: $dark-mode-navtop-left-color;
+            box-shadow: 0 5px 10px 2px rgb(0 0 0 / 80%);
+
             .card-title {
-                color: rgba(255,255,255,.8);
-            }    
-            .card-info { 
+                color: $dark-mode-text-color;
+            }
+
+            .card-info {
                 ul {
-                    li {                     
+                    li {
                         .description {
                             margin-top: 10px;
-    
+
                             .name {
-                                 color: rgba(255,255,255,.8);
+                                color: $dark-mode-text-color;
                             }
-    
+
                             .info {
-                                 color: rgba(255,255,255,.8);
+                                color: $dark-mode-text-color;
                                 margin-top: 5px;
                             }
                         }
                     }
-                }    
-                               
-                .no-result-found { 
+                }
+
+                .no-result-found {
                     p {
-                        color: rgba(255,255,255,.8);
+                        color: $dark-mode-text-color;
                     }
                 }
             }
-        }    
-        .dashboard-stats {            
+        }
+
+        .dashboard-stats {
             .dashboard-card {
-                background: #071e37;
-                box-shadow: 0 5px 10px 2px rgb(0 0 0 / 80%);       
-                
-                .title{
-                    color: rgba(255,255,255,.8);
+                background: $dark-mode-navtop-left-color;
+                box-shadow: 0 5px 10px 2px rgb(0 0 0 / 80%);
+
+                .title {
+                    color: $dark-mode-text-color;
                 }
+
                 .data {
                     color: $white;
+
                     .progress {
-                        color: rgba(255,255,255,.8);    
+                        color: $dark-mode-text-color;
                     }
                 }
             }
-        }    
-    } 
-    
+        }
+    }
+
     .pagination .page-item {
-        background: #000;
+        background: $black;
         border: 1px solid 000;
         color: $white;
     }
 
     .pagination .page-item.active {
-        background-color: rgba(40, 69, 100, 0.2) !important;
+        background-color: $dark-mode-pagination-page-item-active-background-color !important;
         color: $white;
-        border-color: rgba(2, 57, 83, 0.2) !important;
+        border-color: $dark-mode-pagination-page-item-active-border-color !important;
     }
 
-    .filter-tag .wrapper {       
-        background: #02080d;
-        border: 1px solid #02080d;        
-        color: rgba(255,255,255,.8);
+    .filter-tag .wrapper {
+        background: $dark-mode-background-color;
+        border: 1px solid $dark-mode-background-color;
+        color: $dark-mode-text-color;
     }
 
-    .notif{
-        background-color: #02080d;
+    .notif {
+        background-color: $dark-mode-background-color;
 
-        .read{
+        .read {
             background-color: hsl(0deg 0% 13%) !important;
-            color: rgba(255, 255, 255, 0.5);
+            color: $dark-mode-read-color;
 
-            .notif-content > a{
+            .notif-content>a {
                 text-decoration: none;
-                color: rgba(255, 255, 255, 0.5);
+                color: $dark-mode-read-color;
             }
         }
 
-        li{
-            border: 1px solid #24384c;
+        li {
+            border: 1px solid $dark-mode-switch-border;
 
-            color: rgba(255, 255, 255, 1);
+            color: $dark-mode-unread-color;
 
-            .notif-content > a{
+            .notif-content>a {
                 text-decoration: none;
-                color: rgba(255, 255, 255, 1);
+                color: $dark-mode-unread-color;
             }
         }
     }
 
-    #notif-title{
+    #notif-title {
         height: 50px;
         padding: 14px 10px;
-        border-bottom: 1px solid #232d36;
+        border-bottom: 1px solid $dark-mode-notification-border-color;
         cursor: default;
     }
 
@@ -624,60 +663,70 @@
         box-sizing: border-box;
         -ms-touch-action: manipulation;
         touch-action: manipulation;
-        background-color: #02080d;
-        -webkit-box-shadow: 1px 0 0 $black,-1px 0 0 $black,0 1px 0 $black,0 -1px 0 $black,0 3px 13px rgba(0,0,0,.08);
-        box-shadow: 1px 0 0 $black,-1px 0 0 $black,0 1px 0 $black,0 -1px 0 $black,0 3px 13px rgba(0,0,0,.08);
+        background-color: $dark-mode-background-color;
+        -webkit-box-shadow: 1px 0 0 $black, -1px 0 0 $black, 0 1px 0 $black, 0 -1px 0 $black, 0 3px 13px rgba(0, 0, 0, .08);
+        box-shadow: 1px 0 0 $black, -1px 0 0 $black, 0 1px 0 $black, 0 -1px 0 $black, 0 3px 13px rgba(0, 0, 0, .08);
     }
 
     .flatpickr-months .flatpickr-month {
         color: $white;
     }
-    .flatpickr-weekdays .flatpickr-weekdaycontainer, span.flatpickr-weekday {
+
+    .flatpickr-weekdays .flatpickr-weekdaycontainer,
+    span.flatpickr-weekday {
         color: $white;
     }
 
-    .flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover, .flatpickr-day.nextMonthDay, .flatpickr-day.notAllowed, .flatpickr-day.notAllowed.nextMonthDay, .flatpickr-day.notAllowed.prevMonthDay, .flatpickr-day.prevMonthDay {
-        color: rgba(255, 255, 255, 0.8);
+    .flatpickr-day.flatpickr-disabled,
+    .flatpickr-day.flatpickr-disabled:hover,
+    .flatpickr-day.nextMonthDay,
+    .flatpickr-day.notAllowed,
+    .flatpickr-day.notAllowed.nextMonthDay,
+    .flatpickr-day.notAllowed.prevMonthDay,
+    .flatpickr-day.prevMonthDay {
+        color:$dark-mode-text-color;
         background: transparent;
         border-color: transparent;
         cursor: default;
     }
 
-    .flatpickr-weekwrapper span.flatpickr-day, .flatpickr-weekwrapper span.flatpickr-day:hover {
+    .flatpickr-weekwrapper span.flatpickr-day,
+    .flatpickr-weekwrapper span.flatpickr-day:hover {
         color: $white;
-    
+
     }
 
     .flatpickr-day {
         color: $white;
     }
 
-    .flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
+    .flatpickr-months .flatpickr-prev-month,
+    .flatpickr-months .flatpickr-next-month {
         color: $white;
         fill: $white;
     }
 
-    .flatpickr-day.endRange, 
+    .flatpickr-day.endRange,
     .flatpickr-day.endRange.inRange,
-    .flatpickr-day.endRange.nextMonthDay, 
-    .flatpickr-day.endRange.prevMonthDay, 
-    .flatpickr-day.endRange:focus, 
-    .flatpickr-day.endRange:hover, 
-    .flatpickr-day.selected, 
-    .flatpickr-day.selected.inRange, 
-    .flatpickr-day.selected.nextMonthDay, 
-    .flatpickr-day.selected.prevMonthDay, 
-    .flatpickr-day.selected:focus, 
-    .flatpickr-day.selected:hover, 
-    .flatpickr-day.startRange, 
-    .flatpickr-day.startRange.inRange, 
-    .flatpickr-day.startRange.nextMonthDay, 
-    .flatpickr-day.startRange.prevMonthDay, 
-    .flatpickr-day.startRange:focus, 
+    .flatpickr-day.endRange.nextMonthDay,
+    .flatpickr-day.endRange.prevMonthDay,
+    .flatpickr-day.endRange:focus,
+    .flatpickr-day.endRange:hover,
+    .flatpickr-day.selected,
+    .flatpickr-day.selected.inRange,
+    .flatpickr-day.selected.nextMonthDay,
+    .flatpickr-day.selected.prevMonthDay,
+    .flatpickr-day.selected:focus,
+    .flatpickr-day.selected:hover,
+    .flatpickr-day.startRange,
+    .flatpickr-day.startRange.inRange,
+    .flatpickr-day.startRange.nextMonthDay,
+    .flatpickr-day.startRange.prevMonthDay,
+    .flatpickr-day.startRange:focus,
     .flatpickr-day.startRange:hover {
-        background: rgb(5, 30, 55) !important;
+        background: $flatpickr-day-startRange-hover !important;
         color: $white;
-        border-color: rgb(5, 30, 55) !important;
+        border-color: $flatpickr-day-startRange-hover !important;
     }
 
     .flatpickr-day.inRange,
@@ -694,8 +743,8 @@
     .flatpickr-day.nextMonthDay:focus {
         cursor: pointer;
         outline: 0;
-        background: #24384c !important;
-        border-color: #24384c !important;
+        background: $dark-mode-switch-border !important;
+        border-color: $dark-mode-switch-border !important;
     }
 
     .control-group .slider {
@@ -703,10 +752,10 @@
         right: -2px !important;
         background-color: $dark-mode-switch-background !important;
         border: 1px solid $dark-mode-switch-border !important;
-    } 
+    }
 
-    .control-group input:checked + .slider {
+    .control-group input:checked+.slider {
         background-color: $dark-mode-switch-background !important;
     }
 
-}
+}
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/assets/sass/partials/_default.scss b/packages/Webkul/Admin/src/Resources/assets/sass/partials/_default.scss
index 481b6c03d..d80503899 100644
--- a/packages/Webkul/Admin/src/Resources/assets/sass/partials/_default.scss
+++ b/packages/Webkul/Admin/src/Resources/assets/sass/partials/_default.scss
@@ -9,7 +9,7 @@ body {
     background-color: $body-background;
 }
 
-.dark-mode-button{
+.dark-mode-button {
     background: $blue;
     border: none;
     padding: 10px 30px;
@@ -38,18 +38,18 @@ body {
         height: 60px;
         display: flex;
         justify-content: space-between;
-        align-items: center; 
+        align-items: center;
 
-        .hamburger{
+        .hamburger {
             display: block;
             width: 48px;
             height: 48px;
 
-            &::before{
+            &::before {
                 content: "";
                 width: 24px;
                 height: 24px;
-                background-color: rebeccapurple;         
+                background-color: rebeccapurple;
                 background-image: url("../assets/image/Icon-Sortable.svg");
                 display: block;
             }
@@ -84,21 +84,21 @@ body {
                 margin-bottom: -10px;
                 display: block;
                 cursor: default;
-                color: #a2a2a2;
+                color: $link-color;
             }
 
-            .profile-info-div{
+            .profile-info-div {
                 display: flex;
 
-                .profile-info-icon{
+                .profile-info-icon {
                     height: 31px;
                     width: 30px;
-                    background: #3c41ff;
+                    background: $profile-info-icon;
                     padding: 6px;
                     text-align: center;
                     font-size: 17px;
                     font-weight: 600;
-                    color: #fff;
+                    color: $white;
                     border-radius: 50%;
                     margin-right: 6px;
                     margin-top: 3px;
@@ -112,13 +112,14 @@ body {
             }
 
             .name {
-                color: #000311;
+                color: $profile-info-name;
                 display: block;
                 text-align: left;
             }
+
             .role {
                 font-size: 12px;
-                color: #8e8e8e;
+                color: $role-text-color;
                 display: block;
                 text-align: left;
             }
@@ -144,13 +145,14 @@ body {
             }
 
             .name {
-                color: #000311;
+                color: $profile-info-name;
                 display: block;
                 text-align: left;
             }
+
             .role {
                 font-size: 12px;
-                color: #8e8e8e;
+                color: $role-text-color;
                 display: block;
                 text-align: left;
             }
@@ -171,12 +173,12 @@ body {
             font-size: 15px;
             cursor: pointer;
             position: relative;
-            border-left: 1px solid $seprator;            
+            border-left: 1px solid $seprator;
         }
     }
 }
 
-.navbar-left {   
+.navbar-left {
     left: 0;
     bottom: 0;
     top: 60px;
@@ -184,9 +186,9 @@ body {
     width: 56px;
     height: 100vh !important;
     position: fixed;
-    background-color: $white;   
-    border-right:1px solid #ececec;
-    
+    background-color: $white;
+    border-right: 1px solid $navbar-border-right-color;
+
     ul.menubar {
 
         li.menu-item {
@@ -194,7 +196,7 @@ body {
             position: relative;
             overflow: hidden;
 
-            > a {
+            >a {
                 padding: 5px 2px;
                 display: block;
                 color: $black;
@@ -208,15 +210,16 @@ body {
 
                 .menu-label {
                     display: none;
-                    color: #B0BEC5;
+                    color: $menu-label-text-color;
                 }
 
-                .arrow-icon{
+                .arrow-icon {
                     display: none;
                 }
 
-                &.active,&:hover {
-                    padding: 5px 2px;                  
+                &.active,
+                &:hover {
+                    padding: 5px 2px;
                 }
             }
 
@@ -232,40 +235,42 @@ body {
                 top: 0;
                 left: 56px;
                 background-color: $white;
-                box-shadow: 2px 1px 3px #CDCECF;
-                border: 1px solid #eee;
+                box-shadow: 2px 1px 3px $submenu-shadow-color;
+                border: 1px solid $submenu-border-color;
                 border-left: 0;
                 border-radius: 0 3px 3px 0;
-                
+
                 li.sub-menu-item {
                     a {
                         display: block;
                         padding: 8px 12px;
                         color: $black;
                         font-size: 12px;
-                    }    
+                    }
                 }
             }
 
             &:hover {
                 overflow: visible;
+                background: $menu-item-hover-color;
 
                 ul.sub-menubar {
                     display: block;
 
                     .sub-menu-item {
                         .menu-label {
-                            color: $black;                            
+                            color: $black;
                         }
 
                         &.active {
-                            background-color: #e6e6e6;
+                            background-color: $submenu-active-color;
+
                             .menu-label {
                                 color: $blue;
                             }
                         }
 
-                        &:hover{
+                        &:hover {
                             .menu-label {
                                 color: $blue;
                             }
@@ -278,7 +283,7 @@ body {
 
     &.open {
         width: 200px;
-      
+
 
         ul.menubar {
             height: 86vh;
@@ -309,7 +314,7 @@ body {
                     border-radius: 0;
                     box-shadow: unset;
                     border: 0;
-                
+
                     li.sub-menu-item {
                         a {
                             padding-left: 52px;
@@ -319,7 +324,7 @@ body {
 
                 &.active {
                     background: $white;
-                    width: calc(100% - 1px);
+                    width: 100%;
 
                     .menu-label {
                         color: $black;
@@ -327,25 +332,27 @@ body {
 
                     ul.sub-menubar {
                         display: block;
-                        background-color: $white;
-                        border:none !important;
+                        background-color: $menu-item-hover-color;
+                        border: none !important;
 
                         .sub-menu-item {
                             .menu-label {
                                 color: $black;
                             }
 
-                            &.active, &:hover {
-                                background-color: #e6e6e6;
+                            &.active,
+                            &:hover {
+                                background-color: $submenu-border-color;
+
                                 .menu-label {
-                                    color: #000 !important;                                    
+                                    color: $black !important;
                                 }
                             }
                         }
                     }
                 }
 
-                &:hover {                   
+                &:hover {
                     .menu-label {
                         color: $black;
                     }
@@ -358,7 +365,7 @@ body {
         padding: 12px;
         cursor: pointer;
         position: fixed;
-        bottom:0;     
+        bottom: 0;
         background-color: $white;
         width: 56px;
     }
@@ -372,7 +379,7 @@ body {
 
     .control {
         background: $white;
-        border: 1px solid #c7c7c7;
+        border: 1px solid $control-border-color;
         @include border-radius(3px);
         width: 150px;
         height: 36px;
@@ -413,7 +420,7 @@ body {
 
         .locale {
             float: right;
-            color: #8e8e8e;
+            color: $role-text-color;
         }
     }
 
@@ -478,7 +485,7 @@ body {
 }
 
 .content-container {
-    padding-left: 56px; 
+    padding-left: 56px;
     height: calc(100% - 60px);
     width: 100%;
     margin-top: 60px;
@@ -488,7 +495,7 @@ body {
     }
 
     .content-wrapper {
-        margin-top:1px;
+        margin-top: 1px;
     }
 
     .content {
@@ -500,8 +507,8 @@ body {
             position: sticky;
             top: 60px;
             z-index: 3;
-            background-color: $white;            
-            @include box-shadow(0 3px 6px 0 rgba(0, 0, 0, 0.05));  
+            background-color: $white;
+            @include box-shadow(0 3px 6px 0 rgba(0, 0, 0, 0.05));
 
             .page-title {
                 float: left;
@@ -525,7 +532,7 @@ body {
 
             .page-action {
                 float: right;
-                margin-top:-5px;
+                margin-top: -5px;
 
                 * {
                     display: inline-block;
@@ -557,22 +564,22 @@ body {
     }
 }
 
-.notif{
+.notif {
 
     background-color: $white;
 
     li {
         padding: 10px;
-        border-bottom: 1px solid #c7c7c7;
+        border-bottom: 1px solid $notification-li-border-color;
         position: relative;
-      
-        .notif-icon{
+
+        .notif-icon {
             position: absolute;
             height: 40px;
             width: 40px;
             left: 12px;
             border-radius: 5px;
-    
+
             span {
                 position: absolute;
                 background-repeat: no-repeat;
@@ -580,49 +587,49 @@ body {
                 top: 5px;
                 left: 5px;
             }
-        }  
+        }
 
-        .notif-content > a{
+        .notif-content>a {
             text-decoration: none;
             color: rgba(58, 58, 58, 1);
         }
-    
-        .pending{
-            background-color: #f2c94c;
+
+        .pending {
+            background-color: $pending-color;
         }
-    
-        .processing{
-            background-color: #399cdb;
+
+        .processing {
+            background-color: $processing-color;
         }
-    
-        .canceled{
+
+        .canceled {
             background-color: $red;
         }
-    
-        .closed{
-            background-color: #eb5757;
+
+        .closed {
+            background-color: $closed-color;
         }
-    
-        .completed{
+
+        .completed {
             background-color: $green;
         }
-      
+
         .notif-content {
-          margin-left: 50px;
+            margin-left: 50px;
         }
     }
 
-    .read{
+    .read {
         color: rgba(58, 58, 58, 0.5);
 
-        .notif-content > a{
+        .notif-content>a {
             text-decoration: none;
             color: rgba(58, 58, 58, 0.5);
         }
     }
-}    
+}
 
-.notification-badge{
+.notification-badge {
     position: absolute;
     right: 13px;
     top: 6px;
@@ -635,77 +642,77 @@ body {
     font-weight: 900;
 }
 
-#search-icon{
+#search-icon {
     position: absolute;
     margin-top: 6px;
     margin-left: 151px;
 }
 
-.notif-filter{
+.notif-filter {
     margin-top: 0px !important;
 }
 
-.read{
-    background-color: #e8e8e8;
+.read {
+    background-color: $read-background-color;
 }
 
 .page-item.active {
-	.page-link {
-	    color: $white !important;
-    }	
+    .page-link {
+        color: $white !important;
+    }
 }
 
-.switch-dark{
+.switch-dark {
     width: 75%;
 }
 
-.read-all{
-    color: #3a3a3a;
-    background:none;
-    border:none;
+.read-all {
+    color: $read-all-text-color;
+    background: none;
+    border: none;
 }
 
-#notif-title{
+#notif-title {
     height: 50px;
     padding: 14px 10px;
-    border-bottom: 1px solid #c7c7c7;
+    border-bottom: 1px solid $control-border-color;
     cursor: default;
 }
 
-@media only screen and (min-width: 768px){  
-    .navbar-left{
+@media only screen and (min-width: 768px) {
+    .navbar-left {
         display: block;
-    }  
+    }
 
-    .navbar-top {      
+    .navbar-top {
 
         .navbar-top-right {
-           
+
             .profile {
 
-                .profile-info{
-                    display: inline-block; 
+                .profile-info {
+                    display: inline-block;
                 }
             }
         }
     }
 
-    #search-icon{
+    #search-icon {
         position: absolute;
         margin-top: 6px;
         margin-left: 151px;
     }
 
-    .notif-filter{
+    .notif-filter {
         margin-top: 0px !important;
     }
 
-    .switch-dark{
+    .switch-dark {
         width: 75%;
-    }    
+    }
 }
 
-@media only screen and (max-width: 768px){
+@media only screen and (max-width: 768px) {
 
     h1 {
         font-size: 18px;
@@ -715,26 +722,26 @@ body {
         padding: 4px 6px;
     }
 
-    .navbar-top {    
-        .navbar-top-left {    
-            .hamburger{
+    .navbar-top {
+        .navbar-top-left {
+            .hamburger {
                 display: block;
             }
         }
-        
+
         .navbar-top-right {
-           
+
             .profile {
 
-                .profile-info{
+                .profile-info {
                     display: none;
                 }
-                
+
             }
         }
     }
 
-    .navbar-left{
+    .navbar-left {
         left: 0px;
         display: none;
     }
@@ -749,13 +756,13 @@ body {
         bottom: 0px;
         height: calc(100% - 60px);
         width: 100%;
-    
+
         .aside-nav {
             display: none;
         }
 
         .content {
-    
+
             .page-header {
 
                 .control-group {
@@ -770,58 +777,58 @@ body {
                 .page-title {
                     float: left;
                     width: 100%;
-    
-                    .back-link {                      
+
+                    .back-link {
                         margin-top: 0px;
                         margin-right: -1px;
                         height: 22px !important;
                         width: 22px !important;
-                    }   
+                    }
                 }
-                  
+
                 .page-action {
                     position: absolute;
                     right: 10px;
-                    margin-top: 0px;  
+                    margin-top: 0px;
 
-                    .export-import{
+                    .export-import {
                         margin-top: -15px;
                     }
-     
+
                     * {
-                        display: inline-block;                        
-                    }    
+                        display: inline-block;
+                    }
                 }
             }
         }
 
         .content-wrapper {
             margin-left: 0px;
-            margin-top:1px;
-        }   
+            margin-top: 1px;
+        }
     }
 
-    #search-icon{
+    #search-icon {
         position: absolute;
         margin-top: 6px;
         right: 16px;
     }
 
 
-    .notif-filter{
+    .notif-filter {
         margin-top: 12px !important;
     }
 
-    .switch-dark{
+    .switch-dark {
         width: 100%;
     }
 }
 
-@media only screen and (max-width: 411px){
+@media only screen and (max-width: 411px) {
     .content-container {
-      
+
         .content {
-    
+
             .page-header {
 
                 .control-group {
@@ -833,15 +840,15 @@ body {
                     margin-top: 40px;
                 }
             }
-        } 
+        }
     }
 }
 
-@media only screen and (max-width: 385px){
+@media only screen and (max-width: 385px) {
     .content-container {
-      
+
         .content {
-    
+
             .page-header {
 
                 .control-group {
@@ -853,15 +860,15 @@ body {
                     margin-top: 40px;
                 }
             }
-        } 
+        }
     }
 }
 
-@media only screen and (max-width: 320px){
+@media only screen and (max-width: 320px) {
     .content-container {
-      
+
         .content {
-    
+
             .page-header {
 
                 .control-group {
@@ -873,6 +880,6 @@ body {
                     margin-top: 40px;
                 }
             }
-        } 
+        }
     }
-}
+}
\ No newline at end of file
diff --git a/packages/Webkul/Admin/src/Resources/views/layouts/nav-top.blade.php b/packages/Webkul/Admin/src/Resources/views/layouts/nav-top.blade.php
index 03d564426..5e4054e2c 100755
--- a/packages/Webkul/Admin/src/Resources/views/layouts/nav-top.blade.php
+++ b/packages/Webkul/Admin/src/Resources/views/layouts/nav-top.blade.php
@@ -61,7 +61,7 @@
 
                 <div class="dropdown-toggle">
 
-                    <i class="icon locale-icon-bold" style="height:26px;width:26px"></i>
+                    <i class="icon locale-icon-bold"></i>
                 </div>
 
                 <div class="dropdown-list bottom-right">
diff --git a/packages/Webkul/Ui/publishable/assets/css/ui.css b/packages/Webkul/Ui/publishable/assets/css/ui.css
index 0c4400c21..e35a1dce9 100644
--- a/packages/Webkul/Ui/publishable/assets/css/ui.css
+++ b/packages/Webkul/Ui/publishable/assets/css/ui.css
@@ -1 +1 @@
-.accounts-icon,.active .cms-icon,.active.configuration-icon,.arrow-icon,.catalog-icon,.cms-icon,.configuration-icon,.customer-icon,.dashboard-icon,.locale-icon,.locale-icon-bold,.promotion-icon,.sales-icon,.settings-icon,.store-icon{width:48px;height:48px;display:inline-block;background-size:cover}.icon{display:inline-block;background-size:cover}.dashboard-icon{background-image:url(../images/Icon-Dashboard.svg)}.sales-icon{background-image:url(../images/Icon-Sales.svg)}.catalog-icon{background-image:url(../images/Icon-Catalog.svg)}.customer-icon{background-image:url(../images/Icon-Customers.svg)}.configuration-icon{background-image:url(../images/Icon-Configure.svg)}.settings-icon{background-image:url(../images/Icon-Settings.svg)}.promotion-icon{background-image:url(../images/icon-promotion.svg)}.cms-icon{background-image:url(../images/Icon-CMS.svg)}.angle-right-icon{background-image:url(../images/Angle-Right.svg);width:17px;height:17px}.angle-left-icon{background-image:url(../images/Angle-Left.svg);width:17px;height:17px}.arrow-down-icon{background-image:url(../images/Arrow-Down-Light.svg);width:14px;height:8px}.arrow-right-icon{background-image:url(../images/Arrow-Right.svg);width:18px;height:18px}.white-cross-sm-icon{background-image:url(../images/Icon-Sm-Cross-White.svg);width:18px;height:18px}.accordian-up-icon{background-image:url(../images/Accordion-Arrow-Up.svg);width:24px;height:24px}.accordian-down-icon{background-image:url(../images/Accordion-Arrow-Down.svg);width:24px;height:24px}.accordian-left-icon{background-image:url(../images/chevron-left.svg);width:24px;height:24px}.accordian-right-icon{background-image:url(../images/chevron-right.png);width:24px;height:24px}.notification-icon{background-image:url(../images/Icon-bell.svg);width:30px;height:30px}.processing-icon{background-image:url(../images/process.png);width:30px;height:30px}.pending-icon{background-image:url(../images/notification-checked.svg);width:30px;height:30px}.closed-icon{background-image:url(../images/return.png);width:30px;height:30px}.canceled-icon{background-image:url(../images/notification-cancel.svg);width:30px;height:30px}.completed-icon{background-image:url(../images/notification-complete.svg);width:30px;height:30px}.accounts-icon{background-image:url(../images/Account-Icon.svg)}.arrow-icon{background-image:url(../images/arrow-icon.svg);height:13px;width:8px;transform:rotate(90deg)!important;float:right;margin-top:16px!important;margin-right:18px!important}.rotate-arrow-icon{transform:rotate(-90deg)!important}.locale-icon{background-image:url(../images/Local-Icon.svg)}.locale-icon-bold{background-image:url(../images/Local-Icon-bold.svg)}.store-icon{background-image:url(../images/store-icon.svg);height:26px;width:26px}.cross-icon{background-image:url(../images/Icon-Crossed.svg);width:18px;height:18px}.trash-icon{background-image:url(../images/Icon-Trash.svg);width:24px;height:24px}.remove-icon{background-image:url(../images/Icon-remove.svg);width:24px;height:24px}.pencil-lg-icon{background-image:url(../images/Icon-Pencil-Large.svg);width:24px;height:24px}.eye-icon{background-image:url(../images/Icon-eye.svg);width:24px;height:24px}.search-icon{background-image:url(../images/icon-search.svg);width:24px;height:24px}.sortable-icon{background-image:url(../images/Icon-Sortable.svg);width:24px;height:24px}.sort-down-icon,.sort-up-icon{background-image:url(../images/Icon-Sort-Down.svg);width:18px;height:18px}.sort-up-icon{transform:rotate(180deg)}.primary-back-icon{background-image:url(../images/Icon-Back-Primary.svg);width:24px;height:24px}.checkbox-dash-icon{background-image:url(../images/Checkbox-Dash.svg);width:24px;height:24px}.account-icon{background-image:url(../images/icon-account.svg);width:24px;height:24px}.expand-icon{background-image:url(../images/Expand-Light.svg);width:18px;height:18px}.expand-on-icon{background-image:url(../images/Expand-Light-On.svg);width:18px;height:18px}.dark-left-icon{background-image:url(../images/arrow-left-dark.svg);width:18px;height:18px}.light-right-icon{background-image:url(../images/arrow-right-light.svg);width:18px;height:18px}.folder-icon{background-image:url(../images/Folder-Icon.svg);width:24px;height:24px}.star-icon{background-image:url(../images/Star-Icon.svg);width:24px;height:24px}.star-icon-blank{background-image:url(../images/Star-Icon-Blank.svg);width:24px;height:24px}.arrow-down-white-icon{background-image:url(../images/down-arrow-white.svg);width:17px;height:13px}.arrow-up-white-icon{background-image:url(../images/up-arrow-white.svg);width:17px;height:13px}.profile-pic-icon{background-image:url(../images/Profile-Pic.svg);width:60px;height:60px}.graph-up-icon{background-image:url(../images/Icon-Graph-Green.svg);width:24px;height:24px}.graph-down-icon{background-image:url(../images/Icon-Graph-Red.svg);width:24px;height:24px}.no-result-icon{background-image:url(../images/limited-icon.svg);width:52px;height:47px}.note-icon{background-image:url(../images/icon-note.svg)}.list-icon,.note-icon{width:24px;height:24px}.list-icon{background-image:url(../images/Icon-Listing.svg)}.copy-icon{background-image:url(../images/copy-icon.png);width:24px;height:24px}.active .dashboard-icon{background-image:url(../images/Icon-Dashboard-Active.svg)}.active .sales-icon{background-image:url(../images/Icon-Sales-Active.svg)}.active .catalog-icon{background-image:url(../images/Icon-Catalog-Active.svg)}.active .customer-icon{background-image:url(../images/Icon-Customers-Active.svg)}.active .settings-icon{background-image:url(../images/Icon-Settings-Active.svg)}.active .configuration-icon{background-image:url(../images/Icon-Configure-Active.svg)}.active .promotion-icon{background-image:url(../images/icon-promotion-active.svg)}.active .cms-icon{background-image:url(../images/Icon-CMS-Active.svg)}.active>.arrow-down-icon{background-image:url(../images/Arrow-Down-Light.svg);width:14px;height:8px}.active>.expand-icon{background-image:url(../images/Expand-Light-On.svg)}.active.dashboard-icon{background-image:url(../images/Icon-Dashboard-Active.svg)}.active.customer-icon{background-image:url(../images/Icon-Customers-Active.svg)}.active.sales-icon{background-image:url(../images/Icon-Sales-Active.svg)}.active.settings-icon{background-image:url(../images/Icon-Settings-Active.svg)}.active.configuration-icon{background-image:url(../images/Icon-Configure-Active.svg)}.active.arrow-down-icon{background-image:url(../images/Arrow-Down-Light.svg);width:14px;height:8px}.active.expand-icon{background-image:url(../images/Expand-Light-On.svg)}.icon-404{background-image:url(../images/404-image.svg);width:255px;height:255px}.export-icon{background-image:url(../images/Icon-Export.svg);width:32px;height:32px}.import-icon{background-image:url(../images/Icon-Import.svg);width:32px;height:32px}.star-blue-icon{width:17px;height:17px;background-image:url(../images/Icon-star.svg)}.camera-icon{background-image:url(../images/Camera.svg);width:24px;height:24px}@-webkit-keyframes jelly{0%{transform:translateY(0) scale(.7);opacity:0}70%{transform:translateY(5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@keyframes jelly{0%{transform:translateY(0) scale(.7);opacity:0}70%{transform:translateY(5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@-webkit-keyframes jelly-out{0%{transform:translateY(0) scale(1);opacity:1}30%{transform:translateY(-5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(.7);opacity:0}}@keyframes jelly-out{0%{transform:translateY(0) scale(1);opacity:1}30%{transform:translateY(-5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(.7);opacity:0}}.grid-container{display:block;width:100%}.grid-container .grid-top{display:grid;grid-template-rows:auto auto auto;row-gap:8px;align-items:center}.grid-container .grid-top .datagrid-filters,.grid-container .grid-top .datagrid-filters .grid-right{display:grid;grid-template-columns:auto auto;-moz-column-gap:10px;column-gap:10px}.grid-container .grid-top .datagrid-filters .grid-right{justify-self:end;align-items:end}.grid-container .grid-top .datagrid-filters .dropdown-filters{display:inline-block}.grid-container .grid-top .datagrid-filters .dropdown-filters.per-page .control-group label{margin-top:7px;margin-right:10px;flex:auto}.grid-container .grid-top .datagrid-filters .dropdown-filters.per-page .control-group .control{width:100%;margin:0;flex:1}.grid-container .datagrid-filters,.grid-container .datagrid-filters .filter-right{display:grid;grid-template-columns:auto auto;-moz-column-gap:10px;column-gap:10px;align-items:end}.grid-container .datagrid-filters .filter-right{justify-self:end}.grid-container .datagrid-filters .filter-right .control-group .control{margin-bottom:0}.filtered-tags{display:inline-flex;align-items:flex-start;flex-wrap:wrap;margin-bottom:10px}.search-filter{border-radius:3px;height:36px;max-width:300px}.search-filter .control{font-size:15px;border:1px solid #c7c7c7;border-right:none;border-top-left-radius:3px;border-bottom-left-radius:3px;height:36px;width:calc(100% - 36px);padding-left:10px;-webkit-appearance:none}.search-filter:hover{box-shadow:0 0 0 1px rgba(0,64,255,.6)}.search-filter .contorl:focus{border-color:#0041ff}.search-filter .icon-wrapper{border:1px solid #c7c7c7;border-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0;height:36px;width:36px;padding:5px;float:right}.grid-dropdown-header{display:inline-flex;justify-content:space-between;align-items:center;height:36px;width:100%;min-width:200px;border:1px solid #c7c7c7;border-radius:3px;background-color:#fff;padding:0 5px}.grid-dropdown-header .arrow-icon-down{float:right}.dropdown-list.dropdown-container{padding:15px;width:100%;top:43px}.dropdown-list.dropdown-container ul li .control-group{margin-bottom:15px;display:block}.dropdown-list.dropdown-container ul li .control-group .control{margin-bottom:15px}.dropdown-list.dropdown-container .apply-filter{padding:10px;width:100%}.filter-advance{display:flex;justify-content:space-between}.filter-tag{justify-content:space-between;border-radius:2px;margin-right:20px}.filter-tag,.filter-tag .wrapper{display:flex;flex-direction:row;align-items:center;font-size:14px;height:40px}.filter-tag .wrapper{margin-left:4px;padding:5px 10px 5px 16px;background:#e7e7e7;border:1px solid #e7e7e7;color:#000311;letter-spacing:-.22px;border-radius:24px}.filter-tag .wrapper .icon.cross-icon{margin-left:10px;cursor:pointer}.filter-tag .wrapper:hover{background:#fff;border:1px solid #e7e7e7}.rtl .search-filter .control{padding-right:10px;border-left:0;border-right:1px solid #c7c7c7;border-top-right-radius:3px;border-bottom-right-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0}.rtl .search-filter .icon-wrapper{float:left;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:3px;border-bottom-left-radius:3px}.rtl .search-filter:hover{box-shadow:0 0 0 1px rgba(0,64,255,.6)}.rtl .dropdown-filters{display:inline-block}.rtl .dropdown-filters.per-page{margin-left:10px;margin-right:10px}.rtl .filtered-tags .filter-tag .cross-icon,.rtl .filtered-tags .filter-tag .wrapper{margin-right:10px;margin-left:0}@media only screen and (max-width:1040px){.grid-container .grid-top .datagrid-filters{grid-template-columns:100%;row-gap:0}.grid-container .grid-top .datagrid-filters .search-filter{max-width:100%!important}.grid-container .grid-top .datagrid-filters .filter-left,.grid-container .grid-top .datagrid-filters .filter-right{display:grid;grid-template-columns:49.5% 49%;-moz-column-gap:5px;column-gap:5px}.grid-container .grid-top .datagrid-filters .filter-right{width:100%}.grid-dropdown-header{min-width:122px}}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:focus{outline:none}.mb-10{margin-bottom:10px}.mb-15{margin-bottom:15px}.mb-20{margin-bottom:20px}.mb-25{margin-bottom:25px}.mb-30{margin-bottom:30px}.mb-35{margin-bottom:35px}.mb-40{margin-bottom:40px}.mb-45{margin-bottom:45px}.mb-50{margin-bottom:50px}.mb-60{margin-bottom:60px}.mb-70{margin-bottom:70px}.mb-80{margin-bottom:80px}.mb-90{margin-bottom:90px}.mt-5{margin-top:5px}.mt-10{margin-top:10px}.mt-15{margin-top:15px}.mt-20{margin-top:20px}.mt-25{margin-top:25px}.mt-30{margin-top:30px}.mt-35{margin-top:35px}.mt-40{margin-top:40px}.mt-45{margin-top:45px}.mt-50{margin-top:50px}.mt-60{margin-top:60px}.mt-70{margin-top:70px}.mt-80{margin-top:80px}.mt-90{margin-top:90px}body{letter-spacing:-.26px;line-height:19px}a:active,a:focus,a:hover,a:link,a:visited{text-decoration:none;color:#0041ff}::-moz-selection{background-color:rgba(0,64,255,.6);color:#fff}::selection{background-color:rgba(0,64,255,.6);color:#fff}textarea{resize:none}ul{margin:0;padding:0;list-style:none}h1{font-size:28px;margin-top:0}h1,h2{color:#3a3a3a}h2{font-size:24px}h3{font-size:20px}h3,h4{color:#3a3a3a}h4{font-size:16px}h5{font-size:12px;color:#3a3a3a}.hide{display:none!important}.row{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.btn{box-shadow:0 1px 4px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.1);border-radius:3px;border:none;color:#fff;cursor:pointer;transition:.2s cubic-bezier(.4,0,.2,1);font:inherit;display:inline-block}.btn:active,.btn:focus,.btn:hover{opacity:.75;border:none}.btn.btn-sm{padding:6px 12px}.btn.btn-md{padding:8px 16px}.btn.btn-lg{padding:10px 20px}.btn.btn-xl{padding:12px 24px;font-size:16px}.btn.btn-primary{background:#0041ff;color:#fff}.btn.btn-black{background:#000;color:#fff}.btn.btn-white{background:#fff;color:#000}.btn:disabled,.btn[disabled=disabled],.btn[disabled=disabled]:active,.btn[disabled=disabled]:hover{cursor:not-allowed;background:#b1b1ae;box-shadow:none;opacity:1}.dropdown-btn{min-width:150px;text-align:left;background:#fff;border:2px solid #c7c7c7;border-radius:3px;font-size:14px;padding:8px 35px 8px 10px;cursor:pointer;position:relative}.dropdown-btn:active,.dropdown-btn:focus,.dropdown-btn:hover{opacity:.75;border:2px solid #c7c7c7}.dropdown-btn .icon{position:absolute;right:10px;top:50%;margin-top:-4px}.dropdown-toggle{cursor:pointer}.dropdown-open{position:relative}.dropdown-list{width:200px;margin-bottom:20px;box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);border-radius:3px;background-color:#fff;position:absolute;display:none;z-index:10;text-align:left}.dropdown-list.bottom-left{top:42px;left:0}.dropdown-list.bottom-right{top:42px;right:0}.dropdown-list.top-left{bottom:0;left:42px}.dropdown-list.top-right{bottom:0;right:42px}.dropdown-list .search-box{padding:20px;border-bottom:1px solid #e8e8e8}.dropdown-list .search-box .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:100%;height:36px;display:inline-block;vertical-align:middle;transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px}.dropdown-list .search-box .control:focus{border-color:#0041ff}.dropdown-list .dropdown-container{padding:20px;overflow-y:auto}.dropdown-list .dropdown-container label{font-size:15px;display:inline-block;text-transform:uppercase;color:#9e9e9e;font-weight:700;padding-bottom:5px}.dropdown-list .dropdown-container ul{margin:0;list-style-type:none;padding:0}.dropdown-list .dropdown-container ul li{padding:5px 0}.dropdown-list .dropdown-container ul li a:active,.dropdown-list .dropdown-container ul li a:focus,.dropdown-list .dropdown-container ul li a:link,.dropdown-list .dropdown-container ul li a:visited{color:#3a3a3a;display:block}.dropdown-list .dropdown-container ul li a:hover{color:#0041ff}.dropdown-list .dropdown-container ul li .checkbox{margin:0}.dropdown-list .dropdown-container ul li .control-group label{color:#3a3a3a;font-size:15px;font-weight:500;text-transform:capitalize;width:100%}.dropdown-list .dropdown-container .btn{width:100%;margin-top:10px}.notification{width:400px;margin-bottom:20px;box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);border-radius:3px;background-color:#fff;position:absolute;display:none;z-index:10;text-align:left;border-radius:10px}.notification.bottom-left{top:42px;left:0}.notification.bottom-right{top:42px;right:0}.notification.top-left{bottom:0;left:42px}.notification.top-right{bottom:0;right:42px}.notification .dropdown-container{padding:0;overflow-y:auto}.notification .dropdown-container label{font-size:15px;display:inline-block;text-transform:uppercase;color:#9e9e9e;font-weight:700;padding-bottom:5px}.notification .dropdown-container ul{margin:0;list-style-type:none;padding:0}.notification .dropdown-container ul .read{color:rgba(58,58,58,.5)}.notification .dropdown-container ul .read .notif-content>a{text-decoration:none;color:rgba(58,58,58,.5)}.notification .dropdown-container ul .read .notif-content>a:hover{color:rgba(58,58,58,.5)}.notification .dropdown-container ul li{padding:16px 10px;border-bottom:1px solid #c7c7c7}.notification .dropdown-container ul li a:active,.notification .dropdown-container ul li a:focus,.notification .dropdown-container ul li a:link,.notification .dropdown-container ul li a:visited{color:#3a3a3a;display:block}.notification .dropdown-container ul li a:hover{color:#0041ff}.notification .dropdown-container ul li .checkbox{margin:0}.notification .dropdown-container ul li .control-group label{color:#3a3a3a;font-size:15px;font-weight:500;text-transform:capitalize;width:100%}.notification .dropdown-container ul .bottom-li{border-bottom:none!important;color:#3a3a3a;display:flex;justify-content:space-between}.notification .dropdown-container ul .bottom-li a{display:initial;color:#3a3a3a!important}.notification .dropdown-container .btn{width:100%;margin-top:10px}.section .secton-title{font-size:18px;color:#3a3a3a;padding:15px 0;border-bottom:1px solid #e8e8e8}.section .section-content{display:block;padding:20px 0}.section .section-content .row{display:block;padding:7px 0}.section .section-content .row .title{width:200px}.section .section-content .row .title,.section .section-content .row .value{color:#3a3a3a;letter-spacing:-.26px;display:inline-block}.table{width:100%}.table .table-responsive{overflow-x:auto;width:100%}.table .table-responsive::-webkit-scrollbar{height:5px!important}.table .table-responsive::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px #c8c8c8!important}.table .table-responsive::-webkit-scrollbar-thumb{border-radius:10px!important;background-color:#fff!important;-webkit-box-shadow:inset 0 0 6px rgba(90,90,90,.7)!important}.table table{border-collapse:collapse;text-align:left;width:100%}.table table thead th{font-weight:700;padding:12px 10px;background:#f8f9fa;color:#3a3a3a}.table table tbody td{padding:10px;border-bottom:1px solid #d3d3d3;color:#3a3a3a;vertical-align:top}.table table tbody td.actions .action{display:inline-flex}.table table tbody td.actions .icon{cursor:pointer;vertical-align:middle}.table table tbody td.empty{text-align:center}.table table tbody tr:last-child td{border-bottom:none}.table .control-group{width:100%;margin-bottom:0;min-width:140px}.table .control-group .control{width:100%;margin:0}.pagination .page-item{background:#fff;border:2px solid #c7c7c7;border-radius:3px;padding:7px 14px;margin-right:5px;font-size:16px;display:inline-block;color:#3a3a3a;vertical-align:middle;text-decoration:none}.pagination .page-item.next,.pagination .page-item.previous{padding:6px 9px}.pagination .page-item.active{background:#0041ff;color:#fff;border-color:#0041ff}.pagination .page-item .icon{vertical-align:middle;margin-bottom:3px}.checkbox{position:relative;display:block}.checkbox input{left:0;opacity:0;position:absolute;top:0;height:24px;width:24px;z-index:100}.checkbox .checkbox-view{background-image:url(../images/Checkbox.svg);height:24px;width:24px;display:inline-block!important;vertical-align:middle;margin:0 5px 0 0}.checkbox input:checked+.checkbox-view{background-image:url(../images/Checkbox-Checked.svg)}.checkbox input:disabled+.checkbox-view{opacity:.5;cursor:not-allowed}.radio{position:relative;display:block;margin:10px 5px 5px 0}.radio input{left:-4px;opacity:0;position:absolute;top:-1px;z-index:100}.radio .radio-view{background-image:url(../images/controls.svg);background-position:-21px 0;height:20px;width:20px;display:inline-block!important;vertical-align:middle;margin:0 5px 0 0}.radio input:checked+.radio-view{background-position:-21px -21px}.radio input:disabled+.radio-view{opacity:.5;cursor:not-allowed}.rtl .radio input{left:unset;right:1px}.control-group{margin-bottom:25px;font-size:15px;width:750px;max-width:100%;position:relative}.control-group,.control-group label{display:block;color:#3a3a3a}.control-group label.required:after{content:"*";color:#fc6868;font-weight:700;display:inline-block}.control-group textarea.control{height:100px;padding:10px}.control-group .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:70%;height:36px;display:inline-block;vertical-align:middle;transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px;margin-top:10px;margin-bottom:5px}.control-group .control:focus{border-color:#0041ff}.control-group .control[disabled=disabled]{border-color:#d3d3d3;background-color:#d3d3d3;cursor:not-allowed}.control-group .control[multiple]{height:100px}.control-group.date .control,.control-group.datetime .control{padding-right:40px}.control-group.date:after,.control-group.datetime:after{background-image:url(../images/Icon-Calendar.svg);width:24px;height:24px;content:"";display:inline-block;vertical-align:middle;margin-left:-34px;pointer-events:none;position:absolute;top:51%}.control-group.date .cross-icon,.control-group.datetime .cross-icon{position:absolute;cursor:pointer;margin-left:-54px;top:38px}.control-group.multi-select .control{padding:0}.control-group .control-info{display:block;font-size:14px;color:#6f6f6f;font-style:italic}.control-group .control-error{display:none;color:#fc6868;margin-top:5px}.control-group.has-error .control{border-color:#fc6868}.control-group.has-error .control-error{display:block}.control-group.has-error.date:after{margin-top:-12px}.control-group.price .currency-code{vertical-align:middle;display:inline-block}.table .control-group.date:after,.table .control-group.datetime:after{top:6px;left:100%}.table .control-group.has-error.date.date:after,.table .control-group.has-error.date.datetime:after{top:18px}.rtl .control-group.date .control,.rtl .control-group.datetime .control{padding-left:40px;padding-right:10px}.rtl .control-group.date:after,.rtl .control-group.datetime:after{margin-right:-34px;right:70%}.rtl .control-group.date .cross-icon,.rtl .control-group.datetime .cross-icon{margin-right:-54px;top:38px}.rtl .table .control-group.date:after,.rtl .table .control-group.datetime:after{right:unset!important;left:auto}.control-group .switch{position:relative;display:inline-block;width:60px;height:34px;margin-top:10px;margin-bottom:5px}.control-group .switch input{opacity:0;width:0;height:0}.control-group .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#8e8e8e;transition:.2s}.control-group .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.2s}.control-group input:checked+.slider{background-color:#0041ff}.control-group input:focus+.slider{box-shadow:0 0 1px #0041ff}.control-group input:checked+.slider:before{transform:translateX(26px)}.control-group .slider.round{border-radius:34px}.control-group .slider.round:before{border-radius:50%}.button-group{margin-top:20px;margin-bottom:20px}.alert-wrapper{width:300px;top:10px;right:10px;position:fixed;z-index:100;text-align:left}.alert-wrapper .alert{width:300px;padding:15px;border-radius:3px;display:inline-block;box-shadow:0 4px 15.36px .64px rgba(0,0,0,.1),0 2px 6px 0 rgba(0,0,0,.12);position:relative;-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;transform-origin:center top;z-index:500;margin-bottom:10px}.alert-wrapper .alert.alert-error{background:#fc6868}.alert-wrapper .alert.alert-info{background:#204d74}.alert-wrapper .alert.alert-success{background:#4caf50}.alert-wrapper .alert.alert-warning{background:#ffc107}.alert-wrapper .alert .icon{position:absolute;right:10px;top:10px;cursor:pointer}.alert-wrapper .alert p{color:#fff;margin:0;padding:0;font-size:14px}.tabs ul{border-bottom:1px solid #e8e8e8}.tabs ul li{display:inline-block}.tabs ul li a{padding:15px 20px;cursor:pointer;margin:0 2px;text-align:center;color:#000311;display:block}.tabs ul li.active a{border-bottom:3px solid #0041ff}.accordian,accordian{display:inline-block;width:100%}.accordian .accordian-header,.accordian div[slot*=header],accordian .accordian-header,accordian div[slot*=header]{width:100%;display:inline-block;font-size:18px;color:#3a3a3a;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;padding:20px 15px;cursor:pointer;margin-top:-1px}.accordian .accordian-header .expand-icon,.accordian div[slot*=header] .expand-icon,accordian .accordian-header .expand-icon,accordian div[slot*=header] .expand-icon{background-image:url(../images/Expand-Light.svg);margin-right:10px;margin-top:3px}.accordian .accordian-header h1,.accordian div[slot*=header] h1,accordian .accordian-header h1,accordian div[slot*=header] h1{margin:0;font-size:20px;font-weight:500;display:inline-block}.accordian .accordian-header .icon,.accordian div[slot*=header] .icon,accordian .accordian-header .icon,accordian div[slot*=header] .icon{float:right}.accordian .accordian-header .icon.left,.accordian div[slot*=header] .icon.left,accordian .accordian-header .icon.left,accordian div[slot*=header] .icon.left{float:left}.accordian.error .accordian-header,accordian.error .accordian-header{color:#ff5656}.accordian .accordian-content,.accordian div[slot*=body],accordian .accordian-content,accordian div[slot*=body]{width:100%;padding:20px 15px;display:none;transition:all .3s ease}.accordian.active>.accordian-content,accordian.active>.accordian-content{display:inline-block}.accordian.active>.accordian-header .expand-icon,accordian.active>.accordian-header .expand-icon{background-image:url(../images/Expand-Light-On.svg)}.tree-container .tree-item{padding-left:30px;display:inline-block;margin-top:10px;width:100%}.tree-container .tree-item>.tree-item{display:none}.tree-container .tree-item.active>.tree-item{display:inline-block}.tree-container .tree-item .checkbox,.tree-container .tree-item .radio{margin:0;display:inline-block}.tree-container .tree-item .expand-icon{display:inline-block;margin-right:10px;cursor:pointer;background-image:url(../images/Expand-Light.svg);width:18px;height:18px;vertical-align:middle}.tree-container .tree-item .folder-icon{vertical-align:middle;margin-right:10px}.tree-container .tree-item.active>.expand-icon{background-image:url(../images/Expand-Light-On.svg)}.tree-container>.tree-item{padding-left:0}.panel{box-shadow:0 2px 25px 0 rgba(0,0,0,.15);border-radius:5px;background:#fff}.panel .panel-content{padding:20px}modal{display:none}.modal-open{overflow:hidden}.modal-overlay{display:none;overflow-y:auto;z-index:10;top:0;right:0;bottom:0;left:0;position:fixed;background:#000;opacity:.7}.modal-open .modal-overlay{display:block}.modal-container{background:#fff;top:100px;width:600px;max-width:80%;left:50%;margin-left:-300px;position:fixed;z-index:11;box-shadow:0 15px 25px 0 rgba(0,0,0,.03),0 20px 45px 5px rgba(0,0,0,.2);-webkit-animation:fade-in-white .3s ease-in-out;animation:fade-in-white .3s ease-in-out;-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;border-radius:5px;overflow-y:auto;max-height:80%}.modal-container .modal-header{padding:20px}.modal-container .modal-header h3{display:inline-block;font-size:20px;color:#3a3a3a;margin:0}.modal-container .modal-header .icon{float:right;cursor:pointer}.modal-container .modal-body{padding:20px}.modal-container .modal-body .control-group .control{width:100%}@media only screen and (max-width:770px){.modal-container{max-width:80%;left:10%;margin-left:0}.control-group,.control-group .control{width:100%}}.label{background:#e7e7e7;border-radius:2px;padding:8px;color:#000311;display:inline-block}.label.label-sm{padding:5px}.label.label-md{padding:8px}.label.label-lg{padding:11px}.label.label-xl{padding:14px}.badge{border-radius:50px;color:#fff;padding:8px;white-space:nowrap}.badge.badge-sm{padding:5px}.badge.badge-md{padding:3px 10px}.badge.badge-lg{padding:11px}.badge.badge-xl{padding:14px}.badge.badge-success{background-color:#4caf50}.badge.badge-info{background-color:#0041ff}.badge.badge-danger{background-color:#fc6868}.badge.badge-warning{background-color:#ffc107}.image-wrapper{margin-bottom:20px;margin-top:10px;display:inline-block;width:100%}.image-wrapper .image-item{width:200px;height:200px;margin-right:20px;background:#f8f9fa;border-radius:3px;display:inline-block;position:relative;background-image:url(../images/placeholder-icon.svg);background-repeat:no-repeat;background-position:50%;margin-bottom:20px;float:left}.image-wrapper .image-item img.preview{width:100%;height:100%}.image-wrapper .image-item input{display:none}.image-wrapper .image-item .remove-image{background-image:linear-gradient(-180deg,rgba(0,0,0,.08),rgba(0,0,0,.24));border-radius:0 0 4px 4px;position:absolute;bottom:0;width:100%;padding:10px;text-align:center;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.24);margin-right:20px;cursor:pointer}.image-wrapper .image-item:hover .remove-image{display:block}.image-wrapper .image-item.has-image{background-image:none}.vue-swatches__trigger{border:1px solid #d3d3d3}.helper-container{display:block}.helper-container .group code{font-weight:700}.overlay-loader{position:fixed;z-index:11;top:50%;left:50%;margin-top:-24px;margin-left:-24px}.tooltip{display:block!important;z-index:10000}.tooltip .tooltip-inner{background:#000;color:#fff;border-radius:4px;padding:5px 10px 4px}.tooltip .tooltip-arrow{width:0;height:0;border-style:solid;position:absolute;margin:5px;border-color:#000;z-index:1}.tooltip[x-placement^=top]{margin-bottom:5px}.tooltip[x-placement^=top] .tooltip-arrow{border-width:5px 5px 0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;bottom:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=bottom]{margin-top:5px}.tooltip[x-placement^=bottom] .tooltip-arrow{border-width:0 5px 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important;top:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=right]{margin-left:5px}.tooltip[x-placement^=right] .tooltip-arrow{border-width:5px 5px 5px 0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important;left:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip[x-placement^=left]{margin-right:5px}.tooltip[x-placement^=left] .tooltip-arrow{border-width:5px 0 5px 5px;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;right:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.end-date:after,.start-date:after{background-image:url(../images/Icon-Calendar.svg);width:24px;height:24px;content:"";display:inline-block;vertical-align:middle;margin-left:-34px;pointer-events:none;position:absolute;top:43%}@media only screen and (max-width:414px){.notification{width:414px}}@media only screen and (max-width:411px){.notification{width:410px}}@media only screen and (max-width:393px){.notification{width:393px}}@media only screen and (max-width:390px){.notification{width:390px}}@media only screen and (max-width:375px){.notification{width:375px}}@media only screen and (max-width:360px){.notification{width:360px}}@media only screen and (max-width:320px){.notification{width:320px}}
\ No newline at end of file
+.accounts-icon,.active .cms-icon,.active.configuration-icon,.arrow-icon,.catalog-icon,.cms-icon,.configuration-icon,.customer-icon,.dashboard-icon,.locale-icon,.locale-icon-bold,.promotion-icon,.sales-icon,.settings-icon,.store-icon{width:48px;height:48px;display:inline-block;background-size:cover}.icon{display:inline-block;background-size:cover}.dashboard-icon{background-image:url(../images/Icon-Dashboard.svg)}.sales-icon{background-image:url(../images/Icon-Sales.svg)}.catalog-icon{background-image:url(../images/Icon-Catalog.svg)}.customer-icon{background-image:url(../images/Icon-Customers.svg)}.configuration-icon{background-image:url(../images/Icon-Configure.svg)}.settings-icon{background-image:url(../images/Icon-Settings.svg)}.promotion-icon{background-image:url(../images/icon-promotion.svg)}.cms-icon{background-image:url(../images/Icon-CMS.svg)}.angle-right-icon{background-image:url(../images/Angle-Right.svg);width:17px;height:17px}.angle-left-icon{background-image:url(../images/Angle-Left.svg);width:17px;height:17px}.arrow-down-icon{background-image:url(../images/Arrow-Down-Light.svg);width:14px;height:8px}.arrow-right-icon{background-image:url(../images/Arrow-Right.svg);width:18px;height:18px}.white-cross-sm-icon{background-image:url(../images/Icon-Sm-Cross-White.svg);width:18px;height:18px}.accordian-up-icon{background-image:url(../images/Accordion-Arrow-Up.svg);width:24px;height:24px}.accordian-down-icon{background-image:url(../images/Accordion-Arrow-Down.svg);width:24px;height:24px}.accordian-left-icon{background-image:url(../images/chevron-left.svg);width:24px;height:24px}.accordian-right-icon{background-image:url(../images/chevron-right.png);width:24px;height:24px}.notification-icon{background-image:url(../images/Icon-bell.svg);width:30px;height:30px}.processing-icon{background-image:url(../images/process.png);width:30px;height:30px}.pending-icon{background-image:url(../images/notification-checked.svg);width:30px;height:30px}.closed-icon{background-image:url(../images/return.png);width:30px;height:30px}.canceled-icon{background-image:url(../images/notification-cancel.svg);width:30px;height:30px}.completed-icon{background-image:url(../images/notification-complete.svg);width:30px;height:30px}.accounts-icon{background-image:url(../images/Account-Icon.svg)}.arrow-icon{background-image:url(../images/arrow-icon.svg);height:13px;width:8px;transform:rotate(90deg)!important;float:right;margin-top:16px!important;margin-right:18px!important}.rotate-arrow-icon{transform:rotate(-90deg)!important}.locale-icon{background-image:url(../images/Local-Icon.svg)}.locale-icon-bold{background-image:url(../images/Local-Icon-bold.svg);height:26px;width:26px}.store-icon{background-image:url(../images/store-icon.svg);height:26px;width:26px}.cross-icon{background-image:url(../images/Icon-Crossed.svg);width:18px;height:18px}.trash-icon{background-image:url(../images/Icon-Trash.svg);width:24px;height:24px}.remove-icon{background-image:url(../images/Icon-remove.svg);width:24px;height:24px}.pencil-lg-icon{background-image:url(../images/Icon-Pencil-Large.svg);width:24px;height:24px}.eye-icon{background-image:url(../images/Icon-eye.svg);width:24px;height:24px}.search-icon{background-image:url(../images/icon-search.svg);width:24px;height:24px}.sortable-icon{background-image:url(../images/Icon-Sortable.svg);width:24px;height:24px}.sort-down-icon,.sort-up-icon{background-image:url(../images/Icon-Sort-Down.svg);width:18px;height:18px}.sort-up-icon{transform:rotate(180deg)}.primary-back-icon{background-image:url(../images/Icon-Back-Primary.svg);width:24px;height:24px}.checkbox-dash-icon{background-image:url(../images/Checkbox-Dash.svg);width:24px;height:24px}.account-icon{background-image:url(../images/icon-account.svg);width:24px;height:24px}.expand-icon{background-image:url(../images/Expand-Light.svg);width:18px;height:18px}.expand-on-icon{background-image:url(../images/Expand-Light-On.svg);width:18px;height:18px}.dark-left-icon{background-image:url(../images/arrow-left-dark.svg);width:18px;height:18px}.light-right-icon{background-image:url(../images/arrow-right-light.svg);width:18px;height:18px}.folder-icon{background-image:url(../images/Folder-Icon.svg);width:24px;height:24px}.star-icon{background-image:url(../images/Star-Icon.svg);width:24px;height:24px}.star-icon-blank{background-image:url(../images/Star-Icon-Blank.svg);width:24px;height:24px}.arrow-down-white-icon{background-image:url(../images/down-arrow-white.svg);width:17px;height:13px}.arrow-up-white-icon{background-image:url(../images/up-arrow-white.svg);width:17px;height:13px}.profile-pic-icon{background-image:url(../images/Profile-Pic.svg);width:60px;height:60px}.graph-up-icon{background-image:url(../images/Icon-Graph-Green.svg);width:24px;height:24px}.graph-down-icon{background-image:url(../images/Icon-Graph-Red.svg);width:24px;height:24px}.no-result-icon{background-image:url(../images/limited-icon.svg);width:52px;height:47px}.note-icon{background-image:url(../images/icon-note.svg)}.list-icon,.note-icon{width:24px;height:24px}.list-icon{background-image:url(../images/Icon-Listing.svg)}.copy-icon{background-image:url(../images/copy-icon.png);width:24px;height:24px}.active .dashboard-icon{background-image:url(../images/Icon-Dashboard-Active.svg)}.active .sales-icon{background-image:url(../images/Icon-Sales-Active.svg)}.active .catalog-icon{background-image:url(../images/Icon-Catalog-Active.svg)}.active .customer-icon{background-image:url(../images/Icon-Customers-Active.svg)}.active .settings-icon{background-image:url(../images/Icon-Settings-Active.svg)}.active .configuration-icon{background-image:url(../images/Icon-Configure-Active.svg)}.active .promotion-icon{background-image:url(../images/icon-promotion-active.svg)}.active .cms-icon{background-image:url(../images/Icon-CMS-Active.svg)}.active>.arrow-down-icon{background-image:url(../images/Arrow-Down-Light.svg);width:14px;height:8px}.active>.expand-icon{background-image:url(../images/Expand-Light-On.svg)}.active.dashboard-icon{background-image:url(../images/Icon-Dashboard-Active.svg)}.active.customer-icon{background-image:url(../images/Icon-Customers-Active.svg)}.active.sales-icon{background-image:url(../images/Icon-Sales-Active.svg)}.active.settings-icon{background-image:url(../images/Icon-Settings-Active.svg)}.active.configuration-icon{background-image:url(../images/Icon-Configure-Active.svg)}.active.arrow-down-icon{background-image:url(../images/Arrow-Down-Light.svg);width:14px;height:8px}.active.expand-icon{background-image:url(../images/Expand-Light-On.svg)}.icon-404{background-image:url(../images/404-image.svg);width:255px;height:255px}.export-icon{background-image:url(../images/Icon-Export.svg);width:32px;height:32px}.import-icon{background-image:url(../images/Icon-Import.svg);width:32px;height:32px}.star-blue-icon{width:17px;height:17px;background-image:url(../images/Icon-star.svg)}.camera-icon{background-image:url(../images/Camera.svg);width:24px;height:24px}@-webkit-keyframes jelly{0%{transform:translateY(0) scale(.7);opacity:0}70%{transform:translateY(5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@keyframes jelly{0%{transform:translateY(0) scale(.7);opacity:0}70%{transform:translateY(5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(1);opacity:1}}@-webkit-keyframes jelly-out{0%{transform:translateY(0) scale(1);opacity:1}30%{transform:translateY(-5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(.7);opacity:0}}@keyframes jelly-out{0%{transform:translateY(0) scale(1);opacity:1}30%{transform:translateY(-5px) scale(1.05);opacity:1}to{transform:translateY(0) scale(.7);opacity:0}}.grid-container{display:block;width:100%}.grid-container .grid-top{display:grid;grid-template-rows:auto auto auto;row-gap:8px;align-items:center}.grid-container .grid-top .datagrid-filters,.grid-container .grid-top .datagrid-filters .grid-right{display:grid;grid-template-columns:auto auto;-moz-column-gap:10px;column-gap:10px}.grid-container .grid-top .datagrid-filters .grid-right{justify-self:end;align-items:end}.grid-container .grid-top .datagrid-filters .dropdown-filters{display:inline-block}.grid-container .grid-top .datagrid-filters .dropdown-filters.per-page .control-group label{margin-top:7px;margin-right:10px;flex:auto}.grid-container .grid-top .datagrid-filters .dropdown-filters.per-page .control-group .control{width:100%;margin:0;flex:1}.grid-container .datagrid-filters,.grid-container .datagrid-filters .filter-right{display:grid;grid-template-columns:auto auto;-moz-column-gap:10px;column-gap:10px;align-items:end}.grid-container .datagrid-filters .filter-right{justify-self:end}.grid-container .datagrid-filters .filter-right .control-group .control{margin-bottom:0}.filtered-tags{display:inline-flex;align-items:flex-start;flex-wrap:wrap;margin-bottom:10px}.search-filter{border-radius:3px;height:36px;max-width:300px}.search-filter .control{font-size:15px;border:1px solid #c7c7c7;border-right:none;border-top-left-radius:3px;border-bottom-left-radius:3px;height:36px;width:calc(100% - 36px);padding-left:10px;-webkit-appearance:none}.search-filter:hover{box-shadow:0 0 0 1px rgba(0,64,255,.6)}.search-filter .contorl:focus{border-color:#0041ff}.search-filter .icon-wrapper{border:1px solid #c7c7c7;border-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0;height:36px;width:36px;padding:5px;float:right}.grid-dropdown-header{display:inline-flex;justify-content:space-between;align-items:center;height:36px;width:100%;min-width:200px;border:1px solid #c7c7c7;border-radius:3px;background-color:#fff;padding:0 5px}.grid-dropdown-header .arrow-icon-down{float:right}.dropdown-list.dropdown-container{padding:15px;width:100%;top:43px}.dropdown-list.dropdown-container ul li .control-group{margin-bottom:15px;display:block}.dropdown-list.dropdown-container ul li .control-group .control{margin-bottom:15px}.dropdown-list.dropdown-container .apply-filter{padding:10px;width:100%}.filter-advance{display:flex;justify-content:space-between}.filter-tag{justify-content:space-between;border-radius:2px;margin-right:20px}.filter-tag,.filter-tag .wrapper{display:flex;flex-direction:row;align-items:center;font-size:14px;height:40px}.filter-tag .wrapper{margin-left:4px;padding:5px 10px 5px 16px;background:#e7e7e7;border:1px solid #e7e7e7;color:#000311;letter-spacing:-.22px;border-radius:24px}.filter-tag .wrapper .icon.cross-icon{margin-left:10px;cursor:pointer}.filter-tag .wrapper:hover{background:#fff;border:1px solid #e7e7e7}.rtl .search-filter .control{padding-right:10px;border-left:0;border-right:1px solid #c7c7c7;border-top-right-radius:3px;border-bottom-right-radius:3px;border-top-left-radius:0;border-bottom-left-radius:0}.rtl .search-filter .icon-wrapper{float:left;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:3px;border-bottom-left-radius:3px}.rtl .search-filter:hover{box-shadow:0 0 0 1px rgba(0,64,255,.6)}.rtl .dropdown-filters{display:inline-block}.rtl .dropdown-filters.per-page{margin-left:10px;margin-right:10px}.rtl .filtered-tags .filter-tag .cross-icon,.rtl .filtered-tags .filter-tag .wrapper{margin-right:10px;margin-left:0}@media only screen and (max-width:1040px){.grid-container .grid-top .datagrid-filters{grid-template-columns:100%;row-gap:0}.grid-container .grid-top .datagrid-filters .search-filter{max-width:100%!important}.grid-container .grid-top .datagrid-filters .filter-left,.grid-container .grid-top .datagrid-filters .filter-right{display:grid;grid-template-columns:49.5% 49%;-moz-column-gap:5px;column-gap:5px}.grid-container .grid-top .datagrid-filters .filter-right{width:100%}.grid-dropdown-header{min-width:122px}}*{box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:focus{outline:none}.mb-10{margin-bottom:10px}.mb-15{margin-bottom:15px}.mb-20{margin-bottom:20px}.mb-25{margin-bottom:25px}.mb-30{margin-bottom:30px}.mb-35{margin-bottom:35px}.mb-40{margin-bottom:40px}.mb-45{margin-bottom:45px}.mb-50{margin-bottom:50px}.mb-60{margin-bottom:60px}.mb-70{margin-bottom:70px}.mb-80{margin-bottom:80px}.mb-90{margin-bottom:90px}.mt-5{margin-top:5px}.mt-10{margin-top:10px}.mt-15{margin-top:15px}.mt-20{margin-top:20px}.mt-25{margin-top:25px}.mt-30{margin-top:30px}.mt-35{margin-top:35px}.mt-40{margin-top:40px}.mt-45{margin-top:45px}.mt-50{margin-top:50px}.mt-60{margin-top:60px}.mt-70{margin-top:70px}.mt-80{margin-top:80px}.mt-90{margin-top:90px}body{letter-spacing:-.26px;line-height:19px}a:active,a:focus,a:hover,a:link,a:visited{text-decoration:none;color:#0041ff}::-moz-selection{background-color:rgba(0,64,255,.6);color:#fff}::selection{background-color:rgba(0,64,255,.6);color:#fff}textarea{resize:none}ul{margin:0;padding:0;list-style:none}h1{font-size:28px;margin-top:0}h1,h2{color:#3a3a3a}h2{font-size:24px}h3{font-size:20px}h3,h4{color:#3a3a3a}h4{font-size:16px}h5{font-size:12px;color:#3a3a3a}.hide{display:none!important}.row{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.btn{box-shadow:0 1px 4px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.1);border-radius:3px;border:none;color:#fff;cursor:pointer;transition:.2s cubic-bezier(.4,0,.2,1);font:inherit;display:inline-block}.btn:active,.btn:focus,.btn:hover{opacity:.75;border:none}.btn.btn-sm{padding:6px 12px}.btn.btn-md{padding:8px 16px}.btn.btn-lg{padding:10px 20px}.btn.btn-xl{padding:12px 24px;font-size:16px}.btn.btn-primary{background:#0041ff;color:#fff}.btn.btn-black{background:#000;color:#fff}.btn.btn-white{background:#fff;color:#000}.btn:disabled,.btn[disabled=disabled],.btn[disabled=disabled]:active,.btn[disabled=disabled]:hover{cursor:not-allowed;background:#b1b1ae;box-shadow:none;opacity:1}.dropdown-btn{min-width:150px;text-align:left;background:#fff;border:2px solid #c7c7c7;border-radius:3px;font-size:14px;padding:8px 35px 8px 10px;cursor:pointer;position:relative}.dropdown-btn:active,.dropdown-btn:focus,.dropdown-btn:hover{opacity:.75;border:2px solid #c7c7c7}.dropdown-btn .icon{position:absolute;right:10px;top:50%;margin-top:-4px}.dropdown-toggle{cursor:pointer}.dropdown-open{position:relative}.dropdown-list{width:200px;margin-bottom:20px;box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);border-radius:3px;background-color:#fff;position:absolute;display:none;z-index:10;text-align:left}.dropdown-list.bottom-left{top:42px;left:0}.dropdown-list.bottom-right{top:42px;right:0}.dropdown-list.top-left{bottom:0;left:42px}.dropdown-list.top-right{bottom:0;right:42px}.dropdown-list .search-box{padding:20px;border-bottom:1px solid #e8e8e8}.dropdown-list .search-box .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:100%;height:36px;display:inline-block;vertical-align:middle;transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px}.dropdown-list .search-box .control:focus{border-color:#0041ff}.dropdown-list .dropdown-container{padding:20px;overflow-y:auto}.dropdown-list .dropdown-container label{font-size:15px;display:inline-block;text-transform:uppercase;color:#9e9e9e;font-weight:700;padding-bottom:5px}.dropdown-list .dropdown-container ul{margin:0;list-style-type:none;padding:0}.dropdown-list .dropdown-container ul li{padding:5px 0}.dropdown-list .dropdown-container ul li a:active,.dropdown-list .dropdown-container ul li a:focus,.dropdown-list .dropdown-container ul li a:link,.dropdown-list .dropdown-container ul li a:visited{color:#3a3a3a;display:block}.dropdown-list .dropdown-container ul li a:hover{color:#0041ff}.dropdown-list .dropdown-container ul li .checkbox{margin:0}.dropdown-list .dropdown-container ul li .control-group label{color:#3a3a3a;font-size:15px;font-weight:500;text-transform:capitalize;width:100%}.dropdown-list .dropdown-container .btn{width:100%;margin-top:10px}.notification{width:400px;margin-bottom:20px;box-shadow:0 2px 4px 0 rgba(0,0,0,.16),0 0 9px 0 rgba(0,0,0,.16);border-radius:3px;background-color:#fff;position:absolute;display:none;z-index:10;text-align:left;border-radius:10px}.notification.bottom-left{top:42px;left:0}.notification.bottom-right{top:42px;right:0}.notification.top-left{bottom:0;left:42px}.notification.top-right{bottom:0;right:42px}.notification .dropdown-container{padding:0;overflow-y:auto}.notification .dropdown-container label{font-size:15px;display:inline-block;text-transform:uppercase;color:#9e9e9e;font-weight:700;padding-bottom:5px}.notification .dropdown-container ul{margin:0;list-style-type:none;padding:0}.notification .dropdown-container ul .read{color:rgba(58,58,58,.5)}.notification .dropdown-container ul .read .notif-content>a{text-decoration:none;color:rgba(58,58,58,.5)}.notification .dropdown-container ul .read .notif-content>a:hover{color:rgba(58,58,58,.5)}.notification .dropdown-container ul li{padding:16px 10px;border-bottom:1px solid #c7c7c7}.notification .dropdown-container ul li a:active,.notification .dropdown-container ul li a:focus,.notification .dropdown-container ul li a:link,.notification .dropdown-container ul li a:visited{color:#3a3a3a;display:block}.notification .dropdown-container ul li a:hover{color:#0041ff}.notification .dropdown-container ul li .checkbox{margin:0}.notification .dropdown-container ul li .control-group label{color:#3a3a3a;font-size:15px;font-weight:500;text-transform:capitalize;width:100%}.notification .dropdown-container ul .bottom-li{border-bottom:none!important;color:#3a3a3a;display:flex;justify-content:space-between}.notification .dropdown-container ul .bottom-li a{display:initial;color:#3a3a3a!important}.notification .dropdown-container .btn{width:100%;margin-top:10px}.section .secton-title{font-size:18px;color:#3a3a3a;padding:15px 0;border-bottom:1px solid #e8e8e8}.section .section-content{display:block;padding:20px 0}.section .section-content .row{display:block;padding:7px 0}.section .section-content .row .title{width:200px}.section .section-content .row .title,.section .section-content .row .value{color:#3a3a3a;letter-spacing:-.26px;display:inline-block}.table{width:100%}.table .table-responsive{overflow-x:auto;width:100%}.table .table-responsive::-webkit-scrollbar{height:5px!important}.table .table-responsive::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px #c8c8c8!important}.table .table-responsive::-webkit-scrollbar-thumb{border-radius:10px!important;background-color:#fff!important;-webkit-box-shadow:inset 0 0 6px rgba(90,90,90,.7)!important}.table table{border-collapse:collapse;text-align:left;width:100%}.table table thead th{font-weight:700;padding:12px 10px;background:#f8f9fa;color:#3a3a3a}.table table tbody td{padding:10px;border-bottom:1px solid #d3d3d3;color:#3a3a3a;vertical-align:top}.table table tbody td.actions .action{display:inline-flex}.table table tbody td.actions .icon{cursor:pointer;vertical-align:middle}.table table tbody td.empty{text-align:center}.table table tbody tr:last-child td{border-bottom:none}.table .control-group{width:100%;margin-bottom:0;min-width:140px}.table .control-group .control{width:100%;margin:0}.pagination .page-item{background:#fff;border:2px solid #c7c7c7;border-radius:3px;padding:7px 14px;margin-right:5px;font-size:16px;display:inline-block;color:#3a3a3a;vertical-align:middle;text-decoration:none}.pagination .page-item.next,.pagination .page-item.previous{padding:6px 9px}.pagination .page-item.active{background:#0041ff;color:#fff;border-color:#0041ff}.pagination .page-item .icon{vertical-align:middle;margin-bottom:3px}.checkbox{position:relative;display:block}.checkbox input{left:0;opacity:0;position:absolute;top:0;height:24px;width:24px;z-index:100}.checkbox .checkbox-view{background-image:url(../images/Checkbox.svg);height:24px;width:24px;display:inline-block!important;vertical-align:middle;margin:0 5px 0 0}.checkbox input:checked+.checkbox-view{background-image:url(../images/Checkbox-Checked.svg)}.checkbox input:disabled+.checkbox-view{opacity:.5;cursor:not-allowed}.radio{position:relative;display:block;margin:10px 5px 5px 0}.radio input{left:-4px;opacity:0;position:absolute;top:-1px;z-index:100}.radio .radio-view{background-image:url(../images/controls.svg);background-position:-21px 0;height:20px;width:20px;display:inline-block!important;vertical-align:middle;margin:0 5px 0 0}.radio input:checked+.radio-view{background-position:-21px -21px}.radio input:disabled+.radio-view{opacity:.5;cursor:not-allowed}.rtl .radio input{left:unset;right:1px}.control-group{margin-bottom:25px;font-size:15px;width:750px;max-width:100%;position:relative}.control-group,.control-group label{display:block;color:#3a3a3a}.control-group label.required:after{content:"*";color:#fc6868;font-weight:700;display:inline-block}.control-group textarea.control{height:100px;padding:10px}.control-group .control{background:#fff;border:2px solid #c7c7c7;border-radius:3px;width:70%;height:36px;display:inline-block;vertical-align:middle;transition:.2s cubic-bezier(.4,0,.2,1);padding:0 10px;font-size:15px;margin-top:10px;margin-bottom:5px}.control-group .control:focus{border-color:#0041ff}.control-group .control[disabled=disabled]{border-color:#d3d3d3;background-color:#d3d3d3;cursor:not-allowed}.control-group .control[multiple]{height:100px}.control-group.date .control,.control-group.datetime .control{padding-right:40px}.control-group.date:after,.control-group.datetime:after{background-image:url(../images/Icon-Calendar.svg);width:24px;height:24px;content:"";display:inline-block;vertical-align:middle;margin-left:-34px;pointer-events:none;position:absolute;top:51%}.control-group.date .cross-icon,.control-group.datetime .cross-icon{position:absolute;cursor:pointer;margin-left:-54px;top:38px}.control-group.multi-select .control{padding:0}.control-group .control-info{display:block;font-size:14px;color:#6f6f6f;font-style:italic}.control-group .control-error{display:none;color:#fc6868;margin-top:5px}.control-group.has-error .control{border-color:#fc6868}.control-group.has-error .control-error{display:block}.control-group.has-error.date:after{margin-top:-12px}.control-group.price .currency-code{vertical-align:middle;display:inline-block}.table .control-group.date:after,.table .control-group.datetime:after{top:6px;left:100%}.table .control-group.has-error.date.date:after,.table .control-group.has-error.date.datetime:after{top:18px}.rtl .control-group.date .control,.rtl .control-group.datetime .control{padding-left:40px;padding-right:10px}.rtl .control-group.date:after,.rtl .control-group.datetime:after{margin-right:-34px;right:70%}.rtl .control-group.date .cross-icon,.rtl .control-group.datetime .cross-icon{margin-right:-54px;top:38px}.rtl .table .control-group.date:after,.rtl .table .control-group.datetime:after{right:unset!important;left:auto}.control-group .switch{position:relative;display:inline-block;width:60px;height:34px;margin-top:10px;margin-bottom:5px}.control-group .switch input{opacity:0;width:0;height:0}.control-group .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#8e8e8e;transition:.2s}.control-group .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;transition:.2s}.control-group input:checked+.slider{background-color:#0041ff}.control-group input:focus+.slider{box-shadow:0 0 1px #0041ff}.control-group input:checked+.slider:before{transform:translateX(26px)}.control-group .slider.round{border-radius:34px}.control-group .slider.round:before{border-radius:50%}.button-group{margin-top:20px;margin-bottom:20px}.alert-wrapper{width:300px;top:10px;right:10px;position:fixed;z-index:100;text-align:left}.alert-wrapper .alert{width:300px;padding:15px;border-radius:3px;display:inline-block;box-shadow:0 4px 15.36px .64px rgba(0,0,0,.1),0 2px 6px 0 rgba(0,0,0,.12);position:relative;-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;transform-origin:center top;z-index:500;margin-bottom:10px}.alert-wrapper .alert.alert-error{background:#fc6868}.alert-wrapper .alert.alert-info{background:#204d74}.alert-wrapper .alert.alert-success{background:#4caf50}.alert-wrapper .alert.alert-warning{background:#ffc107}.alert-wrapper .alert .icon{position:absolute;right:10px;top:10px;cursor:pointer}.alert-wrapper .alert p{color:#fff;margin:0;padding:0;font-size:14px}.tabs ul{border-bottom:1px solid #e8e8e8}.tabs ul li{display:inline-block}.tabs ul li a{padding:15px 20px;cursor:pointer;margin:0 2px;text-align:center;color:#000311;display:block}.tabs ul li.active a{border-bottom:3px solid #0041ff}.accordian,accordian{display:inline-block;width:100%}.accordian .accordian-header,.accordian div[slot*=header],accordian .accordian-header,accordian div[slot*=header]{width:100%;display:inline-block;font-size:18px;color:#3a3a3a;border-top:1px solid #e8e8e8;border-bottom:1px solid #e8e8e8;padding:20px 15px;cursor:pointer;margin-top:-1px}.accordian .accordian-header .expand-icon,.accordian div[slot*=header] .expand-icon,accordian .accordian-header .expand-icon,accordian div[slot*=header] .expand-icon{background-image:url(../images/Expand-Light.svg);margin-right:10px;margin-top:3px}.accordian .accordian-header h1,.accordian div[slot*=header] h1,accordian .accordian-header h1,accordian div[slot*=header] h1{margin:0;font-size:20px;font-weight:500;display:inline-block}.accordian .accordian-header .icon,.accordian div[slot*=header] .icon,accordian .accordian-header .icon,accordian div[slot*=header] .icon{float:right}.accordian .accordian-header .icon.left,.accordian div[slot*=header] .icon.left,accordian .accordian-header .icon.left,accordian div[slot*=header] .icon.left{float:left}.accordian.error .accordian-header,accordian.error .accordian-header{color:#ff5656}.accordian .accordian-content,.accordian div[slot*=body],accordian .accordian-content,accordian div[slot*=body]{width:100%;padding:20px 15px;display:none;transition:all .3s ease}.accordian.active>.accordian-content,accordian.active>.accordian-content{display:inline-block}.accordian.active>.accordian-header .expand-icon,accordian.active>.accordian-header .expand-icon{background-image:url(../images/Expand-Light-On.svg)}.tree-container .tree-item{padding-left:30px;display:inline-block;margin-top:10px;width:100%}.tree-container .tree-item>.tree-item{display:none}.tree-container .tree-item.active>.tree-item{display:inline-block}.tree-container .tree-item .checkbox,.tree-container .tree-item .radio{margin:0;display:inline-block}.tree-container .tree-item .expand-icon{display:inline-block;margin-right:10px;cursor:pointer;background-image:url(../images/Expand-Light.svg);width:18px;height:18px;vertical-align:middle}.tree-container .tree-item .folder-icon{vertical-align:middle;margin-right:10px}.tree-container .tree-item.active>.expand-icon{background-image:url(../images/Expand-Light-On.svg)}.tree-container>.tree-item{padding-left:0}.panel{box-shadow:0 2px 25px 0 rgba(0,0,0,.15);border-radius:5px;background:#fff}.panel .panel-content{padding:20px}modal{display:none}.modal-open{overflow:hidden}.modal-overlay{display:none;overflow-y:auto;z-index:10;top:0;right:0;bottom:0;left:0;position:fixed;background:#000;opacity:.7}.modal-open .modal-overlay{display:block}.modal-container{background:#fff;top:100px;width:600px;max-width:80%;left:50%;margin-left:-300px;position:fixed;z-index:11;box-shadow:0 15px 25px 0 rgba(0,0,0,.03),0 20px 45px 5px rgba(0,0,0,.2);-webkit-animation:fade-in-white .3s ease-in-out;animation:fade-in-white .3s ease-in-out;-webkit-animation:jelly .5s ease-in-out;animation:jelly .5s ease-in-out;border-radius:5px;overflow-y:auto;max-height:80%}.modal-container .modal-header{padding:20px}.modal-container .modal-header h3{display:inline-block;font-size:20px;color:#3a3a3a;margin:0}.modal-container .modal-header .icon{float:right;cursor:pointer}.modal-container .modal-body{padding:20px}.modal-container .modal-body .control-group .control{width:100%}@media only screen and (max-width:770px){.modal-container{max-width:80%;left:10%;margin-left:0}.control-group,.control-group .control{width:100%}}.label{background:#e7e7e7;border-radius:2px;padding:8px;color:#000311;display:inline-block}.label.label-sm{padding:5px}.label.label-md{padding:8px}.label.label-lg{padding:11px}.label.label-xl{padding:14px}.badge{border-radius:50px;color:#fff;padding:8px;white-space:nowrap}.badge.badge-sm{padding:5px}.badge.badge-md{padding:3px 10px}.badge.badge-lg{padding:11px}.badge.badge-xl{padding:14px}.badge.badge-success{background-color:#4caf50}.badge.badge-info{background-color:#0041ff}.badge.badge-danger{background-color:#fc6868}.badge.badge-warning{background-color:#ffc107}.image-wrapper{margin-bottom:20px;margin-top:10px;display:inline-block;width:100%}.image-wrapper .image-item{width:200px;height:200px;margin-right:20px;background:#f8f9fa;border-radius:3px;display:inline-block;position:relative;background-image:url(../images/placeholder-icon.svg);background-repeat:no-repeat;background-position:50%;margin-bottom:20px;float:left}.image-wrapper .image-item img.preview{width:100%;height:100%}.image-wrapper .image-item input{display:none}.image-wrapper .image-item .remove-image{background-image:linear-gradient(-180deg,rgba(0,0,0,.08),rgba(0,0,0,.24));border-radius:0 0 4px 4px;position:absolute;bottom:0;width:100%;padding:10px;text-align:center;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.24);margin-right:20px;cursor:pointer}.image-wrapper .image-item:hover .remove-image{display:block}.image-wrapper .image-item.has-image{background-image:none}.vue-swatches__trigger{border:1px solid #d3d3d3}.helper-container{display:block}.helper-container .group code{font-weight:700}.overlay-loader{position:fixed;z-index:11;top:50%;left:50%;margin-top:-24px;margin-left:-24px}.tooltip{display:block!important;z-index:10000}.tooltip .tooltip-inner{background:#000;color:#fff;border-radius:4px;padding:5px 10px 4px}.tooltip .tooltip-arrow{width:0;height:0;border-style:solid;position:absolute;margin:5px;border-color:#000;z-index:1}.tooltip[x-placement^=top]{margin-bottom:5px}.tooltip[x-placement^=top] .tooltip-arrow{border-width:5px 5px 0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;bottom:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=bottom]{margin-top:5px}.tooltip[x-placement^=bottom] .tooltip-arrow{border-width:0 5px 5px;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important;top:-5px;left:calc(50% - 5px);margin-top:0;margin-bottom:0}.tooltip[x-placement^=right]{margin-left:5px}.tooltip[x-placement^=right] .tooltip-arrow{border-width:5px 5px 5px 0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important;left:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.tooltip[x-placement^=left]{margin-right:5px}.tooltip[x-placement^=left] .tooltip-arrow{border-width:5px 0 5px 5px;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;right:-5px;top:calc(50% - 5px);margin-left:0;margin-right:0}.end-date:after,.start-date:after{background-image:url(../images/Icon-Calendar.svg);width:24px;height:24px;content:"";display:inline-block;vertical-align:middle;margin-left:-34px;pointer-events:none;position:absolute;top:43%}@media only screen and (max-width:414px){.notification{width:414px}}@media only screen and (max-width:411px){.notification{width:410px}}@media only screen and (max-width:393px){.notification{width:393px}}@media only screen and (max-width:390px){.notification{width:390px}}@media only screen and (max-width:375px){.notification{width:375px}}@media only screen and (max-width:360px){.notification{width:360px}}@media only screen and (max-width:320px){.notification{width:320px}}
\ No newline at end of file
diff --git a/packages/Webkul/Ui/publishable/assets/mix-manifest.json b/packages/Webkul/Ui/publishable/assets/mix-manifest.json
index 481b6e295..f3a54297f 100644
--- a/packages/Webkul/Ui/publishable/assets/mix-manifest.json
+++ b/packages/Webkul/Ui/publishable/assets/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/ui.js": "/js/ui.js?id=99de3c7f62be5fb50eaf",
-    "/css/ui.css": "/css/ui.css?id=cd88292a65dfcf07d879"
+    "/css/ui.css": "/css/ui.css?id=31bef3cce7a4a1b9e172"
 }
diff --git a/packages/Webkul/Ui/src/Resources/assets/sass/main/_icons.scss b/packages/Webkul/Ui/src/Resources/assets/sass/main/_icons.scss
index 095af5f9b..205cc2363 100755
--- a/packages/Webkul/Ui/src/Resources/assets/sass/main/_icons.scss
+++ b/packages/Webkul/Ui/src/Resources/assets/sass/main/_icons.scss
@@ -169,6 +169,8 @@
 .locale-icon-bold {
     @extend %menu-properties;
     background-image: url("../images/Local-Icon-bold.svg");
+    height: 26px;
+    width: 26px;
 }
 
 .store-icon {