/**
 * Chat Buddy helicopter flyover loader v3 — forward-facing aircraft.
 * Pure HTML/CSS/SVG: no external image, library or third-party request.
 */


body.chatbuddy_helicopter_loading {
    overflow: hidden !important;
    overscroll-behavior: none;
}

.chatbuddy_helicopter_preloader {
    --helicopter-flight-duration: 6.2s;
    position: fixed;
    inset: 0;
    z-index: 99999;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 1;
    visibility: visible;
    background: transparent;
    transition: opacity .62s ease, visibility .62s ease;
}

.chatbuddy_helicopter_preloader.is-ready {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.chatbuddy_helicopter_sky {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 100dvh;
    overflow: hidden;
    isolation: isolate;
    background:
        radial-gradient(circle at 54% 42%, rgba(255, 255, 255, .23), transparent 28%),
        radial-gradient(circle at 12% 18%, rgba(236, 72, 153, .15), transparent 36%),
        radial-gradient(circle at 88% 76%, rgba(99, 102, 241, .2), transparent 40%),
        linear-gradient(150deg, rgba(18, 24, 43, .16), rgba(36, 32, 72, .25)),
        var(--chat-page-primary-bg-color);
}

.chatbuddy_helicopter_sky::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(112deg, transparent 0 38%, rgba(255,255,255,.05) 45%, transparent 52%),
        repeating-linear-gradient(0deg, rgba(255,255,255,.015) 0 1px, transparent 1px 4px);
    mix-blend-mode: screen;
}

.chatbuddy_helicopter_horizon {
    position: absolute;
    left: -10%;
    right: -10%;
    bottom: -18%;
    height: 48%;
    z-index: 0;
    border-radius: 50% 50% 0 0;
    background: radial-gradient(ellipse at 50% 0%, rgba(129, 140, 248, .18), rgba(15, 23, 42, .04) 48%, transparent 70%);
    filter: blur(12px);
    pointer-events: none;
}

.chatbuddy_helicopter_cloud {
    position: absolute;
    z-index: 1;
    width: 180px;
    height: 52px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    filter: blur(1px);
    box-shadow:
        48px -18px 0 -2px rgba(255, 255, 255, .1),
        94px -5px 0 -10px rgba(255, 255, 255, .09),
        -42px 2px 0 -13px rgba(255, 255, 255, .08);
    opacity: .68;
    pointer-events: none;
    animation: chatbuddyHelicopterCloudDrift 13s linear infinite;
}

.chatbuddy_helicopter_cloud.cloud_one {
    top: 18%;
    left: -12%;
}

.chatbuddy_helicopter_cloud.cloud_two {
    top: 66%;
    left: 34%;
    width: 130px;
    height: 38px;
    opacity: .44;
    animation-duration: 17s;
    animation-delay: -8s;
}

.chatbuddy_helicopter_cloud.cloud_three {
    top: 8%;
    right: 8%;
    width: 110px;
    height: 30px;
    opacity: .32;
    animation-duration: 20s;
    animation-delay: -4s;
}

.chatbuddy_helicopter_flight {
    position: absolute;
    top: 45%;
    left: 50%;
    z-index: 4;
    width: clamp(360px, 58vw, 790px);
    transform: translate3d(-115vw, 7vh, 0) scale(.72) rotate(-4deg);
    will-change: transform, opacity;
    backface-visibility: hidden;
}

.chatbuddy_helicopter_preloader.is-flying .chatbuddy_helicopter_flight {
    animation: chatbuddyHelicopterFlyover var(--helicopter-flight-duration) cubic-bezier(.28, .02, .48, 1) forwards;
}

.chatbuddy_helicopter_bob {
    position: relative;
    width: 100%;
    animation: chatbuddyHelicopterBob .72s ease-in-out infinite alternate;
    transform-origin: 50% 52%;
}

.chatbuddy_helicopter_svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
    filter: saturate(1.08) contrast(1.03);

    /*
     * The original vector drawing has its cockpit on the left. The flight
     * path moves left-to-right, so mirror the complete aircraft to make the
     * nose point in the direction of travel.
     */
    transform: scaleX(-1);
    transform-origin: center center;
}

/* Counter-mirror the wording so "Created by John" remains readable. */
.chatbuddy_helicopter_plaque_text {
    transform-box: fill-box;
    transform-origin: center;
    transform: scaleX(-1);
}

.chatbuddy_helicopter_main_rotor_plane {
    transform-box: view-box;
    transform-origin: 440px 52px;
    transform: scaleY(.13);
}

.chatbuddy_helicopter_main_rotor {
    transform-box: view-box;
    transform-origin: 440px 52px;
    animation: chatbuddyHelicopterMainRotor .135s linear infinite;
}

.chatbuddy_helicopter_tail_rotor {
    transform-box: view-box;
    transform-origin: 772px 166px;
    animation: chatbuddyHelicopterTailRotor .09s linear infinite reverse;
}

.chatbuddy_helicopter_ground_shadow {
    transform-box: fill-box;
    transform-origin: center;
    animation: chatbuddyHelicopterShadowPulse .72s ease-in-out infinite alternate;
}

.chatbuddy_helicopter_plaque {
    transform-box: fill-box;
    transform-origin: top center;
    animation: chatbuddyHelicopterPlaqueSwing .68s ease-in-out infinite alternate;
}

