/* ═══════════════════════════════════════════════════════════
   Premium interactions — hover, focus, active
   Load after storefront.css on index + product pages
   ═══════════════════════════════════════════════════════════ */

body.storefront-v2 {
    --sf-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
    --sf-ease-spring: cubic-bezier(0.34, 1.35, 0.64, 1);
    --sf-dur: 0.22s;
    --sf-lift: translateY(-2px);
    --sf-shadow-hover: 0 12px 32px rgba(0, 0, 0, 0.12);
    --sf-shadow-soft-hover: 0 8px 24px rgba(0, 0, 0, 0.08);
    --sf-focus-ring: 0 0 0 3px rgba(0, 112, 193, 0.28);
}

html:has(body.storefront-v2) {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html:has(body.storefront-v2) {
        scroll-behavior: auto;
    }
}

/* ─── Shared transition base ─── */
body.storefront-v2 button,
body.storefront-v2 a.btn-back-home,
body.storefront-v2 .btn-add-cart-glass,
body.storefront-v2 .btn-capsule,
body.storefront-v2 .btn-product-add,
body.storefront-v2 .btn-product-favorite,
body.storefront-v2 .btn-view-cart,
body.storefront-v2 .btn-google,
body.storefront-v2 .auth-submit-btn,
body.storefront-v2 .panel-close-btn,
body.storefront-v2 .category-pill,
body.storefront-v2 .glass-icon-btn,
body.storefront-v2 .btn-favorite-float,
body.storefront-v2 .btn-retry,
body.storefront-v2 .btn-go-back {
    transition:
        background var(--sf-dur) var(--sf-ease),
        color var(--sf-dur) var(--sf-ease),
        border-color var(--sf-dur) var(--sf-ease),
        box-shadow var(--sf-dur) var(--sf-ease),
        transform var(--sf-dur) var(--sf-ease),
        opacity var(--sf-dur) var(--sf-ease);
}

body.storefront-v2 button:focus-visible,
body.storefront-v2 a:focus-visible {
    outline: none;
    box-shadow: var(--sf-focus-ring);
}

