::-webkit-scrollbar {
    width: 12px; /* width of the entire scrollbar */
}

::-webkit-scrollbar-track {
    background: #f5f5f5; /* color of the tracking area */
}

::-webkit-scrollbar-thumb {
    background-color: #d7d7d7; /*#ff9800; color of the scroll thumb */
    border-radius: 10px; /* roundness of the scroll thumb */
}

::-webkit-scrollbar-thumb:hover {
    background-color: #7d7d7d;
}

.borderlightCyan {
    border: 1px solid #00f7ec;
}

@media screen and (max-width: 768px) {

    .content-wrapper {
        padding-top: 20% !important;
    }
}

.toggle {
    --width: 40px;
    --height: calc(var(--width) / 2);
    --border-radius: calc(var(--height) / 2);

    display: inline-block;
    cursor: pointer;
}
.toggle__input {
    display: none;
}
.toggle__fill {
    position: relative;
    width: var(--width);
    height: var(--height);
    border-radius: var(--border-radius);
    background: #dddddd;
    transition: background 0.2s;
}
.toggle__fill::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: var(--height);
    width: var(--height);
    background: #ffffff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    border-radius: var(--border-radius);
    transition: transform 0.2s;
}
.toggle__input:checked ~ .toggle__fill {
    background: orange;
}

.toggle__input:checked ~ .toggle__fill::after {
    transform: translateX(var(--height));
}

/**
* Preloader
*/
.preloader.is-active {
  width: 100%;
  text-align: center;
  height: 100%;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000000;
  background: white;
  display: block; }

.preloader {
  display: none; }
  .preloader__wrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    height: 100%; }
  .preloader__img {
    display: block; }

.swal-small{
 width:350px !important;
}

.c-pointer {
    cursor: pointer!important;
}
.c-wait {
    cursor: wait!important;
}
.c-nallowed {
    cursor: not-allowed!important;
}

.backdroper{
    position: fixed;
    top: 0;
    left: 0;
    /* z-index: 1040; */
    width: 100vw;
    height: 100vh;
    background-color: #000;
    opacity: 0.5;
    z-index: 2000;
}

.backdroper-items{
    position: absolute;
    width: 100%;
    background: rgba(0, 0, 0, 0.5);
}

body #sidebar-menu > ul > li > a:focus {
    color: #6e768e !important;
}

body #sidebar-menu .menuitem-active:hover > a,
body #sidebar-menu .menuitem-active > a,
body #sidebar-menu ul > li > a:hover, 
body #sidebar-menu ul > li:hover > a {
    color: #32B7B4 !important;
}

.bg-placed {
    background-color: slategray !important;
}

.bg-processing {
    background-color: #00D9CE !important;
}

.bg-packed {
    background-color: #32A6A0 !important;
}

.bg-shipped {
    background-color: #008C85 !important;
}

.bg-delivered {
    background-color: #41D9D1 !important;
}

.bg-returned {
    background-color: #005955 !important;
}

.bg-cancelled {
    background-color: #003D3A !important;
}

.btn-tess {
    color: #fff !important;
    background-color: #00D9CE !important;
}

.btn-tess:hover {
    color: #fff !important;
    background-color: #32A6A0 !important;
}

.btn-tess-dark {
    color: #fff !important;
    background-color: #008C85 !important;
}

.btn-tess-dark:hover {
    color: #fff !important;
    background-color: #005955 !important;
}

.page-item.active .page-link {
    background-color: #4de2dd !important;
    border-color: #4de2dd !important;
    color: #fff !important;
}

/* a:link { color: #00D9CE !important; }

a:hover { color: #32A6A0 !important; }

a:visited { color: #008C85 !important; }*/

.text-processing {
    color: #00D9CE !important;
}

.text-packed {
    color: #32A6A0 !important;
}

.text-shipped {
    color: #008C85 !important;
}

.text-delivered {
    color: #41D9D1 !important;
}

.text-returned {
    color: #005955 !important;
}

.text-cancelled {
    color: #003D3A !important;
}

.nav-pills .nav-link.active {
    color: #fff !important;
    background-color: #00D9CE !important;
}

.timeline .timeline-desk {
    display: unset!important;
    vertical-align: top;
    width: 100%;
}

.timeline .timeline-box {
    background: #fff;
    display: block;
    /* margin: unset!important; */
    position: relative;
    padding: unset!;
    border-radius: .25rem;
    box-shadow: none;
    padding: unset!important;
}
.timeline:before {
    left: unset!important;
}

.timeline .timeline-icon {
    top: 10px!important;
}

