#wishlist-overlay{

position:fixed;

top:0;

left:0;

width:100%;

height:100%;

background:rgba(0,0,0,.45);

opacity:0;

visibility:hidden;

transition:.3s;

z-index:9998;

}

#wishlist-overlay.active{

opacity:1;

visibility:visible;

}

#wishlist-drawer{

position:fixed;

top:0;

right:-32rem;

width:min(30rem,100%);

height:100vh;

background:#fff;

z-index:9999;

box-shadow:-0.6rem 0 2rem rgba(0,0,0,.15);

transition:.4s;

display:flex;

flex-direction:column;

}

#wishlist-drawer.active{

right:0;

}

.wishlist-header{

padding:1.5rem;

display:flex;

justify-content:space-between;

align-items:center;

border-bottom:.06rem solid #eee;

}

.wishlist-header h3{

margin:0;

font-size:1.5rem;

font-weight:700;

}

#wishlist-close{

border:none;

background:none;

font-size:2rem;

cursor:pointer;

}

#wishlist-items{

flex:1;

overflow-y:auto;
 overflow-x:hidden;

padding:1rem;

}

.drawer-item{

display:flex;

align-items:center;

gap:1rem;

padding:1rem 0;

border-bottom:.06rem solid #eee;

}

.drawer-image img{

width:5rem;

height:5rem;

object-fit:cover;

border-radius:.5rem;

}

.drawer-content{

flex:1;

}

.drawer-content h5{

font-size:1rem;

font-weight:600;

margin-bottom:.3rem;

}

.drawer-price{

font-size:1.1rem;

font-weight:700;

color:#008000;

margin-bottom:.3rem;

}

.drawer-date{

font-size:.8rem;

color:#777;

}

.drawer-actions{

display:flex;

align-items:center;

gap:.6rem;

}

.drawer-move-cart-btn{

border:none;

background:#008000;

color:#fff;

padding:.65rem 1rem;

font-size:.85rem;

font-weight:600;

cursor:pointer;

border-radius:.3rem;

transition:.3s;

}

.drawer-move-cart-btn:hover{

background:#006d00;

}

.drawer-remove-btn{

width:2.3rem;

height:2.3rem;

border:.06rem solid #ff4d4d;

background:#fff;

color:#ff4d4d;

cursor:pointer;

border-radius:.4rem;

font-size:1rem;

}

.drawer-remove-btn:hover{

background:#ff4d4d;

color:#fff;

}

.wishlist-footer{

padding:1rem;

border-top:.06rem solid #eee;
 margin-top:auto;

    background:#fff;

}

.continue-btn{

width:100%;

height:3rem;

border:.06rem solid #333;

background:#fff;

font-size:1rem;

cursor:pointer;

}

.wishlist-empty{

    text-align:center;

    padding:4rem 1rem;

}

.wishlist-empty i{

    font-size:3rem;

    color:#ccc;

    margin-bottom:1rem;

}

.wishlist-empty h4{

    font-size:1.2rem;

    margin-bottom:.5rem;

}

.wishlist-empty p{

    color:#777;

    font-size:.9rem;

}
.drawer-move-cart-btn{

    border:none;

    background:#008000;

    color:#fff;

    padding:.65rem 1rem;

    font-size:.85rem;

    font-weight:600;

    cursor:pointer;

    border-radius:.3rem;

    transition:.3s;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:.5rem;

}


.wishlist-empty{

text-align:center;

padding:2rem;

font-size:1rem;

color:#777;

}
.desktop-cart-text{

    display:inline;
}

.mobile-cart-icon{

    display:none;
}
/* .drawer-item{

    position:relative;
} */
@media(max-width:48rem){

.drawer-item{

flex-wrap:wrap;

}

.drawer-actions{

        width:auto;

        justify-content:flex-end;

        margin-left:auto;
    }

    .drawer-move-cart-btn{

        flex:none;
    }


}
/* 
@media(max-width:30rem){

#wishlist-drawer{

width:100%;

}

.drawer-image img{

width:4rem;

height:4rem;

}

.drawer-content h5{

font-size:.9rem;

}

.drawer-price{

font-size:1rem;

}

.drawer-move-cart-btn{

    width:2.8rem;

    height:2.8rem;

    min-width:2.8rem;

    padding:0;

    border-radius:.4rem;

    display:flex;

    align-items:center;

    justify-content:center;
}
.desktop-cart-text{

    display:none;
}

.mobile-cart-icon{

    display:block;

    font-size:1rem;
}

.drawer-move-cart-btn{

    width:2.5rem;

    height:2.5rem;

    padding:0;

    border-radius:.4rem;
} 

  .drawer-item{

        align-items:flex-start;
    }

    .drawer-content{

        padding-right:6rem;
    }

    .drawer-actions{

        position:absolute;

        right:0;

        top:50%;

        transform:translateY(-50%);
    }
} */

@media (max-width:30rem){

#wishlist-drawer{

    width:100%;

    max-width:100%;

    right:-100%;

}

#wishlist-drawer.active{

    right:0;

}

#wishlist-items{

    padding:.75rem;

}

.drawer-item{

    display:grid;

    grid-template-columns:4rem 1fr auto;

    gap:.75rem;

    align-items:center;

    padding:.9rem 0;

}

.drawer-image img{

    width:4rem;

    height:4rem;

}

.drawer-content{

    padding:0;

}

.drawer-content h5{

    font-size:.9rem;

    margin-bottom:.2rem;

}

.drawer-price{

    font-size:.95rem;

}

.drawer-date{

    font-size:.75rem;

}

.drawer-actions{

    position:static;

    transform:none;

    display:flex;

    flex-direction:column;

    gap:.45rem;

    margin-left:0;

}

.desktop-cart-text{

    display:none;

}

.mobile-cart-icon{

    display:block;

    font-size:.95rem;

}

.drawer-move-cart-btn{

    width:2.5rem;

    height:2.5rem;

    min-width:2.5rem;

    padding:0;

}

.drawer-remove-btn{

    width:2.5rem;

    height:2.5rem;

}

}