/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */

html {
  color: #222;
  font-size: 0.5em;
  line-height: 1.4;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

.browserupgrade {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

.media-container img {
  max-width: 100%;
  max-height: 100%;
}

*:focus {
  outline: none;
}

/* ==========================================================================
    Author's custom styles
    ========================================================================== */

body {
  font-family: "Open Sans", sans-serif;
  background-color: #f5f6fa;
}

.mob-only {
  display: none;
}

.desk-only {
  display: block;
}

.h-divider {
  border-bottom: 1px solid #caccd0;
}

.fix-top-bar {
  position: fixed;
  z-index: 20;
  top: 0;
  left: 0;
  width: 100%;
}

.fix-top-bar .main-wrapper {
  padding: 0 15px;
  background-color: #ffffff;
  border-bottom: 1px solid #e2e4e8;
  box-shadow: 0px 2px 5px -5px rgb(0 0 0 / 0.3);
}

.fix-top-bar .section {
  height: 56px;
}

.fix-top-bar .brandig .media-container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.fix-top-bar .burger-menu {
  height: 56px;
  display: flex;
  align-items: center;
}

.fix-top-bar .menu-trigger {
  border: none;
  background-color: #fff;
  padding: 6px;
  border-radius: 5px;
  transition: 0.2s;
}

.fix-top-bar .menu-trigger:hover {
  background-color: #eceef5;
}

.fix-top-bar .menu-trigger .fi {}

.fix-top-bar .main-search {
  max-width: 680px;
  width: 100%;
  font-size: 16px;
}

.fix-top-bar .main-search form {
  display: flex;
  align-items: center;
  height: 100%;
}

.fix-top-bar .main-search .dash-search-input {
  height: 40px;
  box-sizing: border-box;
  padding: 0 5px;
  background-color: #f5f6fa;
  width: 100%;
  color: #000;
  border: 1px solid #c5c7ce;
  border-right: none;
  border-left: none;
}

.fix-top-bar .main-search .dash-search-select {
  height: 40px;
  box-sizing: border-box;
  border-radius: 5px 0 0 5px;
  padding: 0 5px;
  font-size: 0.8em;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
}

.fix-top-bar .main-search .dash-search-submit {
  height: 40px;
  box-sizing: border-box;
  border-radius: 0 5px 5px 0;
  border: 1px solid #c5c7ce;
  padding: 0 5px;
  border-left: none;
  background-color: #f5f6fa;
}

.fix-top-bar .main-search .dash-search-submit .fi {
  transition: 0.2s;
}

.fix-top-bar .main-search .dash-search-submit:hover .fi {
  color: #0083ff;
}

.fix-top-bar .user {}

.fix-top-bar .user .wrapper {
  cursor: pointer;
  display: flex;
  align-items: center;
}

.fix-top-bar .user .profile-image {}

.fix-top-bar .user .media-container {
  height: 42px;
  border-radius: 999px;
  overflow: hidden;
}

.fix-top-bar .user .name {
  font-size: 14px;
  font-weight: bold;
  margin-left: 5px;
}

.fix-top-bar .user .date {
  font-size: 12px;
  margin-left: 5px;
  color: #c3c6d2;
}

.profile-dropdown {}

.profile-dropdown ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile-dropdown li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.profile-dropdown a {
  display: flex;
  align-items: center;
  text-decoration: none;
  padding: 10px 15px;
  justify-content: space-between;
  transition: 0.2s;
}

.profile-dropdown a:hover {
  background-color: #f5f6fa;
}

.profile-dropdown a .fi {
  width: 16px;
  height: 16px;
  margin-right: 20px;
  color: #bec2d2;
  transition: 0.2s;
}

.profile-dropdown a:hover .fi {
  color: #0083ff;
}

.profile-dropdown a span {
  color: #565656;
}

.profile-dropdown .h-divider {
  border-bottom: 1px solid #caccd0;
}

.user .tippy-content {
  padding: 0;
}

.side-nav {
  position: fixed;
  padding-top: 56px;
  top: 0;
  left: 0;
  height: 100%;
  width: 220px;
  z-index: 19;
}

.side-nav .main-wrapper {
  height: 100%;
  background-color: #1c2c49;
  overflow-x: scroll;
}

.side-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.side-nav li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.side-nav .main-nav {
  padding: 15px 10px;
}

.side-nav .nav-structure {}

.side-nav .nav-structure li {}

.side-nav .nav-item {
  text-decoration: none;
  padding: 8px 5px;
  display: flex;
  align-items: center;
  font-weight: 600;
  transition: 0.2s;
  cursor: pointer;
  border-radius: 5px;
  color: #fff;
  font-size: 15px;
  margin-bottom: 5px;
}

.side-nav .nav-item .fi {
  height: 22px;
  width: 22px;
  margin-right: 5px;
  color: #92a6ca;
  transition: 0.2s;
}

.side-nav .nav-item:hover {
  background-color: #3f5782;
}

.side-nav .nav-item:hover .fi {
  color: #0083ff;
}

.side-nav .nav-item.selected {
  background-color: #0083ff;
}

.side-nav .nav-item.selected .fi {
  color: #000;
}

.side-nav .nav-item.active {
  background-color: #000;
  border-radius: 5px 5px 0 0;
  margin-bottom: 0;
}

.side-nav .acc-content {
  padding: 5px 0;
  background-color: #000;
  border-radius: 0 0 5px 5px;
  display: none;
}

.side-nav .active .acc-content {
  /* display: block; */
}

.side-nav .nav-item-child {
  text-decoration: none;
  padding: 6px 15px;
  display: flex;
  align-items: center;
  transition: 0.2s;
  cursor: pointer;
  color: #fff;
  font-size: 14px;
}

.side-nav .nav-item-child:hover {
  color: #0083ff;
}

.side-nav .nav-item-child.selected {
  color: #0083ff;
}

.side-nav .nav-item.has-child {
  position: relative;
}

.side-nav .nav-item.has-child .arrow {
  position: absolute;
  right: 5px;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.side-nav .nav-item.has-child.active .arrow {
  transform: rotate(180deg);
}

.page-content {
  padding-top: 56px;
  padding-left: 220px;
  width: calc(100% - 220px);
  display: flex;
  position: absolute;
  height: calc(100% - 56px);
}

.page-wrapper {
  width: 100%;
  position: relative;
  display: block;
  padding: 3rem;
  box-sizing: border-box;
}

.page-container {
  padding-bottom: 120px;
}

.main-wrapper {
  margin: 0 auto;
}

.main-wrapper.normal-w {
  max-width: 960px;
}

.main-wrapper.full-w {}

.page-header {}

.page-header .wrapper {
  background-color: #fff;
  box-shadow: 0 0 0 1px rgb(229, 230, 235), 0 1px 4px 0 rgb(229, 230, 235);
  padding: 1rem 1rem;
  border-radius: 5px;
  margin-bottom: 2rem;
  align-items: center;
}

.page-header .page-title {
  font-size: 2.4rem;
  font-weight: 600;
}

.page-header .header-bts-container {}

.page-header .header-bts-container {}

.page-header .header-bt {
  font-size: 2rem;
  height: 5rem;
  padding: 0 3rem;
  border-radius: 0.5rem;
  box-sizing: border-box;
  cursor: pointer;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  color: #1c2c49;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: 0.2s;
  margin-left: 1rem;
}

.page-header .header-bt.back {
  padding: 0 1rem;
  margin-right: 1rem;
}

.page-header .header-bt:hover {
  background: #0083ff;
  color: #fff;
  border: 1px solid #0083ff;
}

.page-header .header-bt.blue-bt {
  background: #0083ff;
  border: 1px solid #0083ff;
  box-shadow: none;
  color: #ffffff;
}

.page-header .header-bt.blue-bt:hover {
  background: #ebf5ff;
  border: 1px solid #0083ff;
  box-shadow: none;
  color: #0083ff;
}

.page-header .header-bt.green-bt {
  background: #4caf50;
  border: 1px solid #4caf50;
  box-shadow: none;
  color: #ffffff;
}

.page-header .header-bt.green-bt:hover {
  background: #e7f5e8;
  border: 1px solid #4caf50;
  box-shadow: none;
  color: #4caf50;
}

.alerts-container {}

.alerts-container .alert {
  padding: 1.5rem;
  font-size: 2rem;
  border-radius: 5px;
  background-color: #d7d9e2;
  border: 1px solid #a2a8c1;
  box-sizing: border-box;
  color: #000;
  margin-bottom: 1rem;
}

.alerts-container .alert:nth-last-child(1) {
  margin-bottom: 2rem;
}

.alerts-container .alert.red {
  background-color: #ffe0e0;
  border: 1px solid #fdaeae;
}

.alerts-container .alert.blue {
  background-color: #dae7f3;
  border: 1px solid #7eb5e8;
}

.alerts-container .alert.green {
  background-color: #d9e6d9;
  border: 1px solid #7ec781;
}

.alerts-container .alert .wrapper {}

.alerts-container .alert .wrapper a {
  font-weight: 600;
}

.input-wrapper {
  margin-bottom: 2rem;
}

.input-wrapper label {
  display: block;
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
}

.input-wrapper label.empty {
  opacity: 0;
}

.input-wrapper label span {
  font-size: 1.5rem;
  margin-left: 0.4rem;
  color: #9ba3c3;
}

/* my change add > */
/* .input-wrapper input {
      width: 100%;
      padding: 1.2rem;
      box-sizing: border-box;
      font-size: 1.8rem;
      box-shadow: inset 0 1px 0 0 rgba(63,63,68,0.05);
      border: 1px solid #c4cdd5;
      border-radius: 0.5rem;
      transition: 0.2s;
  }
  .input-wrapper input:focus {
      border: 1px solid #0083ff;
      box-shadow: inset 0px 0px 2px -1px rgb(0 131 255);
  }
  .input-wrapper select {
      width: 100%;
      padding: 0.885rem 1.2rem;
      box-sizing: border-box;
      font-size: 1.8rem;
      box-shadow: inset 0 1px 0 0 rgba(63,63,68,0.05);
      border: 1px solid #c4cdd5;
      border-radius: 0.5rem;
      transition: 0.2s;
      height: 5rem;
  } */

.input-wrapper .grid-row .col>input,
.input-wrapper>input {
  width: 100%;
  padding: 1.2rem;
  box-sizing: border-box;
  font-size: 1.8rem;
  box-shadow: inset 0 1px 0 0 rgba(63, 63, 68, 0.05);
  border: 1px solid #c4cdd5;
  border-radius: 0.5rem;
  transition: 0.2s;
}

.input-wrapper>input:focus {
  border: 1px solid #0083ff;
  box-shadow: inset 0px 0px 2px -1px rgb(0 131 255);
}

.input-wrapper .flex>select,
.input-wrapper>select {
  width: 100%;
  padding: 0.885rem 1.2rem;
  box-sizing: border-box;
  font-size: 1.8rem;
  box-shadow: inset 0 1px 0 0 rgba(63, 63, 68, 0.05);
  border: 1px solid #c4cdd5;
  border-radius: 0.5rem;
  transition: 0.2s;
  height: 5rem;
}

/* end my change */
.input-wrapper textarea {
  width: 100%;
  padding: 1.2rem;
  box-sizing: border-box;
  font-size: 1.8rem;
  box-shadow: inset 0 1px 0 0 rgba(63, 63, 68, 0.05);
  border: 1px solid #c4cdd5;
  border-radius: 0.5rem;
  transition: 0.2s;
  min-height: 16rem;
}

.input-wrapper .select-group select {
  border-radius: 0;
}

.input-wrapper .select-group select:nth-child(1) {
  border-radius: 0.5rem 0 0 0.5rem;
  border-right: none;
}

.input-wrapper .select-group select:nth-last-child(1) {
  border-radius: 0 0.5rem 0.5rem 0;
  border-left: none;
}

.input-wrapper .ql-editor {
  min-height: 20rem;
  font-size: 1.8rem;
}

.input-wrapper .submit {
  width: 100%;
  font-size: 2rem;
  height: 5rem;
  padding: 0 5rem;
  border-radius: 0.5rem;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  background: #0083ff;
  border: 1px solid #0083ff;
  box-shadow: none;
  color: #ffffff;
  transition: 0.2s;
}

.input-wrapper .submit:hover {
  background: #ebf5ff;
  border: 1px solid #0083ff;
  box-shadow: none;
  color: #0083ff;
}

.input-wrapper .submit.red {
  background: #f34141;
  border: 1px solid #f34141;
}

.input-wrapper .submit.red:hover {
  background: #ffecec;
  border: 1px solid #f34141;
  box-shadow: none;
  color: #f34141;
}

.input-wrapper .submit.green {
  background: #4caf50;
  border: 1px solid #4caf50;
}

.input-wrapper .submit.green:hover {
  background: rgb(76 175 80 / 20%);
  border: 1px solid #4caf50;
  box-shadow: none;
  color: #4caf50;
}

.input-wrapper .submit.grey {
  background: #f9f9f9;
  border: 1px solid #d4d5da;
  color: #72757f;
}

.input-wrapper .submit.grey:hover {
  background: #e9edf1;
}

.double .input-wrapper {}

.double .input-wrapper:nth-child(1) {
  width: 50%;
}

.double .input-wrapper:nth-child(2) {
  width: 50%;
}

.double .input-wrapper:nth-child(1) input {
  border-radius: 0.5rem 0 0 0.5rem;
}

.double .input-wrapper:nth-child(1) select {
  border-radius: 0.5rem 0 0 0.5rem;
}

.double .input-wrapper:nth-child(2) input {
  border-radius: 0 0.5rem 0.5rem 0;
  border-left: none;
}

.double .input-wrapper:nth-child(2) select {
  border-radius: 0 0.5rem 0.5rem 0;
  border-left: none;
}

.product .market-price label {
  text-decoration: line-through;
}

.dropzone {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4rem;
  background-color: #f4f5fb;
  border-radius: 1rem;
}

.dropzone span {
  font-size: 2rem;
  text-align: center;
}

.dropzone span a {}

.product-date-info {}

.product-date-info .row {
  font-size: 1.6rem;
  padding-bottom: 0.5rem;
}

.product-date-info .row .title {
  color: #8b98af;
}

.product-date-info .row .balance {
  font-weight: 600;
  color: #000;
}

.input-wrapper.c-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.custome-chekbox {
  display: flex;
  padding: 1.3rem;
  font-size: 1.8rem;
  background-color: #f4f5fb;
  border-radius: 0.5rem;
  transition: 0.2s;
  cursor: pointer;
  height: 5rem;
  box-sizing: border-box;
}

.custome-chekbox .checkbox- {
  width: 2.5rem;
  height: 2.5rem;
  background-color: #fff;
  border-radius: 999px;
  border: 1px solid #c4cdd5;
  margin-right: 1rem;
  box-sizing: border-box;
  transition: 0.2s;
  position: relative;
}

.custome-chekbox .checkbox- .check-mark {
  display: block;
  width: 18px;
  height: 18px;
  position: absolute;
  top: 0px;
  left: 1px;
  transition: 0.2s;
  opacity: 0;
}

.custome-chekbox .checkbox- .check-mark .fi {
  width: 18px;
  height: 18px;
  transition: 0.2s;
  color: #198bff;
  transition: all 0.2s ease-in-out;
  transform: scale(0);
}

.custome-style:checked+label .custome-chekbox {
  background-color: #00bcd4;
  color: #fff;
}

.custome-style:checked+label .custome-chekbox .checkbox- {
  border: none;
}

.custome-style:checked+label .custome-chekbox .checkbox- .check-mark {
  opacity: 1;
}

.custome-style:checked+label .custome-chekbox .checkbox- .check-mark .fi {
  transform: scale(1);
}

/* selct2 custome css */
.select2 {
  font-size: 1.8rem;
}

.select2 .select2-container--default .select2-selection--multiple {
  min-height: 5rem;
}

.select2 .select2-container--default.select2-container--focus .select2-selection--multiple {
  border: 1px solid #0083ff;
  box-shadow: inset 0px 0px 2px -1px rgb(0 131 255);
}

.select2 .select2-container--default .select2-selection--multiple {
  box-shadow: inset 0 1px 0 0 rgba(63, 63, 68, 0.05);
  border: 1px solid #c4cdd5;
}

.select2 .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: #0083ff;
  border: 1px solid #0083ff;
  border-radius: 2px;
  padding: 0 3px;
}

.select2 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: #0f4d88;
  border-right: none;
  padding: 3px;
}

.select2 .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus {
  background-color: #0083ff;
  color: #fff;
}

.select2 .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
  color: #fff;
}

.select2-container {
  font-size: 1.8rem;
}

.select2.variant-select .select2-container--default.select2-container--focus .select2-selection--multiple {
  border: 1px solid #0083ff;
}

.select2.variant-select .select2-container--default .select2-selection--multiple {
  box-shadow: inset 0 1px 0 0 rgba(63, 63, 68, 0.05);
}

.select2.variant-select .select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: #4caf50;
  border: 1px solid #4caf50;
}

.select2.variant-select .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: #124b10;
}

.select2.variant-select .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus {
  background-color: rgb(0 0 0 / 0);
}

/* ------ */
.product .variants-container {
  font-size: 1.6rem;
  background-color: #f3f3f3;
  padding: 10px;
  padding-right: 0;
  border-radius: 5px;
  scroll-behavior: smooth;
}

.product .variants-container .wrapper {
  overflow-y: scroll;
}

.product .variants-container table th {
  padding-bottom: 0.5rem;
}

.product .variants-container table td {
  padding: 0.5rem;
  padding-bottom: 1rem;
}

.product .variants-container input {
  width: 100%;
  padding: 1rem 0.5rem;
  box-sizing: border-box;
  font-size: 1.6rem;
  border: 1px solid #c4cdd5;
  border-radius: 0.5rem;
  transition: 0.2s;
}

.product .variants-container button {
  padding: 0;
  background-color: #0000;
  border: none;
  color: #1c2c49;
}

.product .variants-container .qty {
  width: 7rem;
  min-width: 7rem;
}

.product.product-reserve .variants-container .qty {
  width: 8rem;
}

.product.product-reserve .variants-container .qty.shop {
  display: none;
}

.product.product-reserve .variants-container .qty.balikbayan {
  display: none;
}

.product.product-reserve .variants-container .qty.kuwait {
  display: none;
}

.product.product-reserve .variants-container .qty.dp {
  display: none;
}

.product .variants-container .var {
  min-width: 18rem;
  width: 18rem;
}

.product .variants-container .barcode {
  min-width: 15rem;
  width: 15rem;
}

.product.product-reserve .variants-container .barcode {
  min-width: 22rem;
  width: 15rem;
}

.item-list {}

.item-list .header .links {
  border-bottom: 1px solid #e5e6eb;
}

.item-list .header ul {
  list-style: none;
  padding: 0;
  margin: 0;
  overflow-y: scroll;
}

