/**
 * Salon CRM — premium sayfa gecisi / yukleme perdesi
 */

:root {
    --pt-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --pt-ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
    --pt-close-ms: 0.14s;
    --pt-open-ms: 0.16s;
    --pt-curtain-bg: linear-gradient(
        145deg,
        #0b0e14 0%,
        #111827 38%,
        #0f172a 68%,
        #0b0e14 100%
    );
    --pt-curtain-shine: linear-gradient(
        118deg,
        transparent 0%,
        rgba(96, 165, 250, 0.12) 42%,
        rgba(139, 92, 246, 0.1) 58%,
        transparent 100%
    );
    --pt-curtain-edge: linear-gradient(90deg, rgba(37, 99, 235, 0.55), rgba(139, 92, 246, 0.45));
    --pt-hidden: polygon(0 -115%, 100% -135%, 100% -125%, 0 -105%);
    --pt-covered: polygon(0 0, 100% 0, 100% 108%, 0 128%);
}

body.login-page {
    --pt-curtain-bg: linear-gradient(
        145deg,
        #0b0e14 0%,
        #111827 45%,
        #1e1b4b 100%
    );
}

body.admin-body {
    --pt-curtain-bg: linear-gradient(
        145deg,
        #0b0e14 0%,
        #111520 42%,
        #0f172a 100%
    );
}

body.public-book-body {
    --pt-curtain-bg: linear-gradient(
        145deg,
        #0f172a 0%,
        #134e4a 38%,
        #0f172a 100%
    );
}

@media (prefers-reduced-motion: reduce) {
    #pt-curtain,
    html.pt-pending-enter::before,
    html.pt-pending-enter::after {
        display: none !important;
    }
}

html.ui-mobile-lite #pt-curtain,
html.ui-mobile-lite.pt-pending-enter::before,
html.ui-mobile-lite.pt-pending-enter::after,
html.ui-pwa-standalone #pt-curtain,
html.ui-pwa-standalone.pt-pending-enter::before,
html.ui-pwa-standalone.pt-pending-enter::after {
    display: none !important;
}

/* Admin: yükleme perdesi kapalı — yavaş yanıtta takılmayı önler */
body.admin-body #pt-curtain,
body.login-page #pt-curtain,
html:has(body.admin-body).pt-pending-enter::before,
html:has(body.admin-body).pt-pending-enter::after,
html:has(body.login-page).pt-pending-enter::before,
html:has(body.login-page).pt-pending-enter::after {
    display: none !important;
}

@media (prefers-reduced-motion: no-preference) {
    #pt-curtain {
        position: fixed;
        inset: 0;
        z-index: 99999;
        pointer-events: none;
        background: var(--pt-curtain-bg);
        clip-path: var(--pt-hidden);
        will-change: clip-path;
        box-shadow: inset 0 0 120px rgba(37, 99, 235, 0.08);
    }

    #pt-curtain::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--pt-curtain-shine);
        opacity: 0.9;
        pointer-events: none;
    }

    #pt-curtain::after {
        content: "";
        position: absolute;
        left: -5%;
        right: -5%;
        bottom: 0;
        height: 3px;
        background: var(--pt-curtain-edge);
        box-shadow: 0 0 24px rgba(96, 165, 250, 0.45);
        transform: skewY(-6deg);
        transform-origin: left bottom;
    }

    #pt-curtain.is-covered {
        clip-path: var(--pt-covered);
    }

    #pt-curtain.is-closing {
        pointer-events: auto;
        animation: ptDiagClose var(--pt-close-ms) var(--pt-ease) forwards;
    }

    #pt-curtain.is-closing .pt-curtain-inner {
        opacity: 1;
        transform: scale(1);
    }

    #pt-curtain.is-opening {
        pointer-events: none;
        clip-path: var(--pt-covered);
        animation: ptDiagOpen var(--pt-open-ms) var(--pt-ease-soft) forwards;
    }

    #pt-curtain.is-opening .pt-curtain-inner {
        opacity: 0;
        transform: scale(0.96);
        transition: opacity 0.12s ease, transform 0.12s ease;
    }

    @keyframes ptDiagClose {
        from { clip-path: var(--pt-hidden); }
        to { clip-path: var(--pt-covered); }
    }

    @keyframes ptDiagOpen {
        from { clip-path: var(--pt-covered); }
        to { clip-path: var(--pt-hidden); }
    }

    html.pt-pending-enter::before {
        content: "";
        position: fixed;
        inset: 0;
        z-index: 99998;
        background: var(--pt-curtain-bg);
        clip-path: var(--pt-covered);
        pointer-events: none;
        box-shadow: inset 0 0 120px rgba(37, 99, 235, 0.08);
    }

    html.pt-pending-enter::after {
        content: "";
        position: fixed;
        left: -5%;
        right: -5%;
        bottom: 0;
        height: 3px;
        z-index: 99999;
        background: var(--pt-curtain-edge);
        box-shadow: 0 0 24px rgba(96, 165, 250, 0.45);
        transform: skewY(-6deg);
        transform-origin: left bottom;
    }

    html.pt-pending-enter #pt-curtain .pt-curtain-inner {
        opacity: 1;
        transform: none;
    }
}

/* Orta yukleme animasyonu */
.pt-curtain-inner {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.85rem;
    opacity: 0;
    transform: scale(0.94);
    transition: opacity 0.1s ease, transform 0.1s ease;
    pointer-events: none;
    z-index: 1;
}

#pt-curtain.is-covered .pt-curtain-inner,
#pt-curtain.is-closing .pt-curtain-inner {
    opacity: 1;
    transform: scale(1);
}

.pt-loader {
    position: relative;
    width: 3.25rem;
    height: 3.25rem;
}

.pt-loader-orbit {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid transparent;
    border-top-color: #60a5fa;
    border-right-color: rgba(96, 165, 250, 0.25);
    animation: ptSpin 0.65s linear infinite;
}

.pt-loader-orbit--reverse {
    inset: 6px;
    border-top-color: #a78bfa;
    border-right-color: rgba(167, 139, 250, 0.2);
    animation-duration: 0.48s;
    animation-direction: reverse;
}

.pt-loader-core {
    position: absolute;
    inset: 11px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, rgba(37, 99, 235, 0.35), rgba(139, 92, 246, 0.2));
    border: 1px solid rgba(147, 197, 253, 0.35);
    color: #dbeafe;
    font-size: 0.95rem;
    box-shadow: 0 8px 24px rgba(37, 99, 235, 0.25);
}

.pt-loader-label {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(219, 234, 254, 0.75);
}

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

form[data-form-submitting='1'] {
    pointer-events: none;
}

form[data-form-submitting='1'] .btn-is-submitting,
.btn-is-submitting {
    opacity: 0.82;
    cursor: wait;
}

.btn-is-submitting .spinner-border-sm {
    width: 0.85rem;
    height: 0.85rem;
    border-width: 0.12em;
}