/*
00. Library override(ex. bootstrap etc) --------------------
01. Text and Typography ------------------------------------
02. Common element(ul,ol,li,body,div etc.) -----------------
03. Common class(padding, margin etc.) ---------------------
04. Header styles ------------------------------------------
05. Footer styles-------------------------------------------
06. Common content------------------------------------------
07. Pages and Posts-----------------------------------------
08. Extra styles--------------------------------------------
09. Media Query---------------------------------------------
*/
/* End Table of Contents */

/* 00. Library override(ex. bootstrap etc) start*/
/* 00. Library override(ex. bootstrap etc)   end*/


/* 01. Text and Typography start */
/* 01. Text and Typography end */


/* 02. Common element(ul,ol,li,body,div etc.) start*/
/* 02. Common element(ul,ol,li,body,div etc.) end*/


/*03. Common class(padding, margin etc.) start*/
/*03. Common class(padding, margin etc.) end*/


/*04. Header styles start*/
/*04. Header styles end*/


/*05. Footer styles start*/
/*05. Footer styles end*/


/*06. Common content start*/
/*06. Common content end*/


/*07. Pages and Posts satrt*/
/* Registration Form CSS Start */

.dropdown-text {
    color: #1F2020;
    font-weight: 600;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
    width: fit-content;

}

input::placeholder {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 14px;
}

input[type="checkbox"] {
    width: 20px;
}

input:focus-visible,
select:focus-visible {
    outline: none;
}

.term-condition-text {
    color: #1F2020;
    font-weight: 400;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
}

.term-conditions {
    font-weight: 600;
    color: #F04E2A;
}

.form-heading {
    font-family: "Plus Jakarta Sans", sans-serif;
}

.form-select:focus {
    border-color: #dee2e6 !important;
    box-shadow: none !important;
}

.submit {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 600;
    background-color: #F04E2A;
    border-color: #F04E2A;
    border-radius: 3px;
    padding: 10px 25px;
    line-height: 1.5;
    border: 1px solid transparent;
    transition: 0.3s ease all;
    color: #ffffff;
}

.submit:hover {
    background-color: transparent;
    color: #F04E2A;
    transition: 0.3s ease all;
    border-color: #F04E2A;
}

.login-text {
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #F04E2A;
    font-weight: 600;
}

label.error {
    display: block;
}

#phone-error {
    width: 100%;
}

/* dropdwn CSS Start */
/* .dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    border: none !important;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    padding: 0px !important;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #f1f1f1;
    border-radius: 5px;
}

.dropdown:hover .dropdown-content {
    display: block;
} */

.profile-image {
    width: 30px;
    height: 30px !important;
    border-radius: 50% !important;
    object-fit: cover;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-menu {
    display: none;
    position: absolute;
    z-index: 1000;
    padding: 0px !important;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    border: none !important;
    border-radius: 10px;
    right: 0;
}

.dropdown-menu .dropdown-item {
    padding: 12px 16px;
    font-family: "Plus Jakarta Sans", sans-serif;

}

.dropdown-menu .dropdown-item:hover {
    background-color: #f1f1f1;
    border-radius: 5px;
}

.dropdown-toggle::after {
    color: #F04E2A;
}

/* dropdwn CSS End */

.form-group,
.input-group {
    position: relative;
}

.required-field::after {
    content: '*';
    position: absolute;
    top: 0px;
    right: -13px;
    height: 10px;
    width: 10px;
    line-height: 1em;
    color: #F04E2A;
}

/* Custom validation CSS Start */
.input-group-text {
    border: 0px !important;
    padding: 0px !important;

}

.input-group-text select {
    border-radius: 7px 0px 0px 7px !important;
}

span.invalid-feedback {
    font-family: "Plus Jakarta Sans", sans-serif;
    /* position: absolute; */
    /* top: 70px;  */
    margin-top: 0px;
}

.input-group span.invalid-feedback {
    /* top: 39px; */
    margin-top: 0px;
}

.term-condition-text span.invalid-feedback {
    /* top: 27px; */
    margin-top: 0px;
}

.valid-feedback {
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #1F2020 !important;
}

input.invalid-feedback {
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #1F2020 !important;
}

/* Custom validation CSS End */
/* My Account Page CSS Start */
.rewards-list-item {
    padding: 15px 20px 20px 20px;
    border: 1px solid #dee2e6;
    border-radius: 10px;
}

.btn-redeem {
    font-size: 14px;
    text-decoration: none;
    padding: 5px 15px;
    display: block;
    width: fit-content;
    border-radius: 4px;
    color: var(--e-global-color-865a548);
    border: 1px solid var(--e-global-color-f0c2efe);
    transition: .3s ease all;
}

.btn-redeem:hover {
    background: var(--e-global-color-f0c2efe);
    color: #ffffff;
    transition: .3s ease all;
}

.nav-pills .nav-link {
    padding: 10px 25px;
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #1F2020;
    font-weight: 500;
    border-color: #F04E2A !important;
}

.nav-pills .nav-link:hover {
    color: #F04E2A;
    font-weight: 500;
}

.nav-pills .nav-link.active {
    background-color: #F04E2A !important;
    padding: 10px 25px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-weight: 500;
}

.term-condition-text {
    display: flex;
}

.avatar-upload {
    position: relative;
    max-width: 140px;
    margin: 0px 10px;
}

.avatar-upload .avatar-edit {
    position: absolute;
    right: 12px;
    z-index: 1;
    top: 10px;
}

.avatar-upload .avatar-edit input {
    display: none;
}

.avatar-upload .avatar-edit input+label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-bottom: 0;
    border-radius: 100%;
    background: #FFFFFF;
    border: 1px solid transparent;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    font-weight: normal;
    transition: all 0.2s ease-in-out;
}