/* ─── Header controls ─── */
body.storefront-v2.storefront-unified .profile-avatar-btn:hover,
body.storefront-v2.storefront-unified .header-actions-capsule .glass-icon-btn:hover,
body.storefront-v2.storefront-unified .header-cart-btn:hover {
    background: rgba(255, 255, 255, 0.92);
    transform: scale(1.06);
    box-shadow: var(--sf-shadow-soft-hover), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

body.storefront-v2.storefront-unified .profile-avatar-btn:active,
body.storefront-v2.storefront-unified .header-actions-capsule .glass-icon-btn:active,
body.storefront-v2.storefront-unified .header-cart-btn:active {
    transform: scale(0.96);
}

body.storefront-v2.storefront-unified .glass-wordmark {
    transition: opacity var(--sf-dur) var(--sf-ease), letter-spacing var(--sf-dur) var(--sf-ease);
}

body.storefront-v2.storefront-unified .glass-wordmark:hover {
    opacity: 0.72;
    letter-spacing: 0.24em;
}

/* ─── Back to shop ─── */
body.storefront-v2.storefront-unified .btn-back-home:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: var(--sf-lift);
    box-shadow: var(--sf-shadow-soft-hover), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

body.storefront-v2.storefront-unified .btn-back-home:active {
    transform: translateY(0) scale(0.98);
}

body.storefront-v2.storefront-unified .btn-back-home svg {
    transition: transform var(--sf-dur) var(--sf-ease);
}

body.storefront-v2.storefront-unified .btn-back-home:hover svg {
    transform: translateX(-3px);
}

/* ─── Category pills (legacy; index uses .category-card) ─── */
body.index-page.storefront-v2 .category-pill:not(.active):hover {
    background: rgba(255, 255, 255, 0.88);
    transform: var(--sf-lift);
    box-shadow: var(--sf-shadow-soft-hover);
    color: var(--primary-black);
}

body.index-page.storefront-v2 .category-pill:active {
    transform: scale(0.97);
}

body.index-page.storefront-v2 .category-pill.active:hover {
    background: #111;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.22);
}

body.index-page.storefront-v2 .index-hero-inner {
    transition: box-shadow var(--sf-dur) var(--sf-ease), border-color var(--sf-dur) var(--sf-ease);
}

body.index-page.storefront-v2 .index-hero-inner:hover {
    border-color: rgba(255, 255, 255, 0.85);
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

/* ─── Hero & trust ─── */
body.index-page.storefront-v2 .btn-capsule-dark:hover {
    background: #1a1a1a;
    transform: var(--sf-lift);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25);
}

body.index-page.storefront-v2 .btn-capsule-dark:active {
    transform: translateY(0) scale(0.98);
}

body.index-page.storefront-v2 .btn-capsule-dark svg {
    transition: transform var(--sf-dur) var(--sf-ease);
}

body.index-page.storefront-v2 .btn-capsule-dark:hover svg {
    transform: translateX(3px);
}

/* ─── Category panels ─── */
body.index-page.storefront-v2 .homepage-section.category-panel {
    transition: box-shadow var(--sf-dur) var(--sf-ease), border-color var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
}

body.index-page.storefront-v2 .homepage-section.category-panel:hover {
    border-color: rgba(255, 255, 255, 0.85);
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.09), inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

/* ─── Product cards ─── */
body.storefront-v2 .product-name[data-goto] {
    cursor: pointer;
    transition: color var(--sf-dur) var(--sf-ease);
}

body.storefront-v2 .product-name[data-goto]:hover {
    color: var(--samsung-blue, #0070c1);
}

body.storefront-v2 .product-image-wrap[data-goto] {
    cursor: pointer;
}

body.storefront-v2 .product-image-wrap[data-goto] img {
    transition: transform 0.45s var(--sf-ease);
}

body.storefront-v2 .product-card.reveal:hover .product-image-wrap[data-goto] img {
    transform: scale(1.04);
}

body.storefront-v2 .btn-favorite-float:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: scale(1.1);
    box-shadow: var(--sf-shadow-soft-hover);
}

body.storefront-v2 .btn-favorite-float.active:hover {
    background: rgba(255, 59, 48, 0.12);
    border-color: rgba(255, 59, 48, 0.35);
}

body.storefront-v2 .btn-favorite-float:active {
    transform: scale(0.92);
}

body.storefront-v2 .btn-add-cart-glass:hover:not(:disabled) {
    background: #1a1a1a;
    transform: var(--sf-lift);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
}

body.storefront-v2 .btn-add-cart-glass:active:not(:disabled) {
    transform: translateY(0) scale(0.97);
}

/* ─── Panels & auth ─── */
body.storefront-v2 .panel-close-btn:hover {
    background: rgba(255, 255, 255, 0.9);
    transform: scale(1.08);
    box-shadow: var(--sf-shadow-soft-hover);
}

body.storefront-v2 .panel-close-btn:active {
    transform: scale(0.94);
}

body.storefront-v2 .btn-google:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: var(--sf-lift);
    box-shadow: var(--sf-shadow-soft-hover);
}

body.storefront-v2 .auth-submit-btn:hover:not(:disabled),
body.storefront-v2 .btn-view-cart:hover {
    background: #1a1a1a;
    transform: var(--sf-lift);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
}

body.storefront-v2 .profile-links a:hover,
body.storefront-v2 .profile-links button:hover {
    background: rgba(0, 0, 0, 0.05);
    transform: translateX(4px);
}

body.storefront-v2 .auth-form-group input:focus {
    border-color: rgba(0, 112, 193, 0.45);
    box-shadow: var(--sf-focus-ring);
    outline: none;
}

