/* Product-scoped carousel animations and layout overrides */

/* Keyframes */
@keyframes _fic_slide-out-left {
    0% {
        transform: translateX(0);
        opacity: 1;
    }

    100% {
        transform: translateX(-20px);
        opacity: 0;
    }
}

@keyframes _fic_slide-in-right {
    0% {
        transform: translateX(20px);
        opacity: 0;
    }

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes _fic_fade-out {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes _fic_fade-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* Image slide classes */
._fic_slide-out {
    animation: _fic_slide-out-left 0.38s cubic-bezier(0.4, 0.0, 0.2, 1) forwards !important;
}

._fic_slide-in {
    animation: _fic_slide-in-right 0.38s cubic-bezier(0.4, 0.0, 0.2, 1) forwards !important;
}

/* Text animation classes with unique suffix */
._ccf_fade-out-202511270558101234 {
    animation: _fic_fade-out 0.28s ease-in forwards !important;
}

._ccf_fade-in-202511270558101234 {
    animation: _fic_fade-in 0.28s ease-out forwards !important;
}

._ccf_text-slide-out-202511270558101234 {
    animation: _fic_slide-out-left 0.38s cubic-bezier(0.4, 0.0, 0.2, 1) forwards !important;
}

._ccf_text-slide-in-202511270558101234 {
    animation: _fic_slide-in-right 0.38s cubic-bezier(0.4, 0.0, 0.2, 1) forwards !important;
}

/* Layout: Fixed width on desktop, full on mobile */
@media (min-width: 900px) {
    #ccf-isolated-container .ccf-product-image-container {
        width: 450px;
        flex: 0 0 450px;
        max-width: 450px;
    }
}

@media (max-width: 899px) {
    #ccf-isolated-container .ccf-product-image-container {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* Hover zoom effect */
#ccf-isolated-container .ccf-product-main-image {
    transition: transform 1s cubic-bezier(0.2, 0.9, 0.2, 1);
}

#ccf-isolated-container .ccf-product-main-image:hover {
    transform: scale(1.12) !important;
    z-index: 10;
}

/* Container for caption text - MUST respect parent width */
#ccf-isolated-container .ccf-image-text-below-image {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* Caption title shrink overrides - CRITICAL FOR PREVENTING OVERFLOW */
#ccf-isolated-container .ccf-image-text-below-image .ccf-product-category-title {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* H1 Gradient (Optional but recommended) */
#ccf-isolated-container .ccf-form-options-container .ccf-form-container>h1._ccf_form-title-gradient-202511270558101234 {
    color: #7c3aed !important;
    /* fallback */
    background-image: linear-gradient(90deg, #6d28d9, #a78bfa) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    text-shadow: 0 10px 24px rgba(109, 40, 217, 0.28), 0 2px 6px rgba(17, 24, 39, 0.12) !important;
    font-weight: 800;
    font-size: 1.5rem;
    line-height: 1.08;
    margin-bottom: 0.2rem;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {

    ._fic_slide-out,
    ._fic_slide-in,
    ._ccf_text-slide-out-202511270558101234,
    ._ccf_text-slide-in-202511270558101234,
    ._ccf_fade-in-202511270558101234,
    ._ccf_fade-out-202511270558101234 {
        animation-duration: 0.001s !important;
    }

    .ccf-product-image-container img {
        transition-duration: 0.01s !important;
    }
}