/* =========================
HEADER ICONS LAYOUT
========================= */

.ss-header-icons{
display:flex;
align-items:center;
gap:20px;
justify-content:flex-end;
position:relative;
z-index:999999;

margin-right:40px;
}


/* =========================
CART ICON
========================= */

.ss-cart-icon-wrapper{
position:relative;
cursor:pointer;
}

.ss-cart-icon{
font-size:22px;
position:relative;
transition:.2s;
}

.ss-cart-icon:hover{
transform:scale(1.08);
}

.ss-count{
position:absolute;
top:-8px;
right:-10px;
background:#ff2d55;
color:#fff;
font-size:11px;
padding:3px 6px;
border-radius:50%;
}


/* =========================
HOVER MINI CART
========================= */

.ss-mini-cart{

position:absolute;
top:38px;
right:0;

width:340px;

background:#fff;

border-radius:10px;

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

padding:15px;

display:none;

z-index:9999999;

animation:miniCartFade .2s ease;

}

@keyframes miniCartFade{
from{
opacity:0;
transform:translateY(8px);
}
to{
opacity:1;
transform:translateY(0);
}
}

.ss-cart-icon-wrapper:hover .ss-mini-cart,
.ss-mini-cart:hover{
display:block;
}


/* =========================
CART LIST
========================= */

.ss-cart-list{
list-style:none;
padding:0;
margin:0;
}

.ss-cart-item{

display:flex;

align-items:flex-start;

gap:12px;

padding:10px 0;

border-bottom:1px solid #eee;

}

.ss-cart-item img{

width:52px;
height:auto;

border-radius:6px;

}


/* =========================
CART INFO
========================= */

.ss-cart-info{
flex:1;
}

.ss-cart-info a{

text-decoration:none;

font-size:14px;

color:#111;

display:block;

font-weight:500;

}

.ss-price{

font-size:13px;

color:#777;

margin-top:3px;

display:block;

}


/* =========================
QTY BUTTON
========================= */

.ss-qty{

display:flex;

align-items:center;

gap:6px;

margin-top:6px;

}

.ss-qty button{

width:28px;
height:28px;

border:1px solid #ddd;
background:#f6f6f6;

cursor:pointer;

border-radius:6px;

font-size:18px;
font-weight:600;

display:flex;
align-items:center;
justify-content:center;

line-height:1;

transition:.2s;

}


/* =========================
REMOVE BUTTON
========================= */

.ss-remove{

background:none;

border:none;

color:#999;

font-size:16px;

cursor:pointer;

transition:.2s;

}

.ss-remove:hover{

color:#e63946;

transform:scale(1.15);

}


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

.ss-cart-footer{

border-top:1px solid #eee;

margin-top:12px;

padding-top:12px;

display:flex;

justify-content:space-between;

align-items:center;

}

.ss-checkout{

background:#000;

color:#fff;

padding:8px 18px;

border-radius:6px;

text-decoration:none;

font-size:14px;

transition:.2s;

}

.ss-checkout:hover{
background:#333;
}


/* =========================
CART DRAWER
========================= */

.ss-cart-overlay{

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,.35);

display:none;

z-index:999998;

backdrop-filter:blur(2px);

}

.ss-cart-drawer{

position:fixed;

top:0;
right:-440px;

width:420px;

height:100%;

background:#fff;

transition:.35s cubic-bezier(.4,0,.2,1);

z-index:999999;

box-shadow:-8px 0 35px rgba(0,0,0,.2);

overflow-y:auto;

padding:10px;

}

.ss-cart-open{
right:0;
}


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

.ss-cart-header{

display:flex;

justify-content:space-between;

align-items:center;

padding:15px;

border-bottom:1px solid #eee;

}

.ss-cart-header h3{
margin:0;
font-size:18px;
}


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

.ss-wishlist-icon{
font-size:22px;
position:relative;
text-decoration:none;
color:#111;
cursor:pointer;
transition:.2s;
}

.ss-wishlist-icon:hover{
transform:scale(1.08);
}

.ss-wishlist-count{
position:absolute;
top:-8px;
right:-10px;
background:#ff2d55;
color:#fff;
font-size:11px;
padding:3px 6px;
border-radius:50%;
}


/* =========================
ACCOUNT
========================= */

.ss-account-wrapper{
position:relative;
cursor:pointer;
}

.ss-account-icon{
font-size:22px;
transition:.2s;
}

.ss-account-icon:hover{
transform:scale(1.08);
}


/* =========================
ACCOUNT DROPDOWN
========================= */

.ss-account-dropdown{
position:absolute;
top:38px;
right:0;
background:#fff;
box-shadow:0 10px 30px rgba(0,0,0,.15);
border-radius:8px;
display:none;
min-width:170px;
z-index:9999999;
padding:8px 0;
animation:miniCartFade .2s ease;
}

.ss-account-dropdown a:hover{
background:#f6f6f6;
padding-left:18px;
transition:0.2s;
}




.ss-account-wrapper:hover .ss-account-dropdown,
.ss-account-dropdown:hover{
display:block;
}

.ss-account-dropdown a{
display:block;
padding:10px 14px;
text-decoration:none;
color:#333;
font-size:14px;
}

.ss-account-dropdown a:hover{
background:#f5f5f5;
}