/*==================================
SHOP PAGE
==================================*/

.shop-page{

padding:60px 0;

background:#f5f5f7;

min-height:100vh;

}

/*==================================
SIDEBAR
==================================*/

.shop-sidebar{

background:#fff;

padding:25px;

border-radius:15px;

box-shadow:0 10px 30px rgba(0,0,0,.08);

position:sticky;

top:20px;

}

.shop-sidebar h4{

font-size:24px;

font-weight:700;

margin-bottom:25px;

color:#15161D;

}

.shop-sidebar h6{

font-size:15px;

font-weight:700;

margin-bottom:10px;

}

.shop-sidebar .form-control,

.shop-sidebar .form-select{

height:48px;

border-radius:10px;

}

.shop-sidebar .btn{

height:50px;

font-weight:700;

border-radius:10px;

}

/*==================================
HEADER
==================================*/

.shop-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:30px;

}

.shop-header h3{

font-size:34px;

font-weight:700;

margin:0;

}

.shop-header p{

margin:0;

color:#777;

}

/*==================================
PRODUCT CARD
==================================*/

.product-card{

background:#fff;

border-radius:18px;

overflow:hidden;

position:relative;

transition:.35s;

box-shadow:0 10px 30px rgba(0,0,0,.06);

height:100%;

}

.product-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 40px rgba(0,0,0,.12);

}

/*==================================
BADGE
==================================*/

.discount-badge{

position:absolute;

top:15px;

left:15px;

background:#D10024;

color:#fff;

padding:6px 12px;

border-radius:50px;

font-size:13px;

font-weight:700;

z-index:2;

}

/*==================================
WISHLIST
==================================*/

.wishlist-btn{

position:absolute;

top:15px;

right:15px;

z-index:2;

}

.wishlist-btn a{

width:40px;

height:40px;

display:flex;

align-items:center;

justify-content:center;

background:#fff;

border-radius:50%;

text-decoration:none;

color:#333;

box-shadow:0 5px 15px rgba(0,0,0,.12);

transition:.3s;

}

.wishlist-btn a:hover{

background:#D10024;

color:#fff;

}

/*==================================
IMAGE
==================================*/

.product-image{

height:260px;

display:flex;

align-items:center;

justify-content:center;

padding:20px;

background:#fff;

}

.product-image img{

max-width:100%;

max-height:220px;

transition:.35s;

}

.product-card:hover .product-image img{

transform:scale(1.08);

}

/*==================================
BODY
==================================*/

.product-body{

padding:20px;

}

.product-category{

font-size:13px;

color:#888;

margin-bottom:8px;

}

.product-body h5{

font-size:18px;

font-weight:700;

height:50px;

overflow:hidden;

margin-bottom:15px;

}

.product-body h5 a{

text-decoration:none;

color:#15161D;

}

.product-body h5 a:hover{

color:#D10024;

}

/*==================================
RATING
==================================*/

.rating{

margin-bottom:15px;

}

.rating i{

color:#ffc107;

font-size:14px;

}

.rating span{

margin-left:5px;

color:#777;

font-size:14px;

}

/*==================================
PRICE
==================================*/

.price{

margin-bottom:15px;

}

.price .sale{

font-size:24px;

font-weight:700;

color:#D10024;

}

.price .mrp{

margin-left:10px;

text-decoration:line-through;

color:#999;

}

/*==================================
STOCK
==================================*/

.stock{

font-size:14px;

font-weight:600;

margin-bottom:15px;

}

.in-stock{

color:#28a745;

}

.out-stock{

color:#dc3545;

}

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

.product-buttons{

display:flex;

gap:10px;

}

.product-buttons .btn{

flex:1;

border-radius:10px;

font-weight:600;

}

/*==================================
PAGINATION
==================================*/

.pagination .page-link{

border:none;

margin:0 4px;

border-radius:8px;

color:#15161D;

padding:10px 16px;

}

.pagination .page-item.active .page-link{

background:#D10024;

border-color:#D10024;

color:#fff;

}

.pagination .page-link:hover{

background:#15161D;

color:#fff;

}

/*==================================
RESPONSIVE
==================================*/

@media(max-width:991px){

.shop-sidebar{

margin-bottom:30px;

position:relative;

top:0;

}

}

@media(max-width:768px){

.shop-header{

flex-direction:column;

align-items:flex-start;

gap:10px;

}

.product-image{

height:220px;

}

.product-image img{

max-height:180px;

}

}

@media(max-width:576px){

.shop-page{

padding:30px 0;

}

.shop-sidebar{

padding:20px;

}

.shop-header h3{

font-size:28px;

}

.product-body{

padding:15px;

}

.product-body h5{

font-size:16px;

height:auto;

}

.price .sale{

font-size:20px;

}

.product-buttons{

flex-direction:column;

}

}