@charset "UTF-8";
:root {
  --app-error-color: #f44336;
  --app-success-color: #4caf50;
  --app-info-color: #2196f3;
  --app-warning-color: #ff9800;
  --app-error-text-color: #611a15;
  --app-success-text-color: #1e4620;
  --app-info-text-color: #0d3c61;
  --app-warning-text-color: #663c00;
  --font-weight: normal;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --h1-font-size: 2rem;
  --h2-font-size: 1.5rem;
  --h3-font-size: 1.25rem;
  --h4-font-size: 1.125rem;
  --h5-font-size: 1rem;
  --h6-font-size: 0.875rem;
  --font-size-32: 2rem;
  --font-size-24: 1.5rem;
  --font-size-20: 1.25rem;
  --font-size-18: 1.125rem;
  --font-size-16: 1rem;
  --font-size-14: 0.875rem;
  --font-size-12: 0.75rem;
  --font-size-10: 0.625rem;
  --font-size-8: 0.5rem;
  --font-size: var(--font-size-14);
  --radius-2: 0.125rem;
  --radius-4: 0.25rem;
  --radius-6: 0.375rem;
  --radius-8: 0.5rem;
  --radius-10: 0.625rem;
  --radius-rounded: 50%;
  --shadow-sm: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 8px rgba(0, 0, 0, .1);
  --shadow-md: 0 1px 8px rgba(0, 0, 0, .1), 0 8px 24px rgba(0, 0, 0, .15);
  --shadow-lg: 0 1px 8px rgba(0, 0, 0, .1), 0 16px 48px rgba(0, 0, 0, .1), 0 24px 60px rgba(0, 0, 0, .1);
  --transition-bounce: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  --transition-ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
  --transition-ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  --transition-ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
  --zindex-dropdown:          1000;
  --zindex-sticky:            1020;
  --zindex-fixed:             1030;
  --zindex-modal-backdrop:    1040;
  --zindex-modal:             1050;
  --zindex-popover:           1060;
  --zindex-tooltip:           1070;
}

[data-theme="themeDefault"] {
  --app-theme-color: #0a78be;
  --app-theme-color-rgb: 10, 120, 190;
  --app-theme-color-dark: #0066a6;
  --app-theme-color-light: #d5ece0;
  --app-theme-color-lighter: #f3f7f9;
  --app-list-selected-bg: #e6f4ed;
  --app-theme-color-focus: rgba(83,185,135, .25);
}

[data-theme="themeBlue"] {
  --app-theme-color: #007bff;
  --app-theme-color-rgb: 0, 123, 255;
  --app-theme-color-dark: #0069d9;
  --app-theme-color-light: #e4f0fb;
  --app-theme-color-lighter: #f3f8fd;
  --app-list-selected-bg: #edf7ff;
  --app-theme-color-focus: rgba(0, 123, 255, .25);
}

[data-theme="themeRed"] {
  --app-theme-color: #ee6562;
  --app-theme-color-rgb: 238, 101, 98;
  --app-theme-color-dark: #e25855;
  --app-theme-color-light: #fbd8d6;
  --app-theme-color-lighter: #fdf4f3;
  --app-list-selected-bg: #fde8e7;
  --app-theme-color-focus: rgba(238, 101, 98, .25);
}

[data-sidebar="dark"] {
  --cpsidebar-background: #2a3042;
  --cpsidebar-icon-background: rgba(255,255,255,.05);
  --cpsidebar-right-border: #2a3042;
  --cpsidebar-text-color: #a6b0cf;
  --cpsidebar-text-hover-color: #fff;
  --cpsidebar-text-active-color: #fff;
  --cpsidebar-logo-text-color: #fff;
}

