@keyframes show-toast{
  0% {bottom: -100%;}
  20% {bottom: 100px;}
  80% {bottom: 100px;}
  100% {bottom: -100%;}
}

.show-notification{
  position: fixed;
  bottom: 100%;
  right: 20px;
  animation-name: show-toast;
  animation-duration: 7s;
  z-index: 9999; /* Ensure it appears above other content like footer */
}
.alert-notify .msg-alert {
margin-right: 12px;
}
.alert-notify .close{
top:7px;
right: 7px;
}

/* Hide Radio button */
.rate > input{
  display: none;
}

.rate{
  display: inline-block;;
  border: 0;
}

.rate > label{
  float: right;
}

/* Showing the stars */
.rate > label:before{
  display: inline-block;
  font-size: 1.1rem;
  font-family: FontAwesome;
  content: "\f005";
  margin:0;
  padding:0.3rem .2rem;
  cursor: pointer;
}

/* Half star */
.rate .half:before{
  content: "\f089";
  position: absolute;
  padding-right: 0;
}

/* Click and hover */
input:checked ~ label, label:hover ~ label{
  color: #ffb503;
}

/* hover hightlight */
input:checked + label:hover, input:checked ~ label:hover,input:checked ~ label:hover ~ label,
label:hover ~ input:checked ~ label{
  color: #cc9000;
}

.rating-star i{
  color: #ffb503 !important;
}

ul.thumb{
  margin: 0 auto;
  padding: 0;
  float: left;
}

ul.thumb li{
  list-style: none;
  margin: 10px;
}

ul.thumb li img{
  width: 80px;
  height: 80px;
  border: 1px solid grey;
}

/* Hide radio buttons of payment method logos in checkout page */
.payment-method [type=radio]{
  position: absolute;
  opacity: 0;
  width: 0;

}

/* Image style */
.payment-method [type=radio] + img{
  cursor: pointer;
  padding: 5px;
}

 /* Checked style */

 .payment-method [type=radio]:checked + img{
  outline: 2px solid #ff0000;
}


.modal-backdrop.show {
  z-index: 1040 !important;
}
.modal.show {
  z-index: 1055 !important;
}