/* ============ 6 ARKA PLAN TEMASI — SAKIN SURUM (QZ-F14) ============ */
/* body[data-bg="..."] ile secilir; .bg-layer sabit gradient, .bg-particles
   SABIT doku katmani.

   KURAL (QZ-F14): titresim/jitter/yuksek frekansli hareket YASAK.
   KOK NEDEN: eski surumde dev katmanlar (inset:-30%) onlarca saniyeye
   yayilmis translate/scale animasyonlariyla kare basina ~0.01px kayiyordu;
   bu alt-piksel kayma compositor'da gradyan dokusunun surekli yeniden
   orneklenmesine yol aciyor ve dusuk hizda akici hareket degil TITREME
   olarak goruluyordu. Cozum: HAREKET SIFIR — yalniz cok yavas (>=30sn)
   opacity nefesi ile renk/gradient gecisi; tum katmanlar tam-piksel sabit,
   translateZ(0) ile kompozit, layout tetikleyen ozellik yok. */

.bg-layer { background-size: cover; }

/* Isik katmani 1: sabit konum, yalniz opacity nefesi (40sn) */
.bg-layer::before {
  content: ""; position: absolute; inset: 0;
  background-image:
    radial-gradient(ellipse 42% 34% at 30% 32%, rgba(255, 255, 255, 0.05), transparent 65%),
    radial-gradient(ellipse 36% 30% at 72% 68%, rgba(34, 211, 238, 0.06), transparent 65%);
  transform: translateZ(0);
  animation: bgBreathA 40s ease-in-out infinite alternate;
}
/* Isik katmani 2: karsit fazda nefes — algilanan yumusak renk gecisi,
   hicbir sey YER DEGISTIRMEZ */
.bg-layer::after {
  content: ""; position: absolute; inset: 0;
  background-image:
    radial-gradient(ellipse 40% 32% at 68% 26%, rgba(34, 211, 238, 0.05), transparent 65%),
    radial-gradient(ellipse 34% 28% at 24% 74%, rgba(255, 255, 255, 0.04), transparent 65%);
  transform: translateZ(0);
  animation: bgBreathB 52s ease-in-out infinite alternate;
}
@keyframes bgBreathA { from { opacity: .35; } to { opacity: 1; } }
@keyframes bgBreathB { from { opacity: 1; } to { opacity: .3; } }

/* "Sabit" secilirse arka plan animasyonlari TAMAMEN durur */
body.bg-static .bg-layer::before,
body.bg-static .bg-layer::after,
body.bg-static .bg-particles,
body.bg-static .bg-particles::before,
body.bg-static .bg-particles::after { animation: none !important; }

/* Sistem "hareketi azalt" diyorsa otomatik Sabit (QZ-F14) */
@media (prefers-reduced-motion: reduce) {
  .bg-layer::before, .bg-layer::after,
  .bg-particles, .bg-particles::before, .bg-particles::after { animation: none !important; }
}

/* --- Okyanus --- */
body[data-bg="okyanus"] .bg-layer {
  background-image: linear-gradient(135deg, #062a4a 0%, #06b6d4 45%, #043249 70%, #021d33 100%);
}
/* --- Gece --- */
body[data-bg="gece"] .bg-layer {
  background-image: linear-gradient(135deg, #05070f 0%, #0a1f3a 40%, #16264d 70%, #05070f 100%);
}
/* --- Aurora --- */
body[data-bg="aurora"] .bg-layer {
  background-image: linear-gradient(135deg, #04121f 0%, #0e4d43 30%, #1f7a5c 50%, #3a2a6b 75%, #04121f 100%);
}
/* --- Gun Batimi --- */
body[data-bg="gunbatimi"] .bg-layer {
  background-image: linear-gradient(135deg, #2b1055 0%, #7a2048 40%, #d95d39 70%, #f2a65a 100%);
}
/* --- Uzay --- */
body[data-bg="uzay"] .bg-layer {
  background-image: linear-gradient(135deg, #01030a 0%, #0d1033 40%, #241a52 65%, #01030a 100%);
}
/* --- Orman --- */
body[data-bg="orman"] .bg-layer {
  background-image: linear-gradient(135deg, #04170d 0%, #0d3b24 40%, #1e5c38 65%, #04170d 100%);
}

/* Aydinlik temada arka planlar yumusar */
[data-theme="light"] .bg-layer { opacity: .35; }

/* ============ DOKU KATMANI — TAMAMEN SABIT (QZ-F14) ============ */
/* Eski yuzen baloncuk/dalga transform animasyonlari KALDIRILDI; doku
   sabit durur, yalniz cok yavas opacity nefesi alir. */
.bg-particles, .bg-particles::before, .bg-particles::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  transform: translateZ(0);
}
.bg-particles::before {
  background-image:
    radial-gradient(circle 90px at 18% 28%, rgba(255,255,255,.04), transparent 70%),
    radial-gradient(circle 60px at 72% 62%, rgba(255,255,255,.05), transparent 70%),
    radial-gradient(circle 120px at 85% 18%, rgba(255,255,255,.04), transparent 70%),
    radial-gradient(circle 50px at 35% 78%, rgba(255,255,255,.05), transparent 70%);
  animation: bgBreathB 48s ease-in-out infinite alternate;
}
.bg-particles::after {
  background-image:
    radial-gradient(circle 70px at 55% 35%, rgba(34,211,238,.06), transparent 70%),
    radial-gradient(circle 100px at 12% 70%, rgba(34,211,238,.04), transparent 70%),
    radial-gradient(circle 45px at 90% 80%, rgba(255,255,255,.05), transparent 70%);
  animation: bgBreathA 60s ease-in-out infinite alternate;
}

/* Uzay temasinda yildiz tozu — sabit konum, 36sn'lik yavas parilti */
body[data-bg="uzay"] .bg-particles {
  background-image:
    radial-gradient(circle 1.5px at 10% 20%, #fff, transparent 100%),
    radial-gradient(circle 1px at 30% 60%, #fff, transparent 100%),
    radial-gradient(circle 2px at 50% 30%, rgba(255,255,255,.9), transparent 100%),
    radial-gradient(circle 1px at 65% 75%, #fff, transparent 100%),
    radial-gradient(circle 1.5px at 80% 45%, #fff, transparent 100%),
    radial-gradient(circle 1px at 92% 15%, #fff, transparent 100%),
    radial-gradient(circle 1px at 22% 85%, #fff, transparent 100%),
    radial-gradient(circle 2px at 42% 8%, rgba(255,255,255,.8), transparent 100%);
  animation: bgTwinkle 36s ease-in-out infinite alternate;
}
@keyframes bgTwinkle { from { opacity: .55; } to { opacity: 1; } }

/* Okyanus dalga dokusu — SABIT (translateX animasyonu kaldirildi) */
body[data-bg="okyanus"] .bg-particles::after {
  background-image:
    radial-gradient(ellipse 300px 40px at 30% 88%, rgba(255,255,255,.05), transparent 70%),
    radial-gradient(ellipse 400px 50px at 75% 94%, rgba(255,255,255,.04), transparent 70%);
  animation: bgBreathA 60s ease-in-out infinite alternate;
}