/* Luxury Preloader for Paradise Blooom */
#sl-luxury-preloader {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: #fffdfa !important;
    z-index: 999999 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    transition: opacity 0.6s cubic-bezier(0.25, 1, 0.5, 1), visibility 0.6s !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

#sl-luxury-preloader.sl-loaded {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Subtle Background Atmosphere */
.sl-moon-bg {
    position: absolute !important;
    top: -5vh !important;
    right: -5vw !important;
    width: 45vmin !important;
    height: 45vmin !important;
    fill: #d4af37 !important;
    opacity: 0.04 !important;
    pointer-events: none !important;
    z-index: 1 !important;
    transform: rotate(-15deg);
}

.sl-stars-bg {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

.sl-mini-star {
    position: absolute !important;
    fill: #d4af37 !important;
    animation: slBlinkStar infinite alternate ease-in-out !important;
}

@keyframes slBlinkStar {
    0% { opacity: 0; transform: scale(0.3); }
    100% { opacity: 0.6; transform: scale(1); filter: drop-shadow(0px 0px 2px #d4af37); }
}

/* Main Centered Container */
.sl-pl-logo-wrapper {
    position: relative !important;
    z-index: 10 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 400px !important;
    margin: 0 auto !important;
}

.sl-pl-logo-container {
    position: relative !important;
    width: 120px !important;
    height: 120px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px auto !important;
}

.sl-pl-orbit {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: 2px solid rgba(212, 175, 55, 0.15) !important;
    box-sizing: border-box !important;
    border-top: 2px solid #d4af37 !important;
    border-right: 2px solid #aa7c11 !important;
    border-radius: 50% !important;
    animation: slOrbitSpin 1.5s cubic-bezier(0.5, 0, 0.5, 1) infinite !important;
}

.sl-pl-logo-container img {
    width: 95px !important;
    height: 95px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    display: block !important;
    margin: 0 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
    animation: slPulseLogo 2.5s ease-in-out infinite !important;
    background: #fff !important;
}

.sl-pl-text {
    font-family: 'Playfair Display', Georgia, serif !important;
    font-size: 17px !important;
    font-style: italic !important;
    color: #1a1a1a !important;
    letter-spacing: 1.5px !important;
    text-align: center !important;
    margin: 0 auto !important;
    animation: slPulseText 2.5s infinite !important;
    font-weight: 600 !important;
}

/* Hand-to-Hand Gifting Scene CSS */
.sl-gifting-scene {
    position: relative !important;
    width: 240px !important;
    height: 60px !important;
    margin: 15px auto 0 auto !important;
    display: block !important;
}

.sl-line {
    fill: none !important;
    stroke: #d4af37 !important;
    stroke-width: 2 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

.sl-giver { animation: slGiver 2s infinite cubic-bezier(0.4, 0, 0.2, 1) !important; }
.sl-receiver { animation: slReceiver 2s infinite cubic-bezier(0.4, 0, 0.2, 1) !important; }
.sl-the-gift { animation: slGiftPass 2s infinite cubic-bezier(0.4, 0, 0.2, 1) !important; }

@keyframes slOrbitSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes slPulseLogo {
    0%, 100% { transform: scale(1); box-shadow: 0 4px 15px rgba(0,0,0,0.08); }
    50% { transform: scale(1.04); box-shadow: 0 8px 25px rgba(212,175,55,0.25); }
}

@keyframes slPulseText {
    0%, 100% { opacity: 0.6; }
    50% { opacity: 1; }
}

@keyframes slGiver {
    0%, 5% { transform: translateX(-90px); opacity: 0; }
    15%, 55% { transform: translateX(0); opacity: 1; }
    65%, 100% { transform: translateX(-90px); opacity: 0; }
}

@keyframes slReceiver {
    0%, 15% { transform: translateX(90px); opacity: 0; }
    25%, 80% { transform: translateX(0); opacity: 1; }
    90%, 100% { transform: translateX(90px); opacity: 0; }
}

@keyframes slGiftPass {
    0%, 5% { transform: translate(-25px, 28px); opacity: 0; }
    15%, 35% { transform: translate(55px, 28px); opacity: 1; }
    45% { transform: translate(110px, 10px) rotate(15deg); opacity: 1; }
    55%, 80% { transform: translate(165px, 28px) rotate(0deg); opacity: 1; }
    90%, 100% { transform: translate(250px, 28px); opacity: 0; }
}