[data-sidebar="light"] {
  --cpsidebar-background: #fff;
  --cpsidebar-icon-background: #f5f6fa;
  --cpsidebar-right-border: #e7e7e7;
  --cpsidebar-logo-bottom-border: #e7e7e7;
  --cpsidebar-text-color: #6c757d;
  --cpsidebar-text-hover-color: var(--app-theme-color, #0a78be);
  --cpsidebar-text-active-color: var(--app-theme-color, #0a78be);
  --cpsidebar-logo-text-color: #000;
}

[data-mode="defaultMode"] {
  --app-bodybg: #f5f6fa;
  --app-bg: #FFF;
  --app-grey-light-bg: #f4f6f8;
  --app-text-color: #000;
  --app-black-text-color: #000;
  --app-dark-text-color: #333;
  --app-light-text-color: #666;
  --app-white-text-color: #fff;
  --app-border-dark-color: #ccc;
  --app-border-color: #d8d8d8;
  --app-border-light-color: #efefef;
  --app-list-border-color: #ededed;
  --app-list-hover-bg: #f4f6f8;
  --app-icon-color: #555;
  --app-icon-hover-color: #000;
  --app-grey-color: #808080;
  --app-disabled-color: rgba(0, 0, 0, 0.26);
  --app-disabled-bg: #e0e0e0;
  --app-separator-color: rgba(0, 0, 0, 0.26);
}

[data-mode="nightMode"] {
  --app-bodybg: #333;
  --app-bg: #2e2d29;
  --app-grey-light-bg: #f4f6f8;
  --app-text-color: #bbb;
  --app-black-text-color: #000;
  --app-dark-text-color: #333;
  --app-light-text-color: #666;
  --app-white-text-color: #fff;
  --app-border-dark-color: #ccc;
  --app-border-color: #4a4a4a;
  --app-border-light-color: #e5e5e5;
  --app-list-border-color: #f4f4f4;
  --app-list-hover-bg: #1a1917;
  --app-grey-color: #808080;
  --app-disabled-color: rgba(0, 0, 0, 0.26);
  --app-disabled-bg: #e0e0e0;
  --app-separator-color: rgba(0, 0, 0, 0.26);
  --cpsidebar-background: #1a1917;
  --cpsidebar-right-border: #1a1917;
  --cpsidebar-text-color: #bbb;
}

@font-face {
  font-family: "Proximanova Regular";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/proximanova-regular.woff") format("woff"), url("../fonts/proximanova-regular.woff2") format("woff2");
}

@font-face {
  font-family: "Proximanova Semibold";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/proximanova-semibold.woff") format("woff"), url("../fonts/proximanova-semibold.woff2") format("woff2");
}

@font-face {
  font-family: "Proximanova Bold";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/proximanova-bold.woff") format("woff"), url("../fonts/proximanova-bold.woff2") format("woff2");
}

@font-face {
  font-family: "CPFI";
  src: url("../fonts/CPFI.woff") format("woff"), url("../fonts/CPFI.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

[class^="cpi-"], [class*=" cpi-"] {
  font-family: 'CPFI' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 16px;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.cpi-rarrow:before {
  content: "\e900";
}

.cpi-larrow:before {
  content: "\e901";
}

.cpi-search:before {
  content: "\e902";
}

.cpi-track:before {
  content: "\e903";
}

.cpi-user:before {
  content: "\e904";
}

.cpi-wishlist:before {
  content: "\e905";
}

.cpi-cart:before {
  content: "\e906";
}

.cpi-cell:before {
  content: "\e907";
}

.cpi-close:before {
  content: "\e908";
}

.cpi-darrow:before {
  content: "\e909";
}

.cpi-star:before {
  content: "\e90a";
}

.cpi-quote:before {
  content: "\e90b";
}

.cpi-facebook:before {
  content: "\e90c";
}

.cpi-twitter:before {
  content: "\e90d";
}

.cpi-linkedin:before {
  content: "\e90e";
}

.cpi-pinterest:before {
  content: "\e90f";
}

.cpi-loarrow:before {
  content: "\e910";
}

.cpi-shopcart:before {
  content: "\e911";
}

.cpi-plus:before {
  content: "\e912";
}

.cpi-delete:before {
  content: "\e913";
}

.cpi-filter:before {
  content: "\e914";
}

.cpi-export:before {
  content: "\e915";
}

.cpi-print:before {
  content: "\e916";
}

.cpi-dots:before {
  content: "\e917";
}

.cpi-roarrow:before {
  content: "\e918";
}

.cpi-stock:before {
  content: "\e919";
}

.cpi-outstock:before {
  content: "\e91a";
}

.cpi-edit:before {
  content: "\e91b";
}

.cpi-import:before {
  content: "\e91c";
}

.cpi-tick:before {
  content: "\e91d";
}

.cpi-mail:before {
  content: "\e91e";
}

.cpi-eye:before {
  content: "\e91f";
}

.cpi-lock:before {
  content: "\e920";
}

.cpi-listview:before {
  content: "\e921";
}

.cpi-gridview:before {
  content: "\e922";
}

.cpi-dotfilter:before {
  content: "\e923";
}

.cpi-refresh:before {
  content: "\e924";
}

.cpi-checklist:before {
  content: "\e925";
}

.cpi-listing:before {
  content: "\e926";
}

.cpi-auser:before {
  content: "\e927";
}

.cpi-dollar:before {
  content: "\e928";
}

.cpi-wallet:before {
  content: "\e929";
}

.cpi-puzzles:before {
  content: "\e92a";
}

.cpi-nav:before {
  content: "\e92b";
}

.cpi-dashbboard:before {
  content: "\e92c";
}

.cpi-products:before {
  content: "\e92d";
}

.cpi-user:before {
  content: "\e92e";
}

.cpi-orders:before {
  content: "\e92f";
}

.cpi-notes:before {
  content: "\e930";
}

.cpi-notify:before {
  content: "\e931";
}

.cpi-reports:before {
  content: "\e932";
}

.cpi-setting:before {
  content: "\e933";
}

.cpi-help:before {
  content: "\e934";
}

.cpi-menu:before {
  content: "\e935";
}

.cpi-oupload:before {
  content: "\e936";
}

.cpi-copy:before {
  content: "\e937";
}

.cpi-minus:before {
  content: "\e938";
}

.cpi-logout:before {
  content: "\e939";
}

.cpi-pdf:before {
  content: "\e93a";
}

.cpi-excel:before {
  content: "\e93b";
}

.cpi-cvs:before {
  content: "\e93c";
}

.cpi-export:before {
  content: "\e93d";
}

.cpi-collapsePane:before {
  content: "\e93e";
}

.cpi-downarrow:before {
  content: "\e93f";
}

.cpi-star:before {
  content: "\e940";
}

.cpi-image:before {
  content: "\e941";
}

.cpi-location:before {
  content: "\e942";
}

.cpi-shop:before {
  content: "\e943";
}

.cpi-photo:before {
  content: "\e944";
}

.cpi-address:before {
  content: "\e945";
}

.cpi-timer:before {
  content: "\e946";
}

.cpi-upload:before {
  content: "\e947";
}

.cpi-download:before {
  content: "\e948";
}

.cpi-calendar:before {
  content: "\e949";
}

.cpi-happy:before {
  content: "\e94a";
}

.cpi-sad:before {
  content: "\e94b";
}

.cpi-mic:before {
  content: "\e94c";
}

.cpi-chat:before {
  content: "\e94d";
}

.cpi-flag:before {
  content: "\e94e";
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

*:focus {
  outline: none;
}

html, body {
  margin: 0;
  padding: 0;
  overflow: hidden;
  height: 100%;
  color: var(--app-text-color);
  font-size: var(--font-size-16);
  font-family: "Proximanova Regular";
  background-color: var(--app-bodybg);
}

html {
  font-size: 1rem;
}

a {
  color: var(--app-theme-color);
  text-decoration: none;
  -webkit-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

a:hover {
  color: var(--app-theme-color-dark);
}

ul {
  list-style: none;
  margin: 0;
}

html:not([dir]) ol {
  margin-right: 2.5rem;
}

html[dir='rtl'] ol {
  margin-left: 2.5rem;
}

ol li {
  list-style: decimal;
  padding: 0.375rem 0;
}

img {
  max-width: 100%;
  height: auto;
}

p {
  line-height: 1.58;
}

h1 {
  font-size: var(--h1-font-size);
}

h2 {
  font-size: var(--h2-font-size);
}

h3 {
  font-size: var(--h3-font-size);
}

h4 {
  font-size: var(--h4-font-size);
}

h5 {
  font-size: var(--h5-font-size);
}

h6 {
  font-size: var(--h6-font-size);
}

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.875rem;
}

::-moz-placeholder {
  /* Firefox 19+ */
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.875rem;
}

:-ms-input-placeholder {
  /* IE 10+ */
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.875rem;
}

:-moz-placeholder {
  /* Firefox 18- */
  color: rgba(0, 0, 0, 0.5);
  font-size: 0.875rem;
}

.bottom-border {
  border-bottom: 1px solid var(--app-border-light-color);
}

.cp-mainWrapper {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
  width: 100%;
  max-width: 100%;
  min-height: 100%;
}

.cp-mainWrapper:not(.layout-static) {
  max-height: 100%;
  height: 100%;
}

.cp-contentWrapper, .cp-contentWrapper > .cp-contentPanel {
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  -webkit-box-flex: 1;
  -moz-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
}

.fixed-pagehead .cp-contentWrapper, .fixed-pagehead .cp-contentWrapper > .cp-contentPanel {
  overflow-x: initial;
  overflow-y: initial;
}

.fixed-pagehead .cp-contentWrapper > .cp-contentPanel {
  height: calc(100% - 3.8125rem);
}

.fixed-pagehead .cp-main-content, .fixed-pagehead .card, .fixed-pagehead .card-inner {
  height: 100%;
}

.fixed-pagehead .cp-contentContainer {
  height: calc(100% - 3.9375rem);
}

.fixed-pagehead .cp-formMainWrap {
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
  height: 100%;
}

.fixed-pagehead .cp-formMainWrap .tab-content {
  -webkit-box-flex: 1;
  -moz-flex: 1;
  -ms-flex: 1;
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0.9375rem 0 1.25rem;
}

.cp-contentWrapper > .cp-contentPanel > .cp-main-content {
  box-sizing: border-box;
  padding: 1.5rem;
}

.cp-contentWrapper > .cp-contentPanel > .cp-main-content.no-padding {
  padding: 0 !important;
}

.cp-contentWrapper > .cp-contentPanel > .cp-main-content.pt0 {
  padding-top: 0;
}

.cp-contentWrapper > .cp-contentPanel > .cp-main-content.ptb0 {
  padding-top: 0;
  padding-bottom: 0;
}

.cp-page-titlecontainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.9375rem 0;
  height: auto;
}

.cp-page-titlecontainer .cp-pageTitleText {
  font-size: var(--font-size-20);
  line-height: 1;
  color: var(--app-theme-color);
  font-weight: 600;
}

html:not([dir]) .cp-page-titlecontainer .cp-btn-list > .btn {
  margin-left: 0.625rem;
}

html[dir='rtl'] .cp-page-titlecontainer .cp-btn-list > .btn {
  margin-right: 0.625rem;
}

.page-link {
  color: var(--app-theme-color);
}

.page-link:hover {
  color: var(--app-theme-color-dark);
}

.page-link:focus {
  box-shadow: 0 0 0 0.2rem rgba(83, 185, 135, 0.25);
}

.page-item.active .page-link {
  background-color: var(--app-theme-color);
  border-color: var(--app-theme-color);
}

.text-warning {
  color: var(--app-warning-color) !important;
}

.text-info {
  color: var(--app-info-color) !important;
}

.text-success {
  color: var(--app-success-color) !important;
}

.iconAct {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  font-size: var(--font-size-8);
  color: var(--app-light-text-color);
  -webkit-transition: 0.3s all ease-in-out;
  -ms-transition: 0.3s all ease-in-out;
  -moz-transition: 0.3s all ease-in-out;
  transition: 0.3s all ease-in-out;
  cursor: pointer;
}

.iconAct.size-m {
  width: 1.5rem;
  height: 1.5rem;
  font-size: var(--font-size-10);
}

.iconAct.size-l {
  width: 1.875rem;
  height: 1.875rem;
  font-size: var(--font-size-12);
}

.iconAct:hover {
  color: var(--app-dark-text-color);
}

.iconAct.themeCol:hover {
  color: var(--app-white-text-color);
}

.iconAct.themeCol.cp-iconHover:hover:after {
  background-color: var(--app-theme-color);
}

.cp-iconHover {
  position: relative;
}

.cp-iconHover:before {
  z-index: 2;
}

.cp-iconHover:after {
  content: '';
  position: absolute;
  z-index: 1;
  bottom: -0.3125rem;
  left: -0.3125rem;
  right: -0.3125rem;
  top: -0.3125rem;
  opacity: 0;
  border-radius: var(--radius-rounded, 50%);
  -webkit-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  -ms-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  -moz-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transform: scale(0);
  transition-property: transform,opacity;
}

.cp-iconHover:hover:after {
  background-color: var(--app-list-hover-bg);
  opacity: 1;
  transform: scale(0.8);
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th.dtr-control:before {
  display: none;
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td.dtr-control, table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th.dtr-control {
  padding-left: 15px;
}

.userrole {
  margin-right: 1rem;
}

.form-radio-label {
  display: inline-flex;
  margin-bottom: .5rem;
  align-items: center;
  justify-content: center;
}

.form-radio-label .form-radio-input {
  margin-right: 5px;
}

.password-wrapper {
  position: relative;
}

#showimg {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.help-block.error-help-block {
  color: red !important;
  font-size: 14px;
}

.has-error .form-control {
  border-color: red !important;
  color: red !important;
}

.dropify-wrapper .dropify-message p {
  font-size: 22px;
}

.import_result {
  display: block;
}

.import_result .form-group {
  margin-bottom: 0rem;
}

.import_result #success-alert {
  margin-bottom: 0.5rem;
}

.form-control.disabled_box {
  background-color: #f5f5f5;
  color: #191d20;
}

.br_circle {
  border-bottom: 1px solid #ddd;
  margin-bottom: 1rem;
  border-top: 1px solid #dddd;
  padding-top: 1rem;
}

.add_title {
  font-size: 16px;
}



/* Murugan Changes */
.divoverflow {
  overflow-x: unset !important;
  overflow-y: unset !important;
}

.text-red {
  color: red;
}

div.dataTables_wrapper span.select-info {
  display: none !important;
}

.cp-headerWrap {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0 1.5rem;
  background: var(--app-bg);
  border-bottom: 1px solid var(--app-border-color);
}

.cp-headerContainer {
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 3.75rem;
}

.cp-header-block {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
}

.cp-header-navList > ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
}

.cp-header-navList > ul > li {
  text-align: center;
  padding: 0.375rem 0;
  cursor: pointer;
  font-size: var(--font-size-20);
  color: var(--app-dark-text-color);
}

.cp-header-navList > ul > li:hover {
  color: var(--app-text-color);
}

.cp-proWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cp-proWrap .cp-proImg {
  width: 2.125rem;
  height: 2.125rem;
  border-radius: 0.25rem;
  line-height: 2.125rem;
  background-size: 100% 100%;
  display: inline-block;
  color: var(--app-white-text-color);
  font-size: var(--font-size-20);
  font-weight: bold;
  overflow: hidden;
}

.cp-proWrap .cp-proName {
  font-size: 0.875rem;
  padding: 0 0.625rem;
}

.cp-proWrap i {
  font-size: 0.5625rem;
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transform: rotate(90deg);
}

.cp-HLPanel {
  flex: 1;
}

.cp-pageTitle {
  padding: 0 0.9375rem;
  flex: 1;
}

.cp-pageTitle .cp-titleTxt {
  font-size: var(--font-size-20);
  margin: 0 0.3125rem;
}

.cp-footerWrap {
  background: var(--app-bg);
  border-top: 1px solid var(--app-border-color);
  padding: 0 1.5rem;
  min-height: 3.125rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--app-light-text-color);
}

@media (max-width: 767px) {
  [data-mode="nightMode"] .cp-headerWrap {
    background-color: #1a1917;
  }
  [data-mode="nightMode"] .cp-mobLogo .cp-proName {
    color: var(--app-white-text-color);
  }
  [data-mode="nightMode"] .cp-mobLogo .cp-proName span {
    color: var(--app-light-text-color);
  }
  .cp-headerWrap {
    padding: 0 0.9375rem;
  }
  .cp-mobileBrand {
    justify-content: flex-start;
    align-items: center;
    display: flex !important;
  }
  .cp-mobileBrand .cp-mobNav {
    display: inline-flex !important;
    justify-content: center;
    align-items: center;
    width: 1.875rem;
    height: 1.875rem;
  }
  .cp-mobileBrand .cp-mobNav i {
    font-size: var(--font-size-20);
  }
  .cp-mobileBrand .cp-mobLogo {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 3.75rem;
  }
  .cp-mobileBrand .cp-mobLogo .cp-logoIco {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 0.9375rem;
  }
  .cp-mobileBrand .cp-mobLogo .cp-logoIco i {
    font-size: var(--font-size-32);
    line-height: 3.0625rem;
    color: var(--app-theme-color);
  }
  .cp-mobileBrand .cp-mobLogo .cp-proName {
    font-size: var(--font-size-20);
    text-transform: uppercase;
    line-height: 1.3;
  }
  .cp-mobileBrand .cp-mobLogo .cp-proName span {
    display: block;
    font-size: var(--font-size-10);
    letter-spacing: 0.25rem;
    color: var(--app-light-text-color);
  }
  .cp-proWrap .cp-proName, .cp-proWrap i {
    display: none;
  }
}

[data-sidebar-toggle="collapsed"] .cp-sideLauncher {
  width: 4.375rem;
}

[data-sidebar-toggle="collapsed"] .header-menu {
  display: none;
}

[data-sidebar-toggle="collapsed"] .cp-sideLauncher-Nav li span {
  display: none;
}

[data-sidebar-toggle="collapsed"] .cp-collapseIco span {
  -webkit-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  -moz-transform: rotate(-180deg);
  transform: rotate(-180deg);
}

[data-sidebar-toggle="collapsed"] .cp-adminLogo .cp-proName {
  display: none;
}

html:not([dir]) [data-sidebar-toggle="collapsed"] .cp-adminLogo .cp-logoIco {
  margin-right: 0rem;
}

html[dir='rtl'] [data-sidebar-toggle="collapsed"] .cp-adminLogo .cp-logoIco {
  margin-left: 0rem;
}

[data-sidebar-toggle="collapsed"] .cp-sideLauncher-Nav .sidebar-dropdown > a:after {
  content: none;
}

.cp-sideLauncher {
  width: 16.25rem;
  -webkit-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  transition: all 0.2s ease;
  background-color: var(--cpsidebar-background);
  box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15);
  border-right: 1px solid var(--app-border-color);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-direction: normal;
  -webkit-box-orient: vertical;
}

.cp-sideLauncher-Nav {
  flex: 1 1 0;
  overflow-y: auto;
}

.cp-sideLauncher-Nav ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.cp-sideLauncher-Nav ul li a {
  display: inline-block;
  width: 100%;
  text-decoration: none;
  position: relative;
  padding: 0.625rem 1.25rem;
  font-size: var(--font-size-16);
  color: var(--cpsidebar-text-color);
  -webkit-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.cp-sideLauncher-Nav ul li a i {
  font-size: var(--font-size-16);
  width: 1.875rem;
  height: 1.875rem;
  line-height: 1.875rem;
  text-align: center;
  border-radius: 0.25rem;
  background: var(--cpsidebar-icon-background);
  display: inline-block;
}

.cp-sideLauncher-Nav ul li a > span {
  margin-left: 0.9375rem;
  display: inline-block;
}

.cp-sideLauncher-Nav ul li a span.label,
.cp-sideLauncher-Nav ul li a span.badge {
  float: right;
  margin-top: 0.5rem;
  margin-left: 0.3125rem;
}

.cp-sideLauncher-Nav ul li.header-menu span {
  font-size: var(--font-size-12);
  font-weight: 600;
  padding: 0.9375rem 1.25rem 0.3125rem 1.25rem;
  display: inline-block;
  width: 100%;
  color: var(--cpsidebar-text-color);
  text-transform: uppercase;
  pointer-events: none;
  cursor: default;
  letter-spacing: 0.03438rem;
}

.cp-sideLauncher-Nav ul li:hover > a {
  color: var(--cpsidebar-text-hover-color);
}

.cp-sideLauncher-Nav ul li.active > a {
  color: var(--cpsidebar-text-active-color);
}

.cp-sideLauncher-Nav .sidebar-dropdown > a:after {
  font-family: "CPFI";
  content: "\e900";
  display: inline-block;
  position: absolute;
  right: 1.875rem;
  top: 1.375rem;
  -webkit-transition: transform 0.3s ease;
  -ms-transition: transform 0.3s ease;
  -moz-transition: transform 0.3s ease;
  transition: transform 0.3s ease;
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  transform: rotate(0deg);
  font-size: var(--font-size-10);
}

.cp-sideLauncher-Nav .sidebar-dropdown .sidebar-submenu {
  overflow: hidden;
}

.cp-sideLauncher-Nav .sidebar-dropdown .sidebar-submenu ul {
  padding: 0.3125rem 0;
  margin: 0;
}

.cp-sideLauncher-Nav .sidebar-dropdown .sidebar-submenu li {
  padding-left: 2.8125rem;
  font-size: var(--font-size-14);
}

.cp-sideLauncher-Nav .sidebar-dropdown .sidebar-submenu li a:before {
  content: none;
  font-family: "CPFI";
  display: inline-block;
  margin-right: 0.625rem;
  font-size: var(--font-size-8);
}

.cp-sideLauncher-Nav .sidebar-dropdown .sidebar-submenu li a .badge,
.cp-sideLauncher-Nav .sidebar-dropdown .sidebar-submenu li a .label {
  float: right;
  margin-top: 0;
}

.cp-sideLauncher-Nav .sidebar-dropdown.active > a:after {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transform: rotate(90deg);
  right: 1.875rem;
}

.cp-sideLauncher .cp-collapseIco {
  opacity: 0.8;
  text-align: right;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  padding: 0.625rem 1.25rem;
}

.cp-sideLauncher .cp-collapseIco span {
  display: inline-block;
  cursor: pointer;
  font-size: var(--font-size-16);
  width: 1.875rem;
  height: 1.875rem;
  line-height: 1.875rem;
  text-align: center;
  color: var(--cpsidebar-text-color);
}

.cp-sideLauncher .cp-collapseIco:hover {
  opacity: 1;
}

.cp-adminLogo {
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 3.75rem;
}

.cp-adminLogo .cp-logoIco {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
}

html:not([dir]) .cp-adminLogo .cp-logoIco {
  margin-right: 0.9375rem;
}

html[dir='rtl'] .cp-adminLogo .cp-logoIco {
  margin-left: 0.9375rem;
}

.cp-adminLogo .cp-logoIco i {
  font-size: var(--font-size-32);
  line-height: 3.0625rem;
  color: var(--cpsidebar-logo-text-color);
}

.cp-adminLogo .cp-proName {
  font-size: var(--font-size-20);
  color: var(--cpsidebar-logo-text-color);
  text-transform: uppercase;
  line-height: 1.3;
}

.cp-adminLogo .cp-proName span {
  display: block;
  font-size: var(--font-size-10);
  color: var(--cpsidebar-text-color);
  letter-spacing: 0.25rem;
}

/*$Id:$*/
.cp-breadcrumb {
  padding: 0.625rem 0;
  display: inline-block;
  width: 100%;
}

.cp-breadcrumb ul li {
  display: inline-block;
}

.cp-breadcrumb ul li a {
  color: var(--app-text-color);
}

.cp-breadcrumb ul li a:hover {
  color: var(--app-theme-color);
}

.cp-breadcrumb ul li:before {
  font-family: 'CPFI';
  content: '\e910';
  vertical-align: top;
  display: inline-block;
  font-size: 8px;
  margin: 0.3125rem 0.625rem 0 0.5rem;
}

.cp-breadcrumb ul li:first-child:before {
  content: none;
}

.cp-breadcrumb ul li.active {
  color: var(--app-dark-text-color);
}

.cp-page-titlecontainer + .cp-breadcrumb {
  padding-top: 0;
}

.card {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: var(--app-bg);
  background-clip: border-box;
  border: 0 solid var(--app-border-color);
  border-radius: var(--radius-4);
}

.card.gutter-b {
  margin-bottom: 1.5rem;
}

.card.card-custom {
  -webkit-box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.05);
  box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.05);
  border: 0;
}

.card-inner {
  padding: 1.5rem;
}

.card-inner.pt0 {
  padding-top: 0;
}

.card-inner.pb0 {
  padding-bottom: 0;
}

.card-inner.p0 {
  padding: 0;
}

.card-bordered {
  border: 1px solid var(--app-border-color);
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: #f2f2f2;
}

.table-striped tbody tr:nth-of-type(even) {
  background-color: var(--app-bg);
}

.dataTables_wrapper {
  /*.dataTable{
		margin-bottom: 45px !important;
	}*/
}

.dataTables_wrapper .dt-button {
  text-transform: capitalize;
  outline: none;
  display: inline-block;
  zoom: 1;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 6px 12px;
  font-size: 13px;
  color: #000;
  line-height: 1.6;
  border-radius: 3px;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.dataTables_wrapper .dt-button.pl20 {
  padding-left: 20px;
}

.dataTables_wrapper .dt-button:hover, .dataTables_wrapper .dt-button:focus {
  text-decoration: none;
  outline: none;
}

.dataTables_wrapper .dt-button i {
  font-size: 12px;
}

.dataTables_wrapper .dt-button i.icon-prepend {
  margin-right: 6px;
}

.dataTables_wrapper .dt-button i.icon-append {
  margin-left: 6px;
}

.dataTables_wrapper .dt-button i.caret-icon {
  margin-left: 30px;
  position: relative;
  font-size: 10px;
}

.dataTables_wrapper .dt-button i.caret-icon:after {
  content: '';
  position: absolute;
  top: -10px;
  left: -12px;
  bottom: 0;
  width: 1px;
  height: 31px;
  background-color: rgba(255, 255, 255, 0.4);
}

.dataTables_wrapper .dt-buttons {
  margin-bottom: 15px;
}

.dataTables_wrapper button.dt-button.buttons-collection, .dataTables_wrapper button.dt-button.buttons-collection:hover, .dataTables_wrapper button.dt-button.buttons-collection:active, .dataTables_wrapper button.dt-button.buttons-collection:focus {
  background: var(--app-theme-color) !important;
  border-color: var(--app-theme-color) !important;
  color: #fff !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.dataTables_wrapper .dt-button-collection {
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
  padding: 0;
}

.dataTables_wrapper .dt-button-collection .dt-button {
  color: #000;
  border: none;
  background: #fff;
  box-shadow: none !important;
  text-shadow: none !important;
  margin-bottom: 0;
  border: none;
  text-align: left;
  padding: 8px 15px;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility {
  padding-bottom: 10px;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility span {
  padding-left: 28px;
  position: relative;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility span:after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 17px;
  height: 17px;
  border: 1px solid #999;
  border-radius: 2px;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility span:before {
  content: none;
  display: block;
  width: 9px;
  height: 5px;
  position: absolute;
  z-index: 2;
  top: 4.5px;
  left: 4px;
  border-bottom: 2px solid #fff;
  border-left: 2px solid #fff;
  transition: transform 0.2s ease;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active {
  background: none;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active span:after {
  border-color: var(--app-theme-color) !important;
  background-color: var(--app-theme-color) !important;
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility.active span:before {
  content: '';
  transform: rotate(-45deg) scale(1);
}

.dataTables_wrapper .dt-button-collection .dt-button.buttons-columnVisibility:hover {
  color: #000 !important;
  background-color: #f4f6f8 !important;
}

.dataTables_wrapper .dt-button-collection .dt-button:active, .dataTables_wrapper .dt-button-collection .dt-button:hover, .dataTables_wrapper .dt-button-collection .dt-button:focus {
  color: #fff !important;
  border: none !important;
  background: var(--app-theme-color) !important;
}

.dataTables_wrapper .dt-button-background {
  background: none;
}

.dataTables_wrapper .dataTables_length {
  float: left;
  margin: 0 10px;
}

.dataTables_wrapper .dataTables_info {
  padding-top: 6px;
  float: left;
}

.dataTables_wrapper td, .dataTables_wrapper th, .dataTables_wrapper .cp-toggleButton {
  vertical-align: middle;
}

.dataTables_wrapper .btn-link {
  text-transform: none;
}

.cp-TblAction .btn {
  padding: 6px;
  margin: 0 4px;
}

.cp-TblAction .btn i {
  font-size: 14px;
}

.cp-tblStatus {
  height: 17px;
  width: 17px;
  border: 1px solid transparent;
  border-radius: 50%;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.cp-tblStatus.disabled {
  color: #f44336;
  border-color: #f44336;
}

.cp-tblStatus.disabled i {
  font-size: 8px;
  line-height: normal;
}

.cp-tblStatus.visible {
  color: #5DB65B;
  border-color: #5DB65B;
}

.cp-tblStatus.visible i {
  font-size: 9px;
  line-height: normal;
}

.dtr-details .text-center {
  text-align: left !important;
}

.table-bordered thead td, .table-bordered thead th {
  border-bottom-width: 1px;
  border-top-width: 1px;
}

.DTFC_ScrollWrapper .DTFC_LeftHeadWrapper table, .DTFC_ScrollWrapper .DTFC_RightHeadWrapper table {
  margin: 6px 0 0 !important;
}

.DTFC_ScrollWrapper .DTFC_LeftHeadWrapper table tr:first-child td, .DTFC_ScrollWrapper .DTFC_RightHeadWrapper table tr:first-child td {
  border-top: none;
}

.DTFC_ScrollWrapper .DTFC_LeftBodyWrapper table, .DTFC_ScrollWrapper .DTFC_RightBodyWrapper table {
  margin: 0 !important;
  border-top: none;
}

.DTFC_ScrollWrapper .DTFC_LeftBodyWrapper table tr:first-child td, .DTFC_ScrollWrapper .DTFC_RightBodyWrapper table tr:first-child td {
  border-top: none;
}

.DTFC_ScrollWrapper .DTFC_RightBodyWrapper {
  border-right: 1px solid #dee2e6;
}

.DTFC_ScrollWrapper .DTFC_RightBodyWrapper table {
  border-right: 1px;
}

.DTFC_ScrollWrapper .DTFC_RightBodyWrapper table td {
  border-left: none;
}

.DTFC_ScrollWrapper .dataTables_scrollBody table {
  margin-bottom: 0 !important;
}

.cp-orderListingTbl .dataTables_info, .cp-orderListingTbl .dataTables_paginate {
  margin-top: 20px !important;
}

.table td {
  vertical-align: middle;
}

.table span .form-control {
  border-color: transparent;
  min-width: 5rem;
  max-width: 6.25rem;
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  font-size: var(--font-size-16);
  background-color: transparent;
}

.table span .form-control:focus {
  border-color: var(--app-theme-color);
}

/* Button CSS */
.btn {
  text-transform: uppercase;
  text-align: center;
  font-size: var(--font-size-14);
  border-radius: var(--radius-4);
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.btn i {
  font-size: var(--font-size-12);
}

html:not([dir]) .btn span + i {
  margin-left: 0.3125rem;
}

html[dir='rtl'] .btn span + i {
  margin-right: 0.3125rem;
}

html:not([dir]) .btn i + span {
  margin-left: 0.3125rem;
}

html[dir='rtl'] .btn i + span {
  margin-right: 0.3125rem;
}

.cp-backBtn {
  width: 1.6875rem;
  height: 1.6875rem;
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

html:not([dir]) .cp-backBtn {
  margin-right: 1.875rem;
}

html[dir='rtl'] .cp-backBtn {
  margin-left: 1.875rem;
}

.cp-backBtn:before {
  content: '';
  position: absolute;
  width: 0.0625rem;
  height: 100%;
  top: 0;
  right: -0.9375rem;
  bottom: 0;
  background: rgba(0, 0, 0, 0.1);
}

.cp-backBtn .cp-back-arrow {
  position: absolute;
  width: 0.75rem;
  height: 0.75rem;
  border: 2px solid var(--app-theme-color);
  transition: all .5s ease;
  top: 50%;
  left: 30%;
  transform: translateY(-50%) rotate(-45deg);
  border-right: none;
  border-bottom: none;
  cursor: pointer;
}

.cp-backBtn .cp-back-arrow:before {
  content: "";
  position: absolute;
  width: 1rem;
  height: 0.125rem;
  background: var(--app-theme-color);
  transform-origin: right;
  transform: rotate(45deg) translate(4px, 11px) scaleX(1);
  transition: all .5s ease;
}

.badge {
  display: inline-block;
  padding: 0.3125rem 0.5rem;
  font-size: var(--font-size-12);
  line-height: 1;
  text-align: center;
  color: var(--app-white-text-color);
}

.status-1 {
  background-color: #28D094;
}

.status-2 {
  background-color: #716ACA;
}

.status-3 {
  background-color: #FF4961;
}

.status-4 {
  background-color: #fec107;
}

.status-5 {
  background-color: #008ffa;
}

.status-6 {
  background-color: #ff9800;
}

.btn-primary, .btn-primary.disabled, .btn-primary:disabled {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color);
  border-color: var(--app-theme-color);
}

.btn-primary:hover, .btn-primary.disabled:hover, .btn-primary:disabled:hover {
  background-color: var(--app-theme-color-dark);
  border-color: var(--app-theme-color-dark);
}

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color-dark);
  border-color: var(--app-theme-color-dark);
}

.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem var(--app-theme-color-focus);
}

.btn-primary.focus, .btn-primary:focus {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color-dark);
  border-color: var(--app-theme-color-dark);
  box-shadow: 0 0 0 0.2rem var(--app-theme-color-focus);
}

.btn.focus, .btn:focus {
  box-shadow: 0 0 0 0.2rem var(--app-theme-color-focus);
}

.btn-outline-primary {
  color: var(--app-theme-color);
  border-color: var(--app-theme-color);
}

.btn-outline-primary:hover {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color);
  border-color: var(--app-theme-color);
}

.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color);
  border-color: var(--app-theme-color);
}

.btn-outline-primary.focus, .btn-outline-primary:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show > .btn-outline-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem var(--app-theme-color-focus);
}

.btn-link {
  color: var(--app-theme-color);
}

.btn-link:hover {
  color: var(--app-theme-color-dark);
}

.cp-forminnerBox {
  padding: 0 1.25rem;
}

.valid-feedback, .invalid-feedback {
  font-size: var(--font-size-14);
}

input[type=text], input[type=password], textarea {
  background-color: transparent;
  display: inline-block;
  font-size: var(--font-size-14);
  border: 1px solid var(--app-border-color);
  color: var(--app-text-color);
  padding: 0.5625rem 0.625rem 0.5rem;
  border-radius: var(--radius-4);
  width: 100%;
  height: auto;
}

input[type=text]:focus, input[type=password]:focus, textarea:focus, .form-control:focus {
  border-color: var(--app-theme-color);
  box-shadow: 0 0 0 0.2rem var(--app-theme-color-focus);
}

.cp-formContent {
  margin: 1.875rem 0 1.25rem;
}

.cp-formContent h5 {
  flex-basis: 100%;
  margin-bottom: 0.625rem;
}

.cp-formContent label {
  text-align: left;
  font-weight: 700;
}

.cp-formContent .small, .cp-formContent small {
  font-size: var(--font-size-14);
  padding-top: 0.625rem;
}

.cp-formContent .input-group-text {
  font-size: var(--font-size-14);
}

.cp-formContent .delete-option {
  width: 2.375rem;
  height: 2.375rem;
}

.cp-formContent .delete-option i {
  font-size: var(--font-size-16);
}

.cp-fromBtn {
  padding-top: 1.5rem;
}

.cp-fromBtn.px-24 {
  padding: 0 1.5rem 1.5rem;
}

textarea {
  resize: none;
}

.cp-reportrange {
  background: var(--app-bg);
  cursor: pointer;
  border: 1px solid var(--app-border-color);
  width: 15rem;
  border-radius: var(--radius-4);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.cp-reportrange span {
  font-size: var(--font-size-14);
  line-height: 1;
  padding: 0.5rem 0;
  flex: 1;
}

html:not([dir]) .cp-reportrange span {
  padding-left: 0.5rem;
}

html[dir='rtl'] .cp-reportrange span {
  padding-right: 0.5rem;
}

.cp-reportrange .cpi-calendar {
  font-size: var(--font-size-14);
  line-height: 34px;
  padding: 0 0.625rem;
  background-color: #e9ecef;
  border-right: 1px solid var(--app-border-color);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.cp-reportrange .cpi-downarrow {
  font-size: var(--font-size-12);
  padding: 0 0.5rem;
}

.daterangepicker .ranges li.active {
  background-color: var(--app-theme-color);
}

.daterangepicker td.active, .daterangepicker td.active:hover {
  background-color: var(--app-theme-color) !important;
}

.daterangepicker td.in-range {
  background-color: var(--app-theme-color-lighter);
}

.daterangepicker td.off, .daterangepicker td.off.in-range, .daterangepicker td.off.start-date, .daterangepicker td.off.end-date {
  background-color: var(--app-white-text-color) !important;
}

@media only screen and (max-width: 767px) {
  .cp-formContent {
    margin: 0.625rem 0 1.25rem;
  }
}

/*$Id:$*/
.cp-dropdown {
  width: 100%;
  display: inline-block;
  background-color: #fff;
  border-radius: var(--radius-4);
  border: 1px solid var(--app-border-color);
  -webkit-transition: 0.5s all ease;
  -ms-transition: 0.5s all ease;
  -moz-transition: 0.5s all ease;
  transition: 0.5s all ease;
  position: relative;
  font-size: var(--font-size-14);
  text-align: left;
}

.cp-dropdown:hover {
  border-color: var(--app-theme-color);
}

.cp-dropdown .cp-select {
  cursor: pointer;
  display: block;
  padding: 0.5625rem 0.625rem 0.5rem;
}

.cp-dropdown .cp-select > i {
  font-size: var(--font-size-10);
  color: var(--app-light-text-color);
  cursor: pointer;
  transition: all .3s ease-in-out;
  float: right;
  line-height: 1.375rem;
}

.cp-dropdown:active {
  background-color: var(--app-theme-color-lighter);
}

.cp-dropdown.active:hover,
.cp-dropdown.active {
  border-top-left-radius: var(--radius-4);
  border-top-right-radius: var(--radius-4);
  background-color: var(--app-theme-color-lighter);
}

.cp-dropdown.active {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-color: var(--app-theme-color);
}

.cp-dropdown.active .cp-select > i {
  transform: rotate(-180deg);
}

.cp-dropdown .cp-dropdown-menu {
  position: absolute;
  background-color: var(--app-bg);
  left: -1px;
  right: -1px;
  border: 1px solid var(--app-theme-color);
  border-top: 0;
  border-bottom-left-radius: var(--radius-4);
  border-bottom-right-radius: var(--radius-4);
  overflow: hidden;
  display: none;
  max-height: 10.125rem;
  overflow-y: auto;
  z-index: 9;
}

.cp-dropdown .cp-dropdown-menu li {
  padding: 0.625rem;
  -webkit-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
}

.cp-dropdown .cp-dropdown-menu {
  padding: 0;
  list-style: none;
}

.cp-dropdown .cp-dropdown-menu li:hover {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color);
}

.cp-dropdown .cp-dropdown-menu li:active {
  color: var(--app-white-text-color);
  background-color: var(--app-theme-color);
}

.circle-loader {
  margin-left: 5px;
  border: 2px solid rgba(0, 0, 0, 0.2);
  border-left-color: var(--app-theme-color);
  animation-name: loader-spin;
  animation-duration: 1s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  box-sizing: content-box;
}

.circle-loader,
.circle-loader:after {
  border-radius: 50%;
  width: 16px;
  height: 16px;
}

.sm-size.circle-loader, .sm-size.circle-loader:after {
  border-radius: 50%;
  width: 12px;
  height: 12px;
}

.md-size.circle-loader {
  border-width: 3px;
}

.md-size.circle-loader, .md-size.circle-loader:after {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}

.lg-size.circle-loader {
  border-width: 3px;
}

.lg-size.circle-loader, .lg-size.circle-loader:after {
  border-radius: 50%;
  width: 34px;
  height: 34px;
}

.load-complete {
  -webkit-animation: none;
  animation: none;
  border-color: var(--app-theme-color);
  transition: border 500ms ease-out;
}

.load-complete .checkmark {
  display: block;
}

.checkmark {
  display: none;
  box-sizing: content-box;
}

.checkmark.draw:after {
  opacity: 1;
  height: 8px;
  width: 4px;
  transform-origin: left top;
  border-right: 2px solid var(--app-theme-color);
  border-top: 2px solid var(--app-theme-color);
  content: '';
  left: 2px;
  top: 8px;
  position: absolute;
  animation-duration: 1.2s;
  animation-timing-function: ease;
  animation-name: checkmark;
  transform: scaleX(-1) rotate(135deg);
}

@keyframes loader-spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 4px;
    opacity: 1;
  }
  40% {
    height: 8px;
    width: 4px;
    opacity: 1;
  }
  100% {
    height: 8px;
    width: 4px;
    opacity: 1;
  }
}

.circle-loadingWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  cursor: default;
  pointer-events: none;
}