.timeline-item > .timeline-desk > .timeline-box:first-child > .timeline-icon {
    background: #dee2e6;
    border-radius: 50%;
    display: block;
    height: 30px!important;
    left: -58px;
    margin-top: -14px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 30px!important;
}
.timeline-item > .timeline-desk > .timeline-box:first-child > .timeline-icon > i {
    font-size: 24px;
    position: absolute;
    left: 3px;
    margin-top: -3px;
}

.badge-outline-tess {
    color: #00D9CE;
    border: 1px solid #00D9CE;
    background-color: transparent;
    box-shadow: none;
}

.badge-soft-tess {
    color: #2c5d5a;
    background-color: #bde9e7;
    box-shadow: none;
}

.swal2-icon.swal2-question {
    border-color: #006f6a!important;
    color: #006f6a!important;
}

.swal2-icon.swal2-error {
    border-color: #006f6a!important;
}

.swal2-icon.swal2-error [class^=swal2-x-mark-line], .swal2-styled.swal2-confirm {
    background-color: #006f6a!important;
}

.swal2-icon.swal2-success .line, .swal2-icon.swal2-success [class^=swal2-success-line], .swal2-icon.swal2-success [class^=swal2-success-line][class$=long]{
    background-color: #006f6a!important;
}

.swal2-icon.swal2-success .placeholder, .swal2-icon.swal2-success .swal2-success-ring{
    border-color: #006f6a!important;
}

.form-check .form-check-input{
    float: unset!important;
}

.form-check-input:checked{
    background-color: #4de2dd!important;
    border-color: #4de2dd!important;
}
.fix-table-head {
  overflow-y: auto;
  height: 110px;
}
.fix-table-head thead th {
  position: sticky;
  top: 0;
}
.cat-list {
    background-color: #f2f2f2; border-radius: 5px; cursor: pointer;
}
.pd-10 {
    padding: 10px;
}
.pd-5 {
    padding: 5px 10px 5px 10px;
}
.pd-2 {
    padding: 2px 10px 2px 10px;
}
.pt-none {
    pointer-events: none;
}

/* timeline */
ul.wizard {
  max-width: 100%;
  margin: 0 auto;
  list-style-type: none;
  counter-reset: steps;
  margin: 0;
  padding: 0;
  font-size: 12px;
}
ul.wizard li {
  padding: 0 0 10px 25px;
  position: relative;
  margin: 0;
  color: #262626;
}
ul.wizard li:after {
  position: absolute;
  top: 14%;
  left: 0;
  content: "";
  border-radius: 50%;
  display: inline-block;
  height: 10px;
  width: 10px;
  text-align: center;
  line-height: 24px;
  background: gray;
}
ul.wizard li.active:after {
  background: #32B7B4;
}
ul.wizard li.active {
  color: #32B7B4;
}
ul.wizard li:before {
  position: absolute;
  left: 4px;
  top: 14%;
  content: "";
  height: 100%;
  width: 0;
  border-left: 1px groove;
  border-right: 1px groove;
}
ul.wizard li:last-of-type:before {
  border: none;
}

.textCyan{
  color: #00f7ec;
}

/* stepper-m */
.stepper-item-m::before {
  top: 18px!important;
}

.stepper-item-m::after {
  top: 18px!important;
}

.stepper-wrapper {
    margin-top: 50px;
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
  }
  .stepper-item {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
  }

  .stepper-item::before {
    position: absolute;
    content: "";
    border-bottom: 2px solid rgb(240, 240, 240);
    background-color: rgb(240, 240, 240);
    border-top: 2px solid rgb(240, 240, 240);
    width: 100%;
    top: 23px;
    left: -50%;
    z-index: 2;
  }

  .stepper-item::after {
    position: absolute;
    content: "";
    border-bottom: 2px solid rgb(240, 240, 240);
    width: 100%;
    top: 23px;
    left: 50%;
    z-index: 2;
  }

  .stepper-item .step-counter {
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgb(240, 240, 240);
    margin-bottom: 6px;
  }

  .stepper-item.completed > .step-counter1 {
    background-color: #262626;
  }

  .stepper-item .step-counter1 {
    position: relative;
    z-index: 5;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgb(240, 240, 240);
    margin-bottom: 6px;
  }

  .stepper-item.completed > .step-counter {
    background-color: #262626;
  }

  .stepper-item.completed::before {
    border-bottom: 2px solid #262626;
    background-color: #262626;
    border-top: 2px solid #262626;
    z-index: 3;
  }

  .stepper-item:first-child::before {
    content: none;
  }
  .stepper-item:last-child::after {
    content: none;
  }

.bglightCyan{
  background-color: #e6fffd;
}

