/* @tailwind base;
@tailwind components;
@tailwind utilities;

[x-cloak] {
    display: none;
} */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}

#nprogress .bar {
  height: 7px !important;
  background: #375298 !important;
  z-index: 1081 !important;
  border-radius: 0 15px 15px 0 !important;
}

#nprogress .peg {
  box-shadow: none !important;
}

#nprogress .spinner-icon {
  width: 40px !important;
  height: 40px !important;
  border-width: 4px !important;
  border-top-color: #375298 !important;
  border-left-color: #375298 !important;
  z-index: 1081 !important;
}

#nprogress .spinner {
  z-index: 1081 !important;
}

:root {
    --btn-main-color: #64259b;
    --btn-main-text-color: #fff;
}

.font-style-one {
    font-size: 0.9rem;
    font-weight: 600;
}
.font-style-two {
    font-size: 1.4rem !important;
    font-weight: 1000 !important;
    letter-spacing: 0;
}
.font-style-three {
    font-size: 0.7rem;
    font-weight: normal;
}
.font-style-four {
    font-size: 2.5rem;
    font-weight: 800;
    letter-spacing: 0.1rem;
}
.font-style-five {
    font-size: 1.1rem;
}
.font-style-six {
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: 0;
}
.font-style-seven {
    font-size: 0.9rem;
    font-weight: 900;
}
.text-color-green {
    color: green;
}
.custom-open-circle-color {
    color: #78d240;
}
.map-location {
    border-radius: 15px;
}
.custom-section {
    padding-right: calc(2.5rem * 0.5);
    padding-left: calc(2.5rem * 0.5);
}
.otp-wrapper {
    width: 24rem;
}
.selected-category-text {
    font-size: 14px;
    font-weight: 500;
}