.chatbuddy_helicopter_nav_light {
    animation: chatbuddyHelicopterNavLight .72s steps(1, end) infinite;
}

.chatbuddy_helicopter_message {
    position: absolute;
    left: 50%;
    bottom: max(7vh, 38px);
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: min(92vw, 620px);
    transform: translateX(-50%);
    color: #fff;
    text-align: center;
    text-shadow: 0 3px 16px rgba(3, 7, 18, .5);
    transition: opacity .3s ease, transform .3s ease;
}

.chatbuddy_helicopter_status {
    min-height: 26px;
    margin: 0;
    font-size: clamp(15px, 1.7vw, 19px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .01em;
}

.chatbuddy_helicopter_status_dots {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 32px;
}

.chatbuddy_helicopter_status_dots i {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    opacity: .35;
    animation: chatbuddyHelicopterStatusDot 1s ease-in-out infinite;
}

.chatbuddy_helicopter_status_dots i:nth-child(2) { animation-delay: .14s; }
.chatbuddy_helicopter_status_dots i:nth-child(3) { animation-delay: .28s; }

.chatbuddy_helicopter_preloader.is-ready .chatbuddy_helicopter_message {
    opacity: 0;
    transform: translateX(-50%) translateY(8px);
}

body.dark_mode .chatbuddy_helicopter_sky {
    background:
        radial-gradient(circle at 54% 42%, rgba(255, 255, 255, .12), transparent 28%),
        radial-gradient(circle at 12% 18%, rgba(236, 72, 153, .12), transparent 36%),
        radial-gradient(circle at 88% 76%, rgba(99, 102, 241, .18), transparent 40%),
        linear-gradient(150deg, rgba(3, 7, 18, .3), rgba(17, 15, 39, .42)),
        var(--chat-page-primary-bg-color);
}

@keyframes chatbuddyHelicopterFlyover {
    0% {
        opacity: 0;
        transform: translate3d(-115vw, 8vh, 0) scale(.66) rotate(3deg);
    }
    7% {
        opacity: 1;
    }
    22% {
        transform: translate3d(-62vw, -4vh, 0) scale(.86) rotate(1.5deg);
    }
    47% {
        transform: translate3d(-50%, -53%, 0) scale(1.06) rotate(1deg);
    }
    66% {
        transform: translate3d(19vw, -60%, 0) scale(1.01) rotate(.5deg);
    }
    88% {
        opacity: 1;
        transform: translate3d(65vw, -8vh, 0) scale(.78) rotate(2deg);
    }
    100% {
        opacity: 0;
        transform: translate3d(108vw, -13vh, 0) scale(.6) rotate(3deg);
    }
}

@keyframes chatbuddyHelicopterBob {
    0% { transform: translate3d(0, -3px, 0) rotate(.25deg); }
    100% { transform: translate3d(0, 5px, 0) rotate(-.35deg); }
}

@keyframes chatbuddyHelicopterMainRotor {
    to { transform: rotate(360deg); }
}

@keyframes chatbuddyHelicopterTailRotor {
    to { transform: rotate(360deg); }
}

@keyframes chatbuddyHelicopterShadowPulse {
    0% { opacity: .18; transform: scaleX(.88); }
    100% { opacity: .31; transform: scaleX(1.04); }
}

@keyframes chatbuddyHelicopterPlaqueSwing {
    0% { transform: rotate(-1.4deg); }
    100% { transform: rotate(1.4deg); }
}

@keyframes chatbuddyHelicopterNavLight {
    0%, 48% { opacity: .22; }
    49%, 100% { opacity: 1; }
}

@keyframes chatbuddyHelicopterCloudDrift {
    from { transform: translate3d(-16vw, 0, 0); }
    to { transform: translate3d(120vw, 0, 0); }
}

@keyframes chatbuddyHelicopterStatusDot {
    0%, 75%, 100% { opacity: .28; transform: translateY(0); }
    38% { opacity: 1; transform: translateY(-4px); }
}

@media (max-width: 767px) {
    .chatbuddy_helicopter_preloader {
        --helicopter-flight-duration: 5.7s;
    }

    .chatbuddy_helicopter_flight {
        top: 46%;
        width: clamp(330px, 92vw, 600px);
    }

    .chatbuddy_helicopter_message {
        bottom: max(5vh, 24px);
        padding: 0 16px;
    }

    .chatbuddy_helicopter_status {
        font-size: 15px;
    }
}

@media (max-width: 420px) {
    .chatbuddy_helicopter_flight {
        width: 370px;
    }

    .chatbuddy_helicopter_message {
        flex-direction: column;
        gap: 5px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .chatbuddy_helicopter_preloader {
        --helicopter-flight-duration: 3.2s;
    }

    .chatbuddy_helicopter_cloud,
    .chatbuddy_helicopter_bob,
    .chatbuddy_helicopter_plaque,
    .chatbuddy_helicopter_ground_shadow,
    .chatbuddy_helicopter_status_dots i {
        animation: none !important;
    }

    .chatbuddy_helicopter_main_rotor {
        animation-duration: .65s;
    }

    .chatbuddy_helicopter_tail_rotor {
        animation-duration: .45s;
    }
}