.circle-loadingWrap .circle-loadingBox {
  text-align: center;
}

.circle-loadingWrap span {
  display: block;
}

.cp-splitPanelWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-direction: normal;
  -webkit-box-orient: horizontal;
}

.cp-splitPanelLeft {
  width: 12.5rem;
  border-right: 1px solid var(--app-border-color);
}

.cp-splitPanelRight {
  -webkit-box-flex: 1;
  -moz-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.cp-splitPanelRight .cp-splitPanelHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.9375rem 1.5rem;
}

.cp-splitPanelRight .cp-splitPanelTitle h3 {
  margin-bottom: 0;
}

.cp-splitPanelRight .cp-splitPanelTitle p {
  color: var(--app-light-text-color);
  margin-bottom: 0;
}

.cp-splitPanelRight .cp-splitContent {
  padding: 1.5rem;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .cp-splitPanelRight .cp-splitPanelHeader {
    flex-direction: column;
    align-items: flex-start;
  }
  .cp-splitPanelRight .cp-splitPanelHeader .cp-splitAction {
    margin-top: 1.25rem;
  }
}

@media (max-width: 767px) {
  .cp-splitPanelRight .cp-splitPanelHeader {
    flex-direction: column;
    align-items: flex-start;
  }
  .cp-splitPanelRight .cp-splitPanelHeader .cp-splitAction {
    margin-top: 1.25rem;
  }
}