.item-list .header .link {
  height: 6rem;
  padding: 0 3rem;
  line-height: 6rem;
  font-size: 1.8rem;
  color: #000;
  transition: 0.2s;
  text-decoration: none;
  background-color: #fff;
  border: none;
  border-radius: 0.5rem 0 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.item-list .header .link .fi {
  width: 2rem;
  height: 2rem;
  margin-right: 0.5rem;
  color: #b3b7ca;
  transition: 0.2s;
}

.item-list .header button.link {
  white-space: nowrap;
}

.item-list .header .link:hover {
  background-color: #f5f6fa;
}

.item-list .header .link.active {
  box-shadow: inset 0px -4px 0px 0px #198bff;
}

.item-list .header .link.active .fi {
  color: #198bff;
}

.sale-report .item-list .custome-graphe-tab {
  max-height: 280px;
  overflow: hidden;
}

.item-list .filters-search {
  border-bottom: 1px solid #e5e6eb;
}

.item-list .filters-search .container .section {
  padding: 2rem;
  padding-bottom: 0;
}

.item-list .filters-search .container .section:nth-last-child(1) {
  padding-left: 0;
}

.item-list .filters .filter-btn .btn {
  width: 100%;
  height: 5rem;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  box-sizing: border-box;
  font-size: 1.8rem;
  display: flex;
  align-items: center;
  cursor: pointer;
  padding: 0 2rem;
  border-right: none;
  transition: 0.2s;
}

.item-list .filters .filter-btn .btn .fi {
  margin-right: 0.5rem;
}

.item-list .filters .filter-btn:nth-last-child(1) .btn {
  border-right: 1px solid #c4cdd5;
  border-radius: 0 0.4rem 0.4rem 0;
}

.item-list .filters .filter-btn:nth-child(1) .btn {
  border-radius: 0.4rem 0 0 0.4rem;
}

.item-list .list {}

.item-list .list .inner {
  padding: 2rem;
}

.item-list .list .hide-scroll {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.item-list .list .scroll-y {
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
  width: 100%;
  height: 100%;
}

.item-list .list .scroll-y::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.item-list .list table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.item-list .list th,
td {
  font-size: 1.8rem;
  padding: 0;
  margin: 0;
  border-collapse: collapse;
}

.item-list .list th {
  color: #aaaaaa;
  font-weight: 600;
  text-align: left;
  padding: 2rem 1rem;
  border-bottom: 1px solid #ebeef0;
}

.item-list .list td {
  border-bottom: 1px solid #ebeef0;
  background: transparent;
  padding: 1rem;
}

.item-list .list td.checkbox {
  max-width: 2rem;
  width: 2rem;
}

.item-list .list td .form-control {
  padding: 1rem;
  display: flex;
  align-items: center;
}

.item-list .list td.checkbox .form-control {
  padding: 0;
}

.item-list .list td a {
  display: block;
  color: #000;
  text-decoration: none;
}

.item-list .list td .media-container {
  width: 7rem;
  height: 7rem;
  box-sizing: border-box;
  border: 1px solid #e2e2e2;
  padding: 0.5rem;
  border-radius: 0.5rem;
}

.item-list .list td span {
  font-size: 1.4rem;
  color: #b1b8d6;
}

.item-list .list td.title {
  min-width: 20rem;
}

.item-list .footer .wrapper {
  padding: 2rem;
}

.item-list .footer .result-per-page {}

.item-list .footer .result-per-page .input-wrapper {
  align-items: center;
  margin: 0;
}

.item-list .footer .result-per-page label {
  font-size: 1.6rem;
  margin: 0;
  margin-right: 0.5rem;
  white-space: nowrap;
  color: #8c91ab;
  font-weight: 600;
}

.item-list .pagination ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.item-list .pagination .p-link {
  height: 5rem;
  font-size: 1.8rem;
  padding: 0 1rem;
  box-sizing: border-box;
  width: 5rem;
  text-align: center;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  border-right: none;
  transition: 0.2s;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #000;
  text-decoration: none;
}

.item-list .pagination ul li:nth-child(1) .p-link {
  border-radius: 0.5rem 0 0 0.5rem;
}

.item-list .pagination ul li:nth-last-child(1) .p-link {
  border-radius: 0 0.5rem 0.5rem 0;
  border-right: 1px solid #c4cdd5;
}

.item-list .pagination .p-link:hover {
  background: #eaeaea;
}

.item-list .pagination .p-link.p-link.selected {
  background: #e3e6ef;
}

.item-list .list .btn .t-btn {
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  border-radius: 0.5rem;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  transition: all 0.2s ease-in-out;
  position: relative;
}

.item-list .list .btn .t-btn .fi {
  transform: scale(0);
  position: absolute;
  transition: transform 0.2s ease-in;
  color: #fff;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}

.item-list .list .btn .t-btn span {
  font-size: 1.6rem;
  color: #000;
}

.item-list .list .btn .t-btn:hover {
  background: #198bff;
  border: 1px solid #198aff;
  box-shadow: 0 3px 10px -4px rgb(25, 138, 255);
  color: #fff;
}

.item-list .list .btn .t-btn.red:hover {
  background: #ff3a3a;
  border: 1px solid #ff3a3a;
  box-shadow: 0 3px 10px -4px #ff3a3a;
  color: #fff;
}

.item-list .list .btn .t-btn:hover .fi {
  transform: scale(1);
}

.item-list .list .btn .t-btn:hover span {
  opacity: 0;
}

.item-list .list .input-wrapper {}

.orders-list .item-list td.store a {
  display: inline-block;
  background-color: #b1b6c7;
  padding: 0.5rem;
  border-radius: 0.5rem;
  color: #fff;
}

/* my change */
/* .orders-list .item-list td.store a.ae {
      background-color: #ec5e5e;
  }
  .orders-list .item-list td.store a.sh {
      background-color: #68c3ec;
  }
  .orders-list .item-list td.store a.kw {
      background-color: #efbe41;
  }
  .orders-list .item-list td.store a.qa {
      background-color: #795548;
  } */
.orders-list .item-list td.store a.uae {
  background-color: #ec5e5e;
}

.orders-list .item-list td.store a.shop {
  background-color: #68c3ec;
}

.orders-list .item-list td.store a.kwt {
  background-color: #efbe41;
}

.orders-list .item-list td.store a.bbm {
  background-color: #795548;
}

.orders-list .item-list td.store a.bfl {
  background-color: #587948;
}

.orders-list .item-list td.store a.btp {
  background-color: #4a4879;
}

/* end my change */

.orders-list .item-list td.id a {
  font-weight: 600;
}

.orders-list .item-list td.address {
  min-width: 200px;
}

.orders-list .item-list td.address a {
  color: #878b98;
  font-size: 1.6rem;
}

.orders-list .item-list td.address .aso {
  color: #2196f3;
}

.orders-list .item-list td.total .amount {
  font-size: 1.8rem;
  font-weight: bold;
  color: #4caf50;
}

.orders-list .item-list td.status {}

.orders-list .item-list td.status .wrapper {
  text-align: center;
  padding: 1rem 1rem;
  border-radius: 999px;
  background-color: #a0a4b9;
  color: #fff;
}

.orders-list .item-list td.status .wrapper.pending {
  background-color: #00bcd4;
}

.orders-list .item-list td.status .wrapper.accpeted {
  background-color: #2196f3;
}

.orders-list .item-list td.status .wrapper.picking {
  background-color: #2196f3;
}

.orders-list .item-list td.status .wrapper.packing {
  background-color: #2196f3;
}

/* my change */
/* .orders-list .item-list td.status .wrapper.ready {
      background-color: #2196F3;
  } */
.orders-list .item-list td.status .wrapper.ready_to_ship {
  background-color: #2196f3;
}

.orders-list .item-list td.status .wrapper.canceled {
  background-color: #f32121;
}

/* end my change */
.orders-list .item-list td.status .wrapper.shipped {
  background-color: #8bc34a;
}

.orders-list .item-list td.status .wrapper.recived {
  background-color: #28343a;
}

.orders-list .item-list td.payment .wrapper {
  text-align: center;
  padding: 1rem 1rem;
  border-radius: 999px;
  background-color: #a0a4b9;
  color: #fff;
}

/* start my change */
/* .orders-list .item-list td.payment .wrapper.unpaied {

  }
  .orders-list .item-list td.payment .wrapper.paied {
      background-color: #8BC34A;
  } */
.orders-list .item-list td.payment .wrapper.unpaid {}

.orders-list .item-list td.payment .wrapper.paid {
  background-color: #8bc34a;
}

/* end my change */
.orders-list .item-list .list .btn .t-btn {
  padding: 1rem 2rem;
}

.orders-list .item-list .list table tr:nth-last-child(even) {
  background-color: #f8f8f9;
}

/* my change */
/* .tags .item-list .filters-search .wrapper {
      padding-top: 2rem;
  }
  .brand-list .item-list .filters-search .wrapper {
      padding-top: 2rem;
  } */

.item-list .filters-search .wrapper {
  padding-top: 2rem;
}

/* end my change */
.size-guide-list .item-list .list td a {
  padding: 1rem;
}

.supplier-list .item-list .list td a {
  padding: 1rem;
}

.purchase-invoice-list .item-list .list td a {
  padding: 1rem;
}

.purchase-invoice-list .item-list .filters-search .wrapper {
  padding-top: 2rem;
}

.purchase-invoice-view .header .photo {
  padding: 1rem;
}

.purchase-invoice-view .prd-list .hide-scroll {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.purchase-invoice-view .prd-list .scroll-y {
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
  width: 100%;
  height: 100%;
}

.purchase-invoice-view .prd-list .scroll-y::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.purchase-invoice-view .prd-list table {
  border-collapse: collapse;
  width: 100%;
  font-size: 1.6rem;
}

.purchase-invoice-view .prd-list table th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 1rem;
}

.purchase-invoice-view .prd-list table td {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 1rem;
  font-size: 1.6rem;
}

.purchase-invoice-view .prd-list table td.number {
  max-width: 20px;
  width: 20px;
  text-align: center;
}

.purchase-invoice-view .prd-list table td.row {
  max-width: 30px;
  width: 30px;
  text-align: center;
  font-weight: 600;
}

.purchase-invoice-view .prd-list table td.vars {}

.purchase-invoice-view .prd-list table td.loc {}

.purchase-invoice-view .prd-list table td.img {
  max-width: 60px;
  width: 60px;
}

.purchase-invoice-view .prd-list table td a {
  text-decoration: none;
  color: #000;
}

.purchase-invoice-view .prd-list table td span {
  font-size: 1.2rem;
  color: #9da0af;
}

.purchase-invoice-view .prd-list table td .media-container {
  width: 60px;
  height: 60px;
  text-align: center;
  margin: 0;
}

.catalog {
  padding: 1rem;
}

.catalog.grid-row {
  padding: 1rem;
  margin: 0;
}

.catalog .row {
  margin-bottom: 1.5rem;
}

.catalog .row.flex {
  align-items: center;
}

.catalog .row .title {
  font-weight: 600;
  font-size: 2rem;
  color: #929bbd;
  margin-right: 0.5rem;
}

.catalog .row .balance {
  font-size: 2rem;
  color: #000;
}

.catalog .row .balance a {
  color: #000;
}

.catalog .row .balance span {
  margin-left: 0.5rem;
  color: #8bc34a;
  font-size: 1.5rem;
}

.log-in {}

.log-in .login-container {
  width: 360px;
  margin: 100px auto;
  padding: 30px 20px;
  background-color: #ffff;
  border-radius: 0.5rem;
  box-shadow: 0 0 0 1px rgb(229, 230, 235), 0 1px 4px 0 rgb(229, 230, 235);
  min-height: 1px;
  box-sizing: border-box;
}

.log-in form {}

.log-in .login-container .remember-me {}

.log-in .login-container .login-bt {
  font-size: 2rem;
  margin: 0 auto;
  padding: 1.5rem 6rem;
  display: block;
  margin-top: 30px;
  border-radius: 999px;
  border: none;
  background-color: #0083ff;
  color: #fff;
  box-shadow: 0px 15px 15px -17px #0083ff;
  transition: 0.2s;
}

.log-in .login-container .login-bt:hover {
  box-shadow: 0px 18px 15px -17px #0083ff;
  transform: translate(0px, -2px);
}

.log-in .login-container .custome-style:checked+label .custome-chekbox {
  background-color: #e9f4ff;
  color: #0083ff;
  border: 1px solid #0083ff;
  box-sizing: border-box;
}

.box-header {
  border-bottom: 1px solid #caccd0;
  padding-bottom: 1rem;
  align-items: center;
  margin-bottom: 2rem;
  transition: 0.3s;
}

.box-header .title {
  font-size: 2.4rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}

.box-header .title .fi {
  margin-right: 0.5rem;
}

.poster .box-header .trigger {
  cursor: pointer;
}

.poster .box-header .trigger .fi {
  transition: 0.3s;
}

.poster .filters-wrapper {
  transition: 0.3s;
}

.poster .filters-wrapper.close {
  display: none;
  opacity: 0;
}

.poster .box-header.close {
  margin-bottom: 0;
  border: none;
  padding-bottom: 0;
}

.poster .box-header.close .trigger .fi {
  transform: rotate(180deg);
}

.poster .poster-dl-all {
  width: 100%;
  font-size: 2rem;
  height: 5rem;
  border-radius: 0.5rem;
  box-sizing: border-box;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #4caf50;
  border: 1px solid #4caf50;
  box-shadow: none;
  color: #ffffff;
}

.poster {}

.poster .pr .result-wrapper {
  text-align: center;
}

.poster .pr .item {
  margin: 0 auto;
  margin-bottom: 3rem;
}

.poster .pr .product .container {
  position: relative;
}

.poster .pr .product .info {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 12;
}

.poster .pr .product .label {
  position: absolute;
}

.poster .pr .product .template {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 11;
}

.poster .pr .product .template img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}

.poster .pr .product .main-photo {
  z-index: 10;
}

.poster .pr .product .main-photo img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: middle;
}

.poster .pr .bt-bar .container {
  background-color: #fff;
  padding: 10px;
  display: flex;
}

.poster .pr .bt-bar .download {
  font-size: 18px;
  width: 75%;
  height: 48px;
  box-sizing: border-box;
  border: none;
  border-radius: 0.5rem;
  background-color: #4caf50;
  color: #fff;
}

.poster .pr .bt-bar .space {
  width: 5%;
}

.poster .pr .bt-bar a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10%;
  text-decoration: none;
  transition: 0.2s;
}

.poster .pr .bt-bar a .fi {
  color: #1c2c49;
  transition: 0.2s;
}

.poster .pr .bt-bar a:hover {
  background-color: #eef0f7;
  border-radius: 0.5rem;
}

.poster .pr .bt-bar a:hover .fi {
  color: #0083ff;
}

.poster .pr .type-1 .item .item-wrapper {
  margin: 0 auto;
  max-width: 690px;
}

.poster .pr .type-1 .item .product {
  overflow: hidden;
  margin: 0 auto;
}

.poster .pr .type-1 .product .main-photo .wrapper {
  position: relative;
}

.product-report .item-list .list tr.Processing {
  background-color: #cbe8ff;
}

.product-report .item-list .list tr.Canceled {
  background-color: #ffe2e2;
}

.tab-header {
  border-bottom: 1px solid #e5e6eb;
}

.tab-header ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tab-header li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tab-header li .link {
  height: 6rem;
  padding: 0 3rem;
  line-height: 6rem;
  font-size: 1.8rem;
  color: #000;
  transition: 0.2s;
  display: block;
  text-decoration: none;
}

.tab-header li .link:hover {
  background-color: #f5f6fa;
}

.tab-header li .link.active {
  box-shadow: inset 0px -4px 0px 0px #198bff;
}

.timeline {
  padding: 1.5rem;
}

.timeline .scroll-y {
  overflow-y: scroll;
}

.timeline .container {
  position: relative;
  width: 100%;
  height: 100%;
}

.timeline .line {
  width: 4px;
  min-height: 6px;
  height: 100%;
  background-color: #e6e8f1;
  position: absolute;
  z-index: 1;
  left: 6px;
}

.timeline ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.timeline li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.timeline .item {
  padding: 1rem 0;
}

.timeline .item .wrapper {
  font-size: 1.8rem;
  color: #000;
  align-items: center;
}

.timeline .item .sc {
  margin-right: 0.5rem;
  flex-shrink: 0;
  white-space: nowrap;
  z-index: 2;
}

.timeline .item .circle {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  box-sizing: border-box;
  border: 4px solid #198bff;
  background-color: #fff;
}

.timeline .item .user {
  font-weight: 700;
}

.timeline .item .text {
  color: #a7aab7;
  font-style: italic;
}

.timeline .item .title {
  font-weight: 800;
  color: #3f51b5;
}

.q-log {}

.q-log .dual-cell {
  padding: 0;
}

.q-log .dual-cell .wrapper {
  display: flex;
  flex-direction: column;
}

.q-log .dual-cell>* {
  min-height: 22px;
}

.q-log .dual-cell .from {
  border-bottom: 1px solid #afafaf;
}

.q-log .dual-cell .to {}

.q-log .container {
  padding: 1rem;
}

.q-log .scroll-y {
  overflow-y: scroll;
}

.q-log ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.q-log li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.q-log .item {
  margin-bottom: 3rem;
}

.q-log .item .wrapper {}

.q-log .item table {
  border: 1px solid #bcbfcc;
  border-collapse: collapse;
}

.q-log .item td {
  border: 1px solid #bcbfcc;
  border-collapse: collapse;
  padding: 0.5rem;
  text-align: center;
}

.q-log .item .type {
  background-color: #000;
  color: #fff;
  border: 1px solid #000000;
}

.q-log .item .type.cancel {
  background-color: #ea4848;
  border: 1px solid #ea4848;
}

.q-log .item .type.order {
  background-color: #4caf50;
  border: 1px solid #4caf50;
}

.q-log .item .type.transfer {
  background-color: #ffc107;
  border: 1px solid #ffc107;
}

.q-log .item .type.transfer_qty {
  background-color: #ffc107;
  border: 1px solid #ffc107;
}

.q-log .item .type.edit {
  background-color: #2196f3;
  border: 1px solid #2196f3;
}

.q-log .item .type.reserve {
  background-color: #ac74de;
  border: 1px solid #ac74de;
}

.q-log .item .type.create {
  background-color: #2196f3;
  border: 1px solid #2196f3;
}

.q-log .item .date {
  background-color: #1c2c49;
  color: #fff;
  border: 1px solid #1c2c49;
}

.q-log .item .desc {
  text-align: left;
}

.q-log .item .title {
  font-weight: bold;
  color: #949dbf;
}

.q-log .item .qty {
  width: 10%;
}

.q-log .item .change {
  background-color: #edeef1;
}

.q-log .item .var {}

.q-log .item .user {
  font-weight: bold;
  color: #000;
}

.filters-container {
  padding: 1rem;
  transform: scaleY(0);
  opacity: 0;
  transition: 0.2s;
  transform-origin: top;
  max-height: 0;
  padding-bottom: 2rem;
  display: none;
}

.filters-container.open {
  transform: scaleY(1);
  opacity: 1;
  display: block;
  max-height: 100%;
}

.item-list .filters .filter-btn .btn.open {
  background: #1c2c49;
  border: 1px solid #1c2c49;
  color: #fff;
}

.address-modal {}

.address-modal.new-address-modal .modal__container {
  width: 340px;
}

.address-modal .modal__container {
  max-width: calc(100vw - 60px);
  padding: 40px 15px 20px 15px;
  border-radius: 16px;
  position: relative;
}

.address-modal .modal__content {
  margin: 0;
  line-height: 1.2;
}

.address-modal .close-modal {
  position: absolute;
  top: 7px;
  right: 7px;
  font-size: 19px;
  color: #607d8b;
  border: none;
  background: #fff0;
  cursor: pointer;
}

.address-modal .address-form {}

.address-modal .address-form .checkbox-wrap {
  width: 100%;
  border: none;
  background: #fff0;
  cursor: pointer;
}

.address-modal .checkbox-wrap input {
  display: none;
}

.address-modal .checkbox-wrap .checkmark {
  font-size: 14px;
  padding: 12px;
  margin-bottom: 15px;
  background-color: #e9f0f5;
  border-radius: 8px;
  box-sizing: border-box;

}

.address-modal .checkbox-wrap:nth-last-child(1) .checkmark {
  margin-bottom: 0;
}

.address-modal .checkbox-wrap .checkmark>.wrapper {}

.address-modal .checkbox-wrap .city {
  font-weight: 600;
}

.address-modal .checkbox-wrap .address {
  height: 34px;
  overflow: hidden;
}

.address-modal .checkbox-wrap input:checked+.checkmark {
  box-shadow: inset 0px 0px 0px 3px #2196f3, 0px 3px 6px -3px rgb(33 150 243 / 75%);
}

.actions-modal .form-control {
  padding: 0.5rem 0.5rem;
  width: 30rem;
}

.social-media-modal .close-modal {
  position: absolute;
  top: 7px;
  right: 7px;
  font-size: 19px;
  color: #607d8b;
  border: none;
  background: #fff0;
  cursor: pointer;
}


.actions-modal .form-control label {
  display: block;
  font-size: 1.6rem;
  margin-bottom: 0.5rem;
  text-align: left;
  color: #909090;
}

.actions-modal .form-control select {
  width: 100%;
  box-sizing: border-box;
  padding: 0 1rem;
  height: 5rem;
  line-height: 5rem;
  font-size: 1.6rem;
  border-radius: 0.5rem;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
}

.actions-modal .form-control input {
  width: 100%;
  box-sizing: border-box;
  padding: 0 1rem;
  height: 5rem;
  line-height: 5rem;
  font-size: 1.6rem;
  border-radius: 0.5rem;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
}

.actions-modal .form-control .filter-submit {
  background: #198cff;
  color: #fff;
  box-shadow: 0px 4px 20px -7px #198cff;
  border: 1px solid #198bff;
  width: 100%;
  height: 5rem;
  margin-top: 2rem;
  border-radius: 0.5rem;
  font-size: 1.8rem;
  cursor: pointer;
}

.orders-actions-modal .link {
  width: 30rem;
  display: flex;
  height: 6rem;
  line-height: 6rem;
  box-sizing: border-box;
  padding: 0 1.5rem;
  transition: 0.2s;
  text-decoration: none;
  align-items: center;
}

.orders-actions-modal .link:hover {
  background-color: #f1f4f7;
}

.orders-actions-modal .link .icon .fi {
  color: #ccc;
  transition: 0.2s;
}

.orders-actions-modal .link:hover .icon .fi {
  color: #198bff;
}

.orders-actions-modal .link .title {
  font-size: 1.8rem;
  color: #000;
  margin-left: 1rem;
}

.order-view .page-title {
  display: flex;
  align-items: center;
}

.order-view .page-title .country {
  font-size: 1.6rem;
  background-color: #1c2c49;
  padding: 0.5rem 1rem;
  color: #fff;
  border-radius: 0.5rem;
  margin-right: 0.5rem;
}

.order-view .page-title .divider {
  height: 100%;
  border-right: 1px solid #d0d5e6;
  min-height: 20px;
  margin: 0 1rem;
}