/* Item Excluded Notif */
.cart-excluded-screen {
  z-index: 1000;
  position: relative;
  /* background: rgba(0, 0, 0, 0.3); */
  width: 95px;
  height: 100%;
  border-radius: 5px;
  
}
.cart-excluded-text {
  width: 100%!important;
  font-size: 9px;
  color: white;
  background-color: rgba(0, 0, 0, 1.6);
  text-align: center;
  margin-bottom: 0!important;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.mini-cart-excluded-screen {
  z-index: 1000;
  position: relative;
  background: rgba(0, 0, 0, 0.3);
  width: 75px;
  height: 100%;
  border-radius: 5px;
  margin: 0 -75px 30px 0;
}
.mini-cart-excluded-text {
  width: 100%!important;
  font-size: 9px;
  color: white;
  background-color: rgba(0, 0, 0, 0.6);
  text-align: center;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
}

.prod-excluded-circle {
  z-index: 100;
  position: absolute;
  left: 50%;
  top: 50%;
  height: 150px;
  width: 150px;
  background-color: #00000070;
  transform: translate(-50%, -50%);
}
.exzoom_zoom_outer {
  z-index: 300;
}
.prod-excluded-text {
  position: absolute;
  z-index: 200;
  font-size: 18px;
  color: white;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

/* Item Excluded Notif - End */

.inactive, .inactive::after {
  cursor: not-allowed !important;
}
input[type='checkbox']:checked  {
background-color: #00f7ec;
border-color: #32B7B4;
}

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

/* Firefox */
.input-qty {
-moz-appearance: textfield;
}

.borderlightDark {
  border: 1px solid #b3aeae;
}

.textdarkDark {
  color: #6c6262;
}

.bglightDark {
  background-color: #f2f2f2;
}

.btnCancelReverse {
background-color: #00f7ec;
color: #fff;
border: 1px solid #00f7ec;
font-weight: bold;
}

.collection-type {
    border: solid 2px #fff!important;
}

.collection-type:hover, .collection-type.active {
    border: solid 2px #0bc6c6!important;
}

.select-addresses {
    border: 1px solid #dee2e6!important;
}

.select-addresses:hover, .select-addresses.active {
    border: 1px solid #0bc6c6!important;
}

.dropdown-megamenu {
    margin-top: 70px!important;
}

.btn-outline.active {
    color: #fff;
    background-color: #4de2dd;
}

form#smileys input[type="radio"].morehappy {
  background: url("../../buyer/images/feedback/happy.png") center;
  background-size: cover;
  padding: 0px;
}
form#smileys input[type="radio"].happy {
  background: url("../../buyer/images/feedback/smile.png") center;
  background-size: cover;
}
form#smileys input[type="radio"].neutral {
  background: url("../../buyer/images/feedback/meh.png") center;
  background-size: cover;
}
form#smileys input[type="radio"].sad {
  background: url("../../buyer/images/feedback/frown.png") center;
  background-size: cover;
}

.borderCyan {
  border: 1px solid #32b7b4;
}

.bgCyan {
  background-color: #4de2dd;
}

.btnRad {
  border-radius: 100px;
}

.textdarkCyan {
  color: #32b7b4 !important;
}

.imageOpacity{
  width: 100%!important;
  font-size: 9px;
  color: white;
  background-color: rgba(0, 0, 0, 0.4);
  text-align: center;
  margin-bottom: 0!important;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  border-radius: 5px;
  height: 100%;
}

.bgCyan {
  background-color: #4de2dd;
}


/*CREATE VOUCHER*/

.tickets-container {
  margin: 100px 0 0 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  ;
}

.tickets-container .item {
/*  width: 1050px;*/
  height: 400px;
  background: #fff;
  display: flex;
  border-radius: 16px;
}


.tickets-container .item-right {
  margin-right: 20px;
  width: 30%;
  position: relative;
  height: 100%;
  padding-left: 10px;
}


.day {
  font-size: 12px;
  width: 25%;
}


.meter {
  font-size: 12px;
  font-weight: 900;
}

.buy {
  display: flex;
  justify-content: space-around;
}

.buy-button {
  padding-left: 30px;
  padding-right: 30px;
  border-radius: 28px;
  font-family: 'Poppins', sans-serif;
  border: none;
}

.up-border, .down-border {
  padding: 14px 15px;
  background-color: #ecf2f5;
  border-radius: 50%;
  position: absolute
}

.up-border {
  top: -12px;
  right: -35px;
}

.down-border {
  bottom: -13px;
  right: -35px;
}

.tickets-container .item-right .num {
  margin: 0;
  font-size: 60px;
  text-align: center;
  color: #111;
}


.tickets-container .item-left {
  width: 70%;
  height: 100%;
  /* border-left: 3px dotted #999; */
  background-color: #92f0f1;
  padding-left: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
} 

.voucherOff{
  color: #13c5bd;
  font-size: 100px;
  font-weight: bold;
}