.avatar-upload .avatar-edit input+label:hover {
    background: #f1f1f1;
    border-color: #d6d6d6;
}

.avatar-upload .avatar-edit input+label svg {
    width: 18px;
    height: 18px;
}

.avatar-upload .avatar-preview {
    width: 120px;
    height: 120px;
    position: relative;
    border-radius: 100%;
    border: 6px solid #F8F8F8;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.1);
}

.avatar-upload .avatar-preview>div {
    width: 100%;
    height: 100%;
    border-radius: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
}

/* My Acoount Page CSS End */
/* Regiostration Form CSS End */
.login-form-wrapper,
.registration-form-wrapper,
.profile-update-form-wrapper {
    position: relative;
}

.login-form-wrapper .loader,
.registration-form-wrapper .loader,
.profile-update-form-wrapper .loader {
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #f8f8f8a3;
}

/* reward history start */
.timeline {
    border-left: 1px solid hsl(0, 0%, 90%);
    position: relative;
    list-style: none;
}

.timeline .timeline-item {
    position: relative;
}

.timeline .timeline-item:after {
    position: absolute;
    display: block;
    top: 0;
}

.timeline .timeline-item:after {
    background-color: hsl(0, 0%, 90%);
    left: -38px;
    border-radius: 50%;
    height: 11px;
    width: 11px;
    content: "";
}

/* reward history end */
/*07. Pages and Posts end*/
/* registration page css start*/
.success-icon {
    display: inline-block;
    width: 8em;
    height: 8em;
    font-size: 10px;
    border-radius: 50%;
    border: 3px solid #96df8f;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    transform-origin: center;
    -webkit-animation: showSuccess 180ms ease-in-out;
    animation: showSuccess 180ms ease-in-out;
    transform: scale(1);
}

.success-icon__tip,
.success-icon__long {
    display: block;
    position: absolute;
    height: 3px;
    background-color: #96df8f;
    border-radius: 10px;
}

.success-icon__tip {
    width: 2.4em;
    top: 4.3em;
    left: 1.4em;
    transform: rotate(45deg);
    -webkit-animation: tipInPlace 300ms ease-in-out;
    animation: tipInPlace 300ms ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-delay: 180ms;
    animation-delay: 180ms;
    visibility: hidden;
}

.success-icon__long {
    width: 4em;
    transform: rotate(-45deg);
    top: 3.7em;
    left: 2.75em;
    -webkit-animation: longInPlace 140ms ease-in-out;
    animation: longInPlace 140ms ease-in-out;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    visibility: hidden;
    -webkit-animation-delay: 440ms;
    animation-delay: 440ms;
}

@-webkit-keyframes showSuccess {
    from {
        transform: scale(0);
    }

    to {
        transform: scale(1);
    }
}

@keyframes showSuccess {
    from {
        transform: scale(0);
    }

    to {
        transform: scale(1);
    }
}

@-webkit-keyframes tipInPlace {
    from {
        width: 0em;
        top: 0em;
        left: -1.6em;
    }

    to {
        width: 2.4em;
        top: 4.3em;
        left: 1.4em;
        visibility: visible;
    }
}

@keyframes tipInPlace {
    from {
        width: 0em;
        top: 0em;
        left: -1.6em;
    }

    to {
        width: 2.4em;
        top: 4.3em;
        left: 1.4em;
        visibility: visible;
    }
}

@-webkit-keyframes longInPlace {
    from {
        width: 0em;
        top: 5.1em;
        left: 3.2em;
    }

    to {
        width: 4em;
        top: 3.7em;
        left: 2.75em;
        visibility: visible;
    }
}

@keyframes longInPlace {
    from {
        width: 0em;
        top: 5.1em;
        left: 3.2em;
    }

    to {
        width: 4em;
        top: 3.7em;
        left: 2.75em;
        visibility: visible;
    }
}

/* registration page css end*/



/* 08. Extra styles start*/
/* 08. Extra styles end*/


/*09. Media Query start*/
@media screen and (min-width: 992px) {}

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

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

/*Tablet*/
@media screen and (max-width: 991px) {}

/*Small Device*/
@media screen and (max-width: 767px) {
    .rewards-list-wrapper .row {
        row-gap: 20px;
    }
}

/*Mobile Device*/
@media screen and (max-width: 640px) {
    .slider-img-slize .swiper-button-prev {
        left: -14px;
    }

    .slider-img-slize .swiper-button-next {
        right: -14px;
    }
}

/*Extra Small Mobile Device*/
@media screen and (max-width: 480px) {}

@media screen and (max-width: 420px) {
    .term-condition-text {
        display: block !important;
    }
}

/*09. Media Query end*/