.page{
    background-color: #FAFAFA ;
    padding-bottom: 50px;
}

.navbar{
    border-bottom: 1px solid #E2E2E2;
}
.navbar-bg{
  background-color: #FAFAFA !important;
}
span.back-text{
    font-size: 18px;
    vertical-align: middle;
    margin-left: 5px;
    font-weight: 600;
}

.popover-arrow{
    display: none !important;
}

.profile-div{
    /* position: relative; */
}
.profile-div .profile-dropdown{
    display: flex;
    flex-direction: column;
    /* position: absolute;
    top: 10px;
    right: 0; */
    background: #FEFEFE !important;
    border: 1px solid #E2E2E2 !important;
    border-radius: 24px !important;
    box-shadow: 0px 4px 12px 0px #0000001A !important;
    z-index: 1000;
    padding: 12px 0;
    /* width: 350px; */
}
.popover-menu{
    --f7-popover-width: -webkit-fill-available !important;
    --f7-popover-padding: 0px;
    --f7-popover-border-radius: 24px;
    --f7-popover-box-shadow: 0px 4px 12px 0px #0000001A;
    --f7-popover-border: 1px solid #E2E2E2;
    --f7-popover-bg-color: #FEFEFE;
    margin-right: 6px !important;
    margin-left: 1px !important;
}

.profile-menu-link{
    /* margin: 0 12px; */
    display: flex;
    align-items: center;
    padding: 3px 10px;
    gap: 5px;
    color: black !important;
    /* justify-content: space-between; */
}

.close-profile{
    /* display: none !important; */
    position: absolute;
    top: -30px;
    left: 92%;
}
.drop-arr{
    margin-left: auto;
    font-size: 15px;
    color: gray;
}

.main-content{
    margin: 16px;
}

.navbars~* .page-with-navbar-large, .navbars~.page-with-navbar-large, .navbar~* .page-with-navbar-large, .navbar~.page-with-navbar-large, .page-with-navbar-large .navbar~* {
    --f7-page-navbar-offset: calc(var(--f7-navbar-height) + var(--f7-navbar-large-title-height) + var(--f7-safe-area-top) - 24px) !important;
}

.demo-swiper-gallery-top swiper-slide{
    /* max-width: 370px !important;
    max-height: 280px !important; */
    border-radius: 24px !important;
    /* width: 90%;
    max-height: 75%; */
    background-repeat: no-repeat;
    background-size: cover;
}
.demo-swiper-gallery-thumbs swiper-slide{
    width: 90px !important;
    height: 80px !important;
}
.swiper-slide-pic{
    width: 85px !important;
    height: 75px !important;
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: var(--swiper-navigation-top-offset,50%);
    width: calc(var(--swiper-navigation-size)/ 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size)/ 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(2,2,2,.5);
    backdrop-filter: blur(2px);
    border-radius: 50%;
    /* width: 40px;
    height: 40px; */
    transform: scale(0.5);
    color: var(--swiper-navigation-color,var(--swiper-theme-color));
}

.car-details-card{
    border-radius: 24px 24px 0 0;
    border: 1px solid var(--W-3, #E2E2E2);
    background: var(--W-1, #FCFCFC);
    /* padding: 8px; */
}

.product-info{
    margin: 8px;
}

.seller-info{
    margin: 8px;
}

.buttons-div{
    border-radius: 36px 36px 0 0;
    border-top: 1px solid var(--W-0, #FEFEFE);
    background: linear-gradient(90deg, rgba(252, 252, 252, 0.2) 0%, rgba(252, 252, 252, 0.2) 100%);
    backdrop-filter: blur(8px);

    box-shadow: 0px 0px 0px 0.5px #FEFEFE66,
                 0px -1px 6px 0px #8F8F8F40;
    display: flex;
    justify-content: space-around;
    padding: 16px;
    gap: 16px;

}

.buttons-div-2{
    /* border-radius: 36px 36px 0 0; */
    /* border-top: 1px solid var(--W-0, #FEFEFE); */
    /* background: linear-gradient(90deg, rgba(252, 252, 252, 0.2) 0%, rgba(252, 252, 252, 0.2) 100%); */
    /* backdrop-filter: blur(8px); */

    /* box-shadow: 0px 0px 0px 0.5px #FEFEFE66,
                 0px -1px 6px 0px #8F8F8F40; */
    display: flex;
    justify-content: space-around;
    padding: 16px;
    gap: 16px;

}


.buttons-div button,.buttons-div-2 button{
    border-radius: 18px;
    padding: 15px 12px;
    border: 1px solid var(--W-6, #B7B7B7);
    background: var(--W-0, #FEFEFE);
}

.buttons-div button.buy-btn, .buttons-div-2 button.buy-btn{
    background: var(--BL-2, #005853);
    border: 1px solid var(--BL-3, #007B74);
    color: var(--W-0, #FEFEFE);
}


.actions-modal{
    /* width: 90% !important;
    margin: 0 auto;
    border-radius: 24px 24px 0 0; */
}

.pop-ani{
    /* width: 80%; */
    /* margin: 0 auto; */
    
    border-radius: 24px 24px 0 0;
    background: white !important;
    padding: 16px; 
}

.close-icon{
    margin-left: auto;
}

.order-div{
    width: -webkit-fill-available;
    margin-left: 4px !important;
    margin-right: 4px !important;

}
.order-div > ul{
    background: #FCFCFC !important;
}
.order-id{
    align-items: center;
    gap: 16px;
    padding: 10px 4px;
}
.order-id span:last-child{
    text-align: right;
}

.actions-modal{
    width: -webkit-fill-available !important;
    /* left: 50%; */
    margin-left: 16px;
    margin-right: 16px;
}

.actions-backdrop, .popover-backdrop{
    backdrop-filter: blur(28px);
    background: #0000001A;
}

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

    .actions-modal {
        width: 350px;
        left: 50%;
        margin-left: -200px;
    }

    .popover-menu{
        /* width: 350px !important; */
    }

}


@media screen and (max-width: 495){

}