@media (max-width: 767px) and (orientation: portrait) {
  .cp-splitPanelWrap {
    flex-direction: column;
  }
  .cp-splitPanelLeft {
    width: 100%;
    border-right: 0;
    border-bottom: 1px solid var(--app-border-color);
  }
}

.address-container .address-heading {
  font-size: var(--font-size-18);
  font-weight: var(--font-weight-bold);
}

.address-container > ul > li {
  padding: 0.625rem 0 0.3125rem;
}

.address-container > ul > li label {
  cursor: pointer;
  display: block;
  margin-bottom: 0;
}

.address-container .addressBox {
  position: relative;
}

.address-container .addressBox .addressAction {
  position: absolute;
  top: 0.9375rem;
  right: 1.125rem;
  z-index: 10;
}

.address-container .addressBox .addressAction > span {
  opacity: 1;
  visibility: visible;
  margin: 0 0.3125rem;
  color: var(--app-light-text-color);
  transition: all 0.4s ease;
  cursor: pointer;
}

.address-container .addressBox .addressAction > span:hover {
  color: var(--app-theme-color);
}

.address-container input[type="radio"] {
  display: none;
}

.address-container input[type="radio"]:checked + .addressDetails {
  border-color: var(--app-theme-color);
  background-color: var(--app-theme-color-lighter);
}