body.storefront-v2 .glass-search-input:focus {
    border-color: rgba(0, 112, 193, 0.4);
    box-shadow: var(--sf-focus-ring);
    outline: none;
    background: rgba(255, 255, 255, 0.85);
}

/* ─── Product page ─── */
body.product-detail-page .btn-product-add:hover:not(:disabled) {
    background: #1a1a1a;
    transform: var(--sf-lift);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25);
}

body.product-detail-page .btn-product-add:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
}

body.product-detail-page .btn-product-favorite:hover {
    background: rgba(255, 255, 255, 0.92);
    transform: scale(1.06);
    box-shadow: var(--sf-shadow-soft-hover);
}

body.product-detail-page .btn-product-favorite.active:hover {
    background: rgba(255, 59, 48, 0.14);
    border-color: rgba(255, 59, 48, 0.45);
}

body.product-detail-page .btn-product-favorite:active {
    transform: scale(0.94);
}

body.product-detail-page .qty-glass button:hover:not(:disabled) {
    background: rgba(0, 0, 0, 0.08);
    transform: scale(1.08);
}

body.product-detail-page .thumb-item {
    transition: border-color var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease), box-shadow var(--sf-dur) var(--sf-ease);
}

body.product-detail-page .thumb-item:hover {
    transform: scale(1.04);
    box-shadow: var(--sf-shadow-soft-hover);
    border-color: rgba(0, 0, 0, 0.15);
}

body.product-detail-page .thumb-item.active:hover {
    border-color: var(--primary-black);
}

body.product-detail-page .main-image-container {
    transition: box-shadow var(--sf-dur) var(--sf-ease);
}

body.product-detail-page .main-image-container:hover,
body.product-detail-page .gallery-zoom-wrap.is-zoom-active .main-image-container {
    box-shadow: var(--sf-shadow-soft-hover);
}

body.product-detail-page .related-card:hover {
    transform: var(--sf-lift);
    box-shadow: var(--sf-shadow-soft-hover);
    border-color: rgba(255, 255, 255, 0.8);
}

body.product-detail-page .related-card:hover .related-card-image img {
    transform: scale(1.05);
}

body.product-detail-page .related-card-image img {
    transition: transform 0.45s var(--sf-ease);
}

body.product-detail-page .product-breadcrumb-link {
    transition: color var(--sf-dur) var(--sf-ease);
}

body.product-detail-page .product-lightbox-close {
    transition: background var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease), box-shadow var(--sf-dur) var(--sf-ease);
}

body.product-detail-page .product-lightbox-close:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: scale(1.08);
    box-shadow: var(--sf-shadow-soft-hover);
}

body.product-detail-page .product-lightbox-close:active {
    transform: scale(0.94);
}

body.product-detail-page .btn-go-back:hover {
    background: #1a1a1a;
    transform: var(--sf-lift);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.22);
}

/* ─── Footer & misc ─── */
body.index-page.storefront-v2 .index-footer-links a {
    transition: color var(--sf-dur) var(--sf-ease), opacity var(--sf-dur) var(--sf-ease);
}

body.index-page.storefront-v2 .index-footer-links a:hover {
    color: var(--primary-black);
    opacity: 1;
}

body.storefront-v2 .btn-retry:hover {
    background: #1a1a1a;
    transform: var(--sf-lift);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

body.storefront-v2 .home-error-card {
    transition: box-shadow var(--sf-dur) var(--sf-ease);
}

/* ─── Selection polish ─── */
body.storefront-v2 ::selection {
    background: rgba(0, 112, 193, 0.18);
    color: var(--primary-black);
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
    body.storefront-v2 *,
    body.storefront-v2 *::before,
    body.storefront-v2 *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

    body.storefront-v2 .product-card.reveal:hover,
    body.storefront-v2 .btn-back-home:hover,
    body.storefront-v2 .category-pill:hover,
    body.storefront-v2 .btn-add-cart-glass:hover {
        transform: none;
    }
}