.order-view .page-title .date {
  font-weight: normal;
  font-size: 2rem;
  color: #858a9c;
}

.order .cart {}

.order .cart table {
  border-collapse: collapse;
  width: 100%;
}

.order .cart td {
  border: 1px solid #dddddd;
  padding: 0.5rem;
  text-align: center;
}

.order .cart td a {
  text-decoration: none;
  color: #000;
}

.order .cart td.photo {
  width: 64px;
}

.order .cart td.info {
  text-align: left;
}

.order .cart td.info .variant {
  font-weight: bold;
  color: #3f51b5;
}

.order .cart td.price .aed {
  font-size: 1.4rem;
  color: #959fa7;
}

.order .cart td.actions {
  width: 1%;
  white-space: nowrap;
}

.order .cart td.actions button {
  display: block;
  border-radius: 4px;
  width: 100%;
}

.order .cart td.actions button:not(:last-child) {
  margin-bottom: 5px;
}

.order .cart td.actions button .fi {
  width: 18px;
  height: 18px;
  color: #fff;
}

.order .cart td.actions button.remove-item {
  background: #f34141;
  border: 1px solid #f34141;
}

.order .cart td.actions button.edit-item {
  background-color: #a2adb7;
  border: 1px solid #a2adb7;
  padding: 5px 0;
}

.order .balance table {
  border-collapse: collapse;
  width: 100%;
}

.order .balance td {
  border: 1px solid #dddddd;
  padding: 1rem;
  text-align: center;
}

.order .balance td.title {
  width: 50%;
}

.order .balance td.value {
  width: 50%;
  font-weight: bold;
  font-size: 2rem;
}

.order .balance td.value .aed {
  font-size: 1.4rem;
  color: #959fa7;
  font-weight: normal;
  margin-left: 0.5rem;
}

.btn-style {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 1.2rem 4rem;
  box-sizing: border-box;
  cursor: pointer;
  border-radius: 0.5rem;
  background: linear-gradient(to bottom, white, #f9fafb);
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  border: 1px solid #c4cdd5;
  font-size: 1.8rem;
  text-align: center;
  text-decoration: none;
  color: #000;
  position: relative;
  transition: all 0.2s ease-in-out;
}

.btn-style:hover {
  box-shadow: 0px 4px 8px -3px #c0c4d6;
}

.btn-style.red {
  background: #ec3232;
  border: 1px solid #ec3232;
  color: #fff;
}

.btn-style.red:hover {
  box-shadow: 0px 4px 8px -3px #ec3232;
}

.btn-style .fi {
  width: 18px;
  height: 18px;
  margin-right: 1rem;
  color: #a0a5b7;
}

.order-view .cancel-order {
  padding-top: 1rem;
}

.order-view .order-view-btns {
  display: flex;
  flex-wrap: wrap;
}

.order-view .order-view-btns a {
  margin-bottom: 1.5rem;
}

.order-view .input-wrapper.phone-number {
  position: relative;
}

.order-view .input-wrapper.phone-number .p-links {
  position: absolute;
  bottom: 6px;
  right: 6px;
  display: flex;
}

.order-view .input-wrapper.phone-number .p-links a {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0083ff;
  border-radius: 999px;
}

.order-view .input-wrapper.phone-number .p-links .whats {
  margin-right: 0.5rem;
  background-color: #009688;
}

.order-view .input-wrapper.phone-number .p-links .copy {
  margin-right: 0.5rem;
  background-color: #a2adb7;
}

.order-view .input-wrapper.phone-number .p-links .search {}

.order-view .input-wrapper.phone-number .p-links a .fi {
  width: 16px;
  height: 16px;
  color: #fff;
}

.live-orders .notes-container,
.order-view .notes-container {
  max-height: 320px;
  overflow: auto;
}

.live-orders .notes-container .note-wrapper,
.order-view .notes-container .note-wrapper {
  padding: 10px;
  font-size: 13px;
  background-color: #f5f6fa;
  border: 1px solid #dee0e9;
  border-radius: 8px;
  margin-bottom: 10px;
}

.live-orders .notes-container .note-wrapper.deleted,
.order-view .notes-container .note-wrapper.deleted {
  background-color: #e91e1e24;
  border: 1px solid #ffc4c4;
}

.live-orders .notes-container .row,
.order-view .notes-container .row {

}

.live-orders .notes-container .row .title,
.order-view .notes-container .row .title {

}

.live-orders 
.order-view .notes-container .row .value {
  display: flex;
  align-items: center;
}

.live-orders .notes-container .row .delete,
.order-view .notes-container .row .delete {
  padding: 0;
  border: none;
  margin: 0 0 3px 3px;
}

.live-orders .notes-container .row .delete .fi,
.order-view .notes-container .row .delete .fi {
  width: 16px;
  height: 16px;
}

.liverorder-view .input-wrapper.phone-number .p-links {}

.liverorder-view .input-wrapper.phone-number .p-links a {
  margin-right: 5px;
}

.liverorder-view .input-wrapper.phone-number .p-links a:nth-last-child(1) {
  margin-right: 0;
}

.liverorder-view .input-wrapper.phone-number .p-links .green {
  background-color: #4caf50;
}

.orders-list .item-list .header ul {
  overflow-y: scroll;
}

.sale-report .top-sc {}

.sale-report .picker-bt {
  margin-left: 0.6rem;
  cursor: pointer;
  transition: 0.2s;
}

.c-date-picker {}

.c-date-picker .form-control label {
  margin-bottom: 10px;
}

.c-date-picker .form-control input {
  margin-bottom: 10px;
}

.c-date-picker .form-control .filter-submit {
  margin: 5px 0 5px 0;
}

.sale-report .main-report {}

.sale-report .main-report table {
  border: 1px solid #000;
  border-collapse: collapse;
  width: 100%;
  margin-bottom: -1px;
}

.sale-report .main-report td {
  border: 1px solid #000;
  border-collapse: collapse;
  text-align: center;
}

.sale-report .main-report td.title {
  font-size: 2rem;
  font-weight: bold;
}

.sale-report .main-report td.main {
  padding: 1rem;
  font-size: 2.6rem;
}

.sale-report .main-report td.main .value {
  font-weight: bold;
}

.sale-report .main-report td.main .aed {
  font-size: 1.5rem;
  color: #9ea2b1;
  margin-left: 0.5rem;
}

.sale-report .main-report td.sub {
  padding: 1rem;
  width: 20%;
}

.sale-report .main-report td.sub .cell {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
}

.sale-report .main-report td.sub .cell .country {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.5rem;
}

.sale-report .main-report td.sub .cell .country img {
  width: 22px;
}

.sale-report .main-report td.sub .cell .value {
  font-weight: bold;
  font-size: 2rem;
}

.sale-report .main-report td.sub .cell .per {
  font-size: 1.8rem;
  margin-left: 0.3rem;
  color: #2196f3;
}

.sale-report .sr-sale-value .section {
  padding: 2rem;
}

.sale-report .sr-sale-value .section:nth-last-child(1) {
  border-left: 1px solid #e5e6eb;
}

.sale-report .sr-sale-value .title {
  justify-content: center;
}

.sale-report .sr-sale-value .title span {
  font-size: 2rem;
  font-weight: 600;
  color: #fff;
}

.sale-report .sr-sale-value .title .fi {
  width: 2.2rem;
  height: 2.2rem;
  color: #0083ff;
  margin-right: 0.5rem;
  /* display: none; */
}

.sale-report .sr-sale-value .content {}

.sale-report .sr-sale-value table {
  border-collapse: collapse;
  width: 100%;
}

.sale-report .sr-sale-value table td {
  border: 1px solid #dddddd;
  text-align: center;
}

.sale-report .sr-sale-value td .wrapper {
  justify-content: center;
}

.sale-report .sr-sale-value td.main {
  background-color: #fbfcff;
}

.sale-report .sr-sale-value td.ti {
  background-color: #1c2c49;
}

.sale-report .sr-sale-value td.main .wrapper {}

.sale-report .sr-sale-value td.main h2 {
  color: #4caf50;
}

.sale-report .sr-sale-value.orders td.main h2 {
  color: #000;
}

.sale-report .sr-sale-value.views td.main h2 {
  color: #000;
}

.sale-report .sr-sale-value td.main .aed {
  font-size: 1.8rem;
  color: #9098b7;
  margin-left: 0.5rem;
}

.sale-report .sr-sale-value td.sub {
  width: 25%;
  padding: 1rem;
}

.sale-report .sr-sale-value td.sub .wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.sale-report .sr-sale-value td.sub .flag {}

.sale-report .sr-sale-value td.sub .flag img {
  width: 2.6rem;
  margin-right: 0.5rem;
}

.sale-report .sr-sale-value td.sub .value {
  color: #1c2c49;
  font-weight: bold;
  font-size: 2.2rem;
  margin-right: 0.5rem;
}

.sale-report .sr-sale-value td.sub .per {
  font-size: 1.8rem;
  color: #9098b7;
  font-weight: 600;
}

.sale-report .sr-sale-value td.sub .aed {}

.sale-report .graph-title {
  text-align: center;
  font-size: 1.8rem;
  margin-bottom: 1rem;
}

.sale-report .sr-box-head {
  margin-bottom: 1rem;
}

.sale-report .sr-box-head .fi {
  width: 2.2rem;
  height: 2.2rem;
  color: #0083ff;
  margin-right: 0.5rem;
}

.sale-report .sr-box-head .title {
  font-size: 2rem;
  font-weight: 600;
  color: #6e7582;
}

.sale-report .sr-box-head .link {}

.sale-report .sr-box-head .link a {
  text-decoration: none;
  display: block;
  font-size: 1.8rem;
  background-color: #e4e6ef;
  padding: 0.5rem 1.5rem;
  border-radius: 999px;
  color: #585858;
}

.sale-report .s-analytic {
  margin-bottom: 2rem;
}

.sale-report .s-analytic table {
  border-collapse: collapse;
  width: 100%;
}

.sale-report .s-analytic td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 1rem;
  font-weight: 600;
}

.sale-report .s-analytic td.title {
  font-weight: bold;
  color: #1c2c49;
}

.sale-report .s-analytic span {
  margin-left: 0.5rem;
  font-weight: normal;
  color: #838aa5;
}

.sale-report.cart-rep .item-list {}

.sale-report.cart-rep .item-list table {}

.sale-report.cart-rep .item-list table th {}

.sale-report.cart-rep .item-list table td {
  padding: 0.5rem;
}

.sale-report.cart-rep .item-list table td.photo {
  width: 80px;
}

.sale-report.cart-rep .item-list table td.photo .media-container {
  width: 80px;
  height: 80px;
}

.sale-report.cart-rep .item-list table td.desc {
  text-align: left;
}

.sale-report.cart-rep .item-list table td.desc .title {
  font-weight: normal;
  font-size: 1.4rem;
}

.sale-report.cart-rep .item-list table td.desc .style-no {
  color: #939fa9;
}

.sale-report.cart-rep .item-list table td.desc .var {
  font-size: 1.8rem;
  font-weight: bold;
}

.sale-report.cart-rep .item-list table td.price {}

.sale-report.cart-rep .item-list table td.price span {
  font-size: 1.4rem;
}

.sale-report.cart-rep .item-list table td.profit {
  color: #8bc34a;
}

.sale-report.cart-rep .item-list table td.profit span {
  font-size: 1.4rem;
}

.sale-report.cart-rep .item-list table td.sold {}

.sale-report.cart-rep .item-list table td.wh {
  font-weight: normal;
  white-space: nowrap;
  font-size: 1.4rem;
}

.site-setting .item-list .priority {
  width: 7rem;
}

.site-setting .item-list .priority input {
  width: 7rem;
  text-align: center;
}

.site-setting .item-list .status select {
  width: 12rem;
}

.site-setting .item-list .list td .media-container {
  border: none;
  width: 9rem;
  text-align: center;
}

.site-setting.index-banners .item-list .list td.image {
  width: 10rem;
}

.site-setting.index-banners .item-list .list td .media-container {
  width: 10rem;
  height: 10rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.site-setting.index-banners .page-header .icon {
  width: 5rem;
  height: 5rem;
  margin-right: 1rem;
}

.dmo .item-list .status select {
  width: 12rem;
}

.customer-list .item-list .c-btn {}

.customer-list .item-list .c-btn a {}

.customer-list .item-list .c-btn .t-btn {
  display: inline-block;
  padding: 1rem 1rem;
  cursor: pointer;
  border-radius: 0.5rem;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgba(22, 29, 37, 0.05);
  transition: all 0.2s ease-in-out;
}

.customer-list .item-list .c-btn.whatsapp .t-btn .fi {
  color: #4caf50;
}

.customer-list .item-list td.address {
  min-width: 200px;
}

.customer-list .item-list td.t-orders {
  min-width: 80px;
}

.customer-list .item-list td.t-orders .amount {
  font-size: 1.8rem;
  font-weight: bold;
  color: #4caf50;
}

.customer-list .item-list .t-orders {
  text-align: center;
}

.customer-list .item-list .orders {
  text-align: center;
}

.customer-list .item-list td.address a {
  color: #878b98;
  font-size: 1.6rem;
}

.customer-view .customer-rank {}

.customer-view .customer-rank table {
  border-collapse: collapse;
  width: 100%;
  font-size: 1.6rem;
}

.customer-view .customer-rank td {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 1rem;
}

.customer-view .customer-rank td.title {
  font-weight: 600;
  text-align: center;
  color: #81869a;
}

.customer-view .customer-rank td.balance {
  font-weight: bold;
}

.customer-view .customer-rank td.value {
  color: #4caf50;
}

.customer-view .customer-rank td span {
  font-size: 1.4rem;
  font-weight: normal;
  margin-left: 0.3rem;
  color: #9ca0b3;
}

.customer-view .item-list .list td span.value {
  color: #4caf50;
  font-weight: bold;
  font-size: 1.8rem;
}

.customer-view .item-list .list td span.aed {
  font-size: 1.4rem;
  font-weight: normal;
  margin-left: 0.3rem;
  color: #9ca0b3;
}

.sale-report .item-list .list td .prd-var {
  color: #0083ff;
}

.liver-report .report-box {}

.liver-report .report-box .wrapper {}

.liver-report .report-box .icon {
  text-align: center;
}

.liver-report .report-box .icon .fi {
  height: 4rem;
  width: 4rem;
}

.liver-report .report-box .title {
  text-align: center;
  margin-top: 10px;
}

.liver-report .report-box .title span {
  font-size: 1.4rem;
  background-color: #f5f6fa;
  padding: 0.4rem 2rem;
  border-radius: 999px;
  color: #969cb5;
}

.liver-report .report-box .data {
  text-align: center;
  padding-top: 2rem;
  font-size: 3.2rem;
  font-weight: 600;
}

.liver-report .l-live .data {
  justify-content: center;
  align-items: center;
}

.liver-report .report-box .aed {
  font-weight: normal;
  font-size: 1.6rem;
  color: #97b4d0;
}

.liver-report .report-box .blink {
  margin-right: 0.5rem;
  height: 1.4rem;
  width: 1.4rem;
  overflow: hidden;
}

.liver-report .l-sale .icon .fi {
  color: #4caf50;
}

.liver-report .l-order .icon .fi {
  color: #2196f3;
}

.liver-report .l-item .icon .fi {
  color: #00bcd4;
}

.liver-report .l-avg .icon .fi {
  color: #bc75e8;
}

.liver-report .l-view .icon .fi {
  color: #ff9800;
}

.liver-report .l-live .icon .fi {
  color: #f74646;
}

.liver-report .l-conv .icon .fi {
  color: #ffd91f;
}

.liver-report .l-orderid .icon .fi {
  color: #03a9f4;
}

.liver-report .sale-graphs .section {
  width: 33.3332%;
  border-right: 1px solid #eaecf3;
  box-sizing: border-box;
}

.liver-report .sale-graphs .section:nth-last-child(1) {
  border: none;
}

.liver-report .sale-graphs .section .title {
  text-align: center;
  margin-bottom: 1rem;
  font-size: 1.6rem;
  font-weight: 700;
  color: #1c2c49;
}

.liver-report .sale-graphs .section .graph-wrapper {}

.warehouse-report .table-weapper table {
  border-collapse: collapse;
  width: 100%;
}

.warehouse-report .table-weapper td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 1rem;
  font-weight: bold;
  font-size: 1.8rem;
}

.warehouse-report .table-weapper th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 1rem;
  font-weight: 600;
  font-size: 1.6rem;
  color: #838aa7;
}

.warehouse-report .table-weapper td span {
  font-weight: normal;
  font-size: 1.4rem;
  margin-left: 0.5rem;
  color: #b3b7ca;
}

.warehouse-report .sg-wrapper .header {
  margin-top: 2rem;
  font-size: 2rem;
  font-weight: bold;
  border-bottom: 1px solid #dadce2;
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}

.warehouse-report .sg-wrapper .graphs-wrapper .cell {
  width: 33.33332%;
  box-sizing: border-box;
  border-right: 1px solid #dadce2;
}

.warehouse-report .sg-wrapper .graphs-wrapper .cell:nth-last-child(1) {
  border: none;
}

.warehouse-report .sg-wrapper .graphs-wrapper .cell .title {
  text-align: center;
  font-size: 1.6rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  padding-top: 1.5rem;
}

.warehouse-report .sg-wrapper .graphs-wrapper .cell .title span {
  background-color: #eaecf5;
  padding: 0.5rem 1.5rem;
  border-radius: 9999px;
}

.warehouse-report .item-list .new-list .hide-scroll {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.warehouse-report .item-list .new-list .scroll-y {
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
  width: 100%;
  height: 100%;
}

.warehouse-report .item-list .new-list table {
  border-collapse: collapse;
  width: 100%;
}

.warehouse-report .item-list .new-list tr:nth-child(odd) {
  background-color: #f5f6fa;
}

.warehouse-report .item-list .new-list th {
  border: 1px solid #848898;
  text-align: center;
  padding: 0.5rem;
  font-size: 1.6rem;
  color: #191e23;
}

.warehouse-report .item-list .new-list th span {
  font-size: 1.2rem;
  font-weight: normal;
  margin-left: 0.5rem;
  color: #9098b5;
}

.warehouse-report .item-list .new-list td {
  border: 1px solid #848898;
  padding: 0.5rem;
  font-size: 1.6rem;
  white-space: nowrap;
}

.warehouse-report .item-list .new-list td a {
  text-decoration: none;
  color: #000;
}

.warehouse-report .item-list .new-list td.img {
  padding: 0;
  width: 6rem;
}

.warehouse-report .item-list .new-list td.img .media-container {
  width: 6rem;
  height: 6rem;
  text-align: center;
  margin: 0;
}

.warehouse-report .item-list .new-list td.img img {}

.warehouse-report .item-list .new-list td.multi {}

.warehouse-report .item-list .new-list td.multi .sc {}

.warehouse-report .item-list .new-list td.multi .sc .title {
  color: #8a8d9a;
}

.warehouse-report .item-list .new-list td.multi .sc .value {
  font-weight: 700;
}

.warehouse-report .item-list .new-list td.qty {
  text-align: center;
}

.warehouse-report .item-list .new-list td.loc {
  text-align: center;
}

.ops .warehouse-summary {
  overflow-y: scroll;
  margin-bottom: 10px;
}

.ops .warehouse-summary table {
  border-collapse: collapse;
  width: 100%;
}

.ops .warehouse-summary tr {
  border: 1px solid #dddddd;
  padding: 0;
  margin: 0;
}

.ops .warehouse-summary td {
  width: calc(100% / 6);
  border: 1px solid #dddddd;
  padding: 0;
  margin: 0;
}

.ops .warehouse-summary.btb-summary td {
  width: auto;
}

.ops .warehouse-summary td.active {
  background-color: #0083ff21;
  border: 1px solid #a4ccf3;
  box-shadow: rgb(0 131 255 / 24%) 0px 2px 8px 0px;
}

.ops .warehouse-summary td.complete {
  background-color: #4caf5038;
  border: 1px solid #4caf506e;
  box-shadow: rgb(76 175 80 / 39%) 0px 2px 8px 0px;
}

.ops .warehouse-summary .flex {
  justify-content: center;
  align-items: center;
  padding: 10px;
  flex-wrap: wrap;
}

.ops .warehouse-summary .total {
  color: #aaaebd;
  margin-right: 5px;
}

.ops .warehouse-summary.btb-summary .total {
  color: #aaaebd;
  margin-right: 0px;
}

.ops .warehouse-summary.btb-summary .input-wrapper {}

.ops .warehouse-summary .value {
  font-weight: bold;
}

.ops .warehouse-summary .flag {
  margin-right: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ops .warehouse-summary .flag img {
  width: 19px;
  height: 13px;
}

.ops .box-head {
  font-size: 1.8rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #caccd0;
  margin-bottom: 10px;
}

.ops .box-head .title {
  align-items: center;
}

.ops .box-head .title .flag {
  display: flex;
  margin-right: 5px;
}

.ops .box-head .title .flag img {
  width: 19px;
}

.ops .box-head .title .warehouse {}

.ops .box-head .title .warehouse span {
  color: #aab0bd;
}

.ops .pkt {}

.ops .pkt .wrapper {}

.ops .pkt table {
  border-collapse: collapse;
  width: 100%;
  font-size: 2rem;
}

.ops .pkt tr {}

.ops .pkt tr:nth-child(even) {
  background-color: #f5f6fa;
}

.ops .pkt th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 5px;
}

.ops .pkt td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 5px;
  font-size: 2rem;
}

