/* ==========================================================================
   IBH CHILD — DARK MODE CSS
   Activated by adding data-theme="dark" to the <html> element.
   JS in header.js handles toggle + localStorage persistence.
   An anti-flash inline script in header.php reads localStorage before
   first paint so the page never flashes between themes on load.

   Design principles:
   • Dark backgrounds use deep navy/slate (matches the Hero/Footer language)
   • Brand blues stay the same — they pop well on dark backgrounds
   • Text contrast meets WCAG AA minimum
   • External sections (Hero, Footer snippets) are NOT targeted here
     since they have their own CSS and look fine on any background
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. DARK MODE CSS VARIABLE OVERRIDES
   All other components inherit these automatically via var()
   -------------------------------------------------------------------------- */
[data-theme="dark"] {

	/* Backgrounds — deep navy to slate */
	--ibh-bg-page:   #0f172a;
	--ibh-bg-card:   #1e293b;
	--ibh-bg-panel:  #162032;

	/* Borders — subtle white/slate */
	--ibh-border:      rgba(148,163,184,.16);
	--ibh-border-soft: rgba(148,163,184,.09);

	/* Text — reversed from light mode */
	--ibh-text-dark:        #f1f5f9;
	--ibh-text-body:        #cbd5e1;
	--ibh-text-muted:       #94a3b8;
	--ibh-text-placeholder: #64748b;

	/* Shadows — slightly more visible on dark bg */
	--ibh-shadow-sm: 0 2px 8px rgba(0,0,0,.30);
	--ibh-shadow-md: 0 6px 20px rgba(0,0,0,.40);
	--ibh-shadow-lg: 0 10px 30px rgba(0,0,0,.50);
}

/* --------------------------------------------------------------------------
   2. BODY + PAGE BACKGROUND
   -------------------------------------------------------------------------- */
[data-theme="dark"] body,
[data-theme="dark"] #page {
	background-color: var(--ibh-bg-page);
	color: var(--ibh-text-body);
}

/* --------------------------------------------------------------------------
   3. HEADER — dark glass instead of white glass
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-header {
	background: rgba(15,23,42,.95) !important;
	border-bottom-color: rgba(59,130,246,.22) !important;
	box-shadow: 0 2px 14px rgba(0,0,0,.40), 0 1px 0 rgba(59,130,246,.14) !important;
}
[data-theme="dark"] .ibh-hdr-logo-text strong { color: #f1f5f9 !important; }
[data-theme="dark"] .ibh-hdr-logo-text span   { color: #94a3b8 !important; }
[data-theme="dark"] .ibh-hdr-nav ul li a       { color: #bfdbfe !important; }
[data-theme="dark"] .ibh-hdr-nav ul li a:hover,
[data-theme="dark"] .ibh-hdr-nav ul li.current-menu-item > a {
	background: rgba(59,130,246,.18) !important;
	color: #fff !important;
}
/* Dark glass buttons */
[data-theme="dark"] .ibh-glass-btn {
	background: rgba(30,58,138,.35) !important;
	border-color: rgba(59,130,246,.40) !important;
	color: #bfdbfe !important;
}
[data-theme="dark"] .ibh-glass-btn:hover {
	background: rgba(30,58,138,.55) !important;
	border-color: rgba(59,130,246,.65) !important;
}
/* Dark mode toggle button — extra visual cue */
[data-theme="dark"] #ibhDarkToggle { color: #fbbf24 !important; }

/* Desktop dropdown in dark mode */
[data-theme="dark"] .ibh-hdr-nav ul li ul {
	background: #1e293b !important;
	border-color: rgba(59,130,246,.20) !important;
}
[data-theme="dark"] .ibh-hdr-nav ul li ul li a { color: #bfdbfe !important; }
[data-theme="dark"] .ibh-hdr-nav ul li ul li a:hover {
	background: rgba(59,130,246,.15) !important;
	color: #fff !important;
}

/* Search bar */
[data-theme="dark"] .ibh-search-bar { background: rgba(15,23,42,.98) !important; }
[data-theme="dark"] .ibh-search-bar .ibh-search-form,
[data-theme="dark"] .ibh-search-bar #searchform {
	background: #1e293b !important;
	border-color: rgba(59,130,246,.30) !important;
}
[data-theme="dark"] .ibh-search-bar .ibh-search-form .search-field,
[data-theme="dark"] .ibh-search-bar #searchform input[type="search"],
[data-theme="dark"] .ibh-search-bar #searchform input[type="text"] {
	color: #f1f5f9 !important;
}

