/**
 * Chat Buddy modern chat-page loader.
 * Standalone override: intentionally loaded after the generated chat CSS.
 */

.preloader.chatbuddy_preloader {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    overflow: hidden;
    opacity: 1;
    visibility: visible;
    transition: opacity .42s ease, visibility .42s ease;
}

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

.chatbuddy_preloader > .chatbuddy_loader_stage {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 100dvh;
    padding: 24px;
    overflow: hidden;
    background:
        radial-gradient(circle at 18% 20%, rgba(236, 72, 153, .16), transparent 34%),
        radial-gradient(circle at 82% 78%, rgba(99, 102, 241, .18), transparent 38%),
        linear-gradient(180deg, rgba(12, 14, 24, .08), rgba(12, 14, 24, .14)),
        var(--chat-page-primary-bg-color);
}

.chatbuddy_loader_glow {
    position: absolute;
    display: block;
    width: min(44vw, 520px);
    aspect-ratio: 1;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(32px);
    opacity: .34;
    animation: chatbuddyLoaderDrift 7s ease-in-out infinite alternate;
}

.chatbuddy_loader_glow_one {
    top: -22%;
    left: -12%;
    background: linear-gradient(135deg, #ec4899, #8b5cf6);
}

.chatbuddy_loader_glow_two {
    right: -14%;
    bottom: -25%;
    background: linear-gradient(135deg, #6366f1, #06b6d4);
    animation-delay: -2.8s;
}

.chatbuddy_preloader .chatbuddy_loader_card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: min(460px, calc(100vw - 42px));
    padding: 22px 20px 18px;
    overflow: visible;
    text-align: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transform: translateY(0) scale(1);
    transition: transform .42s ease, opacity .42s ease;
}

.chatbuddy_preloader.is-ready .chatbuddy_loader_card {
    opacity: 0;
    transform: translateY(-8px) scale(.985);
}

.chatbuddy_preloader .chatbuddy_loader_card::before {
    content: "";
    position: absolute;
    inset: -80px -30px;
    z-index: 0;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(circle, rgba(126, 87, 255, .18) 0%, rgba(236, 72, 153, .11) 34%, rgba(99, 102, 241, .08) 52%, transparent 72%);
    filter: blur(24px);
}

.chatbuddy_preloader .chatbuddy_loader_logo,
.chatbuddy_preloader .chatbuddy_loader_bubbles,
.chatbuddy_preloader .chatbuddy_loader_status,
.chatbuddy_preloader .chatbuddy_loader_progress,
.chatbuddy_preloader .chatbuddy_loader_tagline {
    position: relative;
    z-index: 1;
}

.chatbuddy_preloader .chatbuddy_loader_logo {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 0;
    margin: 0 0 22px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.chatbuddy_preloader .chatbuddy_loader_logo_halo {
    position: absolute;
    inset: -18px -26px;
    z-index: 0;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .16) 0%, rgba(139, 92, 246, .18) 40%, rgba(236, 72, 153, .12) 58%, transparent 76%);
    filter: blur(18px);
    animation: chatbuddyLoaderPulse 2.4s ease-in-out infinite;
}

.chatbuddy_preloader .chatbuddy_loader_logo > img {
    position: relative;
    z-index: 1;
    display: block;
    width: auto;
    max-width: min(235px, 62vw);
    max-height: 82px;
    object-fit: contain;
    filter: drop-shadow(0 8px 22px rgba(0, 0, 0, .18));
}

.chatbuddy_loader_bubbles {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    height: 24px;
    margin: 0 0 16px;
    gap: 8px;
}

.chatbuddy_loader_bubbles > span {
    position: relative;
    display: block;
    width: 11px;
    height: 11px;
    border-radius: 50% 50% 50% 24%;
    background: linear-gradient(135deg, #ec4899, #8b5cf6);
    box-shadow: 0 5px 12px rgba(139, 92, 246, .22);
    transform: translateY(0) rotate(-8deg);
    animation: chatbuddyLoaderBubble 1.2s ease-in-out infinite;
}

.chatbuddy_loader_bubbles > span:nth-child(2) {
    width: 14px;
    height: 14px;
    animation-delay: .14s;
}

.chatbuddy_loader_bubbles > span:nth-child(3) {
    animation-delay: .28s;
}

.chatbuddy_loader_status {
    min-height: 30px;
    margin: 0;
    color: #ffffff;
    font-size: clamp(18px, 2vw, 22px);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -.01em;
    text-shadow: 0 3px 16px rgba(15, 18, 36, .28);
}

.chatbuddy_preloader .chatbuddy_loader_progress {
    position: relative;
    display: block;
    width: min(280px, 74vw);
    height: 4px;
    margin: 20px 0 16px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, .16);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06);
}