.address-container input[type="radio"]:checked + .addressDetails .tickIcon:before, .address-container input[type="radio"]:checked + .addressDetails .tickIcon:after {
  opacity: 1;
  visibility: visible;
}

.address-container .addAddress {
  padding-top: 1.25rem;
  text-align: center;
}

.address-container.cp-shippingAddress {
  box-shadow: 0 0.25rem 0.5rem -0.1rem rgba(0, 32, 64, 0.05);
  border: 1px solid var(--app-border-light-color);
  padding: 0.9375rem 1.5rem 0.625rem;
  margin-bottom: 1.5rem;
}

.address-container.cp-shippingAddress > ul > li {
  padding: 0.625rem 0.625rem;
}

.addressDetails {
  border: 1px solid var(--app-border-color);
  padding: 0.625rem 0.9375rem;
  border-radius: var(--radius-4);
  line-height: 1.4;
  background-color: var(--app-bg);
  position: relative;
  transition: all 0.4s ease;
}

.addressDetails .tickIcon {
  position: absolute;
  width: 1.25rem;
  height: 1.25rem;
  right: -0.3125rem;
  top: -0.3125rem;
}

.addressDetails .tickIcon:before, .addressDetails .tickIcon:after {
  content: '';
  position: absolute;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}

.addressDetails .tickIcon:before {
  width: 0.5625rem;
  height: 0.3125rem;
  top: 0.375rem;
  right: 0.3125rem;
  z-index: 2;
  border-bottom: 2px solid var(--app-white-text-color);
  border-left: 2px solid var(--app-white-text-color);
  transform: rotate(-45deg);
}