.landing-wrapper {
    /* background: linear-gradient(-45deg, rgb(14, 91, 241), #f6ecff, rgb(134, 31, 224)); */
    background: linear-gradient(-45deg, #e3cbf8, #f6ecff, #e3cbf8);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
    min-height: 100vh;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.btn-main {
    background-color: var(--btn-main-color);
    color: var(--btn-main-text-color);
}
.avatar-wrapper {
    height: 50px;
    width: 50px;
}
/* .hero-image {
  height: 550px !important;
} */

.share-icon {
    z-index: 1;
    top: 3%;
    right: 2%;
}
.text-color-custom {
    color: #64259b !important;
}
.text-color-custom-two {
    color: #64259b9a !important;
}
.shop-name {
    font-size: 33px;
    font-weight: 500;
}

.rating-count {
    font-weight: 700;
}

.rating-amount {
    background-color: black;
    color: white;
    border-radius: 27px;
    font-size: 1rem;
    font-weight: normal;
    padding: 5px 15px;
}

.share-btn {
    font-size: 14px;
    font-weight: 500;
}
.confrim-btn {
    background-color: #65249b !important;
    border-color: #65249b !important;
}
.address-bar {
    color: gray;
    font-weight: 400;
}

.status {
    font-weight: 500;
}

.head-text {
    font-size: 24px;
    font-weight: 600;
}
.cart-service {
    font-weight: 450;
}
.discount-text {
    font-size: 13px;
}
.styled-border {
    border-top: 1px dashed #c9d1d7;
}
/* .category-image-wrapper{
    height: 100px;
    width: 100px;
} */
.category-image-wrapper {
    background-color: #f6ecff;
}
.date-wrapper {
    background-color: #f6ecff;
}
.date-wrapper-1 {
    background-color: #ffffff;
}
.day {
    color: #64259b;
    font-size: 28px;
    font-weight: 800;
}

.month {
    color: #64259b;
}
.year {
    color: #64259b;
}
.category-text {
    font-weight: 500;
}
.total-text {
    font-size: 17px;
    font-weight: 500;
}
.services-wrapper .nav-item .active {
    background-color: #65249b !important;
    border-radius: 24px;
    color: white !important;
}

.services-wrapper .nav-item .nav-link {
    border-radius: 24px;
    color: black;
    font-weight: 500;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    background-color: #f6ecff;
}
.bg-custom-color {
    background-color: #f6ecff;
}
.cart-category {
    color: gray;
    font-weight: 400;
    font-size: 14px;
}

.home-nav-sticky {
    top: 12% !important;
}
.total-amount {
    font-size: 17px;
}
.services-wrapper .nav-item {
    min-width: 190px;
}

.services-wrapper .nav-item .nav-link {
    min-width: 190px;
}

.services-wrapper ::-webkit-scrollbar {
    display: none;
}
.service-text {
    font-weight: 500;
    font-size: 17px;
}
.service-time {
    font-weight: 500;
    color: gray;
    font-size: 14px;
}
.service-type:hover {
    background-color: #f6ecff;
}
.service-type {
    transition: 0.1s ease-in-out;
}
.category-image-wrapper {
    padding: 1rem;
}
.book-btn {
    color: black;
    background-color: white;
    text-decoration: none;
    padding: 10px 20px;
}
.book-btn:hover {
    background-color: #f2f3f3;
}

.remove-btn {
    border-color: red !important;
    color: red;
    font-weight: 500;
    background-color: #f6ecff;
    text-decoration: none;
}

.author {
    height: 60px;
    width: 60px;
}
.price {
    font-size: 13px;
}
.appointment-wrapper {
    background-color: #f6ecff6c;
}
.booking_id {
    font-size: 18px;
    font-weight: 500;
}
.author_name {
    font-weight: 600;
    font-size: 17px;
}
.reviewed-date {
    font-weight: 500;
    color: gray;
    font-size: 14px;
}
.stars {
    font-size: 12px;
}
.member-name {
    font-weight: 500;
    font-size: 17px;
}
.member-post {
    color: gray;
    font-size: 14px;
    font-weight: 500;
}
.about-us-text {
    text-align: justify;
}
.branch-name {
    font-size: 19px;
    font-weight: 500;
}
.branch-address {
    font-size: 13px;
}
.store-name {
    font-weight: 600;
    font-size: 20px;
}
.store-address {
    font-size: 14px;
}
.booking-head-text {
    font-weight: 500;
    font-size: 20px;
}
.footer-name {
    font-size: 14px;
}
.footer-padding {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
}
.routeactive {
    color: #64259b !important;
    font-weight: 500;
}
.footer-route {
    text-decoration: none;
    color: gray;
}
.store-name-checkout {
    font-size: 19px;
    font-weight: 600;
}
.date {
    font-size: 14px;
    font-weight: 500;
}
.time {
    font-size: 14px;
    font-weight: 500;
}
.services-wrapper .nav-pills {
    top: 7.5%;
}
.icons-wrapper {
    background-color: #f6ecff;
    width: 60px;
    height: 60px;
}
.delete-text {
    font-size: 18px;
    font-weight: 500;
}
.appointments .nav-item .active {
    background-color: #65249b !important;
    color: white !important;
}
.appointments .nav-item .nav-link {
    background-color: #f6ecff;
    color: black;
    font-weight: 500;
}

.booking-msg {
    font-size: 30px;
    font-weight: 600;
    /* color: #64259b; */
}
.booking-link {
    text-decoration: none;
    color: #64259b;
    font-weight: 500;
}
.msg-text {
    font-size: 18px;
}
.view-app {
    background-color: #64259b;
    border-color: #64259b;
}
.back-btn {
    background-color: #f6ecff;
    border-color: #64259b;
    border-width: 2px;
    color: #64259b;
}
.view-app:hover {
    background-color: #64259b;
    border-color: #64259b;
}
.back-btn:hover {
    background-color: #f6ecff;
    border-color: #64259b;
    border-width: 2px;
    color: #64259b;
}
.welcome-msg {
    font-size: 23px;
    font-weight: 600;
}
.custom-border-field {
    border-right: 1px solid rgb(215, 214, 214) !important;
}
/*  */

/*  */
@media (max-width: 968px) {
    /* .hero-image {
    height: 320px !important;
  } */
}
.add-service-wrapper {
    background-color: #65249b;
    color: white;
}
.add-service {
    color: white;
    text-decoration: none;
}
.booking-sub-text {
    font-size: 14px;
}
.technician-select .form-check-input:checked {
    background-color: #65249b !important;
    border-color: #65249b !important;
}
.technician-select .form-check-input:checked + label {
    color: #65249b !important;
}
.tech-list .form-check-input:checked + label {
    border-color: #65249b !important;
}
.modal-backdrop {
    z-index: 9998 !important;
}
.modal {
    z-index: 9999 !important;
}
.services-wrapper .nav-pills .nav-item {
    margin-bottom: 1rem;
}
.add-book {
    padding: 1rem;
    background-color: black;
    color: white;
    padding: 1rem;
    border-radius: 10px;
}

.add-book:hover {
    background-color: rgb(32, 32, 32);
    color: white;
}
.btn-wrapper {
    padding: 0.5rem 1rem;
}
.address-wrapper {
    padding: 0.5rem 1rem;
}
.open-time {
    font-size: 17px;
}

@media (max-width: 968px) {
    /* .hero-image {
        height: 320px !important;
    } */
    .welcome-text {
        font-size: 2rem !important;
    }
}
@media (max-width: 768px) {

    .technician-wrapper {
        height: 170px;
    }
    /* .hero-image {
  height: 200px !important;
} */

    .time-slide {
        flex-wrap: nowrap;
        overflow-x: scroll;
    }
    .navigation-submenue {
        flex-wrap: nowrap;
        overflow-x: scroll;
    }
    .delete-option {
        flex-wrap: nowrap;
        overflow-x: scroll;
    }
    .msg-text {
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .welcome-text {
        font-size: 1.8rem !important;
    }
    .custom-border-field {
        border-right: none !important;
    }
}
@media (max-width: 1367px) {
    /* .hero-image {
    height: 400px;
  } */
}


.custom-primary-btn {
    font-weight: 600 !important;
    border-radius: 10px !important;
    padding: 10px 25px !important;
    font-size: 15px !important;
    background-color: #2c2c2c !important;
    color: #fff !important;
}
.custom-primary-btn:hover {
    background-color: #1f1f1f !important;
    color: #fff !important;
}
.custom-secondary-btn {
    font-weight: 600 !important;
    border: 1px solid #000000 !important;
    border-radius: 10px !important;
    padding: 10px 25px !important;
    font-size: 15px !important;
    background-color: #ffffff !important;
    color: #000000 !important;
}
.custom-secondary-btn:hover {
    background-color: #e0e0e0 !important;
    color: #000000 !important;
}