.form-signin {
  width: 100%;
  max-width: 330px;
  padding: 15px;
  margin: auto;
}

/* order status */
.my-error-class {
  color: #FF0000;
}

.heart-color {
  color: rgb(207, 36, 36);
}

.track-line {
  height: 2px !important;
  background-color: #488978;
  opacity: 1;
}

.track-line-danger {
  height: 2px !important;
  background-color: #e12121;
  opacity: 1;
}

.dot {
  height: 10px;
  width: 10px;
  margin-left: 3px;
  margin-right: 3px;
  margin-top: 0px;
  background-color: #488978;
  border-radius: 50%;
  display: inline-block
}

.dot-danger {
  height: 10px;
  width: 10px;
  margin-left: 3px;
  margin-right: 3px;
  margin-top: 0px;
  background-color: #e12121;
  border-radius: 50%;
  display: inline-block
}

.blank-dot {
  height: 10px;
  width: 10px;
  margin-left: 3px;
  margin-right: 3px;
  margin-top: 0px;
  background-color: #afc0bc;
  border-radius: 50%;
  display: inline-block
}

.big-dot {
  height: 25px;
  width: 25px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  background-color: #488978;
  border-radius: 50%;
  display: inline-block;
}

.big-dot-danger {
  height: 25px;
  width: 25px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  background-color: #e12121;
  border-radius: 50%;
  display: inline-block;
}

.big-dot i {
  font-size: 12px;
}

.card-stepper {
  z-index: 0
}

.trash:hover {
  cursor: pointer;
}


.text-reset {
  --bs-text-opacity: 1;
  color: inherit !important;
}

/* radio color */
input[type='radio'] {
  accent-color: #232323;
}

.waiting {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: url('/img/loader.svg') 50% 50% no-repeat transparent;
}

.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  /* display: inline-block; */
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}

.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}

.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}

.pagination-block {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
  background: rgb(39, 57, 82);
  border-color: rgb(39, 57, 82);
  color: #ffffff;
}

.pagination-active {
  background: rgb(39, 57, 82);
  border-color: rgb(39, 57, 82);
  color: #ffffff;
}

.comment-box {

  margin-top: 12px;
  padding: 2px;
}

.comment-area textarea {
  resize: none;
  border: 1px solid #ad9f9f;
}

.form-control:focus {
  color: #495057;
  background-color: #fff;
  border-color: #ffffff;
  outline: 0;
  box-shadow: 0 0 0 1px rgb(39, 57, 82) !important;
}

.send {
  background-color: rgb(39, 57, 82);
  ;
  border-color: rgb(39, 57, 82);
}

.send:hover {
  /* color: #fff; */
  background-color: rgb(30, 46, 68);
  border-color: rgb(30, 46, 68);
}


.rating {
  display: flex;
  margin-top: -10px;
  flex-direction: row-reverse;
  margin-left: -4px;
  float: left;
}

.rating>input {
  display: none
}

.rating>label {
  position: relative;
  width: 19px;
  font-size: 25px;
  color: #EDBB0E;
  cursor: pointer;
}

.rating>label::before {
  content: "\2605";
  position: absolute;
  opacity: 0
}

.rating>label:hover:before,
.rating>label:hover~label:before {
  opacity: 1 !important
}

.rating>input:checked~label:before {
  opacity: 1
}

.rating:hover>input:checked~label:before {
  opacity: 0.4
}

@media (max-width: 700px) {
  #latestProducts {
    display: none;
  }

  #offerProducts {
    display: none;
  }

  .hero_all_category {
    display: none;
  }

  .hero__search__phone {
    display: none;
  }

  .primary-banner {
    margin-top: 4rem;
  }
}