/* ============================================
   A-LETE VISION — Shared Interactive CSS
   ============================================ */

/* Product images are now transparent PNGs — no blend mode needed */

/* Mega Menu */
.mega-menu {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
    pointer-events: none;
}
.mega-menu.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}
.mega-backdrop {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}
.mega-backdrop.active {
    opacity: 1;
    visibility: visible;
}

/* Search Overlay */
.search-overlay {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}
.search-overlay.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Cart Drawer */
.cart-overlay { opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; }
.cart-overlay.active { opacity: 1; visibility: visible; }
.cart-drawer { transform: translateX(100%); transition: transform 0.3s ease; }
.cart-drawer.active { transform: translateX(0); }

/* Quick View Modal */
.qv-overlay {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}
.qv-overlay.active {
    opacity: 1;
    visibility: visible;
}
.qv-modal {
    opacity: 0;
    visibility: hidden;
    transform: scale(0.95);
    transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
}
.qv-modal.active {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

/* Size Guide Modal */
.sg-modal {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
}
.sg-modal.active {
    opacity: 1;
    visibility: visible;
}

/* Mobile mega menu arrow */
.mobile-mega-arrow {
    transition: transform 0.2s ease;
}

/* Product card quick view */
.product-card { position: relative; }
.product-card:hover .product-img { transform: scale(1.05); }
.product-card:hover .quick-view { opacity: 1; }
.product-img { transition: transform 0.4s ease; }
.quick-view { opacity: 0; transition: opacity 0.3s ease; }

/* Marquee */
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.marquee-track {
    display: flex;
    animation: marquee 30s linear infinite;
    width: max-content;
}
.marquee-track:hover { animation-play-state: paused; }

/* Star rating */
.star { color: #F59E0B; }

/* Nav */
.nav-icon:hover { opacity: 0.6; }
.nav-icon { transition: opacity 0.2s; }
.nav-scrolled { box-shadow: 0 1px 10px rgba(0,0,0,0.06); }

/* Buttons */
.btn-primary:hover { background: #333; }
.btn-primary { transition: background 0.2s; }

/* Category icons */
.cat-icon:hover { opacity: 0.7; }
.cat-icon { transition: opacity 0.2s; cursor: pointer; }

/* Gender card overlay */
.gender-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 50%);
}
.gender-card:hover img { transform: scale(1.03); }
.gender-card img { transition: transform 0.6s ease; }

/* Tabs */
.tab-btn.active { border-bottom: 2px solid #000; color: #000; }
.tab-btn { border-bottom: 2px solid transparent; color: #999; transition: all 0.2s; }

/* Scroll tracks */
.reviews-track, .loved-track { scroll-behavior: smooth; -ms-overflow-style: none; scrollbar-width: none; }
.reviews-track::-webkit-scrollbar, .loved-track::-webkit-scrollbar { display: none; }

/* Product page */
.thumb-btn { border: 2px solid transparent; transition: border-color 0.2s; }
.thumb-btn.active { border-color: #000; }
.color-btn { transition: box-shadow 0.2s; cursor: pointer; }
.color-btn.active { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #000; }
.accordion-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.accordion-content.open { max-height: 500px; }