/* --------------------------------------------------------------------------
   4. CARDS — archive cards, homepage cards
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-card,
[data-theme="dark"] .ibh-lu-card {
	background: var(--ibh-bg-card);
	border-color: var(--ibh-border-soft);
}
[data-theme="dark"] .ibh-card-body,
[data-theme="dark"] .ibh-lu-body { background: var(--ibh-bg-card); }
[data-theme="dark"] .ibh-card-title a,
[data-theme="dark"] .ibh-lu-title a { color: var(--ibh-text-dark); }
[data-theme="dark"] .ibh-card-title a:hover,
[data-theme="dark"] .ibh-lu-title a:hover { color: var(--ibh-accent); }
[data-theme="dark"] .ibh-card-excerpt,
[data-theme="dark"] .ibh-lu-excerpt { color: var(--ibh-text-muted); }
[data-theme="dark"] .ibh-card-meta { color: var(--ibh-text-placeholder); border-top-color: var(--ibh-border-soft); }

/* --------------------------------------------------------------------------
   5. SINGLE POST
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-single-post,
[data-theme="dark"] .inside-article { background: transparent; }
[data-theme="dark"] .single-post .entry-title,
[data-theme="dark"] .ibh-post-title { color: var(--ibh-text-dark) !important; }
[data-theme="dark"] .ibh-post-meta { background: var(--ibh-bg-panel); }
[data-theme="dark"] .ibh-meta-avatar { border-color: rgba(59,130,246,.50) !important; }
[data-theme="dark"] .ibh-meta-updated { color: var(--ibh-text-muted); }
[data-theme="dark"] .entry-content { color: var(--ibh-text-body); }
[data-theme="dark"] .entry-content h2 {
	background: rgba(30,41,59,.80) !important;
	color: #bfdbfe !important;
	border-left-color: var(--ibh-accent) !important;
}
[data-theme="dark"] .entry-content h3 { color: #93c5fd !important; }
[data-theme="dark"] .entry-content a { color: #60a5fa !important; }
[data-theme="dark"] .entry-content a:hover { color: #93c5fd !important; }
[data-theme="dark"] .entry-content blockquote {
	background: var(--ibh-bg-panel) !important;
	color: var(--ibh-text-body) !important;
}
[data-theme="dark"] .entry-content table td { background: var(--ibh-bg-card); color: var(--ibh-text-body); border-color: var(--ibh-border-soft); }
[data-theme="dark"] .entry-content table tr:nth-child(even) td { background: var(--ibh-bg-panel); }
[data-theme="dark"] .entry-content table tr:hover td { background: rgba(59,130,246,.08); }

/* --------------------------------------------------------------------------
   6. TOC
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-toc {
	background: var(--ibh-bg-panel) !important;
	border-color: rgba(59,130,246,.22) !important;
}
[data-theme="dark"] .ibh-toc summary { color: var(--ibh-text-dark) !important; }
[data-theme="dark"] .ibh-toc a { color: #60a5fa !important; }
[data-theme="dark"] .ibh-toc a:hover { color: #93c5fd !important; }

/* --------------------------------------------------------------------------
   7. SIDEBAR
   -------------------------------------------------------------------------- */
[data-theme="dark"] #right-sidebar .widget,
[data-theme="dark"] .sidebar .widget {
	background: var(--ibh-bg-card) !important;
	border-color: var(--ibh-border-soft) !important;
}
[data-theme="dark"] #right-sidebar .widget-title,
[data-theme="dark"] .sidebar .widget-title {
	color: #bfdbfe !important;
	border-bottom-color: rgba(59,130,246,.25) !important;
}
[data-theme="dark"] .ibh-popular-post-title a { color: var(--ibh-text-dark); }

