/* ======================================================
   SEAN B SHOP
   MARKETPLACE CART COMPONENT
   /assets/css/components/cart.css

   CLEAN PRODUCTION VERSION
====================================================== */


/* ======================================================
   HEADER CART ACTION
====================================================== */


.cart-action{

    position:relative;

    display:flex;

    align-items:center;

    gap:8px;

    color:#0b1f3a;

    font-weight:600;

    transition:.25s ease;

}



.cart-action:hover{

    color:#e60000;

}



.cart-action i{

    font-size:23px;

}





/* ======================================================
   CART COUNTER BADGE
====================================================== */


.cart-counter{


    position:absolute;


    top:-12px;


    right:-14px;



    min-width:22px;


    height:22px;


    padding:0 5px;



    display:flex;


    align-items:center;


    justify-content:center;



    background:#e60000;



    color:#ffffff;



    border-radius:50%;



    border:2px solid #ffffff;



    font-size:11px;



    font-weight:800;



    line-height:1;



}








/* ======================================================
   MINI CART DROPDOWN
====================================================== */


.mini-cart{


    position:absolute;


    top:55px;


    right:0;



    width:360px;



    background:#ffffff;



    border-radius:14px;



    box-shadow:


    0 15px 45px rgba(0,0,0,.15);



    opacity:0;



    visibility:hidden;



    transform:translateY(15px);



    transition:.25s ease;



    z-index:3000;



}





.cart-action:hover .mini-cart{


    opacity:1;


    visibility:visible;


    transform:translateY(0);


}








/* ======================================================
   MINI CART HEADER
====================================================== */


.mini-cart-header{


    padding:18px;


    border-bottom:1px solid #eeeeee;



    display:flex;


    align-items:center;


    justify-content:space-between;



}



.mini-cart-header strong{


    font-size:16px;


    color:#0b1f3a;


}



.mini-cart-header span{


    color:#e60000;


    font-size:13px;


    font-weight:700;


}







/* ======================================================
   CART ITEMS
====================================================== */


.mini-cart-items{


    max-height:320px;


    overflow-y:auto;


    padding:10px 15px;


}





.mini-cart-item{


    display:flex;


    gap:12px;


    padding:12px 0;



    border-bottom:1px solid #f1f5f9;



}





.mini-cart-item img{


    width:65px;


    height:65px;


    object-fit:cover;


    border-radius:8px;


}





.cart-item-info{


    flex:1;


}





.cart-item-title{


    font-size:13px;


    font-weight:600;


    color:#111827;



    display:-webkit-box;


    -webkit-line-clamp:2;


    -webkit-box-orient:vertical;


    overflow:hidden;


}





.cart-item-price{


    margin-top:5px;


    color:#e60000;


    font-size:13px;


    font-weight:700;


}





.cart-item-qty{


    font-size:12px;


    color:#6b7280;


}







/* ======================================================
   EMPTY CART
====================================================== */


.empty-cart{


    padding:35px 20px;


    text-align:center;


    color:#6b7280;


}



.empty-cart i{


    font-size:40px;


    color:#d1d5db;


    margin-bottom:15px;


}



.empty-cart strong{


    display:block;


    color:#111827;


    margin-bottom:6px;


}







/* ======================================================
   CART FOOTER
====================================================== */


.mini-cart-footer{


    padding:18px;


    border-top:1px solid #eeeeee;


}





.cart-total{


    display:flex;


    justify-content:space-between;


    align-items:center;


    margin-bottom:15px;


}



.cart-total span{


    color:#6b7280;


}



.cart-total strong{


    color:#0b1f3a;


    font-size:18px;


}







/* ======================================================
   CART BUTTONS
====================================================== */


.cart-buttons{


    display:flex;


    gap:10px;


}



.cart-buttons a{


    flex:1;


    height:42px;



    display:flex;


    align-items:center;


    justify-content:center;



    border-radius:8px;



    font-size:13px;



    font-weight:700;


    transition:.25s;


}





.view-cart-btn{


    background:#f1f5f9;


    color:#0b1f3a;


}



.view-cart-btn:hover{


    background:#e5e7eb;


}





.checkout-btn{


    background:#e60000;


    color:#ffffff;


}



.checkout-btn:hover{


    background:#c40000;


}








/* ======================================================
   CART PAGE COMPONENT
====================================================== */


.cart-page{


    background:#f8fafc;


    padding:40px 0;


}





.cart-card{


    background:#ffffff;


    border-radius:14px;


    padding:25px;


    box-shadow:


    0 5px 20px rgba(0,0,0,.06);


}





.cart-table{


    width:100%;


    border-collapse:collapse;


}





.cart-table th{


    text-align:left;


    padding:15px;


    background:#f8fafc;


    font-size:13px;


    color:#374151;


}





.cart-table td{


    padding:18px 15px;


    border-bottom:1px solid #eeeeee;


}








/* ======================================================
   MOBILE CART
====================================================== */


.mobile-cart{


    position:relative;


}



.mobile-cart .cart-counter{


    top:-8px;


    right:-8px;


}







@media(max-width:992px){


    .mini-cart{


        display:none;


    }


}





@media(max-width:480px){


    .cart-counter{


        min-width:19px;


        height:19px;


        font-size:10px;


    }


}
.cart-pop{

    animation:
    cartBounce .4s ease;

}



@keyframes cartBounce{


0%{

transform:scale(1);

}


50%{

transform:scale(1.25);

}


100%{

transform:scale(1);

}


}