.ops .pkt td a {
  text-decoration: none;
  color: #000;
}

.ops .pkt td .media-container {}

.ops .pkt td .media-container img {}

.ops .pkt td.photo {
  width: 120px;
  padding: 0;
}

.ops .pkt td.style .styleno {
  font-weight: bold;
  color: #2196f3;
}

.ops .pkt td.style .title {
  opacity: 0.8;
}

.ops .pkt td.style .value {}

.ops .pkt td.var {
  font-weight: bold;
}

.ops .pkt td.qty span {
  font-size: 1.5em;
  font-weight: 700;
  background-color: #ff3838;
  color: #fff;
  width: 46px;
  height: 46px;
  margin: 0 auto;
  line-height: 46px;
  display: block;
}

.ops .pkt td.box-number {}

.ops .pkt td.box-number a {
  display: block;
}

.ops .scanner {}

.ops .scanner .form-control {}

.ops .scanner .form-control .scanner-input {
  width: 70%;
  font-size: 3rem;
  padding: 1.5rem;
  border-radius: 1rem 0 0 1rem;
}

.ops .scanner .form-control .scanner-submit {
  font-size: 3rem;
  border-radius: 0 1rem 1rem 0;
  border-left: none;
  width: 30%;
  box-sizing: border-box;
  background-color: #0b2239;
  border: 1px solid #0b2239;
  color: #ffffff;
  box-shadow: 0px 2px 7px -3px #0b2239;
  transition: 0.2s;
  position: relative;
}

.ops .scanner .form-control .scanner-submit:hover {}

.ops .result {}

.ops .result .wrong {
  width: 100%;
  box-sizing: border-box;
  padding: 3rem;
  text-align: center;
  background-color: #ff3838;
  border-radius: 1rem;
}

.ops .result .wrong span {
  font-size: 3rem;
  color: #fff;
}

.ops .result .correct {}

.ops .result .correct table {
  width: 100%;
  border: none;
  margin: 0;
  padding: 0;
}

.ops .result .correct tr {
  border-radius: 1rem;
  box-shadow: rgb(76 175 80 / 19%) 0px 8px 24px;
}

.ops .result .correct td {
  background-color: #4caf50;
  text-align: center;
  padding: 1rem;
}

.ops .result .correct td.box-number {
  border-radius: 1rem 0 0 1rem;
}

.ops .result .correct td.box-number .wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 0;
}

.ops .result .correct td.box-number .flag {
  width: 19px;
  border: 2px solid #fff;
  border-radius: 5px;
  margin-right: 3px;
  display: flex;
}

.ops .result .correct td.box-number img {
  max-width: 100%;
  max-height: 100%;
  border-radius: 3px;
}

.ops .result .correct td.box-number .value {
  color: #fff;
  font-size: 7rem;
  font-weight: bold;
}

.ops .result .correct td.photo {}

.ops .result .correct td.photo a {}

.ops .result .correct td.photo .media-container {
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.ops .result .correct td.photo img {
  border-radius: 10px;
}

.ops .result .correct td.sku {
  font-weight: 600;
  font-size: 3rem;
}

.ops .result .correct td.var {
  font-weight: 600;
  font-size: 3rem;
}

.ops .result .correct td.qty {
  border-radius: 0 1rem 1rem 0;
}

.ops .result .correct td.qty .wrapper {}

.ops .result .correct td.qty .counter {
  font-size: 5rem;
  color: #fff;
}

.ops .result .correct td.qty .action {}

.ops .result .correct td.qty .action button {
  margin: 0 auto;
  padding: 4px 15px;
  cursor: pointer;
  border-radius: 3px;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #357938;
  box-shadow: 0 1px 0 0 rgb(17 51 18 / 33%);
}

.ops .btk {}

.ops .btk .header {
  margin-bottom: 2rem;
  padding-top: 1rem;
}

.ops .btk .header .tabs {
  justify-content: center;
}

.ops .btk .header .tab {
  display: block;
  padding: 1.3rem 2rem;
  font-size: 2rem;
  color: #6c7182;
  text-decoration: none;
  border: 1px solid #b6bacc;
  margin-right: -1px;
}

.ops .btk .header .tab:nth-child(1) {
  border-radius: 1rem 0 0 1rem;
}

.ops .btk .header .tab:nth-last-child(1) {
  border-radius: 0 1rem 1rem 0;
}

.ops .btk .header .tab.active {
  background-color: #2196f3;
  border: 1px solid #2196f3;
  color: #fff;
  box-shadow: rgb(33 150 243 / 39%) 0px 3px 8px;
}

.ops .btk .wrapper {}

.ops .btk table {
  border-collapse: collapse;
  width: 100%;
  font-size: 2rem;
}

.ops .btk tr {}

.ops .btk tr.partial {
  background-color: #2196f31a;
}

.ops .btk tr.complete {
  background-color: #4caf503b;
}

.ops .btk th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 5px;
}

.ops .btk td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 5px;
  font-size: 2rem;
}

.ops .btk td a {
  text-decoration: none;
  color: #000;
}

.ops .btk td.box-number .flag {
  width: 21px;
}

.ops .btk td.box-number .value {
  font-weight: bold;
  font-size: 4rem;
}

.ops .btk td.photo {
  padding: 0;
  width: 100px;
}

.ops .btk td.photo .media-container {
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.ops .btk td.sku .title {
  color: #a1abd4;
}

.ops .btk td.sku .sku-id .value {
  font-weight: bold;
  font-size: 2.4rem;
}

.ops .btk td.qty span {
  font-size: 3rem;
  font-weight: 600;
}

.ops .btk td.warehouse {}

.ops .btk td.warehouse img {
  width: 21px;
}

.ops .box-select {}

.ops .box-select .wrapper {}

.ops .box-select .input-wrapper {}

.ops .box-select .input-wrapper select {
  font-size: 3rem;
  padding: 1.3rem;
  height: auto;
  border-radius: 1rem;
}

.report-orders-list .box-title {
  font-size: 2rem;
  font-weight: bold;
}

.report-orders-list table td {}

.report-orders-list table td.pending {
  background-color: #ffeb3b33;
}

.report-orders-list table td.processing {
  background-color: #bdbcb133;
}

.report-orders-list table td.ready_to_ship {
  background-color: #f4e2f9;
}

.report-orders-list table td.shipped {
  background-color: #e2eff9;
}

.report-orders-list table td.received {
  background-color: #e4f9e2;
}

.report-orders-list table td.canceled {
  background-color: #ff7f7f;
}

.report-orders-list table td.canceled-return_by_fetcher {
  background-color: #ffa38b;
}

.report-orders-list table td.canceled-return_by_customer {
  background-color: #ffa38b;
}

.report-orders-list table td.pre_cancel {
  background-color: #ffa9ce8f;
}

.report-orders-list table td.paid {
  background-color: #4caf50;
}

.report-orders-list table tr.pending {
  background-color: #ffeb3b33;
}

.report-orders-list table tr.processing {
  background-color: #bdbcb133;
}

.report-orders-list table tr.ready_to_ship {
  background-color: #f4e2f9;
}

.report-orders-list table tr.shipped {
  background-color: #e2eff9;
}

.report-orders-list table tr.received {
  background-color: #e4f9e2;
}

.report-orders-list table tr.canceled {
  background-color: #ff7f7f;
}

.report-orders-list table tr.canceled-return_by_fetcher {
  background-color: #ffa38b;
}

.report-orders-list table tr.canceled-return_by_customer {
  background-color: #ffa38b;
}

.report-orders-list table tr.pre-canceled {
  background-color: #ffa9ce8f;
}

.report-orders-list table tr.paid {
  background-color: #4caf50;
}

.report-orders-list table span {
  font-size: 1.2rem;
  color: #b1b1b1;
  font-weight: bold;
}

.report-orders-list table tr.total {}

.report-orders-list table tr.total td {
  font-size: 2rem;
  font-weight: bold;
  border: 1px solid #000000;
  background-color: #34435f;
  color: #fff;
}

.report-orders-list table tr.color-red td {
  background-color: #ffe4e4;
}

.report-orders-list table tr.color-blue td {
  background-color: #6ab9f726;
}

.report-orders-list table tr.color-purple td {
  background-color: #8b69c833;
}

.report-orders-list table tr.color-green td {
  background-color: #7cc57f2b;
}

.fetcher-list {}

.fetcher-list .box-head {}

.fetcher-list .box-head .title {}

.fetcher-table table {
  border-collapse: collapse;
  width: 100%;
  border-spacing: 0;
}

.fetcher-table tr {}

.fetcher-table tr.pending {
  background-color: #ffeb3b33;
}

.fetcher-table tr.processing {
  background-color: #bdbcb133;
}

.fetcher-table tr.ready_to_ship {
  background-color: #f4e2f9;
}

.fetcher-table tr.shipped {
  background-color: #e2eff9;
}

.fetcher-table tr.received {
  background-color: #e4f9e2;
}

.fetcher-table tr.cancel {
  background-color: #ff7f7f;
}

.fetcher-table tr.pre_cancel {
  background-color: #ffa9ce8f;
}

.fetcher-table th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 1.8rem;
  color: #1c2c49;
  margin: 0;
  border-collapse: collapse;
}

.fetcher-table td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 0.5rem;
  font-weight: normal;
  font-size: 1.8rem;
  margin: 0;
  border-collapse: collapse;
}

.vue-treeselect div,
.vue-treeselect span {
  font-size: 2rem;
}

.filepond--file-info .filepond--file-info-main {
  font-size: 1.8rem;
}

.filepond--file-info .filepond--file-info-sub {
  font-size: 1.6rem;
}

.filepond--drop-label label {
  font-size: 2em !important;
}

.filepond--file-action-button.filepond--file-action-button {
  width: 3.4em;
  height: 3.4em;
}

.v-select,
.v-select * {
  font-size: 2rem;
}

.product .filepond--item {
  width: calc(25% - 0.5em);
}

.orders-list .item-list td.status .wrapper {
  white-space: nowrap;
}

.item-list .list td .media-container {
  display: flex;
  justify-content: center;
}

.dp-picker .page-title .batch-info {
  align-items: center;
}

.dp-picker .page-title .batch-id {
  padding: 0.5rem 1rem;
  background-color: #e3e5ec;
  border-radius: 5px;
  font-weight: bold;
  margin-right: 0.8rem;
  font-size: 3rem;
}

.dp-picker .page-title .batch-range {
  font-size: 1.8rem;
}

.dp-picker .batch-info .batch-date {
  font-size: 1.8rem;
  color: #787fa0;
  font-weight: 300;
  margin-left: 1rem;
}

.dp-picker .links-sc {}

.dp-picker .links-sc .wrapper {
  flex-flow: wrap;
}

.dp-picker .links-sc .left {
  box-sizing: border-box;
  padding: 2rem;
  border-right: 1px solid #e5e6eb;
}

.dp-picker .links-sc .left .links {
  width: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  color: #535d67;
  transition: 0.2s;
}

.dp-picker .links-sc .left .links:hover {
  color: #2196f3;
}

.dp-picker .links-sc .right {
  box-sizing: border-box;
}

.dp-picker .links-sc .summery {}

.dp-picker .links-sc .summery .qty {
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.6rem;
  padding: 2rem;
  font-weight: bold;
  border-right: 1px solid #e5e6eb;
}

.dp-picker .links-sc .summery .total {
  width: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.6rem;
  padding: 2rem;
  font-weight: bold;
  color: #4caf50;
}

.dp-picker .links-sc .summery .total span {
  font-size: 1.6rem;
  font-weight: normal;
  color: #989eb5;
}

.dp-picker .results {}

.dp-picker .results .tab {}

.dp-picker .results .tab.tabcontent {
  display: none;
}

.dp-picker .results .tab.pick {}

.dp-picker .results .tab.collect {}

.dp-picker .item-list {}

.dp-picker .results .item {
  margin-bottom: 10px;
}

.dp-picker .results .item .wrapper {
  background-color: #fff;
  border-radius: 1rem;
  display: flex;
}

.dp-picker .results .item.complete .wrapper {
  background-color: #cee6c54d;
  border: 1px solid #7db967;
  box-sizing: border-box;
}

.dp-picker .results .item.not-complete .wrapper {
  background-color: #ffc10729;
  border: 1px solid #ffc107;
  box-sizing: border-box;
}

.dp-picker .results .item .qty-sc {
  padding-right: 1rem;
  display: flex;
  flex-wrap: wrap;
  width: 50px;
  align-items: center;
}

.dp-picker .results .item .qty-select {
  font-size: 18px;
  width: 50px;
  box-sizing: border-box;
  border: 1px solid #9b9fb9;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  padding: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: "";
  text-align-last: center;
}

.dp-picker .results .item .qty-count {
  font-size: 16px;
  width: 50px;
  box-sizing: border-box;
  border: 1px solid #9b9fb9;
  border-bottom: none;
  border-radius: 5px 5px 0 0;
  padding: 5px;
  text-align-last: center;
  background-color: #fff;
}

.dp-picker .results .item .qty-select::-ms-expand {
  display: none;
}

.dp-picker .results .item .collect-bt {
  width: 50px;
  height: 36px;
  display: block;
  box-sizing: border-box;
  border: none;
  background-color: #6ac34a;
  border-radius: 0 0 5px 5px;
  transition: 0.2s;
}

.dp-picker .results .item .collect-bt:hover {
  transform: scale(1.05, 1.05);
  border-radius: 5px;
}

.dp-picker .results .item .collect-bt:active {
  transform: scale(1.05, 1.05);
  border-radius: 5px;
}

.dp-picker .results .item .collect-bt img {
  width: 20px;
}

.dp-picker .results .item .undo-bt {
  width: 50px;
  height: 36px;
  display: block;
  box-sizing: border-box;
  border: none;
  background-color: #ff2e2e;
  border-radius: 0 0 5px 5px;
  transition: 0.2s;
}

.dp-picker .results .item .undo-bt:hover {
  transform: scale(1.05, 1.05);
  border-radius: 5px;
}

.dp-picker .results .item .undo-bt:active {
  transform: scale(1.05, 1.05);
  border-radius: 5px;
}

.dp-picker .results .item .undo-bt img {
  width: 20px;
}

.dp-picker .results .item .photo-sc {
  border-right: 1px solid #dcdde4;
  width: 110px;
  position: relative;
  padding: 0.5rem;
}

.dp-picker .results .item .photo-sc .photo {}

.dp-picker .results .item .photo-sc a {}

.dp-picker .results .item .photo-sc .media-container {
  text-align: center;
  margin: 0;
  padding: 0;
  height: 110px;
}

.dp-picker .results .item .photo-sc img {}

.dp-picker .results .item .price {
  position: absolute;
  font-size: 2rem;
  width: 110px;
  bottom: 4px;
  text-align: center;
  padding: 5px;
  box-sizing: border-box;
  background-color: rgb(255 255 255 / 50%);
}

.dp-picker .results .item .price .main {}

.dp-picker .results .item .price .total {}

.dp-picker .results .item .price .aed {}

.dp-picker .results .item .more-sc {
  padding: 1rem;
  font-size: 2rem;
  flex-grow: 1;
  position: relative;
}

.dp-picker .results .item .dp-loc {}

.dp-picker .results .item .sc {
  width: 100%;
}

.dp-picker .results .item .sku {
  font-weight: bold;
  font-size: 3rem;
  display: flex;
  align-items: center;
}

.dp-picker .results .item .var {}

.dp-picker .results .item .style-no {
  font-weight: normal;
  background-color: rgb(0 0 0 / 15%);
  padding: 0.5rem 1rem;
  font-size: 1.8rem;
  border-radius: 5px;
  margin-left: 6px;
}

.dp-picker .results .item .zero-qty {}

.dp-picker .results .item .zero-bt {
  background-color: #607d8b36;
  border: 1px solid #607d8b78;
  padding: 0.5rem 2rem;
  border-radius: 5px;
  color: #607d8b;
  margin-top: 8px;
  font-size: 1.8rem;
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg,
          rgba(255, 255, 255, 1) 0%,
          rgb(96 125 139 / 30%) 100%);
}

.dp-check .results .item .qty-count {}

.dp-check .results .item .qty-bt {
  width: 50px;
  height: 35px;
  display: block;
  box-sizing: border-box;
  border: none;
  transition: 0.2s;
  font-size: 2.6rem;
  font-weight: bold;
  color: #fff;
}

.dp-check .results .item .add-qty {
  background: #4caf50;
}

.dp-check .results .item .qty-bt img {
  width: 20px;
}

.dp-check .results .item .remove-qty {
  background-color: #ff2424;
  border-radius: 0 0 5px 5px;
}

.dp-check .results .item .dp-loc {
  margin-top: 5px;
}

.dp-check .results .item .dp-loc .loc {
  width: 26px;
  margin: 0;
  padding: 0.5rem;
  text-align: center;
  margin-right: 3px;
  border: 1px solid #a2a6b3;
  border-radius: 5px;
}

.dp-check .results .item .cost {
  margin-top: 5px;
}

.dp-check .results .item .item-cost {
  width: 40px;
  margin: 0;
  padding: 0.5rem;
  text-align: center;
  margin-right: 5px;
  border: 1px solid #a2a6b3;
  border-radius: 5px;
}

.dp-check .results .item.out-of-stock .wrapper {
  background-color: #ffc1071c;
  border: 1px solid #ffc107;
  box-sizing: border-box;
}

/* taeb-switch styles */

.taeb-switch .taeb {
  display: inline-block;
  width: 50%;
  padding: 12px 0;
  z-index: 1;
  position: relative;
  cursor: pointer;
  transition: 200ms;
  font-size: 2.4rem;
  line-height: normal;
  text-align: center;
}

.taeb-switch .taeb.active {
  color: #0e111d;
  background-color: #d0d3e0;
  font-weight: 600;
  border-radius: 7px;
}

.dp-picker .tab-toggles {}

.dp-picker .tab-toggles .wrapper {
  background-color: #fff;
  padding: 1rem;
  margin-bottom: 3rem;
  border-radius: 1rem;
}

.dp-picker .page-header .view-grid-bts {
  display: flex;
}

.dp-picker .page-header .view-grid-bts .bt {
  display: block;
  border: none;
  padding: 0.5rem;
  color: #000;
  border-radius: 5px;
  background-color: #eff1f9;
  cursor: pointer;
}

.dp-picker .page-header .view-grid-bts .bt:nth-child(1) {
  margin-right: 1rem;
}

.dp-picker .results.gallery .item-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.dp-picker .results.gallery .item {
  width: 32%;
}

.dp-picker .results.gallery .item .wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
}

.dp-picker .results.gallery .item .photo-sc {
  border: none;
  width: auto;
  padding: 0;
}

.dp-picker .results.gallery .item .more-sc {
  display: none;
}

.dp-picker .results.gallery .item .qty-sc {
  display: none;
}

.dp-picker .results.gallery .item .photo-sc .media-container {
  height: 90px;
}

.old-report .table-weapper .note {
  background-color: #ecedf1;
  margin-bottom: 1rem;
  font-size: 1.8rem;
  padding: 1rem;
}

.old-report .table-weapper .note .color-code {
  padding: 0.5rem 1rem;
  border: 1px solid #c0c5da;
}

.old-report .table-weapper .note .pending {
  background-color: #ffeb3b33;
}

.old-report .table-weapper .note .processing {
  background-color: #bdbcb133;
}

.old-report .table-weapper .note .ready_to_ship {
  background-color: #f4e2f9;
}

.old-report .table-weapper .note .shipped {
  background-color: #e2eff9;
}

.old-report .table-weapper .note .received {
  background-color: #e4f9e2;
}

.old-report .table-weapper .note .cancel {
  background-color: #ff7f7f;
}

.old-report .table-weapper .note .pre_cancel {
  background-color: #ffa9ce8f;
}

.old-report .table-weapper table {
  border-collapse: collapse;
  width: 100%;
  border-spacing: 0;
}

.old-report .table-weapper th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 0.5rem;
  font-weight: bold;
  font-size: 1.8rem;
  color: #1c2c49;
  margin: 0;
  border-collapse: collapse;
}

.old-report .table-weapper td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 0;
  font-weight: normal;
  font-size: 1.8rem;
  margin: 0;
  border-collapse: collapse;
}

.old-report.warehouse-value .table-weapper td.pho {
  text-align: center;
  width: 140px;
}