.addressDetails .tickIcon:after {
  top: 0;
  right: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: var(--app-theme-color);
}

.addressDetails .addressHead {
  font-size: var(--font-size-16);
  padding-bottom: 0.3125rem;
  font-weight: var(--font-weight-bold);
}

.addressDetails .addressInfo ul li {
  padding: 0.3125rem 0;
}

.addressDetails .addressInfo .addressBadge .badge {
  font-size: var(--font-size-10);
  text-transform: uppercase;
}

html:not([dir]) .addressDetails .addressInfo .addressBadge .badge:not(:first-child) {
  margin-left: 0.125rem;
}

html[dir='rtl'] .addressDetails .addressInfo .addressBadge .badge:not(:first-child) {
  margin-right: 0.125rem;
}

.addressDetails .addressInfo .addressTxt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  align-items: center;
}

.addressDetails .addressInfo .addressTxt > span {
  flex-basis: 100%;
}

.addressDetails .addressInfo .addressTxt > span.addressName {
  flex-basis: auto;
  font-weight: var(--font-weight-bold);
}

.confirmMsg {
  font-size: var(--font-size-16);
  padding-bottom: 0.9375rem;
}

@media (max-width: 767px) {
  .addressDetails .addressInfo ul li {
    padding: 0.5rem 0;
  }
  .addressDetails .addressInfo .addressBadge {
    margin: 0;
  }
  .addressDetails .addressInfo .addressBadge .badge {
    font-size: var(--font-size-10);
    text-transform: uppercase;
    margin-bottom: 0.3125rem;
  }
  html:not([dir]) .addressDetails .addressInfo .addressBadge .badge:not(:first-child) {
    margin-left: 0rem;
  }
  html[dir='rtl'] .addressDetails .addressInfo .addressBadge .badge:not(:first-child) {
    margin-right: 0rem;
  }
  .addressDetails .addressInfo .addressTxt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    align-items: center;
  }
  .addressDetails .addressInfo .addressTxt > span {
    flex-basis: 100%;
  }
  .addressDetails .addressInfo .addressTxt > span.addressName {
    flex-basis: auto;
    font-weight: var(--font-weight-bold);
  }
}

