/* ── Scrollbar hiding ── */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ── Cart badge pop ── */
.cart-badge { animation: badge-pop 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes badge-pop {
    0%   { transform: scale(0); }
    100% { transform: scale(1); }
}

/* ── Cart overlay transition ── */
.cart-overlay-enter-active { transition: opacity 0.25s ease; }
.cart-overlay-leave-active { transition: opacity 0.2s ease; }
.cart-overlay-enter-from,
.cart-overlay-leave-to { opacity: 0; }

/* ── Cart sheet slide ── */
.cart-sheet-enter-active { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1); }
.cart-sheet-leave-active { transition: transform 0.25s ease-in; }
.cart-sheet-enter-from,
.cart-sheet-leave-to { transform: translateY(100%); }

/* ── Sticky cart bar transition ── */
.cart-bar-enter-active { transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); }
.cart-bar-leave-active { transition: all 0.2s ease-in; }
.cart-bar-enter-from,
.cart-bar-leave-to { opacity: 0; transform: translateY(100%); }

/* ── Product card entrance ── */
.product-card { animation: card-in 0.35s ease both; }
@keyframes card-in {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Gallery scroller ── */
.gallery-track {
    display: flex;
    gap: 0.75rem;
    width: max-content;
    animation: gallery-scroll 40s linear infinite;
}
.gallery-track:hover,
.gallery-track:active {
    animation-play-state: paused;
}
.gallery-img {
    width: 220px;
    height: 220px;
    object-fit: cover;
    border-radius: 1rem;
    flex-shrink: 0;
    opacity: 0.7;
    transition: opacity 0.3s ease;
}
@media (min-width: 1024px) {
    .gallery-img {
        width: 300px;
        height: 300px;
    }
}
.gallery-img:hover {
    opacity: 1;
}
@keyframes gallery-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* ── Line clamp fallback ── */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Tabular nums for prices ── */
.tabular-nums { font-variant-numeric: tabular-nums; }

/* ── Selection color ── */
::selection { background-color: #FDF6EE; color: #4A0E1E; }

/* ── Focus styles ── */
button:focus-visible { outline: 2px solid #FDF6EE; outline-offset: 2px; }

/* ── Tap highlight ── */
button, a { -webkit-tap-highlight-color: transparent; }

/* ── Add button bounce ── */
.add-btn:active { transform: scale(0.92); }

/* ── Smooth scroll ── */
html { scroll-behavior: smooth; }