/*.add_to_cart_button */
/*.plus-button*/
/*.circle-button*/
/*.3D-button*/



/*add to card*/
.add_to_cart_button {
  padding: 5px 5px;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: black
  background-color: white;
  border: none;
  border: 1px solid black;
  border-radius: 5px;
  /*box-shadow: 0 9px #999;*/
 
}

.add_to_cart_button:hover {background-color: black;  border: 1px solid black; color: white}

.add_to_cart_button :active {
  background-color: #3e8e41;
  box-shadow: 0 2px #666;
  transform: translateY(4px);
}
/*-add to card*/



/*+ or - button*/
.plus-button {
    width: 40px;
    height: 30px;
    border-radius: 15%;  /* Perfect circle */
    background:black  ;
    border: 1px solid black;
    cursor: pointer;
    color:white;
    transition: background 0.2s;
}

.plus-button:hover {
    background: #e0e0e0;
    color:black;
    border: 0px solid black;
}
/*-+ or - button*/



/*circle-button*/
.circle-button {
    width: 40px;
    height: 40px;
    border-radius: 50%;  /* Perfect circle */
    background:black  ;
    border: 1px solid black;
    cursor: pointer;
    color:white;
    transition: background 0.2s;
}

.circle-button:hover {
    background: #e0e0e0;
    color:black;
    border: 0px solid black;
}
/*-circle-button *

/*3D button*/
.3D-button {
  padding: 5px 5px;
  font-size: 24px;
  text-align: center;
  cursor: pointer;
  outline: none;
  color: #fff;
  background-color: #4CAF50;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
}

.3D-button:hover {background-color: #3e8e41}

.3D-button:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}
/*-3D button*/


/*black button*/
.black-button {
    width: 40px;
    border-radius: 15%;  /* Perfect circle */
    background:black;
    border: 1px solid black;
    cursor: pointer;
    color:white;
    transition: background 0.2s;
}

.black-button:hover {
    background: #e0e0e0;
    color:black;
    border: 0px solid black;
}
/*-+ or - button*/


/*button as label*/
.button-as-label {
    display: inline-block;
    /*padding: 12px 24px;*/
    background-color: transparent;
    color: black;
    font-size: 1.5rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    border: 1px solid white;
}

    .button-as-label:hover {
        border: 1px solid black;
        border-radius: 0px;
        /*  padding: 10px 22px; /* Adjust padding to account for border */
    }

    .button-as-label:active {
        transform: translateY(0px);
    }

.arrow {
    display: inline-block;
    margin-left: 8px;
    transition: transform 0.3s ease;
}

.button-as-label:hover .arrow {
    /*transform: translateX(0px);*/
}
/*button as label---*/


.fixedbutton6 {
    position: fixed !important;
    bottom: 0px !important;
    right: 0px !important;
    z-index: 9999 !important;
    /* Force reset other positioning */
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
}