.voucher{
  color: #13c5bd;
  font-size: 77px;
  font-weight: bold;
  line-height: 0.75rem;
}

.minimum{
  color: #13c5bd;
  font-size: 32px;
}

.btnCollect{
  background-color: #13c5bd;
  border-radius: 100px;
  font-size: 25px;
  padding: 10px 20px 10px 20px;
  font-weight: bold;
}

.listings-container1 {
  margin: 0;
  padding: 0;
  height:  111vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.scene {
  width: 300px;
  height: 600px;
  perspective: 600px;
}

.cardCoupon {
  width: 100%;
  height: 86%;
  position: relative;
  transition: transform 1s;
  transform-style: preserve-3d;
  margin-top: 62px;
  
}

.cardCoupon1 {
  width: 100%;
  height: 86%;
  position: relative;
  transition: transform 1s;
  transform-style: preserve-3d;
  margin-top: 90px;
  
}

.card__face {
  position: absolute;
  height: 100%;
  width: 100%;
  backface-visibility: hidden;
}

.card__face--front {
  background: white;
  border-radius: 16px;
}



.mobile-title {
  margin-top: 15px;
  padding: 0;
  margin-bottom: 0;
  color: #000;
  font-size: 12px;
}

.num {
  margin: 0;
  display: flex;
  justify-content: center;
  font-size: 40px;
  margin-top: 10px;
}

.sell {
  display: flex;
  justify-content: space-around;
  margin-top: 218px;
  padding-top: 20px;
  border-top: 2px dotted #ddd;
}

.down {
  padding: 14px 15px;
  background-color: #ecf2f5;
  border-radius: 50%;
  position: absolute;
  bottom: 70px;
  right: 285px;
}

.up {
  padding: 14px 15px;
  background-color: #ecf2f5;
  border-radius: 50%;
  position: absolute;
  top: 417px;
  right: -15px;
}


.down1 {
  padding: 14px 15px;
  background-color: #4de2dd;
  border-radius: 50%;
  position: absolute;
  bottom: 70px;
  right: 285px;
}

.up1 {
  padding: 14px 15px;
  background-color: #4de2dd;
  border-radius: 50%;
  position: absolute;
  top: 417px;
  right: -15px;
}


.coup {
  width: 100%;
  height: 100%;
}


.ref {
  margin: 0;
  padding: 0;
  font-size: 12px;
  display: flex;
  justify-content: center;
  color: #999;
  margin-bottom: 25px;

}

.icons {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center;
  margin-bottom: 30px;
}

.day {
  font-size: 12px;
  width: 25%;
}


.meter {
  font-size: 12px;
  font-weight: 900;
}

.buy {
  display: flex;
  justify-content: space-around;
}

.buy-button {
  padding-left: 30px;
  padding-right: 30px;
  border-radius: 28px;
  font-family: 'Poppins', sans-serif;
  border: none;
  background-color: #ddd;
}

.logos{
  margin-top: -27px;
  border-radius: 5px;
  height: 239px;
}

.btnOff{
  box-shadow: 0 4px 203px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/*VOUCHERS*/

.tickets-container1 {
  margin: 100px 0 0 0;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  ;
}

.tickets-container1 .item1 {
  width: 444px;
  height: 156px;
  background: #fff;
  display: flex;
  border-radius: 16px;
}


.tickets-container1 .item-right1 {
  margin-right: 20px;
  width: 30%;
  position: relative;
  height: 100%;
  padding-left: 10px;
}

.up-border1, .down-border1 {
  padding: 14px 15px;
  background-color: #ecf2f5;
  border-radius: 50%;
  position: absolute
}

.up-border1 {
  top: -12px;
  right: -35px;
}

.down-border1 {
  bottom: -13px;
  right: -35px;
}


.tickets-container1 .item-left1 {
  width: 70%;
  height: 100%;
  /* border-left: 3px dotted #999; */
  background-color: #92f0f1;
  padding-left: 10px;
  display: block;
  align-items: center;
  justify-content: space-between;
} 

.voucherOff1{
  color: #13c5bd;
  font-size: 40px;
  font-weight: bold;
}

.voucher1{
  color: #13c5bd;
  font-size: 32px;
  font-weight: bold;
  line-height: 0.75rem;
}

.minimum1{
  color: #13c5bd;
  font-size: 13px;
}

.btnCollect1{
  background-color: #13c5bd;
  border-radius: 100px;
  font-size: 25px;
  padding: 10px 20px 10px 20px;
  font-weight: bold;
}


.coup1 {
  width: 100%;
  height: 100%;
}


.buy1 {
  display: flex;
  justify-content: space-around;
}

.btnOff1{
  box-shadow: 0 4px 203px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}