/* پس‌زمینه پرچم سه‌رنگ (سبز / سفید / قرمز) — بادخور و blur برای اسپلش بارگذاری */

.heyat-boot-flag {
    position: absolute;
    inset: -18%;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.heyat-boot-flag-layer {
    position: absolute;
    inset: 0;
    filter: blur(38px) saturate(1.2);
    opacity: 0.92;
    animation: heyat-flag-sway 5.5s ease-in-out infinite;
    will-change: transform;
}

.heyat-boot-flag-layer--delay {
    filter: blur(52px) saturate(1.05);
    opacity: 0.55;
    animation-duration: 7s;
    animation-direction: reverse;
    transform: scale(1.08) rotate(1deg);
}

.heyat-boot-stripe {
    position: absolute;
    left: -14%;
    right: -14%;
    height: 34%;
    transform-origin: center center;
    animation: heyat-flag-wave 4.2s ease-in-out infinite;
    will-change: transform, border-radius;
}

.heyat-boot-stripe--green {
    top: 0;
    background: linear-gradient(135deg, #1b8a38 0%, #2ecc5a 42%, #0f6b2a 100%);
}

.heyat-boot-stripe--white {
    top: 33%;
    background: linear-gradient(135deg, #ffffff 0%, #f4f6f8 50%, #e8ecef 100%);
    animation-delay: -0.35s;
}

.heyat-boot-stripe--red {
    top: 66%;
    background: linear-gradient(135deg, #b80012 0%, #e53935 45%, #8f000f 100%);
    animation-delay: -0.7s;
}

.heyat-boot-scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        radial-gradient(ellipse 80% 60% at 50% 45%, rgba(8, 14, 32, 0.35) 0%, rgba(8, 14, 32, 0.72) 100%),
        linear-gradient(180deg, rgba(6, 10, 24, 0.45) 0%, rgba(6, 10, 24, 0.62) 100%);
    pointer-events: none;
}

.heyat-boot-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 24px 16px;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
}

#heyat-boot-overlay,
#app.app-blazor-prep #heyat-static-boot {
    position: relative;
    overflow: hidden;
    background: #080e1c !important;
}

#heyat-boot-overlay .heyat-boot-prog {
    stroke: #f8fafc;
    filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.35));
}

#heyat-boot-overlay .heyat-boot-pct {
    color: #f8fafc;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.65);
}

#heyat-boot-overlay .heyat-boot-track {
    stroke: rgba(255, 255, 255, 0.28);
}

#app.app-blazor-prep .heyat-static-boot-spinner {
    border-color: rgba(255, 255, 255, 0.28);
    border-top-color: #f8fafc;
    box-shadow: 0 0 18px rgba(255, 255, 255, 0.2);
}

#heyat-boot-overlay .heyat-boot-overlay-title,
#heyat-boot-overlay .heyat-boot-overlay-hint,
#heyat-boot-overlay .heyat-boot-overlay-status,
#app.app-blazor-prep .heyat-static-boot-title,
#app.app-blazor-prep .heyat-static-boot-hint {
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.72);
}

@keyframes heyat-flag-sway {
    0%, 100% { transform: rotate(-2.5deg) scale(1.06); }
    50% { transform: rotate(2.5deg) scale(1.1); }
}

@keyframes heyat-flag-wave {
    0%, 100% {
        transform: skewY(-4deg) translateX(-3%) scaleY(1.02);
        border-radius: 42% 58% 52% 48% / 10% 14%;
    }
    33% {
        transform: skewY(2deg) translateX(1%) scaleY(1.04);
        border-radius: 50% 50% 46% 54% / 12% 9%;
    }
    66% {
        transform: skewY(5deg) translateX(3%) scaleY(1.01);
        border-radius: 58% 42% 48% 52% / 9% 13%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .heyat-boot-flag-layer,
    .heyat-boot-stripe {
        animation: none !important;
    }
}