/* =====================================================
   AWDI PODCAST — Enhancements v3
   Dark mode · Animations · Special components
   ===================================================== */

/* ─────────────────────────────────────────────────────
   DARK MODE
───────────────────────────────────────────────────── */
[data-theme="dark"] {
  --ink:        #f1f5f9;
  --ink-2:      #cbd5e1;
  --ink-3:      #94a3b8;
  --ink-4:      #64748b;
  --canvas:     #0d1117;
  --canvas-2:   #161b22;
  --canvas-3:   #1c2128;
  --border:     #2d333b;
  --border-2:   #22272e;
  --white:      #161b22;
  --green-pale: rgba(22,163,74,0.15);
  --green-ink:  #052e16;
}

[data-theme="dark"] body { background: var(--canvas); }

[data-theme="dark"] .navbar {
  background: rgba(13, 17, 23, 0.97) !important;
  border-bottom-color: var(--border-2) !important;
}

[data-theme="dark"] .platform-strip { background: var(--canvas-2) !important; }

[data-theme="dark"] .featured-ep { background: #060E08; }

[data-theme="dark"] .ep-card,
[data-theme="dark"] .blog-card,
[data-theme="dark"] .video-card { background: var(--canvas-2) !important; }

[data-theme="dark"] .topics-grid { background: var(--canvas-2) !important; }
[data-theme="dark"] .topic-item:hover { background: var(--canvas-3) !important; }

[data-theme="dark"] .testimonial-card { background: var(--canvas-2) !important; }

[data-theme="dark"] .faq-item { background: var(--canvas-2) !important; }

[data-theme="dark"] .host-card { background: #060E08; }

[data-theme="dark"] .nav-links { background: var(--canvas-2) !important; }

[data-theme="dark"] .site-footer {
  background: var(--canvas-2) !important;
  border-top-color: var(--border) !important;
}
[data-theme="dark"] .footer-grid { border-bottom-color: var(--border) !important; }

/* logo2.png = dark-mode logo */
[data-theme="dark"] .logo-dark  { display: inline-block !important; }
[data-theme="dark"] .logo-light { display: none !important; }

/* mix-blend-mode: screen makes black pixels transparent so logo2's
   solid black background disappears against any dark surface */
[data-theme="dark"] .logo-dark { mix-blend-mode: screen; }

.logo-dark { display: none !important; }
.logo-light { display: inline-block !important; }

/* ─────────────────────────────────────────────────────
   FLOATING PODCAST PLAYER
───────────────────────────────────────────────────── */
#podcast-player {
  position: fixed;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%) translateY(120%);
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--ink);
  color: var(--white);
  padding: 14px 20px;
  border-radius: 100px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.25);
  z-index: 980;
  transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1);
  white-space: nowrap;
  max-width: calc(100vw - 40px);
}

#podcast-player.visible {
  transform: translateX(-50%) translateY(0);
}

[data-theme="dark"] #podcast-player {
  background: var(--canvas-2);
  box-shadow: 0 8px 40px rgba(0,0,0,0.5);
}

.player-icon-wrap {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--green);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: var(--white);
}

.player-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.player-label {
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.5);
  line-height: 1;
}

.player-title {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 220px;
}

.player-listen-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--white);
  background: #1DB954;
  border-radius: 100px;
  padding: 7px 14px;
  flex-shrink: 0;
  transition: background 150ms;
  text-decoration: none;
}
.player-listen-btn:hover { background: #17a349; }

.player-close {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.4);
  flex-shrink: 0;
  border: none;
  background: none;
  cursor: pointer;
  transition: color 150ms;
}
.player-close:hover { color: rgba(255,255,255,0.85); }

/* ─────────────────────────────────────────────────────
   REVEAL ANIMATIONS (desktop only)
───────────────────────────────────────────────────── */
.reveal-hidden {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94),
              transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94);
}

.reveal-hidden.revealed {
  opacity: 1;
  transform: none;
}

/* Mobile: always show content */
@media (max-width: 768px) {
  .reveal-hidden {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ─────────────────────────────────────────────────────
   CUSTOM SCROLLBAR
───────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: var(--green-mid); }