@media (max-width: 767px) and (orientation: portrait) {
  .addressLbl {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

.sellerRating {
  padding: 0.75rem 0;
}

.sellerRating .ratingeProgress {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  margin-bottom: 0.625rem;
}

.sellerRating .ratingeProgress > span {
  flex-basis: 3.75rem;
  margin: 0 0.9375rem;
}

.sellerRating .ratingeProgress .progress {
  flex: 1;
}

.sellerRating .badge {
  font-size: var(--font-size-24);
  color: var(--app-white-text-color);
  font-weight: 200;
}

.sellerRating .badge i {
  font-size: var(--font-size-16);
  font-weight: 200;
}

.sellerRating .about-rating {
  font-size: var(--font-size-16);
  font-weight: 500;
  margin-top: 0.625rem;
}

.sellerRating .total-ratings {
  font-size: var(--font-size-16);
}

.ratingBox input[readonly] ~ .pm-rating li a {
  cursor: default;
}

.ratingBox input {
  display: none;
}

.pm-rating {
  height: 1.25rem;
  padding: 0px;
  margin: 0px;
}

.pm-rating li {
  list-style: none;
  float: left;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0px;
  margin: 0px;
}

.pm-rating li .hover:after {
  content: '★';
  color: #ffc000;
}

.pm-rating li .full:after {
  content: '★';
  color: #ffc000;
}

.pm-rating li a {
  display: block;
  position: relative;
}

.pm-rating li a span {
  text-indent: -999em;
  display: inline-block;
}

.pm-rating li a:after {
  content: '☆';
  position: absolute;
  width: 100%;
  height: 100%;
  color: #ffc000;
}

.cp-productReviews {
  margin-top: 1.5rem;
}

.cp-productReviews ul > li:not(:last-child) {
  margin-bottom: 0.625rem;
}

.cp-productReviews .ratingBox ul > li {
  margin-bottom: 0;
}

.cp-productReviews .box-review {
  box-shadow: 0 0.25rem 0.5rem -0.1rem rgba(0, 32, 64, 0.05);
  border: 1px solid var(--app-border-light-color);
  padding: 0.625rem 0.9375rem;
}

.cp-productReviews .box-review .ratingBox {
  display: inline-block;
  height: 1.125rem;
}

.cp-productReviews .box-review .ratingBox .cp-rating li {
  margin-bottom: 0;
}

.cp-productReviews .box-review .reviewName {
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-16);
}

.cp-productReviews .box-review .reviewTitle {
  font-weight: var(--font-weight-bold);
  padding-bottom: 0.3125rem;
}

.cp-productReviews .box-review .reviewDesc {
  line-height: 1.3;
}

.cp-productReviews .box-review .reviewDate {
  text-align: right;
}

.cp-productReviews .box-review .reviewDate p {
  display: inline-block;
  margin-bottom: 0;
  font-size: var(--font-size-12);
  color: var(--app-light-text-color);
}

.bg-custom {
  background-color: #ff9800 !important;
}

/*$Id:$*/
/* Custom Checkbox */
.cp-checkboxContainer {
  display: inline-block;
}

.cp-checkboxContainer.horizontal .cp-checkBox {
  margin-right: 1.25rem;
  display: inline-block;
}

.cp-checkBox {
  margin-bottom: 0.9375rem;
  position: relative;
}

.cp-checkBox a {
  text-decoration: none;
}

.cp-checkBox a:hover {
  text-decoration: underline;
}

.cp-checkBox input[type="checkbox"] {
  display: none;
}

.cp-checkBox label {
  padding-left: 1.75rem;
  display: inline-block;
  position: relative;
  cursor: pointer;
  top: 0 !important;
  left: 0;
  pointer-events: auto;
  user-select: none;
  box-sizing: border-box;
  margin-bottom: 0;
}

.cp-checkBox span {
  position: relative;
  width: 1.125rem;
  height: 1.125rem;
  display: inline-block;
  vertical-align: middle;
}

.cp-checkBox input[type="checkbox"] + label:before, .cp-checkBox input[type="checkbox"] + span:before {
  content: '';
  display: block;
  width: 1.125rem;
  height: 1.125rem;
  position: absolute;
  top: 0;
  left: 0;
  background: var(--app-bg);
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  border: 1px solid var(--app-border-color);
  transition: all 0.4s ease;
}

.cp-checkBox input[type="checkbox"] + label:after, .cp-checkBox input[type="checkbox"] + span:after {
  content: '';
  display: block;
  width: 0.5625rem;
  height: 0.3125rem;
  position: absolute;
  top: -0.125rem;
  left: 0.3125rem;
  bottom: 0;
  margin: auto;
  border-bottom: 2px solid var(--app-bg);
  border-left: 2px solid var(--app-bg);
  transform: rotate(-45deg) scale(0.2);
  transition: transform 0.2s ease;
}

.cp-checkBox input[type="checkbox"]:checked + label:before, .cp-checkBox input[type="checkbox"]:checked + span:before, .cp-checkBox input[type="checkbox"]:indeterminate + span:before {
  animation: cbx-scale 0.3s ease;
  background: var(--app-theme-color);
  border-color: var(--app-theme-color);
}

.cp-checkBox input[type="checkbox"]:checked + label:after, .cp-checkBox input[type="checkbox"]:checked + span:after {
  transform: rotate(-45deg) scale(1);
}

.cp-checkBox input[type="checkbox"]:indeterminate + span::after {
  width: 0.5625rem;
  height: 0.125rem;
  border: none;
  background: var(--app-white-text-color);
  top: 0;
  left: 0.3125rem;
  transform: rotate(0deg);
}

.table.dataTable .cp-checkBox {
  margin-bottom: 0;
}

.table.dataTable tr.selected {
  background-color: var(--app-list-selected-bg) !important;
}

.table.dataTable tr.selected td {
  background-color: var(--app-list-selected-bg) !important;
}

@-moz-keyframes cbx-scale {
  50% {
    transform: scale(1.1);
  }
}

@-webkit-keyframes cbx-scale {
  50% {
    transform: scale(1.1);
  }
}

@-o-keyframes cbx-scale {
  50% {
    transform: scale(1.1);
  }
}

@keyframes cbx-scale {
  50% {
    transform: scale(1.1);
  }
}

/*$Id:$*/
/* Custom Radio */
.cp-radioBoxContainer {
  display: block;
}

.cp-radioBoxContainer.horizontal .cp-radioBox {
  margin-right: 20px;
  display: inline-block;
}

.cp-radioBox {
  margin-bottom: 15px;
  position: relative;
}

.cp-radioBox a {
  color: var(--app-black-text-color);
  text-decoration: none;
}

.cp-radioBox a:hover {
  text-decoration: underline;
}

.cp-radioBox input[type="radio"] {
  display: none;
}

.cp-radioBox label {
  padding-left: 1.75rem;
  display: inline-block;
  line-height: 1.3;
  position: relative;
  cursor: pointer;
  color: var(--app-black-text-color);
  font-size: var(--font-size-14);
  top: 0 !important;
  left: 0;
  pointer-events: auto;
  user-select: none;
  box-sizing: border-box;
  vertical-align: middle;
  margin-bottom: 0;
}

.cp-radioBox input[type="radio"] + label:before {
  content: '';
  display: block;
  width: 1.125rem;
  height: 1.125rem;
  position: absolute;
  top: -2px;
  left: 0;
  background: var(--app-white-text-color);
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
  border: 1px solid var(--app-border-color);
  transition: all 0.4s ease;
}

.cp-radioBox input[type="radio"] + label:after {
  content: '';
  display: block;
  width: 0.625rem;
  height: 0.625rem;
  position: absolute;
  top: 2px;
  bottom: 0;
  left: 4px;
  border-radius: var(--radius-rounded, 50%);
  background-color: var(--app-theme-color);
  transform: scale(0);
  transition: transform 0.2s ease;
}

.cp-radioBox input[type="radio"]:checked + label:before {
  animation: rbx-scale 0.3s ease;
  background: var(--app-white-text-color);
  border-color: var(--app-theme-color);
}

.cp-radioBox input[type="radio"]:checked + label:after {
  transform: scale(1);
}

@-moz-keyframes rbx-scale {
  50% {
    transform: scale(1.1);
  }
}

@-webkit-keyframes rbx-scale {
  50% {
    transform: scale(1.1);
  }
}

@-o-keyframes rbx-scale {
  50% {
    transform: scale(1.1);
  }
}

@keyframes rbx-scale {
  50% {
    transform: scale(1.1);
  }
}

/* Toggle Button */
.cp-toggleButton {
  will-change: background-color;
  position: relative;
  display: inline-block;
  margin: 0;
  padding: 10px;
  width: 2.5rem;
  height: 1.25rem;
  border: none;
  cursor: pointer;
  box-shadow: inset 0 0 0 0 #E5E5E5;
  border-radius: 2rem;
  background-color: #eaeaea;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  -webkit-transition: background-color -webkit-ease-in-out .4s, box-shadow -webkit-ease-in-out .4s;
  transition: background-color ease .3s, box-shadow ease-in-out .3s;
}

.cp-toggleButton::after {
  content: "";
  will-change: transform;
  position: absolute;
  top: 1px;
  left: 1px;
  width: 1.125rem;
  height: 1.125rem;
  -webkit-box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.25), 0 3px 3px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.25), 0 3px 3px 0 rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  background-color: white;
  -webkit-transition: transform -webkit-cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.4s;
  transition: transform cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
}

