/**
 * Site geneli görsel stabilite: React mount alanları (font kuralları yok).
 * layout.php / layout-panel.php ile birlikte yüklenir.
 */

/* Boş React kökleri: içerik gelene kadar yükseklik rezervi (layout shift azaltır) */
[id$="-root"]:empty {
    min-height: 10rem;
}

.page--yonetim-app [id$="-root"]:empty,
.page--yonetim-app .adm-rs:has([id$="-root"]:empty) {
    min-height: 18rem;
}

.fp-app [id$="-root"]:empty,
.page [id$="-root"]:empty {
    min-height: 8rem;
}

/* Yönetim React alanı: Tailwind CDN stilleri gelene kadar hafif iskelet */
html.sk-tw-pending .adm-rs:has([id$="-root"]) {
    position: relative;
}

html.sk-tw-pending .adm-rs:has([id$="-root"]:empty)::before {
    content: "";
    display: block;
    min-height: 18rem;
    border-radius: 12px;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.04) 0%,
        rgba(0, 0, 0, 0.07) 50%,
        rgba(0, 0, 0, 0.04) 100%
    );
    background-size: 200% 100%;
    animation: sk-stable-shimmer 1.2s ease-in-out infinite;
}

html.sk-tw-ready .adm-rs:has([id$="-root"]:empty)::before,
html.sk-tw-ready .adm-rs:has([id$="-root"]:not(:empty))::before {
    display: none;
    animation: none;
}

@keyframes sk-stable-shimmer {
    0% {
        background-position: 100% 0;
    }
    100% {
        background-position: -100% 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    html.sk-tw-pending .adm-rs:has([id$="-root"]:empty)::before {
        animation: none;
        background: rgba(0, 0, 0, 0.05);
    }
}