/* =========================================================
   FakezModz.XD — shared theme
   Dipakai oleh: Layout/Starter, Auth/login, Auth/register
   ========================================================= */

:root {
    --fz-bg:        #0a0612;
    --fz-accent:    #7c3aed;
    --fz-accent-2:  #ec4899;
    --fz-text-soft: rgba(196, 170, 255, 0.85);
    --fz-img-desktop: url('../img/fakezmodz/bg.jpg');
    --fz-img-mobile:  url('../img/fakezmodz/bg-mobile.jpg');
}

/* ---------- Background (fixed layer, aman untuk iOS) ---------- */
body.fz-body,
body.fz-auth-body {
    background-color: var(--fz-bg) !important;
    background-image: none !important;
    min-height: 100vh;
    position: relative;
}

body.fz-body::before,
body.fz-auth-body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -2;
    background:
        radial-gradient(ellipse 70% 55% at 15% 85%, rgba(124, 58, 237, 0.28), transparent 65%),
        radial-gradient(ellipse 55% 45% at 85% 10%, rgba(236, 72, 153, 0.16), transparent 65%),
        linear-gradient(180deg, rgba(10, 6, 22, 0.50) 0%, rgba(10, 6, 22, 0.82) 100%),
        var(--fz-img-desktop) 72% center / cover no-repeat;
}

/* Vignette tipis supaya tepi halaman lebih gelap & fokus ke konten */
body.fz-body::after,
body.fz-auth-body::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background: radial-gradient(ellipse at center, transparent 45%, rgba(0, 0, 0, 0.55) 100%);
}

@media (max-width: 768px) {
    body.fz-body::before,
    body.fz-auth-body::before {
        background:
            radial-gradient(ellipse 80% 50% at 50% 100%, rgba(124, 58, 237, 0.30), transparent 70%),
            linear-gradient(180deg, rgba(10, 6, 22, 0.35) 0%, rgba(10, 6, 22, 0.88) 70%),
            var(--fz-img-mobile) center top / cover no-repeat;
    }
}

/* ---------- Logo ---------- */
.fz-logo-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    display: block;
    user-select: none;
    -webkit-user-drag: none;
}

.fz-logo-ring {
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, var(--fz-accent), var(--fz-accent-2));
    overflow: hidden;
}

.fz-float-soft {
    animation: fz-float-soft 3.2s ease-in-out infinite;
}
@keyframes fz-float-soft {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-5px); }
}

/* ---------- Teks di luar kartu (halaman dalam) ---------- */
.fz-page-title { color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55); }
.fz-page-sub   { color: rgba(255, 255, 255, 0.72); }

/* ---------- Scrollbar ---------- */
body.fz-body::-webkit-scrollbar { width: 10px; }
body.fz-body::-webkit-scrollbar-track { background: #0a0612; }
body.fz-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--fz-accent), var(--fz-accent-2));
    border-radius: 10px;
}

/* ---------- Hormati preferensi kurangi animasi ---------- */
@media (prefers-reduced-motion: reduce) {
    .fz-float-soft { animation: none; }
}