/* ============================================================
   PAGE LOADER — logo shiny şekilde yatayda açılarak belirir
   (ışık parıltısı soldan sağa süzülür, logo arkasından dolar)
   ============================================================ */

.loader {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    /* zemin kolonlardan gelir — loader'ın kendisi şeffaf ki
       kolonlar kalkınca altından sayfa görünsün */
    background: transparent;
}

.loader.is-done {
    display: none;
}

body.is-loading {
    overflow: hidden;
}

/* ---- Su örtüsü: yüklenirken tek pürüzsüz yüzey; kapanışta alt
        kenarı canlı dalgaya dönüşüp yukarı süzülür ---- */
.loader-veil {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

/* dalga ucundaki mint enerji hattı — yumuşak glow */
#loaderVeilEdge {
    filter: drop-shadow(0 0 7px rgba(45, 240, 143, 0.8));
}

/* Logo = navy dolgu, şekli LogoSquare maskesiyle kesiliyor.
   Soldan sağa clip ile açılır (--wipe). */
.loader-logo {
    position: relative;
    isolation: isolate;
    width: clamp(160px, 22vw, 260px);
    aspect-ratio: 934 / 728;
    background: #002877;
    -webkit-mask: url(../../uploads/logo/LogoSquare.svg) center / contain no-repeat;
    mask: url(../../uploads/logo/LogoSquare.svg) center / contain no-repeat;
    --wipe: 100%;
    -webkit-clip-path: inset(0 var(--wipe) 0 0);
    clip-path: inset(0 var(--wipe) 0 0);
    overflow: hidden;
    filter: drop-shadow(0 12px 36px rgba(0, 40, 120, 0.12));
}

/* Işık bandı — logo üzerinde soldan sağa süzülen shine.
   Geniş + blur'lu + yumuşak çan eğrisi: keskin çizgi yok, ipeksi süzülme */
.loader-shine {
    position: absolute;
    top: -22%;
    left: 0;
    width: 56%;
    height: 144%;
    background: linear-gradient(90deg,
            rgba(185, 212, 255, 0) 0%,
            rgba(188, 214, 255, 0.18) 28%,
            rgba(228, 240, 255, 0.55) 50%,
            rgba(188, 214, 255, 0.18) 72%,
            rgba(185, 212, 255, 0) 100%);
    filter: blur(14px);
    mix-blend-mode: screen;
    will-change: transform;
}

/* Hareket azaltma / JS yok: logo direkt dolu, parıltı yok */
@media (prefers-reduced-motion: reduce) {
    .loader-logo {
        --wipe: 0%;
        -webkit-clip-path: none;
        clip-path: none;
    }
    .loader-shine {
        display: none;
    }
}