.cp-toggleButton:checked {
  background-color: var(--app-theme-color);
  box-shadow: none;
}

.cp-toggleButton:checked::after {
  -webkit-transform: translateX(1.25rem);
  transform: translateX(1.25rem);
}

/*$Id:$*/
.zmw-tabContainer ul {
  border-bottom: 0 solid var(--app-border-color);
  padding: 0.625rem 0 0;
  margin-top: 0;
  margin-bottom: 0.625rem;
  position: relative;
}

.zmw-tabContainer ul li {
  display: inline-block;
  cursor: pointer;
  position: relative;
}

html:not([dir]) .zmw-tabContainer ul li:not(:last-child) {
  margin-right: 0.9375rem;
}

html[dir='rtl'] .zmw-tabContainer ul li:not(:last-child) {
  margin-left: 0.9375rem;
}

.zmw-tabContainer ul li:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  margin: auto;
  width: 0;
  height: 0.125rem;
  -webkit-transition: all 0.3s ease-out;
  -ms-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  background-color: var(--app-theme-color);
}

.zmw-tabContainer ul li span {
  display: inline-block;
  line-height: 1.75rem;
  padding: 0 0.3125rem 0;
  color: var(--app-dark-text-color);
  position: relative;
  -webkit-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.zmw-tabContainer ul li span span {
  font-size: var(--font-size-12);
  padding-bottom: 0;
  padding-top: 0;
}

.zmw-tabContainer ul li .zmwi-darrow {
  font-size: var(--font-size-10);
  vertical-align: middle;
}

html:not([dir]) .zmw-tabContainer ul li .zmwi-darrow {
  padding-right: 0.4375rem;
}

html[dir='rtl'] .zmw-tabContainer ul li .zmwi-darrow {
  padding-left: 0.4375rem;
}

.zmw-tabContainer ul li.active:before, .zmw-tabContainer ul li:hover:before {
  width: 100%;
}

.zmw-tabContainer ul li.active span, .zmw-tabContainer ul li:hover span {
  color: var(--app-theme-color);
}

.zmw-tabContainer ul li.active span {
  font-weight: var(--font-weight-bold);
}

/*$Id:$*/
.cp-progressMenu {
  padding: 2.5rem 0 1.5rem;
}

.cp-progressMenu ul {
  display: flex;
}

.cp-progressMenu .cp-progressNav {
  flex: 1 1 100%;
  position: relative;
  text-align: center;
}

.cp-progressMenu .cp-progressNav .cp-sticon {
  border-radius: 50%;
  color: var(--app-white-text-color);
  content: "";
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  line-height: 1.25rem;
  position: absolute;
  width: 1.25rem;
  height: 1.25rem;
  box-shadow: rgba(0, 0, 0, 0.15) 0 2px 6px;
  -webkit-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  z-index: 2;
  display: block;
  left: 0;
  right: 0;
  bottom: 1.75rem;
  margin: auto;
}

.cp-progressMenu .cp-progressNav .cp-sticon i {
  font-style: normal;
  -webkit-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.cp-progressMenu .cp-progressNav .cp-sticon:after {
  position: absolute;
  top: 0.375rem;
  left: 0.375rem;
  margin: auto;
  content: '';
  -webkit-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}

.cp-progressMenu .cp-progressNav .cp-stname {
  color: var(--app-light-text-color);
  font-size: var(--font-size-12);
  font-weight: var(--font-weight-bold);
  text-transform: uppercase;
}

.cp-progressMenu .cp-progressNav .cp-progress-bar {
  position: absolute;
  left: 50%;
  bottom: 2.25rem;
  width: 100%;
  height: 0.1875rem;
  margin-bottom: 0;
  margin: 0;
  display: block;
  overflow: hidden;
  background: #ececec;
}

.cp-progressMenu .cp-progressNav .cp-progress-bar:after {
  content: '';
  position: absolute;
  left: 0;
  width: 0;
  height: 0.1875rem;
  -webkit-transition: width .6s ease;
  -o-transition: width .6s ease;
  transition: width .6s ease;
  background-color: transparent;
}

.cp-progressMenu .cp-progressNav:last-child .cp-progress-bar {
  display: none;
}

.cp-progressMenu .cp-progressNav.in-disabled .cp-sticon, .cp-progressMenu .cp-progressNav.in-progress .cp-sticon {
  background-color: var(--app-grey-light-bg);
  animation: bounce .5s forwards;
  animation-delay: .8s;
}

.cp-progressMenu .cp-progressNav.in-disabled .cp-sticon i, .cp-progressMenu .cp-progressNav.in-progress .cp-sticon i {
  opacity: 0;
  visibility: hidden;
}

.cp-progressMenu .cp-progressNav.in-disabled .cp-sticon:after, .cp-progressMenu .cp-progressNav.in-progress .cp-sticon:after {
  color: var(--app-disabled-color);
  top: 0.4375rem;
  left: 0.4375rem;
  width: 0.375rem;
  height: 0.375rem;
  border: none;
  background: var(--app-disabled-color);
  border-radius: 50%;
}

.cp-progressMenu .cp-progressNav.in-progress .cp-stname {
  color: var(--app-text-color);
}

.cp-progressMenu .cp-progressNav.in-progress .cp-sticon {
  background-color: var(--app-theme-color);
}

.cp-progressMenu .cp-progressNav.in-progress .cp-sticon:after {
  color: var(--app-white-text-color);
  background: var(--app-white-text-color);
}

.cp-progressMenu .cp-progressNav.in-done .cp-stname {
  color: var(--app-text-color);
}

.cp-progressMenu .cp-progressNav.in-done .cp-progress-bar:after {
  width: 100%;
  background-color: var(--app-theme-color);
}

.cp-progressMenu .cp-progressNav.in-done .cp-sticon {
  animation: bounce .5s forwards;
  animation-delay: .5s;
  background-color: var(--app-theme-color);
}

.cp-progressMenu .cp-progressNav.in-done .cp-sticon i {
  opacity: 0;
  visibility: hidden;
}

.cp-progressMenu .cp-progressNav.in-done .cp-sticon:after {
  color: var(--app-white-text-color);
  width: 0.5625rem;
  height: 0.3125rem;
  border-bottom: 2px solid var(--app-white-text-color);
  transform: rotate(-45deg);
  border-left: 2px solid var(--app-white-text-color);
}

@keyframes bounce {
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}