/* --------------------------------------------------------------------------
   8. SEARCH FORM (sidebar + searchform.php)
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-search-form,
[data-theme="dark"] #searchform,
[data-theme="dark"] .widget_search form {
	background: var(--ibh-bg-panel) !important;
	border-color: rgba(59,130,246,.25) !important;
}
[data-theme="dark"] .ibh-search-form .search-field,
[data-theme="dark"] #searchform input[type="search"],
[data-theme="dark"] #searchform input[type="text"],
[data-theme="dark"] .widget_search input[type="search"] {
	color: var(--ibh-text-dark) !important;
	background: transparent !important;
}

/* --------------------------------------------------------------------------
   9. AUTHOR BOX
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-author-box {
	background: var(--ibh-bg-card) !important;
	border-color: var(--ibh-border-soft) !important;
}
[data-theme="dark"] .ibh-author-name a  { color: #bfdbfe !important; }
[data-theme="dark"] .ibh-author-bio     { color: var(--ibh-text-muted) !important; }

/* --------------------------------------------------------------------------
   10. POST NAVIGATION (prev/next)
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-pnav-card {
	background: var(--ibh-bg-card) !important;
	border-color: var(--ibh-border-soft) !important;
	color: var(--ibh-text-dark) !important;
}
[data-theme="dark"] .ibh-pnav-title { color: var(--ibh-text-dark) !important; }

/* --------------------------------------------------------------------------
   11. PAGINATION
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-pagination a,
[data-theme="dark"] .ibh-pagination span {
	background: var(--ibh-bg-card) !important;
	border-color: var(--ibh-border-soft) !important;
	color: var(--ibh-text-dark) !important;
}

/* --------------------------------------------------------------------------
   12. HOMEPAGE SECTIONS
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-sec-head {
	background: var(--ibh-bg-panel) !important;
	border-color: var(--ibh-border-soft) !important;
}
[data-theme="dark"] .ibh-sec-title { color: var(--ibh-text-dark) !important; }
[data-theme="dark"] .ibh-cat-card {
	background: var(--ibh-bg-card) !important;
	border-color: var(--ibh-border-soft) !important;
}
[data-theme="dark"] .ibh-cat-name { color: var(--ibh-text-dark) !important; }

/* --------------------------------------------------------------------------
   13. COMMENTS
   -------------------------------------------------------------------------- */
[data-theme="dark"] .comment-body,
[data-theme="dark"] .ibh-comment { background: var(--ibh-bg-card); border-color: var(--ibh-border-soft); }
[data-theme="dark"] .comment-author .fn { color: var(--ibh-text-dark); }
[data-theme="dark"] .ibh-comment-form input,
[data-theme="dark"] .ibh-comment-form textarea {
	background: var(--ibh-bg-panel) !important;
	border-color: var(--ibh-border) !important;
	color: var(--ibh-text-dark) !important;
}

/* --------------------------------------------------------------------------
   14. TAGS + BADGES
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-badge {
	background: rgba(30,58,138,.35) !important;
	color: #bfdbfe !important;
	border-color: rgba(59,130,246,.30) !important;
}
[data-theme="dark"] .ibh-badge-tag {
	background: transparent !important;
	border-color: rgba(59,130,246,.35) !important;
	color: #60a5fa !important;
}

/* --------------------------------------------------------------------------
   15. 404 + EMPTY STATE
   -------------------------------------------------------------------------- */
[data-theme="dark"] .ibh-404,
[data-theme="dark"] .ibh-empty-state { color: var(--ibh-text-body); }

/* --------------------------------------------------------------------------
   16. DARK MODE TOGGLE BUTTON — sun/moon icon swap
   -------------------------------------------------------------------------- */
.ibh-dark-toggle .ibh-icon-moon { display: block; }
.ibh-dark-toggle .ibh-icon-sun  { display: none;  }
[data-theme="dark"] .ibh-dark-toggle .ibh-icon-moon { display: none;  }
[data-theme="dark"] .ibh-dark-toggle .ibh-icon-sun  { display: block; }