/**
 * VIK AUTO TRADING - Background Slideshow Styles
 *
 * 배경 사진 사이클:
 * - 3개 레이어: 사진 → 오버레이 → 콘텐츠
 * - 크로스페이드 전환
 * - Ken Burns 효과 (미세 확대)
 */

/* ==========================================
   BACKGROUND CONTAINER
========================================== */

.bg-slideshow {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--z-background);
    overflow: hidden;
}

/* ==========================================
   BACKGROUND SLIDES
========================================== */

.bg-slideshow__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: opacity var(--bg-transition-duration) var(--ease-smooth);
    -o-transition: opacity var(--bg-transition-duration) var(--ease-smooth);
    transition: opacity var(--bg-transition-duration) var(--ease-smooth);
}

.bg-slideshow__slide.is-active {
    opacity: 1;
}

/* ==========================================
   BACKGROUND IMAGE
========================================== */

.bg-slideshow__image {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    -webkit-transform: translate(-50%, -50%) scale(1.05);
    -ms-transform: translate(-50%, -50%) scale(1.05);
    transform: translate(-50%, -50%) scale(1.05);
    -o-object-fit: cover;
    object-fit: cover;
    /* 채도 낮춤 - 금색 UI와 조화 */
    -webkit-filter: saturate(0.5) brightness(0.8);
    filter: saturate(0.5) brightness(0.8);
}

/* Ken Burns Effect */
.bg-slideshow__slide.is-active .bg-slideshow__image {
    -webkit-animation: kenBurns var(--bg-display-duration) var(--ease-smooth) forwards;
    animation: kenBurns var(--bg-display-duration) var(--ease-smooth) forwards;
}

@-webkit-keyframes kenBurns {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(1.05);
        transform: translate(-50%, -50%) scale(1.05);
    }
    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.12);
        transform: translate(-50%, -50%) scale(1.12);
    }
}

@keyframes kenBurns {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(1.05);
        transform: translate(-50%, -50%) scale(1.05);
    }
    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.12);
        transform: translate(-50%, -50%) scale(1.12);
    }
}

/* ==========================================
   DARK OVERLAY
========================================== */

.bg-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-bg-overlay);
    z-index: var(--z-overlay);
    pointer-events: none;
}

/* ==========================================
   FALLBACK (사진 없을 때)
========================================== */

.bg-slideshow--empty {
    background: var(--color-bg-black);
}

/* ==========================================
   REDUCED MOTION (접근성)
========================================== */

@media (prefers-reduced-motion: reduce) {
    .bg-slideshow__slide.is-active .bg-slideshow__image {
        -webkit-animation: none;
        animation: none;
    }

    .bg-slideshow__slide {
        -webkit-transition: opacity 0.5s ease;
        -o-transition: opacity 0.5s ease;
        transition: opacity 0.5s ease;
    }
}