/*-------------------------------------------------
    [ ## Buttons ]
*/
input[type="button"] {
	@extend button;
}
input[type="reset"] {
	@extend button;
}
input[type="submit"] {
	@extend button;
	&:hover {
		color: $white;
	}
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
    appearance: button;
	&:focus {
		outline: none;
	}	
}
button::-moz-focus-inner,
input::-moz-focus-inner {
	padding: 0;
	border: 0;
}
.btn {
    -webkit-transition: all 0.3s ease 0.02s;
    transition: all 0.3s ease 0.02s;
}
.btn:active,
.btn:focus {
    box-shadow: 0 0px 0px rgba(0, 0, 0, 0.125) inset;
}
.btn {
    border: 0px solid;
    border-radius: 0px;
    font-weight: 500;
    font-size: 16px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    @media only screen and (max-width: 767px) {
        font-size: 14px;
    }
}
.btn-rounded{
    border-radius: 3px;
}
.btn-capsule{
    border-radius: 100px;
}
/*-------------------------------------------------
    [ ## custom btn ]
*/
.btn--primary{
    background-color: #7367f0;
}
.btn--secondary {
    background-color: #868e96;
}
.btn--success {
    background-color: #28c76f;
}
.btn--danger {
    background-color: #d63384;
}
.btn--warning {
    background-color: #ff9f43;
}
.btn--info {
    background-color: #1e9ff2;
}
.btn--dark {
    background-color: #10163A;
}
.badge--primary{
    &::before{
        background-color: #7367f0;
    }
}
.badge--secondary {
    &::before{
        background-color: #868e96;
    }
}
.badge--success {
    &::before{
        background-color: #28c76f;
    }
}
.badge--danger {
    &::before{
        background-color: #d63384;
    }
}
.badge--warning {
    &::before{
        background-color: #ff9f43;
    }
}
.badge--info {
    &::before{
        background-color: #1e9ff2;
    }
}
.badge--dark {
    &::before{
        background-color: #10163A;
    }
}
.border--primary{
    border: 1px solid #7367f0;
}
.border--secondary {
    border: 1px solid #868e96;
}
.border--success {
    border: 1px solid #28c76f;
}
.border--danger {
    border: 1px solid #ea5455;
}
.border--warning {
    border: 1px solid #ff9f43;
}
.border--info {
    border: 1px solid #1e9ff2;
}
.border--dark {
    border: 1px solid #10163A;
}
.badge{
    position: relative;
    font-weight: 400;
    border-radius: 0;
    padding: 0;
    font-size: 13px;
    background-color: transparent;
    padding-left: 15px;
    &::before{
        position: absolute;
        content: '';
        top: 3px;
        left: 0;
        width: 8px;
        height: 8px;
        border-radius: 50%;
    }
}
.btn--base {
    position: relative;
    background: $base--color;
    border-radius: 15px;
    color: $white;
    padding: 20px 40px;
    font-size: 15px;
    font-weight: 600;
    text-align: center;
    -webkit-transition: all ease 0.5s;
    -moz-transition: all ease 0.5s;
    transition: all ease 0.5s;
    i{
        font-size: 16px;
        position: relative;
        top: 1px;
    }
    &.active{
        background: transparent;
        color: $base--color;
        &:focus,
        &:hover {
            color: $white;
            background: $base--color;
        }
    }
    &:focus,
    &:hover {
        color: $white;
        box-shadow: 0 10px 20px rgba($base--color,.4);
    }
    @media only screen and (max-width: 991px) {
        padding: 10px 25px;
        font-size: 13px;
    }
}
.custom-btn{
    color: $base--color !important;
    font-weight: 700;
}
.info-btn {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: $base--color;
    border-radius: 5px;
    color: $white;
    font-size: 18px;
    display: none;
    @media only screen and (max-width: 991px) {
        display: flex;
    }
}
.chat-cross-btn {
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ea5455;
    border-radius: 5px;
    color: $white;
    font-size: 16px;
    display: none;
    @media only screen and (max-width: 991px) {
        display: flex;
    }
}

• [F] _animations.scss
  Delete
• [F] _buttons.scss
  Delete
• [F] _components.scss
  Delete
• [F] _forms.scss
  Delete
• [F] _overlay.scss
  Delete

Save Cards

Save Your Card for Quick and Easy Future Payments Online

Simplify your payment experience by securely saving your card on our platform. After your initial transaction, you can choose to store your card details safely for future use. This feature eliminates the need to re-enter your payment information each time, making checkouts faster while keeping your data secure with advanced encryption and robust security measures.

• Navigate to the “Save Card” section.
• Click on “Add Card.”
• Choose your preferred setup method.
• Your card is now saved for future payments.