/* ============================================
   DOWNLOADER PAGE HERO
============================================ */
.downloader-hero {
  position: relative;
  overflow: hidden;
  padding: 120px 0 60px;
  text-align: center;
}

.dh-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
  animation: dhBlob 8s ease-in-out infinite;
}

.dh-blob-1 {
  width: 400px; height: 400px;
  top: -120px; left: -100px;
  opacity: 0.3;
}

.dh-blob-2 {
  width: 350px; height: 350px;
  bottom: -100px; right: -80px;
  opacity: 0.2;
  animation-direction: reverse;
}

@keyframes dhBlob {
  0%,100% { transform: translate(0,0) scale(1); }
  50% { transform: translate(20px,-15px) scale(1.08); }
}

/* Platform-specific themes */
.downloader-hero-yt {
  background: radial-gradient(ellipse at 20% 40%, rgba(255,0,0,0.12) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 60%, rgba(255,0,0,0.06) 0%, transparent 60%),
              var(--bg-base);
}
.downloader-hero-yt .dh-blob-1 { background: radial-gradient(circle, rgba(255,0,0,0.5) 0%, transparent 70%); }
.downloader-hero-yt .dh-blob-2 { background: radial-gradient(circle, rgba(200,0,0,0.4) 0%, transparent 70%); }
.downloader-hero-yt .dh-icon   { color: #ff0000; text-shadow: 0 0 40px rgba(255,0,0,0.5); }

.downloader-hero-tt {
  background: radial-gradient(ellipse at 20% 40%, rgba(105,201,208,0.1) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 60%, rgba(238,29,82,0.1) 0%, transparent 60%),
              var(--bg-base);
}
.downloader-hero-tt .dh-blob-1 { background: radial-gradient(circle, rgba(105,201,208,0.5) 0%, transparent 70%); }
.downloader-hero-tt .dh-blob-2 { background: radial-gradient(circle, rgba(238,29,82,0.5) 0%, transparent 70%); }
.downloader-hero-tt .dh-icon   { color: var(--tt-accent); }

.downloader-hero-fb {
  background: radial-gradient(ellipse at 20% 40%, rgba(24,119,242,0.12) 0%, transparent 60%),
              var(--bg-base);
}
.downloader-hero-fb .dh-blob-1 { background: radial-gradient(circle, rgba(24,119,242,0.5) 0%, transparent 70%); }
.downloader-hero-fb .dh-blob-2 { background: radial-gradient(circle, rgba(0,70,200,0.4) 0%, transparent 70%); }
.downloader-hero-fb .dh-icon   { color: #1877f2; text-shadow: 0 0 40px rgba(24,119,242,0.5); }

.downloader-hero-ig {
  background: radial-gradient(ellipse at 20% 40%, rgba(245,133,41,0.1) 0%, transparent 50%),
              radial-gradient(ellipse at 80% 60%, rgba(221,42,123,0.1) 0%, transparent 50%),
              var(--bg-base);
}
.downloader-hero-ig .dh-blob-1 { background: radial-gradient(circle, rgba(245,133,41,0.5) 0%, transparent 70%); }
.downloader-hero-ig .dh-blob-2 { background: radial-gradient(circle, rgba(221,42,123,0.5) 0%, transparent 70%); }
.downloader-hero-ig .dh-icon   { background: linear-gradient(135deg, #f58529, #dd2a7b, #8134af); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }

.dh-container { position: relative; z-index: 2; }

.dh-icon {
  font-size: 4rem;
  display: block;
  margin-bottom: 1.25rem;
  line-height: 1;
}

.dh-title {
  font-size: clamp(1.9rem, 4vw, 3rem);
  font-weight: 900;
  color: var(--text-primary);
  margin-bottom: 0.75rem;
}

.dh-desc {
  font-size: 1.05rem;
  color: var(--text-secondary);
  max-width: 540px;
  margin: 0 auto 1.75rem;
  line-height: 1.6;
}

.dh-badges {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.dh-badge {
  display: inline-flex;
  align-items: center;
  background: var(--bg-hover);
  border: 1px solid var(--border-subtle);
  color: var(--text-secondary);
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.4rem 0.9rem;
  border-radius: 50px;
  backdrop-filter: blur(8px);
}

/* ============================================
   DOWNLOADER TOOL AREA
============================================ */
.downloader-body {
  background: var(--bg-base);
  padding: 2.5rem 0 5rem;
}

.downloader-tool-wrap {
  background: var(--bg-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: 2.5rem;
  box-shadow: var(--shadow-lg);
  max-width: 800px;
  margin: 0 auto;
}

/* Override any plugin styles to fit dark theme */
.downloader-tool-wrap input[type="text"],
.downloader-tool-wrap input[type="url"] {
  background: var(--bg-hover) !important;
  border: 1px solid var(--border-subtle) !important;
  color: var(--text-primary) !important;
  border-radius: var(--radius-md) !important;
}

.downloader-tool-wrap input::placeholder {
  color: var(--text-muted) !important;
}

.downloader-tool-wrap .btn,
.downloader-tool-wrap button[type="submit"] {
  background: linear-gradient(135deg, var(--brand-primary), #8b5cf6) !important;
  border: none !important;
  border-radius: 50px !important;
  color: #fff !important;
  font-weight: 700 !important;
}

@media (max-width: 768px) {
  .downloader-hero { padding: 100px 0 50px; }
  .dh-icon { font-size: 3rem; }
  .downloader-tool-wrap { padding: 1.5rem; }
}