.old-report.warehouse-value .table-weapper td.pho .media-container {
  width: 140px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.old-report.warehouse-value .table-weapper td.inf {
  min-width: 240px;
}

.old-report.warehouse-value .table-weapper td.inf .style-no {
  font-size: 3rem;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
}

.old-report.warehouse-value .table-weapper td.inf .title {
  border-bottom: 1px solid #ddd;
  padding: 1rem 0.5rem;
}

.old-report.warehouse-value .table-weapper td.inf .brand {
  border-bottom: 1px solid #ddd;
  padding: 1rem 0.5rem;
}

.old-report.warehouse-value .table-weapper td.inf .status {
  padding: 1rem 0.5rem;
  font-size: 2rem;
  font-weight: bold;
}

.old-report.warehouse-value .table-weapper td.inf .status.published {
  color: #4caf50;
}

.old-report.warehouse-value .table-weapper td.inf .status.ready_to_publish {
  color: #cddc39;
}

.old-report.warehouse-value .table-weapper td.inf .status.draft {
  color: #ff9800;
}

.old-report.warehouse-value .table-weapper td.loc {
  min-width: 130px;
}

.old-report.warehouse-value .table-weapper td.loc input {
  width: 77px;
}

.old-report.warehouse-value .table-weapper td.loc label {
  font-size: 1.4rem;
}

.old-report.warehouse-value .table-weapper td.loc .uae-loc {
  border-bottom: 1px solid #ddd;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.old-report.warehouse-value .table-weapper td.loc .kw-loc {
  border-bottom: 1px solid #ddd;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.old-report.warehouse-value .table-weapper td.loc .dp-loc {
  border-bottom: 1px solid #ddd;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.old-report.warehouse-value .table-weapper td.loc .dp-loc .cont {
  justify-content: space-between;
  width: 85px;
}

.old-report.warehouse-value .table-weapper td.loc .dp-loc input {
  width: 19px;
}

.old-report.warehouse-value .table-weapper td.loc .loc-submit {
  padding: 1rem;
}

.old-report.warehouse-value .table-weapper td.loc .loc-submit button {}

.old-report.warehouse-value .table-weapper td.qty {}

.old-report.warehouse-value .table-weapper td.qty .total-qty {
  font-size: 3rem;
  font-weight: bold;
  padding-bottom: 1rem;
  border-bottom: 1px solid #ddd;
  padding: 1rem 0.5rem;
}

.old-report.warehouse-value .table-weapper td.qty .total-qty span {
  font-size: 1.4rem;
  font-weight: normal;
}

.old-report.warehouse-value .table-weapper td.qty .total-shelve-qty {
  font-size: 3rem;
  font-weight: bold;
  padding-bottom: 1rem;
}

.old-report.warehouse-value .table-weapper td.qty .total-shelve-qty span {
  font-size: 1.4rem;
  font-weight: normal;
}

.old-report.warehouse-value .table-weapper td.qty .qty-table {
  /* padding: 5px; */
  border-bottom: 1px solid #ddd;
  padding: 1rem 0.5rem;
}

.old-report.warehouse-value .table-weapper td.qty table {}

.old-report.warehouse-value .table-weapper td.qty table tr {}

.old-report.warehouse-value .table-weapper td.qty table td {
  font-size: 1.4rem;
  padding: 2px;
}

.old-report.warehouse-value .table-weapper td.qty .shelve-qty {

}

.old-report.warehouse-value .table-weapper td.qty .shelve-qty .title{
  font-size: 1.5rem;
  font-weight: bold;
  padding-bottom: 1rem;
}

.old-report.warehouse-value .table-weapper td.qty .shelve-qty .value,
.old-report.warehouse-value .table-weapper td.qty .showroom-qty .value{
  font-size: 3rem;
  font-weight: bold;
  padding-bottom: 1rem;
}

.old-report.warehouse-value .table-weapper td.val {
  min-width: 120px;
  font-size: 1.6rem;
}

.old-report.warehouse-value .table-weapper td.val .cell {
  border-bottom: 1px solid #ddd;
  padding: 1rem 0.5rem;
}

.old-report.warehouse-value .table-weapper td.val .cell:nth-last-child(1) {
  border: none;
}

.old-report.warehouse-value .table-weapper td.val .sub {}

.old-report.warehouse-value .table-weapper td.val .sub .title {}

.old-report.warehouse-value .table-weapper td.val .sub .value {
  font-size: 2rem;
  font-weight: bold;
}

.old-report.warehouse-value .table-weapper td.val .sub .currency {
  font-size: 1.2rem;
  color: #afafaf;
}

.old-report.warehouse-value .table-weapper td.val .total .title {}

.old-report.warehouse-value .table-weapper td.val .total .value {
  font-size: 2rem;
  font-weight: bold;
  color: #0083ff;
}

.old-report.warehouse-value .table-weapper td.val .total .currency {
  font-size: 1.2rem;
  color: #afafaf;
}

.old-report.warehouse-value .table-weapper td.pri {
  min-width: 120px;
}

.old-report.warehouse-value .table-weapper td.pri .input-wrap {
  border-bottom: 1px solid #ddd;
  padding: 7px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.old-report.warehouse-value .table-weapper td.pri label {
  font-size: 1.4rem;
}

.old-report.warehouse-value .table-weapper td.pri input {
  width: 30px;
}

.old-report.warehouse-value .table-weapper td.pri .profit {
  width: 30px;
  background-color: #efefef;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #4caf50;
  font-weight: 600;
}

.old-report.warehouse-value .table-weapper td.pri .price-submit {
  padding: 1rem;
}

.old-report.warehouse-value .table-weapper td.oth {
  min-width: 180px;
}

.old-report.warehouse-value .table-weapper td.oth .cell {
  display: flex;
  justify-content: space-between;
  padding: 5px;
  border-bottom: 1px solid #ddd;
  font-size: 1.6rem;
}

.old-report.warehouse-value .table-weapper td.oth .cell:nth-last-child(1) {
  border: none;
}

.old-report.warehouse-value .table-weapper td.oth .cell .title {
  color: #989898;
}

.old-report.warehouse-value .table-weapper td.oth .cell .value {
  font-weight: 600;
}

.old-report.warehouse-value .table-weapper td.oth .cell .value span {
  font-size: 1rem;
  font-weight: normal;
}

.old-report.warehouse-value .table-weapper td.lin {
  min-width: 90px;
}

.old-report.warehouse-value .table-weapper td.lin a {
  display: block;
  margin-bottom: 5px;
}

.old-report.warehouse-value .table-weapper {
  overflow-y: scroll;
}

.old-report.warehouse-value .table-weapper tr.total {
  background-color: #f3f8fd;
}

.old-report.warehouse-value .table-weapper tr.backorder {
  background-color: #e2f6c9;
}

.standard-table {
  overflow-y: scroll;
}

.standard-table.no-overflow {
  overflow-y: initial;
}

.standard-table table {
  border-collapse: collapse;
  width: 100%;
  font-size: 1.6rem;
}

.standard-table table td {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 0.5rem;
}

.standard-table table th {
  border: 1px solid #dddddd;
  text-align: center;
  padding: 0.5rem;
  font-weight: bold;
}
.standard-table.fat-cell table td {
  padding: 1.2rem 1rem;
}
.standard-table.double-color table tr:nth-child(even) {
  background-color: rgb(0 0 0 / 2%);
}
.standard-table table .photo {
  width: 80px;
  text-align: center;
}

.standard-table table .strong {
  color: #000;
  font-weight: bold;
}

.standard-table table .currency {
  font-size: 1.2rem;
  color: #b1b1b1;
  font-weight: bold;
}

.standard-table table .green {
  color: #4caf50;
}

.standard-table table .divider td {
  border: none;
}

.sale-report .standard-table table .number {
  font-size: 2.4rem;
}
.standard-table td.left-align {
  text-align: left;
}




.shop-miss table td.photo {
  padding: 0;
}

.shop-miss table td.photo .media-container {
  width: 130px;
  margin: 0 auto;
}

.shop-miss table td.desc {
  text-align: left;
}

.shop-miss table td.desc a {
  text-decoration: none;
  color: #222;
}

.shop-miss table td.desc .style-no {
  font-weight: bold;
  font-size: 2.5rem;
}

.shop-miss table td.qty .small-table table {}

.shop-miss table td.qty .small-table table td {
  font-size: 1.2rem;
  padding: 0.2rem;
}

.shop-miss table td.qty .total {
  font-weight: bold;
  font-size: 3rem;
}
.product .recharge-bt {
  margin-top: 15px;
}
.product .prd-invoices {

}
.product .invs-container {
  max-height: 320px;
  overflow: auto;
}
.product .invs-container .inv-wrapper {
  padding: 10px;
  font-size: 13px;
  background-color: #f5f6fa;
  border: 1px solid #dee0e9;
  border-radius: 8px;
  margin-bottom: 10px;
}
.product .invs-container .inv-wrapper.deleted {
  background-color: #e91e1e24;
  border: 1px solid #ffc4c4;
}
.product .invs-container .row {

}
.product .invs-container .row .title {

}
.product .invs-container .row .value {
  display: flex;
  align-items: center;
}
.product .invs-container .row .delete {
  padding: 0;
  border: none;
  margin: 0 0 3px 3px;
}
.product .invs-container .row .delete .fi {
  width: 16px;
  height: 16px;
}
.uae-recharge-modal .modal-wrapper {

}
.uae-recharge-modal .modal .content {
  padding: 2rem;
}
.uae-recharge-modal .vars-list {

}
.uae-recharge-modal .vars-list .row {
  margin-bottom: 5px;
  align-items: center;
  padding: 0.5rem;
}
.uae-recharge-modal .vars-list .row:nth-child(even) {
  background-color: #f5f6fa;
}
.uae-recharge-modal .vars-list .var-name {
  width: 85%;
  text-align: left;
}
.uae-recharge-modal .vars-list .input-wrapper,
.uae-recharge-modal .vars-list .input-title {

  padding: 0 5px;
  margin: 0;
  width: 15%;
}
.uae-recharge-modal .vars-list .input-wrapper input {
  padding: 5px;
}

/* qqq */

.warehouse-report .box-header .title {
  font-size: 2rem;
  color: #0083ff;
}

.warehouse-report .chart-container {
  position: relative;
  padding: 15px;
}

/* new css */
.live-list .merge-bt {
  background: #4caf50;
  border: 1px solid #4caf50;
}

.live-list .merge-bt:hover {
  background: #4caf501f;
  border: 1px solid #4caf50;
  color: #4caf50;
}

.scroll-y-wrapper {
  overflow-x: scroll;
  overflow-y: hidden;
}

.live-list .lo-table tr:nth-child(odd) {
  background-color: #f5f6fa;
}

.lo-table table .customer {
  text-align: left;
  font-weight: bold;
}

.lo-table table .customer .phone {
  font-weight: normal;
}

.lo-table table .product {
  padding: 0;
  width: 480px;
}

.lo-table table .lo-product {
  box-sizing: border-box;
  text-decoration: none;
  color: #000;
  text-align: left;
  width: 480px;
  overflow: hidden;
  align-items: center;
}

.lo-table table .lo-product:not(:last-child) {
  border-bottom: 1px solid #ddd;
}

.lo-table table .cell {
  box-sizing: border-box;
  height: 60px;
}

.lo-table table .cell:not(:last-child) {
  border-right: 1px solid #ddd;
}

.lo-table table .photo {
  width: 60px;
  height: 60px;
}

.lo-table table .photo img {
  max-width: 100%;
  max-height: 100%;
  margin: 0 auto;
}

.lo-table table .info {
  width: 260px;
  padding: 0 5px;
}

.lo-table table .info .title {
  height: 20px;
  width: 249px;
  overflow: hidden;
}

.lo-table table .info .style-no {
  height: 20px;
  width: 249px;
  overflow: hidden;
  color: #9c9c9c;
}

.lo-table table .info .variant {
  height: 20px;
  width: 249px;
  overflow: hidden;
  font-weight: bold;
}

.lo-table table .qty {
  width: 40px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
  line-height: 60px;
}

.lo-table table .price {
  width: 100px;
  font-weight: bold;
  color: #4caf50;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.lo-table table .price .total {
  width: 100%;
  text-align: center;
}

.lo-table table .price .each {
  width: 100%;
  font-size: 12px;
  font-weight: normal;
  color: #5c5c5c;
  text-align: center;
  margin-top: -25px;
}

.lo-table table .price .currency {}

.lo-table table .remove {
  width: 20px;
  line-height: 60px;
}

.lo-table table .remove button {
  border: none;
}

.lo-table table .remove button:hover {
  background-color: #ff5353;
  color: #fff;
}

.lo-table table .sub-total .cell {
  height: 30px;
}

.lo-table table .sub-total .cell:not(:last-child) {}

.lo-table table .lo-product.sub-total {
  background-color: #efefef;
}

.lo-table table .placeholder {
  width: 320px;
  line-height: 30px;
  text-align: center;
  background-color: #535353;
  color: #fff;
}

.lo-table table .tot-qty {
  line-height: 30px;
  background-color: #535353;
  color: #fff;
}

.lo-table table .tot-price {
  background-color: #535353;
  color: #fff;
  width: 120px;
  font-size: 20px;
}

.lo-table table .delivery {
  background-color: #d2d2d2;
  text-align: center;
}

.lo-table table .delivery .charge {
  font-weight: bold;
}

.lo-table table .delivery i {}

.lo-table table .options {
  width: 140px;
  min-width: 140px;
  box-sizing: border-box;
  padding: 0;
}

.lo-table table .links {
  flex-wrap: wrap;
}

.lo-table table .lo-bt {
  width: calc(50% - 10px);
  display: block;
  box-sizing: border-box;
  margin: 5px;
  text-decoration: none;
  color: #000;
  background-color: #dbdfec;
  padding: 5px 0;
  text-align: center;
  border-radius: 5px;
  font-size: 12px;
  border: none;
}

.lo-table table .lo-bt.cancel {
  background-color: #e44848;
  color: #fff;
}

.lo-table table .lo-bt.submit {
  background-color: #4caf50;
  color: #fff;
}

.liveshopping .search-prd input {
  border-radius: 0.5rem 0 0 0.5rem;
  border-right: none;
}

.liveshopping .search-prd button {
  width: auto;
  padding: 1rem;
  border-radius: 0 0.5rem 0.5rem 0;
}

.livesell .daily-goal .balance {
  width: 10%;
}

.livesell .daily-goal .balance.right {
  text-align: right;
}

.livesell .daily-goal .progress-bar {
  width: 100%;
  display: flex;
  align-items: center;
}

.livesell .daily-goal progress {
  height: 4rem;
  width: 100%;
}

.livesell .prd-info {
  font-size: 2rem;
  display: flex;
  margin-bottom: 10px;
}

.livesell .profit-graph .cell.pr60 {
  background-color: #4caf50;
}

.livesell .profit-graph .cell.pr50 {
  background-color: #8bc34a;
}

.livesell .profit-graph .cell.pr40 {
  background-color: #cddc39;
}

.livesell .profit-graph .cell.pr30 {
  background-color: #ffde00;
}

.livesell .profit-graph .cell.pr20 {
  background-color: #ff9800;
}

.livesell .profit-graph .cell.pr10 {
  background-color: #ff5722;
}

.livesell .prd-info {}

.livesell .prd-info .photo {
  width: 160px;
  box-sizing: border-box;
}

.livesell .prd-info .photo a {}

.livesell .prd-info .photo img {}

.livesell .prd-info .photo .style-no {
  text-align: center;
  background-color: #e3e4ec;
  padding: 5px 0;
  font-weight: 600;
}

.livesell .prd-info .details {
  width: calc(100% - 160px);
  box-sizing: border-box;
  padding-left: 10px;
}

.livesell .prd-info .details .title a {
  color: #607d8b;
  margin-bottom: 5px;
}

.livesell .price-info {}

.livesell .price-info.c-price-info .cell.r-price,
.livesell .price-info.c-price-info .cell.cost {
  display: grid;
}

.livesell .price-info .cell {
  padding: 10px;
  background-color: rgb(216 216 220);
  border-radius: 15px;
  width: 48%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.livesell .price-info .cell.r-price {
  background-color: rgb(139 195 74 / 60%);
}

.livesell .price-info .cell.cost {
  background-color: rgb(255 0 0 / 40%);
}

.livesell .price-info .cell .title {
  font-weight: 600;
  color: #fff;
  margin-bottom: 5px;
}

.livesell .price-info .cell .price {
  display: flex;
  align-items: center;
}

.livesell .price-info .cell .balance {
  font-size: 32px;
  font-weight: bold;
}

.livesell .price-info .cell .currency {
  font-size: 1.8rem;
  opacity: 0.5;
  font-weight: normal;
  margin-left: 2px;
}

.livesell .price-info .cell .converted-p {
  display: flex;
  align-items: center;
}

.livesell .price-info .cell .converted-p .balance {
  color: #fff;
  font-size: 18px;
}

.livesell .price-info .cell .converted-p .currency {
  font-size: 12px;
}

.livesell .profit-graph {
  padding: 5px;
}

.livesell .profit-graph .cell {
  width: calc(100%/3);
  text-align: center;
  padding: 7px 0;
}

.livesell .profit-graph .cell:nth-child(1) {
  border-radius: 15px 0 0 15px;
}

.livesell .profit-graph .cell:nth-last-child(1) {
  border-radius: 0 15px 15px 0;
}

.livesell .profit-graph .precent {
  font-size: 14px;
  opacity: 0.8;
}

.livesell .profit-graph .value {
  font-weight: bold;
  font-size: 24px;
  color: #fff;
}

.livesell .size-table tr:nth-child(even) {
  background-color: #f2f3f7;
}

.livesell .size-table td {
  font-size: 2rem;
  padding: 1rem;
}

.livesell .size-table td.qty {
  font-weight: bold;
  font-size: 2.6rem;
}

.livesell .size-table td.res {
  font-weight: bold;
  font-size: 2.6rem;
  color: #ff5722;
}

.livesell .size-table td.shop {
  width: 1%;
  white-space: nowrap;
}

.livesell .size-table .add {
  background-color: initial;
  background-image: linear-gradient(-180deg, #00d775, #00bd68);
  border-radius: 5px;
  box-shadow: rgb(0 0 0 / 10%) 0 2px 4px;
  color: #ffffff;
  cursor: pointer;
  height: 40px;
  line-height: 40px;
  overflow: hidden;
  padding: 0px 40px;
  text-align: center;
  white-space: nowrap;
  border: 0;
  font-size: 16px;
}

.livesell .last-orders {
  font-size: 2rem;
}

.livesell .last-orders .box {
  /* margin-bottom: 1rem; */
}

.livesell .last-orders .header {}

.livesell .last-orders .header .wrapper {
  display: flex;
  justify-content: space-between;
}

.livesell .last-orders .header label {}

.livesell .last-orders .header a {}

.livesell .last-orders .item {
  padding: 0;
}

.livesell .last-orders .item .customer {
  padding: 0.5rem 1rem;
  border-bottom: 1px solid #c4cdd5;
  margin-bottom: 5px;
}

.livesell .last-orders .item .prd-detail {
  display: flex;
  padding: 1rem;
  position: relative;
}

.livesell .last-orders .item .photo {
  width: 70px;
  height: 70px;
  text-align: center;
  background-color: #e1e1e1;
  border-radius: 5px;
  overflow: hidden;
  margin-right: 6px;
}

.livesell .last-orders .item .photo img {}

.livesell .last-orders .item .info {}

.livesell .last-orders .item .style-no {
  color: #6e6e6e;
}

.livesell .last-orders .item .var {
  font-weight: bold;
}

.livesell .last-orders .item .price {
  display: flex;
}

.livesell .last-orders .item .sell {
  font-weight: bold;
  font-size: 2.5rem;
  color: #4caf50;
}

.livesell .last-orders .item .profit {
  background-color: #8bc34a;
  color: #fff;
  height: 25px;
  line-height: 25px;
  padding: 0px 0px 0px 10px;
  margin-left: 5px;
  border-radius: 20px;
  display: flex;
}

.livesell .last-orders .item .percentage {
  font-weight: bold;
  font-size: 1.8rem;
  height: 25px;
  display: block;
  background-color: #689a2d;
  margin-left: 5px;
  padding: 0 5px;
  border-radius: 0 5px 5px 0;
}

.livesell .last-orders .item .currency {
  font-size: 1.5rem;
  font-weight: normal;
  color: #8c8c8c;
}

.livesell .last-orders .item .qty {
  position: absolute;
  right: 10px;
  top: 27px;
  background-color: #ff9800;
  color: #fff;
  font-weight: bold;
  font-size: 1.8rem;
  height: 25px;
  width: 25px;
  line-height: 25px;
  border-radius: 999px;
  text-align: center;
}

.livesell .add-modal {
  padding: 3rem;
  max-width: 460px;
  position: relative;
}

.livesell .add-modal .close-bt {}

.livesell .add-modal .close-bt button {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 3rem;
  border: none;
  background-color: #0000;
  opacity: 0.5;
}

.livesell .add-modal .form-wrapper {}

.livesell .add-modal .var {
  text-align: center;
  margin: 10px 0 20px 0;
}

.livesell .add-modal .var span {
  font-size: 2rem;
  padding: 5px 10px;
  background-color: #e9e9e9;
  border-radius: 999px;
}

.livesell .add-modal .customer-name {}

.livesell .add-modal .customer-name .select2 {
  font-size: 2rem;
}

.livesell .add-modal .select2-container .select2-selection--single {
  height: 40px;
  border-radius: 5px;
  border: 1px solid #c4cdd5;
}

.livesell .add-modal .select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 37px;
}

.livesell .add-modal .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 40px;
}

.livesell .add-modal .select2-container--default .select2-selection--single .select2-selection__clear {
  height: 40px;
}

.livesell .add-modal .input-group {
  display: flex;
}

.livesell .add-modal .input-group .x-wrapper {
  margin-bottom: 15px;
  display: flex;
}

.livesell .add-modal .input-group .form-control {}

.livesell .add-modal .input-group .prd-qty {
  margin-right: 10px;
}

.livesell .add-modal .input-group select {
  font-size: 3rem;
  text-align: center;
  width: 50px;
  height: 50px;
  border-radius: 10px;
  font-weight: bold;
  border: 1px solid #848f99;
  outline: none;
}

.livesell .add-modal .input-group .prd-price {
  position: relative;
  margin-right: 10px;
}

.livesell .add-modal .input-group input {
  font-size: 2.5rem;
  height: 50px;
  border-radius: 10px;
  outline: none;
  border: 1px solid #848f99;
  /* padding: 0 10px 0 10px; */
  width: 140px;
  box-sizing: border-box;
  font-weight: bold;
  color: #4caf50;
}

.livesell .add-modal .input-group .prd-price .currency {
  position: absolute;
  right: 10px;
  top: 14px;
  font-size: 2rem;
  color: #848f99;
}

.livesell .add-modal .converted-price {
  font-size: 2rem;
  display: flex;
  border: 1px solid #c4cdd5;
  border-radius: 10px;
  height: 50px;
  box-sizing: border-box;
  line-height: 50px;
}

.livesell .add-modal .c-price {
  padding: 0 5px;
  font-weight: 600;
}

.livesell .add-modal .c-price:not(:last-child) {
  border-right: 1px solid #c4cdd5;
}

.livesell .add-modal .c-price .currency {
  font-size: 1rem;
  margin-left: 2px;
  font-weight: normal;
}

.livesell .add-modal .c-price .one-k {
  font-size: 1rem;
}

.livesell .add-modal .profit-meter {
  display: flex;
  height: 50px;
  box-sizing: border-box;
  background-color: #a5a5a5;
  padding: 10px 17px;
  align-items: center;
  font-size: 3rem;
  border-radius: 10px;
  justify-content: center;
  margin-bottom: 10px;
}

.livesell .add-modal .profit {
  font-weight: bold;
  color: #fff;
  margin-right: 10px;
}

.livesell .add-modal .profit .currency {
  font-weight: normal;
  font-size: 1.8rem;
  margin-left: 3px;
}

.livesell .add-modal .percentage {
  font-size: 2.5rem;
  border-radius: 5px;
  font-weight: 600;
  margin-right: 5px;
  color: #fff;
}

.livesell .add-modal .pr-icon {
  height: 30px;
  width: 30px;
  background-size: contain;
  background-repeat: no-repeat;
}

.livesell .add-modal .profit-meter.pr60 {
  background-color: #4caf50;
}

.livesell .add-modal .profit-meter.pr60 .pr-icon {
  background-image: url(../img/icons/emoji-60.png);
}

.livesell .add-modal .profit-meter.pr50 {
  background-color: #8bc34a;
}

.livesell .add-modal .profit-meter.pr50 .pr-icon {
  background-image: url(../img/icons/emoji-50.png);
}

.livesell .add-modal .profit-meter.pr40 {
  background-color: #cddc39;
}

.livesell .add-modal .profit-meter.pr40 .pr-icon {
  background-image: url(../img/icons/emoji-40.png);
}

.livesell .add-modal .profit-meter.pr30 {
  background-color: #ffde00;
}

.livesell .add-modal .profit-meter.pr30 .pr-icon {
  background-image: url(../img/icons/emoji-30.png);
}

.livesell .add-modal .profit-meter.pr20 {
  background-color: #ff9800;
}

.livesell .add-modal .profit-meter.pr20 .pr-icon {
  background-image: url(../img/icons/emoji-20.png);
}

.livesell .add-modal .profit-meter.pr10 {
  background-color: #ff5722;
}

.livesell .add-modal .profit-meter.pr10 .pr-icon {
  background-image: url(../img/icons/emoji-10.png);
}

.livesell .add-modal .order-note {}

.livesell .add-modal .order-note label {}

.livesell .add-modal .order-note textarea {
  min-height: auto;
}

.livesell .add-modal .modal-buttons {
  justify-content: space-between;
}

.livesell .add-modal .modal-buttons .modal-bt {
  height: 50px;
  font-size: 2.5rem;
  border-radius: 10px;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 40px;
}

.livesell .add-modal .modal-buttons .submit-order {
  background-color: #2196f3;
  color: #fff;
}

.livesell .add-modal .modal-buttons .close-modal {
  cursor: pointer;
  background-color: #e9e9e9;
  font-size: 3rem;
}

.live-orders {
  font-size: 2rem;
}

.live-orders .page-header .wrapper {
  align-items: center;
}

.live-orders .page-header .title {
  font-size: 2.4rem;
  font-weight: 600;
}

.live-orders .page-header .header-btns {}

.live-orders .page-header .header-btns .delete-bt {}

.live-orders .page-header .header-btns .merge-bt {}

.live-orders .page-header .header-btns .cancel-bt {}

.live-orders .orders-list table {}

.live-orders .orders-list table tr {}

.live-orders .orders-list tr:nth-child(odd) {
  background-color: #f5f6fa;
}

.live-orders .orders-list table th {}

.live-orders .orders-list table td {}

.live-orders .orders-list table td.check {
  width: 1%;
  white-space: nowrap;
}

.live-orders .orders-list table td.row-n {
  width: 1%;
  white-space: nowrap;
}

.live-orders .orders-list .customer-info {
  text-align: left;
  min-width: 300px;
  vertical-align: top;
  padding: 1rem;
}

.live-orders .orders-list .customer-info .user {
  justify-content: space-between!important;
}

.live-orders .orders-list .customer-info .user .link-user {
  display: flex;
  gap: 5px;
}

.live-orders .orders-list .customer-info .user .link-user .verify img{
  width: 16px;
}

.live-orders .orders-list .customer-info .label {
  font-weight: 300;
  margin-right: 3px;
  color: #000;
  font-size: 1.8rem;
  opacity: 0.6;
}

.live-orders .orders-list .customer-info .name {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.live-orders .orders-list .customer-info .name .customer-name {
  text-decoration: none;
  color: #000;
  font-weight: 600;
}

.live-orders .orders-list .customer-info .name .facebook-profile {
  text-decoration: none;
  padding: 2px 10px;
  background-color: rgb(0 0 0 / 30%);
  color: #fff;
  font-weight: 300;
  border-radius: 4px;
  margin: 0 5px;
}

.live-orders .orders-list .customer-info .name .recurring {
  background-color: #8bc34a;
  margin: 0 5px;
  width: 22px;
  height: 22px;
  box-sizing: border-box;
  padding: 3px;
  border-radius: 999px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.live-orders .orders-list .customer-info .name .recurring .fi {
  max-width: 100%;
  max-height: 100%;
  color: #fff;
}

.live-orders .orders-list .customer-info .status {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.live-orders .orders-list .customer-info .status > span {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.live-orders .orders-list .customer-info .mine {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.live-orders .orders-list .customer-info .mine > span {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.live-orders .orders-list .customer-info .mine > span.first-mine {
  color: red;
}

.live-orders .orders-list .customer-info .mine > span.last-mine {
  color: orange
}

.live-orders .orders-list .customer-info .status .recurring {
  background-color: #8bc34a;
  margin: 0 5px;
  width: 22px;
  height: 22px;
  box-sizing: border-box;
  padding: 3px;
  border-radius: 999px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.live-orders .orders-list .customer-info .status .recurring .fi {
  max-width: 100%;
  max-height: 100%;
  color: #fff;
}

.live-orders .orders-list .customer-info .name .recurring-live {
  background-color: #00bcd4;
  margin: 0 5px;
  width: 22px;
  height: 22px;
  box-sizing: border-box;
  padding: 3px;
  border-radius: 999px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.live-orders .orders-list .customer-info .name .recurring-live .fi {
  max-width: 100%;
  max-height: 100%;
  color: #fff;
}

.live-orders .orders-list .customer-info .destination {}

.live-orders .orders-list .products {
  padding: 0;
  vertical-align: top;
  /* white-space: nowrap; */
  width: 1%;
}
.live-orders .orders-list .products a.undercost,
.live-orders .orders-list .products a.undercost:hover {
  background-color: red;
}

.live-orders .orders-list .products a.undercost .cell.price .pr-icon {
  height: 30px;
  width: 30px;
  background-size: contain;
  background-repeat: no-repeat;
  margin: auto;
}


.live-orders .orders-list .products a.undercost .cell.price .pr-icon  {
  background-image: url(../img/icons/emoji-10.png);
}

.live-orders .orders-list .products a.underprice,
.live-orders .orders-list .products a.underprice:hover {
  background-color: yellow;
}

.live-orders .orders-list .products a.underprice .cell.price .pr-icon {
  height: 30px;
  width: 30px;
  background-size: contain;
  background-repeat: no-repeat;
  margin: auto;
}


.live-orders .orders-list .products a.underprice .cell.price .pr-icon  {
  background-image: url(../img/icons/emoji-20.png);
}



.live-orders .orders-list .products .product {
  display: flex;
  width: 640px;
  box-sizing: border-box;
  height: 80px;
  border-bottom: 1px solid #ddd;
  transition: all 200ms ease-in-out;
}

.live-orders .orders-list .products .product.pending {}

.live-orders .orders-list .products .product.canceled {
  background-color: rgb(225 52 52 / 30%);
  cursor: no-drop;
  opacity: 0.5;
}

.live-orders .orders-list .products .product.canceled:hover {
  background-color: rgb(225 52 52 / 30%);
}

.live-orders .orders-list .products .product:not(:last-child) {}

.live-orders .orders-list .products .product:hover {
  background-color: #f3f9ff;
}

.live-orders .orders-list .products .cell {
  box-sizing: border-box;
}

.live-orders .orders-list .products .cell:not(:last-child) {
  border-right: 1px solid #ddd;
}

.live-orders .orders-list .product .seller-date {
  width: 80px;
  min-width: 80px;
  font-size: 1.5rem;
  overflow: hidden;
}

.live-orders .orders-list .product .seller {
  height: 25%;
  border-bottom: 1px solid #ddd;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
}

.live-orders .orders-list .product .status {
  height: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  opacity: 0.3;
}

.live-orders .orders-list .product .date {
  height: 50%;
  display: flex;
  border-bottom: 1px solid #ddd;
  justify-content: center;
  align-items: center;
  font-size: 10px;
}

.live-orders .orders-list .product .photo {
  width: 80px;
  min-width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.live-orders .orders-list .product .photo img {
  max-width: 100%;
  max-height: 100%;
}

.live-orders .orders-list .product .details {
  text-align: left;
  padding: 0.5rem;
  width: 250px;
  min-width: 250px;
  overflow: hidden;
}

.live-orders .orders-list .product .name {
  height: 15px;
  overflow: hidden;
  color: #c3c3c3;
  font-size: 1.5rem;
}

.live-orders .orders-list .product .style-no {
  font-weight: 600;
  color: #607d8b;
  margin: 2px 0;
}

.live-orders .orders-list .product .variant {
  font-weight: 600;
}

.live-orders .orders-list .product .qty {
  width: 40px;
  min-width: 40px;
  font-weight: bold;
  font-size: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.live-orders .orders-list .info {
  font-size: 12px;
  vertical-align: top;
}

.live-orders .orders-list .info .status {
  font-size: 14px;
  padding-bottom: 5px;
  margin-bottom: 5px;
  border-bottom: 1px solid #ddd;
}

.live-orders .orders-list .info>div {}

.live-orders .orders-list .info label {
  font-weight: 300;
  margin-right: 3px;
  color: #000;
  opacity: 0.6;
}

.live-orders .orders-list .info .dispatch {
  padding: 3px 5px;
  background-color: rgb(139 195 74 / 50%);
  border: 1px solid #8bc34a;
  border-radius: 4px;
  margin: 5px 0;
}

.live-orders .orders-list .info .call-request {
  padding: 3px 5px;
  background-color: rgb(108 37 190 / 50%);
  border: 1px solid #6c25be;
  border-radius: 4px;
  margin: 5px 0;
}

.live-orders .orders-list .info .type {
  padding: 3px 5px;
  background-color: rgb(3 169 244 / 40%);
  border: 1px solid #2196f3;
  border-radius: 4px;
  margin: 5px 0;
}

.live-orders .orders-list .x {
  font-weight: normal;
  font-size: 1.6rem;
  margin-left: 2px;
}

.live-orders .orders-list .product .price {
  width: 80px;
  min-width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: rgb(0 131 255 / 10%);
}

.live-orders .orders-list .product .price .total {
  font-size: 2.2rem;
  font-weight: 800;
}

.live-orders .orders-list .product .price .each {
  font-size: 1.6rem;
  opacity: 0.8;
}

.live-orders .orders-list .product .profit {
  width: 80px;
  min-width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: rgb(76 175 80 / 10%);
}

.live-orders .orders-list .product .profit .total {
  font-size: 2.2rem;
  font-weight: 800;
  color: #4caf50;
}

.live-orders .orders-list .product .profit .percentage {
  font-size: 1.6rem;
  opacity: 0.8;
}

.live-orders .orders-list .product .actions {
  width: 30px;
  min-width: 30px;
}

.live-orders .orders-list .product .actions button {
  padding: 0;
  height: 50%;
  border: none;
  background-color: transparent;
  width: 30px;
  box-sizing: border-box;
}

.live-orders .orders-list .product .actions button .fi {
  width: 18px;
  height: 18px;
}

.live-orders .orders-list .product .actions .remove-item {}

.live-orders .orders-list .product .actions .remove-item:hover {
  background-color: red;
}

.live-orders .orders-list .product .actions .edit-item {}

.live-orders .orders-list .product .actions .edit-item:hover {
  background-color: #0083ff;
}

.live-orders .orders-list .sub-total {}

.live-orders .orders-list .sub-total .cell {}

.live-orders .orders-list .sub-total .empty {
  width: 410px;
}

.live-orders .orders-list .sub-total .empty-end {}

.live-orders .orders-list .sub-total .sub-qty {
  width: 40px;
  font-weight: bold;
  font-size: 2.5rem;
}

.live-orders .orders-list .sub-total .sub-price {
  width: 80px;
  font-size: 2.2rem;
  font-weight: 800;
}

.live-orders .orders-list .sub-total .sub-profit {
  width: 80px;
  font-size: 2.2rem;
  font-weight: 800;
  color: #4caf50;
}

.live-orders .orders-list td.links {
  vertical-align: top;
}

.live-orders .orders-list td.links a {}

.live-orders .orders-list td.links .cell {
  display: block;
  text-decoration: none;
  color: #000;
  margin: 0 0 5px 0;
  border-radius: 4px;
  padding: 3px 5px;
  background: linear-gradient(to bottom, white, #f9fafb);
  box-shadow: 0 1px 0 0 rgb(22 29 37 / 5%);
  border: 1px solid #c4cdd5;
}

.live-orders .orders-list td.links .send {
  padding-bottom: 5px;
  margin-bottom: 5px;
  border-bottom: 1px solid #c4cdd5;
}

.live-orders .orders-list td.links .title {
  font-size: 12px;
}

.live-orders .orders-list td.links .small {
  color: #0083ff;
}

.live-orders .orders-list .links {
  vertical-align: top;
  width: 170px;
}

.live-orders .orders-list td.links .btns {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.live-orders .orders-list td.links .btns a {
  width: 70px;
  margin: 0;
}

.live-orders .orders-list td.links .f-bt.submit {
  margin-bottom: 5px;
}

.live-orders .orders-list td.links .f-bt {
  border: none;
  outline: none;
  width: 100%;
  display: block;
}

.live-orders .orders-list .a-links a {
  margin-bottom: 3px;
  font-size: 1.6rem;
  transition: all 200ms ease-in-out;
  /* color: #6d6e70; */
  margin-right: 5px;
}

.live-orders .orders-list .address {}

.live-orders .orders-list .address .destination {
  font-weight: bold;
}

.live-orders .orders-list .address .city {}

.live-orders .orders-list .links a:hover {
  color: #0083ff;
  text-decoration: underline;
}

.live-orders .orders-list .links .submit {
  padding: 3px;
  border-radius: 5px;
  background-color: #4caf50;
  color: #fff;
}

.live-orders .orders-list .links .submit:hover {
  color: #fff;
  text-decoration: none;
  background-color: #2c832f;
}

.live-orders .orders-list .links .cancel {
  padding: 3px;
  border-radius: 5px;
  background-color: #e13434;
  color: #fff;
}

.live-orders .orders-list .links .cancel:hover {
  color: #fff;
  text-decoration: none;
  background-color: #b11b1b;
}

.live-orders .orders-list .links .delete {
  padding: 3px;
  border-radius: 5px;
  background-color: #000;
  color: #fff;
}

.live-orders .qe-modal {
  padding: 3rem;
  max-width: 460px;
  position: relative;
}

.live-orders .qe-modal .close-bt button {
  position: absolute;
  top: 5px;
  right: 5px;
  font-size: 3rem;
  border: none;
  background-color: #0000;
  opacity: 0.5;
}

.live-orders .qe-modal .input-wrapper textarea {
  min-height: auto;
}

.live-orders .qe-modal .modal-buttons {
  justify-content: space-between;
}

.live-orders .qe-modal .modal-buttons .modal-bt {
  height: 50px;
  font-size: 2.5rem;
  border-radius: 10px;
  border: none;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 40px;
}

.live-orders .qe-modal .modal-buttons .submit-order {
  background-color: #2196f3;
  color: #fff;
}

.live-orders .qe-modal .modal-buttons .close-modal {
  cursor: pointer;
  background-color: #e9e9e9;
  font-size: 3rem;
}

.live-invoice {
  font-size: 2rem;
}

.live-invoice .main-wrapper {
  width: 560px;
  box-sizing: border-box;
  margin: 0 auto;
  background-color: #fff;
}

.live-invoice .header {
  padding: 5px 10px;
  align-items: center;
  border-bottom: 1px solid #cbcdd3;
}

.live-invoice .header .logo img {
  max-width: 100%;
  max-height: 100%;
}

.live-invoice .header .id-date .country {
  background-color: #000;
  color: #fff;
  padding: 3px 5px;
  font-size: 12px;
  border-radius: 4px;
  font-weight: bold;
}

.live-invoice .header .id-date .id {
  margin-left: 3px;
  font-size: 18px;
  font-weight: bold;
}

.live-invoice .header .id-date .date {
  font-size: 14px;
  margin-top: 3px;
  text-align: right;
}

.live-invoice .cart {
  padding: 10px;
}

.live-invoice .cart .standard-table {
  overflow-y: auto;
}

.live-invoice .cart .photo {
  height: 60px;
  width: 60px;
}

.live-invoice .cart .name {
  width: 240px;
  max-width: 240px;
}

.live-invoice .cart .name a {
  text-align: left;
}

.live-invoice .cart .name .title {
  height: 20px;
  overflow: hidden;
}

.live-invoice .cart .name .no {
  height: 20px;
  overflow: hidden;
}

.live-invoice .cart .name .var {
  height: 20px;
  overflow: hidden;
  font-weight: bold;
}

.live-invoice .cart .qty {
  font-size: 18px;
  font-weight: bold;
}

.live-invoice .cart .price {
  font-weight: bold;
  font-size: 18px;
}

.live-invoice .cart .total {
  font-weight: bold;
  font-size: 18px;
}

.live-invoice .footer {
  padding: 10px;
  padding-top: 0;
}

.live-invoice .footer .address-box {
  width: 319px;
  overflow: hidden;
  text-align: left;
  padding: 5px;
  border: 1px solid #ddd;
  font-size: 14px;
  box-sizing: border-box;
}

.live-invoice .footer .address-box .phone {
  font-weight: bold;
}

.live-invoice .footer .address-box .customer-note {
  font-style: italic;
  margin-top: 5px;
  font-weight: bold;
}

.live-invoice .footer .total-box {
  overflow: hidden;
  border: 1px solid #ddd;
  font-size: 14px;
  box-sizing: border-box;
  flex-grow: 1;
  border-left: none;
  min-height: 120px;
}

.live-invoice .footer .total-box .row {
  box-sizing: border-box;
  height: 25%;
  border-bottom: 1px solid #ddd;
  padding: 0 5px;
  justify-content: space-between;
  align-items: center;
}

.live-invoice .footer .total-box .row:nth-last-child(1) {
  border-bottom: none;
}

.live-invoice .footer .total-box .title {}

.live-invoice .footer .total-box .balance {
  font-weight: bold;
  font-size: 15px;
}

.live-invoice .footer .total-box .currency {
  font-size: 1.2rem;
  color: #b1b1b1;
  font-weight: bold;
  margin-left: 2px;
}

.live-invoice .download-photo {
  width: 560px;
  box-sizing: border-box;
  margin: 15px auto;
}

.live-invoice .download-photo button {
  font-size: 2rem;
  height: 5rem;
  padding: 0 3rem;
  border-radius: 0.5rem;
  box-sizing: border-box;
  cursor: pointer;
  background: linear-gradient(to bottom, white, #f9fafb);
  border: 1px solid #c4cdd5;
  box-shadow: 0 1px 0 0 rgb(22 29 37 / 5%);
  color: #1c2c49;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: 0.2s;
  margin: 0 auto;
}

.live-invoice.irt-invoice {}

.live-invoice.irt-invoice .footer .address-box {}

.livesell-rep .general-report {}

.livesell-rep .general-report td {
  font-size: 3rem;
  padding: 2rem 1rem;
}

.livesell-rep .general-report .sale {
  font-weight: bold;
  color: #4caf50;
}

.livesell-rep .general-report .profit {
  font-weight: bold;
  color: #2196f3;
}

.livesell-rep .seller-report {}

.livesell-rep .seller-report tr:nth-child(even) {
  background-color: #f5f6fa;
}

.livesell-rep .seller-report td {
  font-size: 2rem;
  padding: 2rem 1rem;
}

.livesell-rep .seller-report .user {
  font-weight: bold;
}

.livesell-rep .seller-report .sale {
  font-weight: bold;
  color: #4caf50;
}

.livesell-rep .seller-report .canceled .total {
  font-weight: bold;
  color: #f44336;
}

.livesell-rep .general-report.cancel-report td {
  font-weight: bold;
  color: #f44336;
}
.livesell-rep .seller-report .multi-row {
  padding: 0;
}
.livesell-rep .seller-report .multi-row .cell {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 0.5rem 1rem;
  border-bottom: 1px solid #ddd;
}
.livesell-rep .seller-report .multi-row .cell:nth-last-child(1) {
  border-bottom: none;
}
.livesell-rep .seller-report .multi-row .title {
  font-size: 1.6rem;
  color: #5a5a5a;
  font-weight: normal;
}
.livesell-rep .seller-report .multi-row .balance {
  font-weight: bold;
}

.livesell-rep .seller-report .multi-row .cell.total {
  color: #4caf50;
}

.livesell-rep .seller-report .view a {
  display: block;
  font-size: 1.6rem;
}

.livesell-rep .seller-report .view a:nth-child(1) {
  margin-bottom: 5px;
}

.livesell-rep .seller-report .profit {
  font-weight: bold;
  color: #2196f3;
}
.livesell-rep .seller-report .profit .title {

}
.livesell-rep .seller-report .profit .balance {
  font-weight: normal;
  color: #000;
}
.livesell-rep .seller-report .multi-row.cancel-detail .title {
  color: #f44336;
  font-size: 1.8rem;
}
.stock-taking .result {}

.stock-taking .result .prd-title {
  font-size: 2rem;
  margin-bottom: 5px;
  color: #000;
}

.stock-taking .result .style-no {
  font-size: 3rem;
  margin-bottom: 5px;
  font-weight: bold;
  color: #607d8b;
}

.stock-taking .result .input-wrapper input {
  font-size: 3rem;
}

:root {
  --mirror-page-w: 960px;
  --mirror-page-h: calc((var(--mirror-page-w) / 2) - 20px);
}

.live-mirror {
  /* background-color: #1b1c31; */
  min-height: 100vh;
}

.live-mirror .main-wrapper {
  width: var(--mirror-page-w);
  margin: 0 auto;
  padding: 20px;
  box-sizing: border-box;
}

.live-mirror .content {
  font-family: "Rubik", sans-serif;
  background-color: #fff;
  overflow: hidden;
  display: flex;
  border-radius: 20px;
}

.live-mirror .content .left {
  width: 50%;
  height: var(--mirror-page-h);
  box-sizing: border-box;
  padding: 15px;
  position: relative;
  overflow: hidden;
}

.live-mirror .content .prd-photo {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #e1e2e9;
  border-radius: 15px;
}

.live-mirror .content .prd-photo img {
  max-height: 100%;
  max-width: 100%;
  border-radius: 15px;
}

.live-mirror .content .prd-no {
  display: block;
  position: absolute;
  font-size: 38px;
  text-decoration: none;
  font-weight: 700;
  color: #1b1c31;
  width: 50%;
  height: 54px;
  line-height: 54px;
  text-align: center;
  border-radius: 999px;
  right: 25%;
  bottom: 25px;
  border: 2px solid rgb(255 255 255 / 40%);
  background-color: rgb(255 255 255 / 10%);
  transition: background-color 0.3s ease-in-out;
  backdrop-filter: blur(5px);
  box-shadow: 0px 8px 16px -8px rgb(0 0 0 / 10%);
}

.live-mirror .content .right {
  width: 50%;
  /* height: var(--mirror-page-h); */
  box-sizing: border-box;
  padding: 15px;
  padding-left: 0;
  position: relative;
  overflow: hidden;
}

.live-mirror .content .price {
  text-align: center;
  border-bottom: 1px solid #e3e3e3;
}

.live-mirror .content .price .value {
  font-size: 76px;
  font-weight: 800;
  color: #4caf50;
}

.live-mirror .content .price .currency {
  font-size: 36px;
  color: #bdbdbd;
}

.live-mirror .content .variants {
  padding-top: 15px;
  padding: 15px 15px 0 15px;
}

.live-mirror .content .var {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #1b1c31;
  box-shadow: 0px 8px 10px -8px #1b1c31;
  margin-bottom: 12px;
  height: 60px;
  border-radius: 10px;
  position: relative;
}

.live-mirror .content .var .size {
  font-size: 38px;
  color: #fff;
  padding-left: 15px;
}

.live-mirror .content .var .qty {
  font-size: 38px;
  height: 44px;
  width: 120px;
  box-sizing: border-box;
  text-align: center;
  background-color: #00bcd4;
  margin-right: 8px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-weight: 700;
  border-bottom: 1px solid #3be9ff;
  box-shadow: 0px 3px 8px -4px #47eaff;
}

@property --rotate {
  syntax: "<angle>";
  initial-value: 132deg;
  inherits: false;
}

.live-mirror .card {
  background: #2c2d4b;
  width: calc(var(--mirror-page-w) - 44px);
  height: 100px;
  position: relative;
  border-radius: 20px;
  margin: 0 auto;
  margin-top: 20px;
  justify-content: center;
  align-items: center;
  text-align: center;
  display: flex;
  font-size: 1.5em;
  color: rgb(88 199 250 / 0%);
  cursor: pointer;
  box-sizing: border-box;
  font-family: "Rubik", sans-serif;
}

.live-mirror .card::before {
  content: "";
  width: calc(var(--mirror-page-w) - 40px);
  height: 104px;
  border-radius: 20px;
  background-image: linear-gradient(var(--rotate),
          #5ddcff,
          #3c67e3 43%,
          #4e00c2);
  position: absolute;
  z-index: -1;
  top: -2px;
  left: -2px;
  animation: spin 5s ease-in-out infinite;
  /* opacity: 0.8; */
}

.live-mirror .card::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  right: 0;
  z-index: -1;
  height: 100%;
  width: 100%;
  margin: 0 auto;
  filter: blur(10px);
  background-image: linear-gradient(var(--rotate),
          #5ddcff,
          #3c67e3 43%,
          #4e00c2);
  opacity: 0.2;
  transition: opacity 0.5s;
  animation: spin 4s ease-in-out infinite;
}

@keyframes spin {
  0% {
      --rotate: 0deg;
  }

  100% {
      --rotate: 360deg;
  }
}

.live-mirror .card input {
  color: #fff;
  font-size: 42px;
  font-weight: 700;
  background-color: #0000;
  border: none;
  width: 100%;
  text-align: center;
}

.liverorder-view .cart .date-seller {
  font-size: 1.4rem;
}

.liverorder-view .cart .date-seller .seller {
  padding-bottom: 5px;
  border-bottom: 1px solid #ccc;
  margin-bottom: 5px;
}

.liverorder-view .cart .price-profit .total {
  font-weight: bold;
  font-size: 2rem;
}

.liverorder-view .cart .price-profit .each {
  font-size: 1.4rem;
  color: #989898;
}

.liverorder-view .cart .price-profit .currency {
  font-size: 1.2rem;
  font-weight: bold;
  color: #989898;
}

.liverorder-view .cart .price .total {
  color: #2196f3;
}

.liverorder-view .cart .profit .total {
  color: #4caf50;
}

.fitcell {
  width: 1% !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
}

.milestone-rep .seller-report .sale-detail {}

.milestone-rep .seller-report .sale-detail .cell {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #bcbcbc;
  padding-bottom: 5px;
  margin-bottom: 5px;
  align-items: center;
}

.milestone-rep .seller-report .sale-detail .cell:nth-last-child(1) {
  border-bottom: none;
}

.milestone-rep .seller-report .sale-detail .title {
  font-size: 1.6rem;
  color: #5a5a5a;
  font-weight: normal;
}

.milestone-rep .seller-report .sale-detail .balance {
  font-weight: bold;
  color: #000;
}

.milestone-rep .seller-report .sale-detail .order .balance {
  color: #4caf50;
}

.milestone-rep .seller-report .sale-detail .live .balance {
  color: #00bcd4;
}

.milestone-rep .seller-report .sale-detail .total .balance {}

.milestone-rep .seller-report .sale-detail .profit .balance {
  color: #2196f3;
}

.milestone-rep .seller-report .sale-detail .profit .percentage {
  font-weight: normal;
  color: #000;
  font-size: 1.6rem;
}

.milestone-rep .graph progress {
  height: 32px;
}

.showroom .showroom-items tr.total {
  background-color: #f5f6fa;
}

.showroom .showroom-items .total td {
  font-weight: bold;
}

.showroom .showroom-items .info {
  text-align: left;
}

.mb-10 {
  margin-bottom: 10px;
}

.user-log .tab-header li {
  width: 50%;
  text-align: center;
}

.order-view .user-data {
  margin-bottom: 15px;
}

.order-view .user-data .wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background-color: #f0f2f5;
  border-radius: 18px;
  padding: 5px 50px 5px 10px;
  position: relative;
}

.order-view .user-data .profile-pic {
  padding-right: 5px;
}

.order-view .user-data .profile-pic img {
  width: 48px;
  height: 48px;
  border-radius: 999px;
}

.order-view .user-data .content {
  padding: 8px 12px;
  font-size: 14px;
  color: #050505;
  overflow: hidden;
  max-width: calc(100% - 53px);
}

.order-view .user-data .user {
  font-weight: 700;
  display: block;
  text-decoration: none;
  color: #050505;
}

.order-view .user-data .message {
  display: block;
  text-decoration: none;
  color: #050505;
}

.order-view .user-data .icon-btn {
  display: flex;
  gap: 10px;
  position: absolute;
  right: 10px;
}

.order-view .user-data .inbox-link {
  /* position: absolute; */
  /* right: 10px; */
}

.order-view .user-data .inbox-link img {
  width: 36px;
  height: 100%;
}

.order-view .user-data .verify {
  /* position: absolute; */
  /* right: 10px; */
}

.order-view .user-data .verify img {
  width: 36px;
  height: 100%;
}

.order-view .user-data .addresses {
  /* position: absolute; */
  /* right: 50px; */
}

.order-view .user-data .addresses svg {
  color: #f81938;
  width: 36px;
  height: 100%;
}

.order-view .social-media-box{
  padding-bottom: 11px;
}

.order-view .social-media-box a{
  text-decoration: none;
  padding: 2px 10px;
  background-color: rgb(0 0 0 / 30%);
  color: #fff;
  font-weight: 300;
  font-size: 20px;
  display: block;
  border-radius: 4px;
}

.liverorder-view .facebook-comment {
  margin-bottom: 15px;
}

.liverorder-view .facebook-comment .wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background-color: #f0f2f5;
  border-radius: 18px;
  padding: 5px 50px 5px 10px;
  position: relative;
}

.liverorder-view .facebook-comment .profile-pic {
  padding-right: 5px;
}

.liverorder-view .facebook-comment .profile-pic img {
  width: 48px;
  height: 48px;
  border-radius: 999px;
}

.liverorder-view .facebook-comment .content {
  padding: 8px 12px;
  font-size: 14px;
  color: #050505;
  overflow: hidden;
  max-width: calc(100% - 53px);
}

.liverorder-view .facebook-comment .user {
  font-weight: 700;
  display: block;
  text-decoration: none;
  color: #050505;
}

.liverorder-view .facebook-comment .message {
  display: block;
  text-decoration: none;
  color: #050505;
}

.liverorder-view .facebook-comment .inbox-link {
  position: absolute;
  right: 10px;
}

.liverorder-view .facebook-comment .inbox-link img {
  width: 36px;
  height: 100%;
}

.liverorder-view .cart table tr.canceled {
  background-color: rgb(243 65 65 / 20%);
  opacity: 0.8;
}

.liverorder-view .cart tr.canceled .date-seller .status {
  color: #f34141;
}

.liverorder-view .modal .content {
  text-align: revert;
  /* max-width: 300px; */
}

.live-orders .page-report {}

.live-orders .page-report .standard-table {
  overflow: hidden;
}

.live-orders .filters {}

.live-orders .filters .filters-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: -1.2rem;
  margin-bottom: 1.2rem;
}

.live-orders .filters .filters-wrapper .input-wrapper {
  width: calc(100% / 7);
  padding: 1.2rem;
  box-sizing: border-box;
  margin: 0;
}

.live-orders .orders-list .date {}

.live-orders .orders-list .date .wrapper {}

.live-orders .orders-list .date .first {}

.live-orders .orders-list .date .last {
  padding-top: 10px;
  margin-top: 10px;
  border-top: 1px solid #ddd;
}

.live-orders .orders-list .date .date-format {
  font-size: 13px;
  color: rgb(0 0 0 / 80%);
  font-weight: 300;
}

.live-orders .orders-list .date .day {
  font-weight: bold;
  font-size: 12px;
}

.warehouse-check table .size {
  font-weight: bold;
}

.warehouse-check table tr.blue {
  background-color: #2196f31a;
}

.warehouse-check table tr.red {
  background-color: #f443361a;
}

.lo-customer-report .orders-list .items {
  font-size: 2.6rem;
  font-weight: bold;
}

.lo-customer-report .orders-list .total {
  font-size: 2.6rem;
  font-weight: bold;
  color: #4caf50;
}

.lo-customer-report .orders-list .total .currency {
  font-size: 1.2rem;
  color: #b1b1b1;
  font-weight: bold;
}

.liverorder-log {}

.liverorder-log .log-table table tr:nth-child(even) {
  background-color: rgb(0 0 0 / 3%);
}

.liverorder-log .log-table table td {
  border: 1px solid #afafaf;
}

.liverorder-log .log-table table th {
  border: 1px solid #afafaf;
}

.liverorder-log .log-table {}

.liverorder-log .log-table .var {
  text-align: left;
}

.liverorder-log .log-table .variant {
  font-weight: bold;
}

.liverorder-log .log-table .sku {}

.liverorder-log .log-table .style-no {}

.liverorder-log .log-table .dual-cell {
  padding: 0;
}

.liverorder-log .log-table .dual-cell .wrapper {
  display: flex;
  flex-direction: column;
}

.liverorder-log .log-table .dual-cell>* {
  min-height: 22px;
}

.liverorder-log .log-table .dual-cell .from {
  border-bottom: 1px solid #afafaf;
}

.liverorder-log .log-table .dual-cell .to {}

.liverorder-log .log-table .changed {
  border: 2px dashed #606060;
  /* background: #000; */
}

.liverorder-log .log-table table tr.cancel {
  background-color: #ff01012b;
}

.liverorder-log .log-table table tr.cancel-order {
  background-color: #ff01012b;
}

.liverorder-log .log-table table .merged td:nth-last-child(1) {
  background-color: #6abdff57;
}

.liverorder-log .log-table table .add_by_merge td:nth-last-child(1) {
  background-color: rgb(63 189 68 / 34%);
}

.liverorder-log .log-table table .add td:nth-last-child(1) {
  background-color: rgb(63 189 68 / 34%);
}

.liverorder-log .log-table table .update td:nth-last-child(1) {
  background-color: rgb(158 121 219 / 29%);
}

.liverorder-log .log-table table .update_by_merge td:nth-last-child(1) {
  background-color: rgb(158 121 219 / 29%);
}

.liverorder-log .log-table table .update_from_extention td:nth-last-child(1) {
  background-color: rgb(158 121 219 / 29%);
}

.liverorder-log .log-table table tr.submit {
  background-color: rgb(251 243 220)
}
.standard-table-weapper {
  padding: 2rem 1rem;
}
.pi-list table tr.uncompleted {
  background-color: rgb(255 87 34 / 12%) !important;
}
.pi-view .pi-brief {
  
}
.pi-view .pi-brief .photo {
  padding-right: 15px;
  width: 120px;
}
.pi-view .pi-brief .photo a {

}
.pi-view .pi-brief .media-container {
  position: relative;
  height: 100%;
  overflow: hidden;
  justify-content: center;
  align-items: center;
  display: flex;
  border-radius: 0.5rem;
}
.pi-view .pi-brief .media-container img {
  object-fit: cover;
  height: 100%
}
.pi-view .pi-brief .media-container span {
  position: absolute;
  display: block;
  font-size: 13px;
  color: #000;
  background-color: rgb(255 255 255 / 80%);
  padding: 6px 12px;
  border-radius: 999px;
}
.pi-view .pi-brief .info {
  flex-grow: 1;
}
.pi-view .pi-brief .info table td.title {
  text-align: left;
  width: 1% !important;
  white-space: nowrap !important;
}
.pi-view .pi-brief .info table td.value {
  font-weight: bold;
}
.pi-view .pi-items {

}
.pi-view .pi-items table td.row {
  width: 40px !important;
  box-sizing: border-box;
  font-weight: bold;
  font-size: 16px;
}
.pi-view .pi-items table td.items {
  padding: 0 !important;
}
.pi-view .pi-items table th.items {
  padding: 0 !important;
}
.pi-view .pi-items table th.items .c-th {

}
.pi-view .pi-items table th.items .c-th div {
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: normal;
}
.pi-view .pi-items table td.pi-qty {
  width: 60px !important;
  box-sizing: border-box;
  font-weight: bold;
  font-size: 16px;
}
.pi-view .pi-items table td.pi-total {
  width: 100px !important;
  box-sizing: border-box;
  font-weight: bold;
  font-size: 16px;
}

.pi-view .pi-items .items .sub-table {
  min-width: 676px !important;
}
.pi-view .pi-items .items .sub-table tr {
  border: none;
  border-bottom: 1px solid #dddddd;
}
.pi-view .pi-items .items .sub-table tr:nth-last-child(1) {
  border-bottom: none;
}
.pi-view .pi-items .items .sub-table td {
  border: none;
  border-right: 1px solid #dddddd;
}
.pi-view .pi-items .items .sub-table tr td:nth-last-child(1) {
  border-right: none;
}
.pi-view .pi-items .items .sub-table tr.deleted {
  background-color: rgb(255 0 0 / 20%);
  border-color: rgb(255 0 0 / 50%);
}
.pi-view .pi-items .items .sub-table tr.deleted td {
  border-color: rgb(255 0 0 / 50%);
}
.pi-view .pi-items .items .sub-table a {
  text-decoration: none;
  color: #000;
  display: block;
}
.pi-view .pi-items .items .item-row {
  width: 1% !important;
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 1rem !important;
  box-sizing: border-box;
  width: 32px !important;

}
.pi-view .pi-items .items .item-img {
  padding: 0;
  width: 64px !important;
  box-sizing: border-box;
}
.pi-view .pi-items .items .item-img .media-container {
  max-width: 64px;
  overflow: hidden;
}
.pi-view .pi-items .items .item-title {
  text-align: left;
  width: 224px !important;
  box-sizing: border-box;
}
.pi-view .pi-items .items .item-pi-cost {
  width: 82px !important;
  box-sizing: border-box;
}
.pi-view .pi-items .items .item-qty {
  width: 82px !important;
  box-sizing: border-box;
}
.pi-view .pi-items .items .item-vars {
  width: calc(100% - 452px) !important;
  box-sizing: border-box;
}
.new-picklist table {

}
.new-picklist table td.photo {
  width: 75px !important;
  min-width: 75px;
}
.new-picklist table td.photo .media-container {
  height: 74px;
}
.new-picklist table .qty .total > span {
  font-size: 18px;
  font-weight: bold;
  padding: 8px;
  background-color: #0083ff;
  border-radius: 4px;
  color: #fff;
}
.new-picklist table .qty .sub {
  margin-top: 12px;
  font-size: 12px;
}
.new-picklist table .details {
  min-width: 180px;
  text-align: left;
}
.new-picklist table .details .title a{
  font-size: 12px;
  color: #3c3c3c;
}
.new-picklist table .details .cost {
  font-size: 18px;
  font-weight: bold;
  color: #4caf50;
}
.new-picklist table .details .tot-cost {
  color: #449547;
  background-color: rgb(76 175 80 / 10%);
  padding: 5px;
}
.new-picklist table .vars {

}
.new-picklist table .var {
    display: flex;
    align-items: center;
    margin-bottom: 5px;

}
.new-picklist table .var-qty {
  background-color: #e3e6ef;
  border-radius: 5px 0 0 5px;
  white-space: nowrap;
  height: 46px;
  width: 46px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
  padding: 0 5px;
}
.new-picklist table .t-qty {
  font-weight: bold;
  font-size: 18px;
}
.new-picklist table .sub-qty {
font-size: 10px;
}
.new-picklist table .var-size {
  border: 1px solid #e3e6ef;
  border-radius: 0 5px 5px 0;
  white-space: nowrap;
  height: 46px;
  padding: 0 10px;
  width: 100%;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}
.customer-view .page-header .verify img {
  width: 16px;
  margin-left: 5px;
}
.customer-view .phone-number .verify {
  position: absolute;
  left: 10px;
  bottom: 12px;
}
.customer-view .phone-number .verify img {
  width: 16px;
}
.customer-view .phone-number input.is_verified {
  padding-left: 30px;
}

/* zzz */


/* ==========================================================================
    modal
    ========================================================================== */
.modal__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 25;
}

.modal__container {
  background-color: #fff;
  max-width: 500px;
  max-height: 100vh;
  border-radius: 1rem;
  overflow-y: auto;
  box-sizing: border-box;
}

.modal__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@keyframes mmfadeIn {
  from {
      opacity: 0;
  }

  to {
      opacity: 1;
  }
}

@keyframes mmfadeOut {
  from {
      opacity: 1;
  }

  to {
      opacity: 0;
  }
}

@keyframes mmslideIn {
  from {
      transform: translateY(15%);
  }

  to {
      transform: translateY(0);
  }
}

@keyframes mmslideOut {
  from {
      transform: translateY(0);
  }

  to {
      transform: translateY(-10%);
  }
}

.micromodal-slide {
  display: none;
}

.micromodal-slide.is-open {
  display: block;
}

.micromodal-slide[aria-hidden="false"] .modal__overlay {
  animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="false"] .modal__container {
  animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__overlay {
  animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden="true"] .modal__container {
  animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
  /* will-change: transform; */
}

.modal {}

.modal .modal-wrapper {}

.modal .header {
  padding: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 0;
}

.modal .header .title {
  font-size: 1.8rem;
}

.modal .header .close {
  cursor: pointer;
  border-radius: 999px;
  padding: 0.5rem;
  transition: 0.2s;
}

.modal .header .close:hover {
  background-color: #f0f2f3;
}

.modal .header .close img {
  cursor: pointer;
}

.modal .content {
  padding: 2rem 4rem;
  font-size: 2rem;
  text-align: center;
}

.modal .footer {
  padding: 2rem 2rem 3rem 2rem;
}

.modal .footer .btns {
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal .footer .btns .modal-btn {
  font-size: 2rem;
  padding: 1rem 2rem;
  border-radius: 0.5rem;
  border: none;
  transition: 0.2s;
  width: 15rem;
  margin: 0 2rem;
  box-sizing: border-box;
}

.modal .footer .btns .modal-btn.blue {
  background-color: #0083ff;
  color: #fff;
}

.modal .footer .btns .modal-btn.red {
  background-color: #f34141;
  color: #fff;
}

.modal .footer .btns .modal-btn.green {
  background-color: #4caf50;
  color: #fff;
}

.modal .footer .btns .modal-btn:hover {
  background-color: #acb2b7;
  color: #fff;
}

.modal .footer .btns .modal-btn.blue:hover {
  box-shadow: 0px 0px 0px 2px #0083ff;
  background-color: #fff;
  color: #0083ff;
}

.modal .footer .btns .modal-btn.red:hover {
  box-shadow: 0px 0px 0px 2px #f34141;
  background-color: #fff;
  color: #f34141;
}

.modal .footer .btns .modal-btn.green:hover {
  box-shadow: 0px 0px 0px 2px #4caf50;
  background-color: #fff;
  color: #4caf50;
}

/* ==========================================================================
    Grid
    ========================================================================== */

.grid-row {
  margin-right: -1rem;
  margin-left: -1rem;
}

.grid-row.flex {
  flex-wrap: wrap;
}

.wrap {
  flex-wrap: wrap;
}

.col {
  padding-right: 1rem;
  padding-left: 1rem;
  box-sizing: border-box;
  width: 100%;
}

.main-col {}

.col-1 {
  width: 8.3333%;
}

.col-12-8 {
  width: calc(100% / 8);
}

.col-2 {
  width: 16.6666%;
}

.col-3 {
  width: 25%;
}

.col-4 {
  width: 33.3333%;
}

.col-6 {
  width: 50%;
}

.col-8 {
  width: 66.6666%;
}

.col-9 {
  width: 75%;
}

.col-10 {
  width: 83.3333%;
}

.col-12 {
  width: 100%;
}

.col .box {
  background-color: #ffff;
  padding: 2rem;
  margin-bottom: 3rem;
  border-radius: 0.5rem;
  box-shadow: 0 0 0 1px rgb(229, 230, 235), 0 1px 4px 0 rgb(229, 230, 235);
  min-height: 1px;
}

.box .box-title {
  padding-bottom: 1rem;
}

.box .box-title h1 {
  font-size: 2rem;
  font-weight: 600;
  line-height: 0;
}

.box .box-title h2 {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 0;
  margin-top: 2.5rem;
  color: #9fa7c1;
}

.porduct-header-link {}

.porduct-header-link .box {
  margin-bottom: 2rem;
  padding: 1rem;
}

.porduct-header-link .wrapper {
  padding: 0 1rem;
}

.porduct-header-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #445b84;
  transition: 0.2s;
  border-radius: 0.5rem;
  width: calc(100% / 4);
  padding: 1rem 0;
  box-sizing: border-box;
}

.porduct-header-link a:hover {
  background-color: #e2e5f1;
}

.porduct-header-link .fi {
  height: 2.5rem;
  width: 2.5rem;
}

.porduct-header-link span {
  font-size: 2rem;
  margin-left: 0.8rem;
}

.dash-nav .nav-overlay {
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  position: fixed;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.7);
  z-index: 20;
  opacity: 0;
  display: none;
}

.dash-nav.active {
  display: initial;
  opacity: 1;
}

.dash-nav.active .nav-overlay {
  opacity: 1;
  display: initial;
}

.no-style {
  text-decoration: none;
  color: #000;
  display: block;
}

/* ==========================================================================
    Media Queries
    ========================================================================== */
@media only screen and (max-width: 1601px) {
  .col-l-3 {
      width: 25%;
  }
}

@media only screen and (max-width: 1200px) {
  .fix-top-bar .main-search {
      max-width: 540px;
  }

  .livesell .price-info .balance {
      font-size: 2em;
  }
}

@media only screen and (max-width: 960px) {
  .mob-only {
      display: block;
  }

  .desk-only {
      display: none !important;
  }

  .fix-top-bar .main-search {
      max-width: 420px;
  }

  .page-content {
      padding-left: 0;
      width: 100%;
  }

  .ops .result .correct td.photo .media-container {
      width: 60px;
      height: 60px;
  }

  .ops .result .correct td.box-number .value {
      font-size: 5rem;
  }

  .ops .result .correct td.sku {
      font-size: 2rem;
  }

  .ops .result .correct td.var {
      font-size: 2rem;
  }

  .ops .result .correct td.qty .counter {
      font-size: 3rem;
  }

  .ops .result .correct td.qty .action button {
      font-size: 1.2rem;
      padding: 4px 10px;
  }

  .dash-nav {}

  .dash-nav .side-nav {
      z-index: 25;
      padding-top: 0;
      left: -220px;
      transition: all 0.3s ease;
  }

  .dash-nav.active .side-nav {
      left: 0;
  }

  .side-nav .main-nav {
      padding-top: 0;
  }

  .filepond--wrapper {
      padding-right: 20px;
  }
}

@media only screen and (max-width: 750px) {
  .fix-top-bar .main-wrapper {
      padding: 0 10px;
  }

  .fix-top-bar .user .name-and-date {
      display: none;
  }

  .fix-top-bar .user .media-container {
      height: 36px;
      width: 36px;
  }

  .fix-top-bar .main-search {
      max-width: 80%;
      width: 420px;
  }

  .col-md-0 {
      width: 0px;
      display: none;
  }

  .col-md-4 {
      width: 33.333333%;
  }

  .col-md-3 {
      width: 25%;
  }

  .col-md-6 {
      width: 50%;
  }

  .col-md-8 {
      width: 66.6666%;
  }

  .col-md-12 {
      width: 100%;
  }

  .porduct-header-link a {
      width: calc(100% / 4);
  }

  .item-list .filters-search .container .section:nth-last-child(1) {
      padding-left: 2rem;
  }

  .sale-report .main-report td.sub .cell {
      display: block;
      text-align: center;
  }

  .sale-report .main-report td.sub .cell .country {
      margin: 0;
      margin-bottom: 0.5rem;
  }

  .sale-report .sr-sale-value .section:nth-last-child(1) {
      border-left: none;
      border-top: 1px solid #e5e6eb;
      display: none;
  }

  .sale-report .sr-sale-value td.sub .wrapper {
      display: block;
  }

  .sale-report .sr-sale-value td.sub .value {
      display: block;
  }

  .liver-report .sale-graphs .section {
      width: 100%;
      border: none;
      margin-bottom: 3rem;
  }

  .warehouse-report .sg-wrapper .graphs-wrapper .cell {
      width: 100%;
      box-sizing: border-box;
      border-right: none;
      border-bottom: 1px solid #dadce2;
      padding-bottom: 2rem;
      padding-top: 2rem;
  }

  .ops .warehouse-summary .flag {
      width: 100%;
      margin-right: 0;
      margin-bottom: 5px;
  }

  .ops .warehouse-summary .total {
      margin-right: 0;
      width: 100%;
      text-align: center;
  }

  .ops .pkt td {
      padding: 0;
      font-size: 1.6rem;
  }

  .ops .pkt td.photo {
      width: 80px;
  }

  .ops .pkt td.qty span {
      width: 30px;
      height: 30px;
      line-height: 30px;
  }

  .ops .btk table {
      font-size: 1.6rem;
  }

  .ops .btk td {
      font-size: 1.6rem;
  }

  .ops .btk td.box-number .value {
      font-size: 3rem;
  }

  .ops .btk td.photo {
      width: 60px;
  }

  .ops .btk td.photo .media-container {
      width: 60px;
      height: 60px;
  }

  .ops .btk td.box-number .flag {
      width: 16px;
  }

  .ops .btk td.sku .sku-id .value {
      font-size: 2rem;
  }

  .ops .btk td.qty span {
      font-size: 2rem;
  }

  .dp-picker .links-sc .left {
      border-right: none;
      border-bottom: 1px solid #e5e6eb;
  }

  .livesell .daily-goal .balance {
      width: 18%;
      text-align: center !important;
  }
}

@media only screen and (max-width: 600px) {
  .fix-top-bar .main-search {
      max-width: 70%;
  }

  .modal__container {
      max-width: 400px;
  }
}

@media only screen and (max-width: 540px) {
  .page-wrapper {
      padding: 0;
      padding-top: 2rem;
  }

  .col .box {
      border-radius: 0;
  }

  .page-header .wrapper {
      border-radius: 0;
  }

  .alerts-container .alert {
      border-radius: 0;
  }

  .ops .result .correct td.photo .media-container {
      width: 50px;
      height: 50px;
  }

  .ops .result .correct td.photo .media-container img {
      border-radius: 3px;
  }

  .ops .result .correct td {
      padding: 0.5rem;
  }

  .ops .result .correct td.box-number .value {
      font-size: 3rem;
  }

  .ops .result .correct td.box-number .wrapper {
      display: block;
      text-align: center;
  }

  .livesell .add-modal .c-price .currency {
      font-size: 1.6rem;
  }

  .ops .result .correct td.box-number .flag {
      margin: 0 auto;
      width: 15px;
      border: 1px solid #fff;
      border-radius: 0;
  }

  .ops .result .correct td.box-number .flag img {
      border-radius: 0;
  }

  .sale-report.cart-rep .item-list table td.photo {
      width: 50px;
  }

  .sale-report.cart-rep .item-list table td.photo .media-container {
      width: 50px;
      height: 50px;
  }

  .livesell .add-modal .input-group {
      display: block;
  }

  .livesell .add-modal .input-group .x-wrapper {
      justify-content: center;
  }

  .livesell .add-modal .c-price {
      width: calc(100% / 3);
  }

  .livesell .add-modal .converted-price {
      margin-bottom: 10px;
  }

  .livesell .add-modal .modal-buttons .modal-bt {}

  .livesell .add-modal .modal-buttons .submit-order {
      margin-right: 15px;
  }

  .livesell .prd-info {
      display: block;
  }

  .livesell .prd-info .photo {
      padding-bottom: 10px;
  }

  .livesell .prd-info .prd-photo {
      margin: 0 auto;
  }

  .livesell .prd-info .details {
      width: 100%;
  }
}

@media only screen and (max-width: 420px) {
  html {
      font-size: 0.4rem;
  }

  .fix-top-bar .main-search form {
      font-size: 12px;
  }

  .fix-top-bar .main-search .dash-search-submit {
      padding: 0;
  }

  .fix-top-bar .main-search .dash-search-submit .fi {
      width: 18px;
      height: 18px;
      margin-right: 3px;
  }

  .fix-top-bar .main-search .dash-search-select {
      padding: 0;
  }

  .custome-chekbox .checkbox- .check-mark .fi {
      width: 14px;
      height: 14px;
  }

  .col-xs-4 {
      width: 33.333333%;
  }

  .col-xs-6 {
      width: 50%;
  }

  .col-xs-12 {
      width: 100%;
  }

  .log-in .login-container {
      width: 320px;
  }

  .timeline .item .circle {
      width: 12px;
      height: 12px;
      border: 3px solid #198bff;
  }

  .timeline .line {
      width: 2px;
      left: 5px;
  }

  .modal__container {
      max-width: 320px;
  }

  .order .cart td.price .aed {
      display: none;
  }

  .order-view .input-wrapper.phone-number .p-links {
      bottom: 4px;
      right: 4px;
  }

  .order-view .input-wrapper.phone-number .p-links a {
      width: 24px;
      height: 24px;
      border-radius: 0.5rem;
  }

  .orders-actions-modal .link {
      width: 24rem;
  }

  .orders-actions-modal .link .icon .fi {
      width: 18px;
      height: 18px;
  }

  .ops .col .box.custome-box {
      padding: 0.5rem;
  }

  .ops .pkt td.photo {
      width: 60px;
  }

  .ops .pkt td {
      font-size: 1.4rem;
  }

  .ops .btk td.warehouse img {
      width: 13px;
  }

  .ops .scanner .form-control .scanner-input {
      font-size: 2rem;
  }

  .ops .scanner .form-control .scanner-submit {
      font-size: 2rem;
  }

  .ops .box-select .input-wrapper select {
      font-size: 2rem;
  }
}

@media only screen and (max-width: 360px) {
  .fix-top-bar .main-search {
      display: none;
  }

  .log-in .login-container {
      width: 300px;
  }

  .modal__container {
      max-width: 280px;
  }

  .order-view .page-header .header-bt {
      padding: 0 3rem;
  }

  .order .cart td.photo {
      width: 46px;
  }

  .ops .btk td.box-number .value {
      font-size: 2rem;
  }

  .ops .btk td.photo {
      width: 50px;
  }

  .ops .btk td.photo .media-container {
      width: 50px;
      height: 50px;
  }

  .ops .btk td.box-number .flag {
      width: 13px;
  }

  .ops .btk td.sku .value {
      font-size: 1.4rem;
  }

  .ops .btk td.sku .sku-id .value {
      font-size: 1.6rem;
  }

  .ops .btk td.qty span {
      font-size: 2rem;
  }

  .ops .btk .header .tab {
      padding: 1rem 1.5rem;
      font-size: 1.6rem;
  }

  .livesell .prd-info {
      display: block;
  }

  .livesell .prd-info .photo {
      width: 100px;
      margin: 0 auto;
      padding: 0;
      padding-bottom: 5px;
  }

  .livesell .prd-info .prd-photo .media-container {
      display: flex;
      align-items: center;
      justify-content: center;
  }

  .livesell .prd-info .prd-photo .media-container img {
      max-height: 100px;
      max-width: 100px;
  }

  .livesell .size-table td {
      padding: 0.5rem;
  }

  .livesell .size-table .add {
      height: 34px;
      line-height: 34px;
      padding: 0px 10px;
  }

  .livesell .add-modal .input-group input {
      width: 90px;
  }

  .livesell .add-modal .profit-meter {
      padding: 10px 8px;
  }
}

@media only screen and (max-width: 320px) {
  html {
      font-size: 0.35rem;
  }

  .item-list .footer .result-per-page {
      display: none;
  }

  .item-list .pagination {
      margin: 0 auto;
  }

  .log-in .login-container {
      width: 260px;
  }

  .modal__container {
      max-width: 240px;
  }

  .order-view .page-header .header-bt {
      padding: 0 2rem;
  }

  .order-view .input-wrapper.phone-number .p-links {
      bottom: 4px;
      right: 4px;
  }

  .order-view .input-wrapper.phone-number .p-links {
      bottom: 2px;
      right: 2px;
  }

  .ops .pkt td.qty span {
      width: auto;
      height: auto;
      background-color: #0000;
      color: #f43636;
      padding: 0;
      margin: 0;
      display: inline-block;
  }
}

@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {}

/* ==========================================================================
    Helper classes
    ========================================================================== */

.hidden {
  display: none !important;
  visibility: hidden;
}

.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}

.invisible {
  visibility: hidden;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.clearfix {
  *zoom: 1;
}

.flex {
  display: flex;
}

.inline-grid{
  display: inline-grid;
}

.bet {
  justify-content: space-between;
}

.flex-wrap {
  flex-wrap: wrap;
}

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

.no-padding {
  padding: 0 !important;
}

.no-margin {
  margin: 0 !important;
}

.no-wrap {
  white-space: nowrap;
}

.no-bg {
  background-color: #0000 !important;
  border: none !important;
  box-shadow: none !important;
}

.p-relative {
  position: relative;
}

.overflow-y-scroll {
  overflow-y: scroll;
}

.pad-1rem {
  padding: 1rem;
}
.pad-2rem {
  padding: 2rem;
}

/* ==========================================================================
    Print styles
    ========================================================================== */

@media print {

  *,
  *:before,
  *:after {
      background: transparent !important;
      color: #000 !important;
      box-shadow: none !important;
      text-shadow: none !important;
  }

  a,
  a:visited {
      text-decoration: underline;
  }

  a[href]:after {
      content: " (" attr(href) ")";
  }

  abbr[title]:after {
      content: " (" attr(title) ")";
  }

  a[href^="#"]:after,
  a[href^="javascript:"]:after {
      content: "";
  }

  pre,
  blockquote {
      border: 1px solid #999;
      page-break-inside: avoid;
  }

  thead {
      display: table-header-group;
  }

  tr,
  img {
      page-break-inside: avoid;
  }

  img {
      max-width: 100% !important;
  }

  p,
  h2,
  h3 {
      orphans: 3;
      widows: 3;
  }

  h2,
  h3 {
      page-break-after: avoid;
  }
}

/* my change add */
.swal2-popup {
  font-size: 2rem !important;
}

.input-label {
  display: block;
  font-size: 1.8rem;
  margin-bottom: 0.5rem;
}

.v-select {
  font-size: 2.5em;
}

/* my change add end */
.capitalize {
  text-transform: capitalize;
}

.ck-editor__main>.ck-content {
  height: 200px;
  font-size: 1.8rem;
}

/* my change add prism editor style */
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: #90a4ae;
}

.token.punctuation {
  color: #9e9e9e;
}

.namespace {
  opacity: 0.7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
  color: #e91e63;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #4caf50;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
  color: #795548;
}

.token.atrule,
.token.attr-value,
.token.keyword {
  color: #3f51b5;
}

.token.function {
  color: #f44336;
}

.token.regex,
.token.important,
.token.variable {
  color: #ff9800;
}

.token.important,
.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token.entity {
  cursor: help;
}

.height-200 {
  height: 200px !important;
}

.my-prism-editor {
  background-color: #fafafa;
  max-height: 400px;
  font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
  font-size: 14px;
  line-height: 1.5;
  padding: 5px 10px;
}

/* optional class for removing the outline */
.prism-editor__textarea:focus {
  outline: none;
}

.text-red {
  color: red
}

.text-green {
  color: green
}

.text-yellow {
  color: yellow
}

.text-darkyellow{
  color: #c2c21b
}

/* end my change add prism editor style */