/* ============================================================
   ARTICLE DARK MODE — Universal Theme Forcing
   css/article-dark.css
   ============================================================
   Imported by all article pages to force the dark theme,
   overriding main.css light mode and any inherited styles.
   ============================================================ */

/* ── GLOBAL DARK FORCING ── */
body {
  background: #0B1120 !important;
  color: #E2E8F0 !important;
}

/* Hide light-mode decorations */
.aurora, .aurora::before, .aurora::after,
.grain-overlay,
.light-beam { display: none !important; }

/* ── NAVBAR DARK ── */
nav, nav.scrolled {
  background: rgba(11,17,32,0.92) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}
nav .nav-links a,
nav .logo-text { color: rgba(255,255,255,0.85) !important; }
nav .nav-links a:hover,
nav .nav-links a.active { color: #818CF8 !important; }
nav .logo-text span { color: #818CF8 !important; }
nav .btn-primary, nav .nav-cta {
  background: linear-gradient(135deg, #4F46E5, #7C3AED) !important;
  color: #fff !important;
  border: none !important;
}

/* ── HERO DARK ── */
.art-hero {
  background: #0B1120 !important;
  color: #fff !important;
}
.art-hero-bg { background: #0B1120 !important; }
.art-hero-veil {
  background: linear-gradient(
    to bottom,
    rgba(11,17,32,0.2) 0%,
    rgba(11,17,32,0.15) 40%,
    rgba(11,17,32,0.85) 75%,
    rgba(11,17,32,1.0) 100%
  ) !important;
}

/* ── Hero title must be white ── */
.art-hero-title,
.art-hero h1 {
  color: #fff !important;
}
.art-hero-subtitle,
.art-hero .art-hero-subtitle {
  color: rgba(156,163,175,0.9) !important;
}
.art-breadcrumb a { color: #818CF8 !important; }
.art-category-badge { color: #818CF8 !important; }
.art-meta-label { color: rgba(255,255,255,0.45) !important; }
.art-meta-value { color: rgba(255,255,255,0.85) !important; }
.art-author-info .name { color: #fff !important; }
.art-author-info .role { color: rgba(255,255,255,0.5) !important; }

/* ── ARTICLE BODY ── */
.art-body { background: #0B1120 !important; position: relative; z-index: 1; }

/* ── SCROLL MARGIN ── */
.art-content h2[id] { scroll-margin-top: 100px; }
.art-content h3[id] { scroll-margin-top: 100px; }

/* ── FOOTER DARK ── */
footer, .site-footer, .footer {
  background: #080C18 !important;
  color: rgba(255,255,255,0.5) !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}
footer *, .site-footer *, .footer * {
  color: inherit !important;
}
footer a, .site-footer a, .footer a {
  color: rgba(255,255,255,0.6) !important;
}
footer .logo-text, .site-footer .logo-text {
  color: #fff !important;
}
footer .logo-text span {
  color: #818CF8 !important;
}

/* ── RELATED ARTICLES ── */
.art-related {
  background: #080C18 !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}

/* ── FORCE REVEALS VISIBLE ── */
.reveal, [class*="reveal"],
.art-tldr, .art-pullquote, .art-stats-grid, .art-stat-card,
.art-infobox, .art-warnbox, .art-code, .art-table-wrap,
.art-references, .art-tags, .benchmark-chart,
.method-grid, .method-card, .pipeline-flow, .pipeline-step,
.industry-grid, .industry-card, .arch-diagram,
.decision-grid, .decision-card, .roi-grid, .roi-card,
.case-study, .framework-grid, .framework-step,
.maturity-bar, .barrier-list,
.blog-card, .art-related-grid {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* ── PRINT ── */
@media print {
  body { background: #fff !important; color: #000 !important; }
  nav, .art-hero-bg, .art-hero-float,
  .art-hero-grid, .art-hero-scan,
  #art-progress, .art-sidebar,
  .chat-toggle, #chat-window { display: none !important; }
  .art-content h2, .art-content h3,
  .art-content p, .art-content strong { color: #000 !important; }
}

/* ============================================================
   ── LIGHT THEME TOPOGRAPHY OVERRIDES ──
   Activates when body has .art-page-topo class (loaded dynamically)
   ============================================================ */
body.art-page-topo {
  background: #FAF9F6 !important;
  color: #1F2937 !important;
}

body.art-page-topo .art-body {
  background: transparent !important;
}

/* Navbar overrides for light mode */
body.art-page-topo nav,
body.art-page-topo nav.scrolled {
  background: rgba(250, 249, 246, 0.72) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}
body.art-page-topo nav .nav-links a,
body.art-page-topo nav .logo-text {
  color: #374151 !important;
}
body.art-page-topo nav .nav-links a:hover,
body.art-page-topo nav .nav-links a.active {
  color: var(--accent) !important;
}
body.art-page-topo nav .logo-text span {
  color: var(--accent) !important;
}
body.art-page-topo nav .btn-primary,
body.art-page-topo nav .nav-cta {
  background: var(--gradient-primary) !important;
  color: #fff !important;
  border: none !important;
}

/* Hero elements overrides for light mode */
body.art-page-topo .art-hero,
body.art-page-topo .art-hero-bg {
  background: transparent !important;
  color: #1F2937 !important;
}
body.art-page-topo .art-hero-veil {
  background: linear-gradient(
    to bottom,
    rgba(250, 249, 246, 0.1) 0%,
    rgba(250, 249, 246, 0.3) 40%,
    rgba(250, 249, 246, 0.8) 75%,
    #FAF9F6 100%
  ) !important;
}
body.art-page-topo .art-hero-title,
body.art-page-topo .art-hero h1 {
  color: #09090B !important;
}
body.art-page-topo .art-hero-subtitle,
body.art-page-topo .art-hero .art-hero-subtitle {
  color: #4B5563 !important;
}
body.art-page-topo .art-breadcrumb a {
  color: #4F46E5 !important;
}
body.art-page-topo .art-category-badge {
  color: #4F46E5 !important;
}
body.art-page-topo .art-meta-label {
  color: #71717A !important;
}
body.art-page-topo .art-meta-value {
  color: #18181B !important;
}
body.art-page-topo .art-author-info .name {
  color: #09090B !important;
}
body.art-page-topo .art-author-info .role {
  color: #52525B !important;
}

/* Sidebar and TOC light mode overrides */
body.art-page-topo aside.art-sidebar div.art-toc,
body.art-page-topo aside.art-sidebar div.art-sidebar-card {
  background: rgba(255, 255, 255, 0.72) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  border-radius: 20px !important;
  box-shadow: 
    0 12px 32px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  margin-bottom: 24px !important;
  color: #27272A !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-card h5 {
  color: #09090B !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
  font-weight: 700 !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-stat {
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-stat:last-child {
  border-bottom: none !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-stat span.label {
  color: #52525B !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-stat span.value {
  color: #1F2937 !important;
  font-weight: 600 !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-stat span.value.green {
  color: #059669 !important;
}
body.art-page-topo aside.art-sidebar div.art-sidebar-stat span.value.cyan {
  color: #4F46E5 !important;
  background: rgba(79, 70, 229, 0.06) !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-size: 0.72rem !important;
}

/* TOC active link */
body.art-page-topo aside.art-sidebar div.art-toc nav.art-toc-list a.art-toc-item {
  color: #4B5563 !important;
  border-left: 2px solid transparent !important;
  background: transparent !important;
}
body.art-page-topo aside.art-sidebar div.art-toc nav.art-toc-list a.art-toc-item:hover {
  background: rgba(79, 70, 229, 0.05) !important;
  color: #4F46E5 !important;
  border-left-color: rgba(79, 70, 229, 0.4) !important;
}
body.art-page-topo aside.art-sidebar div.art-toc nav.art-toc-list a.art-toc-item.active {
  background: rgba(79, 70, 229, 0.08) !important;
  color: #4F46E5 !important;
  border-left-color: #4F46E5 !important;
  box-shadow: 
    0 4px 12px rgba(79, 70, 229, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  font-weight: 600 !important;
}
body.art-page-topo aside.art-sidebar div.art-toc nav.art-toc-list a.art-toc-item .toc-num {
  color: #9CA3AF !important;
}
body.art-page-topo aside.art-sidebar div.art-toc nav.art-toc-list a.art-toc-item.active .toc-num {
  color: #4F46E5 !important;
  font-weight: 700 !important;
}

/* Share buttons */
body.art-page-topo aside.art-sidebar div.art-share div.art-share-btns button.art-share-btn {
  background: rgba(255, 255, 255, 0.6) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #374151 !important;
}
body.art-page-topo aside.art-sidebar div.art-share div.art-share-btns button.art-share-btn:hover {
  background: rgba(79, 70, 229, 0.08) !important;
  border-color: rgba(79, 70, 229, 0.3) !important;
  color: #4F46E5 !important;
  transform: translateY(-1px) !important;
}

/* Footer overrides for light mode */
body.art-page-topo footer,
body.art-page-topo .site-footer,
body.art-page-topo .footer {
  background: #FAF9F6 !important;
  color: #4B5563 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
}
body.art-page-topo footer *,
body.art-page-topo .site-footer *,
body.art-page-topo .footer * {
  color: inherit !important;
}
body.art-page-topo footer a,
body.art-page-topo .site-footer a,
body.art-page-topo .footer a {
  color: #4B5563 !important;
}
body.art-page-topo footer a:hover,
body.art-page-topo .site-footer a:hover {
  color: #4F46E5 !important;
}
body.art-page-topo footer .logo-text,
body.art-page-topo .site-footer .logo-text {
  color: #09090B !important;
}
body.art-page-topo footer .logo-text span,
body.art-page-topo .site-footer .logo-text span {
  color: #4F46E5 !important;
}

/* Related articles section overrides */
body.art-page-topo .art-related {
  background: #F3F2EE !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  color: #1F2937 !important;
}
body.art-page-topo .art-related h3 {
  color: #09090B !important;
}

/* Footer social buttons override for light mode */
body.art-page-topo footer .footer-social {
  margin-top: 0 !important;
  display: flex !important;
  gap: 8px !important;
}
body.art-page-topo footer .social-btn {
  background: rgba(255, 255, 255, 0.6) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #52525B !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: var(--radius-md) !important;
  transition: all 0.3s var(--ease) !important;
}
body.art-page-topo footer .social-btn:hover {
  background: rgba(79, 70, 229, 0.08) !important;
  border-color: rgba(79, 70, 229, 0.3) !important;
  color: #4F46E5 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(79, 70, 229, 0.05) !important;
}

