/* NEW ARRIVALS SECTION - MINIMALISTIC & ELEGANT */
.new-arrivals-section {
    margin: 32px 0;
    background: linear-gradient(135deg, #fff9f0, #fffef9);
    border-radius: 12px;
    padding: 24px 0;
    position: relative;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Background elements for new arrivals section */
.new-arrivals-bg-elements {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 1;
}

.new-arrivals-bg-element {
    position: absolute;
    font-size: 1.3rem;
    opacity: 0.05;
    pointer-events: none;
    animation: newArrivalsFloat 11s ease-in-out infinite;
}

.new-arrivals-bg-element.sparkle { color: #ffd700; }
.new-arrivals-bg-element.star { color: #ff6b4a; }
.new-arrivals-bg-element.gift { color: #ff69b4; }
.new-arrivals-bg-element.ribbon { color: #ff1493; }
.new-arrivals-bg-element.baby { color: #87ceeb; }
.new-arrivals-bg-element.heart { color: #ff6b9d; }

@keyframes newArrivalsFloat {
    0%, 100% { transform: translateY(0px) rotate(0deg) scale(1); }
    25% { transform: translateY(-5px) rotate(2deg) scale(1.03); }
    50% { transform: translateY(-10px) rotate(3deg) scale(0.97); }
    75% { transform: translateY(-5px) rotate(1deg) scale(1.01); }
}

/* Container for horizontal scrolling */
.new-arrivals-container {
    position: relative;
    width: 100%;
    height: 420px;
    margin: 0 auto;
    overflow: hidden;
    z-index: 2;
}

/* Track for product cards */
.new-arrivals-track {
    display: flex;
    gap: 16px;
    padding: 0 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    height: 100%;
    align-items: flex-start;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

.new-arrivals-track::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

/* Loading skeletons */
.new-arrivals-loading {
    display: flex;
    gap: 16px;
    animation: fadeOut 0.5s ease-out 2s forwards;
}

.new-arrival-card-skeleton {
    min-width: 260px;
    width: 260px;
    height: 380px;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    background: #f0f0f0;
    flex-shrink: 0;
}

/* Shimmer: a band swept across with transform, so it runs on the compositor
   (an animated background-position restyles and repaints every frame on the
   main thread). Two sweeps cover the 2.5s before the skeletons fade out;
   an infinite one kept running, invisible, for as long as they stayed. */
.new-arrival-card-skeleton::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.06), transparent);
    transform: translateX(-100%);
    animation: new-arrival-skeleton-sweep 1.5s ease-in-out 2;
}

@keyframes new-arrival-skeleton-sweep {
    to { transform: translateX(100%); }
}

@keyframes fadeOut {
    to { opacity: 0; visibility: hidden; }
}

/* Product card in New Arrivals - Minimalistic Design */
.new-arrivals-track .product-card {
    min-width: 260px;
    width: 260px;
    min-height: 420px;
    background: #ffffff;
    border-radius: 12px;
    overflow: visible;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    scroll-snap-align: start;
    flex-shrink: 0;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    opacity: 0;
    animation: fadeInUp 0.6s ease forwards;
}

.new-arrivals-track .product-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

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

/* Stagger animation delays */
.new-arrivals-track .product-card:nth-child(1) { animation-delay: 0.1s; }
.new-arrivals-track .product-card:nth-child(2) { animation-delay: 0.2s; }
.new-arrivals-track .product-card:nth-child(3) { animation-delay: 0.3s; }
.new-arrivals-track .product-card:nth-child(4) { animation-delay: 0.4s; }
.new-arrivals-track .product-card:nth-child(5) { animation-delay: 0.5s; }
.new-arrivals-track .product-card:nth-child(6) { animation-delay: 0.6s; }
.new-arrivals-track .product-card:nth-child(7) { animation-delay: 0.7s; }
.new-arrivals-track .product-card:nth-child(8) { animation-delay: 0.8s; }
.new-arrivals-track .product-card:nth-child(9) { animation-delay: 0.9s; }
.new-arrivals-track .product-card:nth-child(10) { animation-delay: 1s; }

/* Product image container */
.new-arrivals-track .product-image-container {
    position: relative;
    width: 100%;
    height: 240px;
    overflow: hidden;
    background: #f9f9f9;
    border-radius: 12px 12px 0 0;
}

/* Image slider container */
.new-arrivals-track .product-images-slider {
    position: relative;
    width: 100%;
    height: 100%;
}

/* Individual image slides */
.new-arrivals-track .product-image-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.6s cubic-bezier(0.65, 0, 0.35, 1);
    pointer-events: none;
}

.new-arrivals-track .product-image-slide.active {
    opacity: 1;
    pointer-events: auto;
}

.new-arrivals-track .product-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.4s ease;
}

.new-arrivals-track .product-card:hover .product-image {
    transform: scale(1.08);
}

/* Product info section */
.new-arrivals-track .product-info {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 160px;
}

.new-arrivals-track .product-brand {
    font-size: 0.75rem;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 500;
    line-height: 1.2;
}

.new-arrivals-track .product-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: #333;
    line-height: 1.4;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    min-height: auto;
    max-height: 2.8em;
}

/* Variant availability indicator */
.new-arrivals-track .variant-info {
    font-size: 0.8rem;
    color: #666;
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    margin: 4px 0;
}

.new-arrivals-track .variant-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: #f0f0f0;
    border-radius: 12px;
    font-size: 0.7rem;
    color: #555;
    white-space: nowrap;
}

.new-arrivals-track .variant-badge.in-stock {
    background: #e8f5e9;
    color: #2e7d32;
}

.new-arrivals-track .variant-badge.low-stock {
    background: #fff3e0;
    color: #ef6c00;
}

.new-arrivals-track .variant-badge.out-of-stock {
    background: #ffebee;
    color: #c62828;
}

/* Actual size chips on the card, with strikethrough for out-of-stock sizes */
.new-arrivals-track .size-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.new-arrivals-track .size-chip {
    display: inline-block;
    padding: 3px 7px;
    border: 1px solid #d5d5d5;
    border-radius: 6px;
    background: #fff;
    font-size: 0.68rem;
    line-height: 1.2;
    color: #444;
    white-space: nowrap;
}

.new-arrivals-track .size-chip.out-of-stock {
    text-decoration: line-through;
    opacity: 0.5;
}

/* Price section */
.new-arrivals-track .product-price {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 8px;
}

.new-arrivals-track .current-price {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1b7b89;
    line-height: 1.2;
}

.new-arrivals-track .original-price {
    font-size: 0.9rem;
    color: #999;
    text-decoration: line-through;
    line-height: 1.2;
}

.new-arrivals-track .discount-percentage {
    font-size: 0.75rem;
    color: #ff6b4a;
    font-weight: 600;
    background: #ffe5e0;
    padding: 3px 8px;
    border-radius: 4px;
    line-height: 1.2;
    white-space: nowrap;
}

/* Navigation buttons */
.new-arrivals-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(0, 0, 0, 0.1);
    color: #333;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}

.new-arrivals-nav:hover:not(:disabled) {
    background: #ff6b4a;
    color: white;
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 4px 18px rgba(255, 107, 74, 0.4);
}

.new-arrivals-nav:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.new-arrivals-prev {
    left: 8px;
}

.new-arrivals-next {
    right: 8px;
}

/* Progress indicators - Hidden */
.new-arrivals-progress {
    display: none;
}

.progress-dot {
    display: none;
}

.progress-dot.active {
    display: none;
}

.progress-dot:hover {
    display: none;
}

/* Product labels (New Arrival tag) - Hidden */
.new-arrivals-track .product-labels {
    display: none;
}

.new-arrivals-track .label {
    display: none;
}

/* Wishlist button - Hidden */
.new-arrivals-track .product-actions {
    display: none;
}

.new-arrivals-track .wishlist-btn {
    display: none;
}

.new-arrivals-track .wishlist-btn:hover {
    display: none;
}

.new-arrivals-track .wishlist-btn.active {
    display: none;
}

/* Screen reader only text */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Responsive adjustments */
@media (max-width: 767px) {
    .new-arrivals-section {
        margin: 24px 0;
        padding: 16px 0;
    }
    
    .new-arrivals-container {
        height: 420px;
    }
    
    .new-arrivals-track {
        gap: 12px;
        padding: 0 12px;
    }
    
    .new-arrivals-track .product-card {
        min-width: 240px;
        width: 240px;
        min-height: 400px;
    }
    
    .new-arrivals-track .product-image-container {
        height: 220px;
    }
    
    .new-arrivals-track .product-info {
        padding: 12px;
        min-height: 160px;
    }
    
    .new-arrivals-nav {
        width: 38px;
        height: 38px;
        font-size: 1rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .new-arrivals-container {
        height: 450px;
    }
    
    .new-arrivals-track .product-card {
        min-width: 280px;
        width: 280px;
        min-height: 430px;
    }
    
    .new-arrivals-track .product-image-container {
        height: 260px;
    }
    
    .new-arrivals-track .product-info {
        padding: 16px;
        min-height: 170px;
    }
}

@media (min-width: 992px) {
    .new-arrivals-container {
        height: 480px;
    }
    
    .new-arrivals-track {
        gap: 20px;
        padding: 0 20px;
    }
    
    .new-arrivals-track .product-card {
        min-width: 300px;
        width: 300px;
        min-height: 450px;
    }
    
    .new-arrivals-track .product-image-container {
        height: 260px;
    }
    
    .new-arrivals-track .product-info {
        padding: 18px;
        min-height: 180px;
        gap: 10px;
    }
    
    .new-arrivals-track .product-name {
        font-size: 1rem;
    }
    
    .new-arrivals-track .current-price {
        font-size: 1.25rem;
    }
}

/* Accessibility - reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
    .new-arrivals-track .product-card,
    .new-arrivals-bg-element,
    .new-arrivals-nav,
    .progress-dot,
    .new-arrival-card-skeleton::after {
        animation: none !important;
        transition: none !important;
    }
    
    .new-arrivals-track {
        scroll-behavior: auto;
    }
}

/* EQUAL-HEIGHT CARDS: each card used to keep its own height (cards aligned
   to the top of a fixed-height track), so a product with more sizes or a
   longer name stood taller than its neighbours. The container now sizes to
   the tallest card and every card stretches to match (the price is already
   pinned to the bottom). The vertical padding keeps the hover lift and the
   card shadow from being clipped. */
.new-arrivals-container {
    height: auto;
}

.new-arrivals-track {
    height: auto;
    align-items: stretch;
    padding-top: 10px;
    padding-bottom: 16px;
}