/* =========================================================
   God Rays Background — v3.4.0
   Tehnica originala restaurata, dar animatia mutata pe
   transform (GPU compositor) in loc de background-position.

   Structura DOM:
   .god-rays-container
     .god-rays-jumbo          ← static, stripes + rainbow
       .god-rays-shimmer      ← 300% wide, acelasi gradient,
                                 mix-blend-mode:difference,
                                 animat cu transform
   ========================================================= */

.has-god-rays {
    position: relative;
}

.god-rays-container {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

/* ── Elementul de baza (static) ─────────────────────────── */
.god-rays-jumbo {
    --stripes: repeating-linear-gradient(
        100deg,
        #fff 0%,
        #fff 7%,
        transparent 10%,
        transparent 12%,
        #fff 16%
    );
    --stripesDark: repeating-linear-gradient(
        100deg,
        #000 0%,
        #000 7%,
        transparent 10%,
        transparent 12%,
        #000 16%
    );
    --rainbow: repeating-linear-gradient(
        100deg,
        #60a5fa 10%,
        #e879f9 15%,
        #60a5fa 20%,
        #5eead4 25%,
        #60a5fa 30%
    );

    position: absolute;
    inset: -10px;
    background-image: var(--stripes), var(--rainbow);
    background-size: 300%, 200%;
    background-position: 50% 50%, 50% 50%;
    pointer-events: none;
}

/* ── Overlay animat (inlocuieste ::after cu element real
      ca sa putem anima transform in loc de background-pos) */
.god-rays-shimmer {
    position: absolute;
    inset: 0;
    /* 300% lat + translateX(-66.67%) = un loop complet seamless */
    width: 300%;
    background-image: var(--stripes), var(--rainbow);
    background-size: 200%, 100%;
    mix-blend-mode: difference;

    will-change: transform;
    transform: translate3d(0, 0, 0);
    animation: god-rays-slide 60s linear infinite;
}

@keyframes god-rays-slide {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(-66.67%, 0, 0); }
}

/* ── Light theme ─────────────────────────────────────────── */
.has-god-rays[data-god-rays-theme="light"] .god-rays-jumbo {
    filter: blur(5px) invert(100%);
    mask-image: radial-gradient(ellipse at 100% 0%, black 40%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at 100% 0%, black 40%, transparent 70%);
}

.has-god-rays[data-god-rays-theme="light"] .god-rays-shimmer {
    background-image: var(--stripes), var(--rainbow);
}

/* ── Dark theme ──────────────────────────────────────────── */
.has-god-rays[data-god-rays-theme="dark"] .god-rays-jumbo {
    background-image: var(--stripesDark), var(--rainbow);
    filter: blur(5px) opacity(50%) saturate(200%);
    mask-image: radial-gradient(ellipse at 100% 0%, black 40%, transparent 70%);
    -webkit-mask-image: radial-gradient(ellipse at 100% 0%, black 40%, transparent 70%);
}

.has-god-rays[data-god-rays-theme="dark"] .god-rays-shimmer {
    background-image: var(--stripesDark), var(--rainbow);
}

/* ── Elementor content deasupra efectului ────────────────── */
.has-god-rays > .elementor-container,
.has-god-rays > .e-con-inner {
    position: relative;
    z-index: 1;
}

@media (prefers-reduced-motion: reduce) {
    .god-rays-shimmer {
        animation: none;
    }
}
