/* ==========================================================================
   Dark Mode Overrides
   ========================================================================== */

/* Note: :root [data-theme="dark"] variable overrides are in variables.css.
   Most components inherit dark mode automatically via CSS variables.
   This file handles components that use hardcoded colors. */

/* Dark mode toggle icon swap */
.dark-toggle__sun { display: none; }
.dark-toggle__moon { display: inline; }
[data-theme="dark"] .dark-toggle__sun { display: inline; }
[data-theme="dark"] .dark-toggle__moon { display: none; }

/* ── Header — see header.css for dark mode rules ──────────────────────── */

[data-theme="dark"] .header__dropdown a:hover {
  background: #222222;
}

[data-theme="dark"] .header__btn:hover {
  background: #222222;
}

/* ── Search Overlay ────────────────────────────────────────────────────── */

[data-theme="dark"] .search-overlay {
  background: rgba(0, 0, 0, 0.95);
}

[data-theme="dark"] .search-overlay__input {
  background: #1a1a1a;
  color: var(--color-heading);
  border-bottom-color: var(--color-border);
}

/* ── Search Page ───────────────────────────────────────────────────────── */

[data-theme="dark"] .search-page__input {
  background: #1a1a1a;
  color: var(--color-heading);
  border-color: var(--color-border);
}

[data-theme="dark"] .search-page__input:focus {
  border-color: var(--tb-red);
}

/* ── Mobile Menu ───────────────────────────────────────────────────────── */

[data-theme="dark"] .mobile-menu {
  background: #111111;
  border-right-color: var(--color-border);
}

[data-theme="dark"] .mobile-menu__nav > .menu-item > a,
[data-theme="dark"] .mobile-menu__nav > li > a {
  color: var(--color-heading);
  border-bottom-color: var(--color-border);
}

[data-theme="dark"] .mobile-menu__close {
  color: var(--color-meta);
}

[data-theme="dark"] .mobile-menu__dark {
  border-top-color: var(--color-border);
  color: var(--color-heading);
}

/* ── Cards ─────────────────────────────────────────────────────────────── */

[data-theme="dark"] .card__title a,
[data-theme="dark"] .h-card__title a,
[data-theme="dark"] .overlay-card__title {
  color: var(--color-heading);
}

[data-theme="dark"] .card__excerpt,
[data-theme="dark"] .h-card__excerpt {
  color: var(--color-body);
}

[data-theme="dark"] .h-card {
  border-bottom-color: var(--color-border);
}

/* ── Post Content ──────────────────────────────────────────────────────── */

[data-theme="dark"] .post-content pre {
  background: #1a1a1a;
}

[data-theme="dark"] .post-content p code {
  background: #1a1a1a;
}

[data-theme="dark"] .post-content blockquote {
  border-top-color: var(--color-heading);
  border-bottom-color: var(--color-border);
}

/* ── Post Hero ─────────────────────────────────────────────────────────── */

[data-theme="dark"] .post-hero__label {
  color: var(--tb-red);
}

/* ── Share Buttons ─────────────────────────────────────────────────────── */

[data-theme="dark"] .post-share__btn:hover,
[data-theme="dark"] .post-share .share-buttons__btn:hover,
[data-theme="dark"] .share-buttons--horizontal .share-buttons__btn:hover {
  background: rgba(255, 255, 255, 0.08);
}

/* ── Mobile Share ──────────────────────────────────────────────────────── */

[data-theme="dark"] .mobile-share {
  background: var(--color-bg);
  border-top-color: var(--color-border);
}

/* ── Inline Related ────────────────────────────────────────────────────── */

[data-theme="dark"] .inline-related {
  border-top-color: var(--color-heading);
  border-bottom-color: var(--color-border);
}

/* ── Category Page ─────────────────────────────────────────────────────── */

[data-theme="dark"] .category-hero {
  border-bottom-color: var(--color-border);
}

[data-theme="dark"] .filter-tabs {
  border-bottom-color: var(--color-border);
}

[data-theme="dark"] .filter-tabs__tab {
  color: var(--color-meta);
}

[data-theme="dark"] .filter-tabs__tab:hover,
[data-theme="dark"] .filter-tabs__tab.is-active {
  color: var(--color-heading);
}

/* ── Pagination ────────────────────────────────────────────────────────── */

[data-theme="dark"] .pagination .page-numbers {
  color: var(--color-body);
}

[data-theme="dark"] .pagination .page-numbers:hover {
  color: var(--tb-red);
}

[data-theme="dark"] .pagination .page-numbers.current {
  color: var(--color-heading);
}

/* ── Sidebar Widgets ───────────────────────────────────────────────────── */

[data-theme="dark"] .widget-title,
[data-theme="dark"] .widget__title {
  color: var(--color-heading);
  border-bottom-color: var(--color-border);
}

[data-theme="dark"] .widget-latest-link,
[data-theme="dark"] .numbered-list__title,
[data-theme="dark"] .numbered-list__title a {
  color: var(--color-heading);
}

[data-theme="dark"] .widget {
  border-color: var(--color-border);
}

[data-theme="dark"] .post-sidebar__widget-title {
  border-bottom-color: var(--color-heading);
}

/* ── Newsletter Section ────────────────────────────────────────────────── */

[data-theme="dark"] .newsletter__input {
  background: #1a1a1a;
  color: var(--color-heading);
  border-color: var(--color-border);
}

/* ── Author Page ───────────────────────────────────────────────────────── */

[data-theme="dark"] .author-hero {
  border-bottom-color: var(--color-border);
}

/* ── Post Tags ─────────────────────────────────────────────────────────── */

[data-theme="dark"] .post-tags {
  border-top-color: var(--color-border);
}

[data-theme="dark"] .post-tags__tag {
  border-color: var(--color-border);
  color: var(--color-meta);
}

[data-theme="dark"] .post-tags__tag:hover {
  border-color: var(--tb-red);
  color: var(--tb-red);
}

/* ── Author Box ────────────────────────────────────────────────────────── */

[data-theme="dark"] .author-box {
  border-top-color: var(--color-border);
}

/* ── Related Posts ─────────────────────────────────────────────────────── */

[data-theme="dark"] .related-posts {
  border-top-color: var(--color-border);
}

/* ── Breadcrumb ────────────────────────────────────────────────────────── */

[data-theme="dark"] .breadcrumb a {
  color: var(--color-meta);
}

/* ── Body ──────────────────────────────────────────────────────────────── */

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

/* ── Sections with hardcoded light backgrounds ─────────────────────────── */

[data-theme="dark"] .section--follow .follow-strip {
  border-top-color: var(--color-border);
  border-bottom-color: var(--color-border);
}

/* ── Gaming section (already has dark bg) — no change needed ──────────── */

/* ── Horizontal Card borders ───────────────────────────────────────────── */

[data-theme="dark"] .share-buttons--horizontal {
  border-top-color: var(--color-border);
}