/**
 * Tempo FM — dinamik ön yüz katmanı (animasyon, SPA geri bildirimi).
 * prefers-reduced-motion: reduce ise çoğu hareket kapatılır.
 */

:root {
  --tfm-motion-duration: 0.55s;
  --tfm-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ——— SPA / tam sayfa geçiş çubuğu ——— */
.tfm-nav-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  z-index: 10800;
  pointer-events: none;
  background: linear-gradient(90deg, var(--fm-neon, #ff2d55), var(--fm-blue, #00d4ff));
  box-shadow: 0 0 12px rgba(0, 212, 255, 0.35);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.tfm-nav-progress.is-active {
  opacity: 1;
  width: 92%;
  transition:
    width 1.1s var(--tfm-motion-ease),
    opacity 0.2s ease;
}

.tfm-nav-progress.is-done {
  width: 100%;
  opacity: 0;
  transition:
    width 0.25s ease-out,
    opacity 0.35s ease 0.1s;
}

/* ——— Kaydırınca ortaya çıkan bloklar ——— */
@media (prefers-reduced-motion: reduce) {
  .tfm-reveal {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  /*
   * Opacity 0 + JS (IntersectionObserver) bazı ortamlarda içeriği tamamen gizleyebiliyordu
   * (script gecikmesi, hata, CSP). Varsayılan görünür; animasyon yalnızca hafif kaydırma.
   */
  .tfm-reveal {
    opacity: 1;
    transform: translate3d(0, 1.25rem, 0);
    will-change: transform;
  }

  .tfm-reveal.tfm-reveal--in {
    animation: tfm-reveal-up var(--tfm-motion-duration) var(--tfm-motion-ease) forwards;
  }

  .tfm-reveal--hero.tfm-reveal--in {
    animation-duration: 0.75s;
  }
}

@keyframes tfm-reveal-up {
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

/* ——— Kart / satır hover (hafif) ——— */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .tfm-lift {
    transition: transform 0.25s var(--tfm-motion-ease), box-shadow 0.25s ease;
  }

  .tfm-lift:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  }

  .fm-chart-item.tfm-lift:hover {
    border-color: rgba(0, 212, 255, 0.35);
  }
}

/* ——— Sekme içeriği yumuşak geçiş ——— */
@media (prefers-reduced-motion: no-preference) {
  .tab-pane.fade {
    transition: opacity 0.2s ease;
  }

  .fm-onair-card,
  .fm-sponsors-page .card {
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
  }
}

/* ——— SPA sonrası içerik kısa giriş (player.js swap’tan sonra) ——— */
.tfm-spa-enter {
  animation: tfm-spa-fade 0.35s var(--tfm-motion-ease) both;
}

@keyframes tfm-spa-fade {
  from {
    opacity: 0.65;
  }
  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tfm-spa-enter {
    animation: none;
  }
}

/* ——— Üst kabuk: içerik iframe (radyo üst belgede sabit) ——— */
html.tfm-shell-html {
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  overflow: hidden;
}

html.tfm-shell-html body.tfm-shell-parent {
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  overflow: hidden;
  /* Çift kaydırma: dış belge kaymasın, yalnızca iframe içi kayar */
}

body.tfm-shell-parent .site-main.site-main--inner {
  flex: 1 1 0%;
  min-height: 0;
  overflow: hidden;
}

body.tfm-shell-parent .spa-inner.tfm-shell-inner {
  flex: 1 1 0%;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

body.tfm-shell-parent .tfm-main-frame {
  flex: 1 1 0%;
  min-height: 0 !important;
  height: 100%;
  width: 100%;
  border: 0;
  background: var(--fm-bg, #0a0a0e);
}

.tfm-main-frame {
  flex: 1 1 auto;
  width: 100%;
  min-height: min(85vh, calc(100dvh - var(--fm-nav-h, 4.5rem) - 8rem));
  border: 0;
  background: var(--fm-bg, #0a0a0e);
}

body.tfm-embed-doc {
  min-height: 100%;
}

body.tfm-embed-doc .spa-inner {
  min-height: min(100vh, 100dvh);
}

/*
 * Gömülü sayfada site-dynamics.js yok; .tfm-reveal opacity:0 kalırsa içerik görünmez (siyah ekran).
 */
body.tfm-embed-doc .tfm-reveal {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}