.chatbuddy_preloader .chatbuddy_loader_progress > .loading {
    position: absolute;
    top: 0;
    left: -42%;
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #ec4899, #8b5cf6, #6366f1);
    box-shadow: 0 0 14px rgba(139, 92, 246, .42);
    transform: none;
    animation: chatbuddyLoaderProgress 1.35s cubic-bezier(.65, 0, .35, 1) infinite;
}

.chatbuddy_loader_tagline {
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: 15px;
    font-weight: 500;
    line-height: 1.45;
    text-shadow: 0 2px 10px rgba(15, 18, 36, .22);
}

body.dark_mode .chatbuddy_preloader > .chatbuddy_loader_stage {
    background:
        radial-gradient(circle at 18% 20%, rgba(236, 72, 153, .15), transparent 34%),
        radial-gradient(circle at 82% 78%, rgba(99, 102, 241, .18), transparent 38%),
        linear-gradient(180deg, rgba(5, 7, 14, .28), rgba(5, 7, 14, .38)),
        var(--chat-page-primary-bg-color);
}

body.dark_mode .chatbuddy_preloader .chatbuddy_loader_logo > img {
    filter: drop-shadow(0 10px 26px rgba(0, 0, 0, .36));
}

body.dark_mode .chatbuddy_loader_status {
    color: #f7f6fc;
}

body.dark_mode .chatbuddy_loader_tagline {
    color: rgba(231, 229, 241, .76);
}

body.dark_mode .chatbuddy_preloader .chatbuddy_loader_progress {
    background: rgba(255, 255, 255, .12);
}

@keyframes chatbuddyLoaderBubble {
    0%, 70%, 100% {
        opacity: .46;
        transform: translateY(0) rotate(-8deg) scale(.92);
    }
    35% {
        opacity: 1;
        transform: translateY(-8px) rotate(-8deg) scale(1);
    }
}

@keyframes chatbuddyLoaderProgress {
    0% {
        left: -42%;
    }
    100% {
        left: 108%;
    }
}

@keyframes chatbuddyLoaderPulse {
    0%, 100% {
        opacity: .64;
        transform: scale(.98);
    }
    50% {
        opacity: 1;
        transform: scale(1.03);
    }
}

@keyframes chatbuddyLoaderDrift {
    0% {
        transform: translate3d(0, 0, 0) scale(1);
    }
    100% {
        transform: translate3d(12px, -16px, 0) scale(1.06);
    }
}

@media (max-width: 767px) {
    .chatbuddy_preloader > .chatbuddy_loader_stage {
        padding: 20px 18px;
    }

    .chatbuddy_preloader .chatbuddy_loader_card {
        width: min(100%, 420px);
        padding: 16px 8px 14px;
    }

    .chatbuddy_preloader .chatbuddy_loader_card::before {
        inset: -60px -12px;
    }

    .chatbuddy_preloader .chatbuddy_loader_logo {
        margin-bottom: 18px;
    }

    .chatbuddy_preloader .chatbuddy_loader_logo > img {
        max-width: min(210px, 64vw);
        max-height: 72px;
    }

    .chatbuddy_loader_status {
        font-size: 17px;
        min-height: 24px;
    }

    .chatbuddy_loader_tagline {
        font-size: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .chatbuddy_loader_glow,
    .chatbuddy_preloader .chatbuddy_loader_logo_halo,
    .chatbuddy_loader_bubbles > span,
    .chatbuddy_preloader .chatbuddy_loader_progress > .loading {
        animation: none !important;
    }

    .preloader.chatbuddy_preloader,
    .chatbuddy_preloader .chatbuddy_loader_card {
        transition: opacity .25s ease, visibility .25s ease !important;
    }
}
