/* ═══════════════════════════════════════════════════════════════
 * SIHIR HOME — Mobile Splash Screen + App Feel %100
 * v131BG-MOBILE-SPLASH (2026-05-08)
 *
 * Standalone (PWA) modunda cold-start'ta animasyonlu splash gösterir.
 * Sonra mobile app hissiyatı için global tweaks:
 *  - Tap highlight kaldır
 *  - Overscroll bounce control
 *  - Smooth scroll
 *  - Touch callout disable (link long-press menu)
 *  - Text size adjust
 * ═══════════════════════════════════════════════════════════════ */

/* ═══════ 1. SPLASH SCREEN ═══════ */
#sihirSplash {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: #FAFAF8;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 1;
    transition: opacity 0.4s ease, visibility 0.4s ease;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', sans-serif;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
}

#sihirSplash.fade-out {
    opacity: 0;
    visibility: hidden;
}

.splash-logo-wrap {
    width: 92px;
    height: 92px;
    border-radius: 22px;
    background: linear-gradient(135deg, #FFF7ED, #FED7AA);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px;
    box-shadow: 0 12px 40px rgba(234, 88, 12, 0.18), 0 4px 16px rgba(234, 88, 12, 0.08);
    animation: splashLogoIn 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.splash-logo-wrap img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    animation: splashLogoPulse 1.6s ease-in-out infinite;
}

.splash-brand {
    font-family: 'Georgia', 'Playfair Display', serif;
    font-size: 22px;
    font-weight: 700;
    color: #0F172A;
    letter-spacing: -0.3px;
    margin: 0;
    animation: splashTextIn 0.8s ease 0.2s both;
}

.splash-tagline {
    font-size: 11.5px;
    color: #64748B;
    letter-spacing: 2px;
    margin-top: 4px;
    text-transform: uppercase;
    animation: splashTextIn 0.8s ease 0.35s both;
}

.splash-dots {
    display: flex;
    gap: 8px;
    margin-top: 28px;
    animation: splashTextIn 0.8s ease 0.5s both;
}

.splash-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #F97316;
    animation: splashDotBounce 1.2s ease-in-out infinite;
}
.splash-dots span:nth-child(2) { animation-delay: 0.15s; }
.splash-dots span:nth-child(3) { animation-delay: 0.3s; }

@keyframes splashLogoIn {
    from { transform: scale(0.5); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}
@keyframes splashLogoPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}
@keyframes splashTextIn {
    from { transform: translateY(8px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}
@keyframes splashDotBounce {
    0%, 80%, 100% { transform: translateY(0); opacity: 0.5; }
    40% { transform: translateY(-8px); opacity: 1; }
}

/* ═══════ 2. APP FEEL %100 (mobile global) ═══════ */
@media (max-width: 768px) {
    /* Tap highlight kaldır — gri kutucuk yok */
    * {
        -webkit-tap-highlight-color: transparent;
    }

    /* Smooth scroll global */
    html {
        scroll-behavior: smooth;
    }

    /* Text auto-zoom kapatma (iOS) */
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    /* Overscroll bounce — sticky header üstte rubber band yok */
    body {
        overscroll-behavior-y: contain;
    }

    /* Linklere long-press callout (kopyala/paylaş) menüsü kaldır — app gibi */
    a, button {
        -webkit-touch-callout: none;
        touch-action: manipulation; /* double-tap zoom iptal */
    }

    /* Görsel uzun-basınca büyük preview kaldır (app feel) */
    img {
        -webkit-touch-callout: none;
        -webkit-user-drag: none;
    }

    /* Standalone modda — gerçek app gibi */
    body.standalone-mode {
        /* iOS notch güvenli alan */
        padding-top: env(safe-area-inset-top, 0px);
    }

    /* Standalone modda zoom-pinch kapat (opsiyonel — bazı kullanıcı sevmez ama app feel) */
    body.standalone-mode {
        touch-action: pan-x pan-y;
    }

    /* Sayfa geçişi yumuşak (anchor click) */
    body {
        view-transition-name: page;
    }
}

/* ═══════ 3. PRINT — splash gözükmez ═══════ */
@media print {
    #sihirSplash { display: none !important; }
}