*{font-family:'DM Sans',system-ui,sans-serif;box-sizing:border-box}
:root{
    --accent:#4f46e5;
    --accent2:#7c3aed;
    --dark:#0a0a0f;
}
.fade-in{animation:fadeIn .4s cubic-bezier(.4,0,.2,1)}
@keyframes fadeIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.card-lift{transition:all .4s cubic-bezier(.4,0,.2,1)}.card-lift:hover{transform:translateY(-8px);box-shadow:0 32px 64px -16px rgba(0,0,0,.1)}
.mobile-menu{transition:transform .35s cubic-bezier(.4,0,.2,1)}.mobile-menu.closed{transform:translateX(-100%)}
.toast{animation:tIn .4s ease,tOut .35s ease 2.5s forwards}
@keyframes tIn{from{transform:translateX(120%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes tOut{to{transform:translateX(120%);opacity:0}}
.zoom-img{transition:transform .5s cubic-bezier(.4,0,.2,1)}.zoom-img:hover{transform:scale(1.05)}
.thumb-item{cursor:pointer; border-radius:14px;overflow:hidden;transition:all .25s}.thumb-item.active{border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,70,229,.2)}
.magnifier{overflow:hidden;cursor:crosshair}.magnifier img{transition:transform .15s ease-out}
.qty-wrap{display:inline-flex;align-items:center;border:1.5px solid #e2e8f0;border-radius:14px;overflow:hidden}.qty-btn{width:42px;height:42px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;cursor:pointer;transition:all .15s;user-select:none}.qty-btn:hover{background:#f1f5f9}
.badge-pos{position:absolute;top:14px;left:14px;z-index:5}
.glass{background:rgba(255,255,255,.06);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08)}
.gradient-text{background:linear-gradient(135deg,#6366f1 0%,#a855f7 50%,#ec4899 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-dark{background:var(--dark)}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(79,70,229,.1)}
.tab-active{color:var(--accent);border-bottom:2px solid var(--accent)}
.wishlist-heart{transition:all .25s}.wishlist-heart:hover{transform:scale(1.2)}.wishlist-heart.liked svg{fill:#ef4444;stroke:#ef4444}
.account-tab.active{background:linear-gradient(135deg,#eef2ff,#ede9fe);color:var(--accent);font-weight:700}
.nav-active{background:#f1f5f9;color:var(--accent);font-weight:700}

.nav-link.active-nav { color: #6366f1; border-bottom: 2px solid #6366f1; }
.mega-menu { display: none; }
.mega-trigger:hover .mega-menu { display: block; }
.bg-primary { background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a78bfa 100%); }

.thumb-item {
        flex: 0 0 80px !important; 
    }
/* mobile search option */
.mobile-search-row{
    overflow:hidden;max-height:0;opacity:0;
    transition:max-height .35s cubic-bezier(.4,0,.2,1),opacity .25s ease,padding .35s ease;
    padding:0 16px;
}
.mobile-search-row.open{max-height:80px;opacity:1;padding:0 16px 14px 16px}

/* Hero Slide Animation */
.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.7s ease-in-out;
}

.hero-slide.active-slide {
    opacity: 1;
}