/**
 * Dark Mode Styles for Blog and Pages
 * Ensures proper text contrast and readability
 */

/* ==========================================================================
   Dark Mode Base Text Colors
   ========================================================================== */

body.dark-mode {
    color: #e4e4e7;
    background-color: #0a0f1c;
}

body.dark-mode .site-content,
body.dark-mode .post-content,
body.dark-mode .page-content,
body.dark-mode .archive-content {
    color: #e4e4e7;
}

/* ==========================================================================
   Typography in Dark Mode - Core Content
   ========================================================================== */

/* All headings in main content - FORCE WHITE */
body.dark-mode .main-content h1,
body.dark-mode .main-content h2,
body.dark-mode .main-content h3,
body.dark-mode .main-content h4,
body.dark-mode .main-content h5,
body.dark-mode .main-content h6,
body.dark-mode .entry-content h1,
body.dark-mode .entry-content h2,
body.dark-mode .entry-content h3,
body.dark-mode .entry-content h4,
body.dark-mode .entry-content h5,
body.dark-mode .entry-content h6,
body.dark-mode .enhanced-typography h1,
body.dark-mode .enhanced-typography h2,
body.dark-mode .enhanced-typography h3,
body.dark-mode .enhanced-typography h4,
body.dark-mode .enhanced-typography h5,
body.dark-mode .enhanced-typography h6,
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
    color: #ffffff !important;
}

/* WordPress block headings specifically */
body.dark-mode .wp-block-heading {
    color: #ffffff !important;
}

/* Main content paragraphs and text - Override main.css and enhanced-typography with higher specificity */
body.dark-mode .entry-content,
body.dark-mode .enhanced-typography,
body.dark-mode .main-content,
body.dark-mode .main-content p,
body.dark-mode .main-content div,
body.dark-mode .main-content span,
body.dark-mode .entry-content p,
body.dark-mode .entry-content div,
body.dark-mode .entry-content span,
body.dark-mode .site-content .entry-content,
body.dark-mode .site-content .entry-content p,
body.dark-mode .site-content .entry-content div,
body.dark-mode .site-content .entry-content span,
body.dark-mode .enhanced-typography p,
body.dark-mode .enhanced-typography div,
body.dark-mode .enhanced-typography span,
body.dark-mode article .entry-content,
body.dark-mode article .entry-content p,
body.dark-mode article .entry-content div,
body.dark-mode article .entry-content span,
body.dark-mode .entry-content.enhanced-typography,
body.dark-mode .entry-content.enhanced-typography p,
body.dark-mode .entry-content.enhanced-typography div,
body.dark-mode .entry-content.enhanced-typography span,
body.dark-mode .site-main .entry-content,
body.dark-mode .site-main .entry-content p,
body.dark-mode .site-main .enhanced-typography,
body.dark-mode .site-main .enhanced-typography p {
    color: #e4e4e7 !important;
}

/* List items in content */
body.dark-mode .main-content li,
body.dark-mode .main-content ul,
body.dark-mode .main-content ol,
body.dark-mode .entry-content li,
body.dark-mode .entry-content ul,
body.dark-mode .entry-content ol,
body.dark-mode .enhanced-typography li,
body.dark-mode .enhanced-typography ul,
body.dark-mode .enhanced-typography ol {
    color: #e4e4e7 !important;
}

/* Single page/post article content */
body.dark-mode .single-page .entry-content,
body.dark-mode .single-post .entry-content,
body.dark-mode article.page .entry-content,
body.dark-mode article.post .entry-content,
body.dark-mode .post-content .entry-content,
body.dark-mode .page-content .entry-content {
    color: #e4e4e7 !important;
}

/* Privacy policy tutorial text (the bold suggested text) */
body.dark-mode .privacy-policy-tutorial,
body.dark-mode strong.privacy-policy-tutorial {
    color: #fbbf24 !important; /* Amber color for visibility */
}

body.dark-mode .entry-content strong,
body.dark-mode .entry-content b {
    color: #f3f4f6;
}

body.dark-mode .entry-content em,
body.dark-mode .entry-content i {
    color: #e5e7eb;
}

/* Links in content */
body.dark-mode .entry-content a {
    color: #60a5fa;
}

body.dark-mode .entry-content a:hover {
    color: #93bbfc;
}

/* Blockquotes */
body.dark-mode .entry-content blockquote,
body.dark-mode .enhanced-typography blockquote {
    background: #1e293b;
    border-left-color: #3b82f6;
    color: #cbd5e1;
}

body.dark-mode .enhanced-typography blockquote::before {
    color: #3b82f6;
}

/* Code blocks */
body.dark-mode .entry-content code,
body.dark-mode .enhanced-typography code {
    background: #1e293b;
    color: #f472b6;
}

body.dark-mode .entry-content pre,
body.dark-mode .enhanced-typography pre {
    background: #0f172a;
    color: #e2e8f0;
}

/* ==========================================================================
   Post/Page Meta in Dark Mode
   ========================================================================== */

body.dark-mode .entry-meta {
    color: #9ca3af;
}

body.dark-mode .entry-meta a {
    color: #cbd5e1;
}

body.dark-mode .entry-meta a:hover {
    color: #60a5fa;
}

body.dark-mode .post-date,
body.dark-mode .reading-time,
body.dark-mode .meta-item {
    color: #9ca3af;
}

/* ==========================================================================
   Hero Section Dark Mode
   ========================================================================== */

body.dark-mode .post-hero .hero-content {
    color: #ffffff;
}

body.dark-mode .hero-title {
    color: #ffffff;
}

body.dark-mode .hero-meta {
    color: #e5e7eb;
}

/* ==========================================================================
   Breadcrumbs Dark Mode
   ========================================================================== */

body.dark-mode .breadcrumb-wrapper,
body.dark-mode .breadcrumbs-wrapper {
    background: #1e293b;
    border-bottom-color: #334155;
}

body.dark-mode .breadcrumbs a {
    color: #94a3b8;
}

body.dark-mode .breadcrumbs a:hover {
    color: #60a5fa;
}

body.dark-mode .breadcrumbs .current,
body.dark-mode .breadcrumb-current {
    color: #e2e8f0;
}

body.dark-mode .breadcrumb-separator,
body.dark-mode .breadcrumbs .separator {
    color: #64748b;
}

/* ==========================================================================
   Table of Contents Dark Mode
   ========================================================================== */

body.dark-mode .table-of-contents {
    background: #1e293b;
    border-color: #334155;
}

body.dark-mode .table-of-contents h3 {
    color: #f1f5f9;
}

body.dark-mode .toc-content a {
    color: #94a3b8;
}

body.dark-mode .toc-content a:hover,
body.dark-mode .toc-content a.active {
    color: #60a5fa;
}

/* ==========================================================================
   Author Box Dark Mode
   ========================================================================== */

body.dark-mode .author-box,
body.dark-mode .author-box.enhanced {
    background: #1e293b;
    border-color: #334155;
    color: #d1d5db;
}

body.dark-mode .author-box h3,
body.dark-mode .author-box h4 {
    color: #f1f5f9;
}

body.dark-mode .author-box p {
    color: #9ca3af;
}

body.dark-mode .author-box a {
    color: #60a5fa;
}

body.dark-mode .author-box a:hover {
    color: #93bbfc;
}

/* ==========================================================================
   Post Navigation Dark Mode
   ========================================================================== */

body.dark-mode .entry-navigation,
body.dark-mode .post-navigation.enhanced {
    background: transparent;
}

body.dark-mode .post-navigation.enhanced .nav-previous,
body.dark-mode .post-navigation.enhanced .nav-next {
    background: #1e293b;
}

body.dark-mode .post-navigation.enhanced .nav-previous:hover,
body.dark-mode .post-navigation.enhanced .nav-next:hover {
    background: #334155;
}

body.dark-mode .nav-title {
    color: #e2e8f0;
}

body.dark-mode .nav-indicator,
body.dark-mode .nav-direction {
    color: #94a3b8;
}

/* ==========================================================================
   Related Posts Dark Mode
   ========================================================================== */

body.dark-mode .related-posts h2,
body.dark-mode .related-posts h3 {
    color: #f1f5f9;
}

body.dark-mode .related-post-card {
    background: #1e293b;
    box-shadow: 0 5px 20px rgba(0,0,0,0.3);
}

body.dark-mode .related-post-card:hover {
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

body.dark-mode .related-post-card h3,
body.dark-mode .related-post-card h4 {
    color: #f1f5f9;
}

body.dark-mode .related-post-card p {
    color: #94a3b8;
}

body.dark-mode .related-post-meta {
    color: #64748b;
}

/* ==========================================================================
   Sidebar Dark Mode
   ========================================================================== */

body.dark-mode .sidebar .widget,
body.dark-mode .sidebar.enhanced .widget,
body.dark-mode .archive-sidebar .widget {
    background: rgba(42, 51, 68, 0.95);
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    border: 1px solid rgba(255,255,255,0.05);
}

body.dark-mode .widget-title {
    color: #f1f5f9;
}

body.dark-mode .widget-title::after {
    background: linear-gradient(90deg, #3b82f6, #06b6d4);
}

body.dark-mode .widget a {
    color: #cbd5e1;
}

body.dark-mode .widget a:hover {
    color: #60a5fa;
}

body.dark-mode .widget p,
body.dark-mode .widget li {
    color: #94a3b8;
}

/* Search Widget */
body.dark-mode .widget-search .search-field {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

body.dark-mode .widget-search .search-field::placeholder {
    color: #64748b;
}

body.dark-mode .widget-search .search-submit {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
}

/* Popular Posts Widget */
body.dark-mode .popular-posts time {
    color: #64748b;
}

body.dark-mode .popular-posts h4 {
    color: #e2e8f0;
}

/* Categories Widget */
body.dark-mode .category-list a {
    color: #cbd5e1;
}

body.dark-mode .category-list a:hover {
    color: #60a5fa;
}

/* Tag Cloud */
body.dark-mode .tag-cloud a,
body.dark-mode .tagcloud a {
    background: #334155;
    color: #cbd5e1;
}

body.dark-mode .tag-cloud a:hover,
body.dark-mode .tagcloud a:hover {
    background: #3b82f6;
    color: #ffffff;
}

/* Newsletter Widget */
body.dark-mode .widget-newsletter {
    background: linear-gradient(135deg, #0a4f5c 0%, #0a5c3a 100%);
    color: #fff;
}

body.dark-mode .widget-newsletter .widget-title,
body.dark-mode .widget-newsletter p {
    color: #fff;
}

body.dark-mode .newsletter-form input[type="email"] {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

body.dark-mode .newsletter-form input[type="email"]::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

body.dark-mode .newsletter-form button {
    background: rgba(255, 255, 255, 0.15);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

body.dark-mode .newsletter-form button:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* ==========================================================================
   Archive Page Dark Mode
   ========================================================================== */

body.dark-mode .archive-hero {
    background: var(--bg-card, #151B2C);
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-mode .filter-bar {
    background: rgba(42, 51, 68, 0.95);
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.05);
}

body.dark-mode .view-toggle button {
    background: transparent;
    color: #94a3b8;
}

body.dark-mode .view-toggle button.active {
    background: #334155;
    color: #60a5fa;
}

body.dark-mode .sort-select {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

body.dark-mode .filter-tag {
    background: #334155;
    color: #cbd5e1;
}

body.dark-mode .filter-tag:hover {
    background: #3b82f6;
    color: #ffffff;
}

/* Post Cards */
body.dark-mode .post-card.enhanced {
    background: rgba(42, 51, 68, 0.98);
    box-shadow: 0 5px 20px rgba(0,0,0,0.3);
    border: 1px solid rgba(255,255,255,0.05);
}

body.dark-mode .post-card.enhanced:hover {
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    background: rgba(42, 51, 68, 1);
}

body.dark-mode .post-title a {
    color: #f1f5f9;
}

body.dark-mode .post-title a:hover {
    color: #60a5fa;
}

body.dark-mode .post-excerpt {
    color: #94a3b8;
}

body.dark-mode .post-meta-bottom {
    border-top-color: #334155;
}

body.dark-mode .author-name a {
    color: #cbd5e1;
}

body.dark-mode .author-name a:hover {
    color: #60a5fa;
}

body.dark-mode .category-badge {
    background: #334155;
    color: #cbd5e1;
    border-color: rgba(255, 255, 255, 0.1);
    font-weight: 600;
}

body.dark-mode .category-badge:hover {
    background: linear-gradient(135deg, #00D9FF 0%, #00F5A0 100%);
    color: #0A0F1C;
    border-color: transparent;
}

/* ==========================================================================
   Comments Section Dark Mode
   ========================================================================== */

body.dark-mode .comment-list {
    color: #d1d5db;
}

body.dark-mode .comment-body {
    background: #1e293b;
    border-color: #334155;
}

body.dark-mode .comment-author {
    color: #f1f5f9;
}

body.dark-mode .comment-metadata {
    color: #64748b;
}

body.dark-mode .comment-metadata a {
    color: #94a3b8;
}

body.dark-mode .comment-content {
    color: #d1d5db;
}

body.dark-mode .comment-reply-link {
    color: #60a5fa;
}

body.dark-mode .comment-reply-link:hover {
    color: #93bbfc;
}

body.dark-mode #commentform input[type="text"],
body.dark-mode #commentform input[type="email"],
body.dark-mode #commentform input[type="url"],
body.dark-mode #commentform textarea {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

body.dark-mode #commentform input[type="text"]::placeholder,
body.dark-mode #commentform input[type="email"]::placeholder,
body.dark-mode #commentform input[type="url"]::placeholder,
body.dark-mode #commentform textarea::placeholder {
    color: #64748b;
}

/* ==========================================================================
   Pagination Dark Mode
   ========================================================================== */

body.dark-mode .pagination a,
body.dark-mode .pagination span,
body.dark-mode .page-numbers a,
body.dark-mode .page-numbers span {
    background: #1e293b;
    color: #cbd5e1;
    border-color: #334155;
}

body.dark-mode .pagination a:hover,
body.dark-mode .page-numbers a:hover {
    background: #3b82f6;
    color: #ffffff;
    border-color: #3b82f6;
}

body.dark-mode .pagination .current,
body.dark-mode .page-numbers .current {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    color: #ffffff;
    border-color: transparent;
}

body.dark-mode .pagination-info {
    color: #94a3b8;
}

/* ==========================================================================
   404 and No Posts Dark Mode
   ========================================================================== */

body.dark-mode .no-posts-found {
    background: #1e293b;
}

body.dark-mode .no-posts-icon {
    color: #334155;
}

body.dark-mode .no-posts-found h2 {
    color: #f1f5f9;
}

body.dark-mode .no-posts-found p {
    color: #94a3b8;
}

body.dark-mode .category-card {
    background: #334155;
    color: #cbd5e1;
}

body.dark-mode .category-card:hover {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    color: #ffffff;
}

body.dark-mode .category-name {
    color: #e2e8f0;
}

body.dark-mode .category-count {
    color: #94a3b8;
}

/* ==========================================================================
   Buttons Dark Mode
   ========================================================================== */

body.dark-mode .btn-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
}

body.dark-mode .btn-outline {
    color: #60a5fa;
    border-color: #60a5fa;
}

body.dark-mode .btn-outline:hover {
    background: #3b82f6;
    color: #ffffff;
    border-color: #3b82f6;
}

body.dark-mode .read-more-link {
    color: #60a5fa;
}

body.dark-mode .read-more-link:hover {
    color: #93bbfc;
}

/* ==========================================================================
   Social Share Dark Mode
   ========================================================================== */

body.dark-mode .social-share {
    background: #2A3344;
    border: 1px solid rgba(255,255,255,0.05);
}

body.dark-mode .social-share h4 {
    color: #ffffff;
}

body.dark-mode .share-buttons a {
    background: rgba(255, 255, 255, 0.1);
    color: #e4e4e7;
    border: 1px solid rgba(255,255,255,0.1);
}

body.dark-mode .share-buttons a:hover {
    background: rgba(255, 255, 255, 0.15);
    transform: translateY(-2px);
}

/* ==========================================================================
   Back to Top Button Dark Mode
   ========================================================================== */

body.dark-mode .back-to-top {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    color: #ffffff;
}

body.dark-mode .back-to-top:hover {
    box-shadow: 0 10px 20px rgba(59, 130, 246, 0.3);
}

/* ==========================================================================
   Forms Dark Mode
   ========================================================================== */

body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="url"],
body.dark-mode input[type="search"],
body.dark-mode textarea,
body.dark-mode select {
    background: #0f172a;
    border-color: #334155;
    color: #e2e8f0;
}

body.dark-mode input[type="text"]::placeholder,
body.dark-mode input[type="email"]::placeholder,
body.dark-mode input[type="url"]::placeholder,
body.dark-mode input[type="search"]::placeholder,
body.dark-mode textarea::placeholder {
    color: #64748b;
}

body.dark-mode input[type="submit"],
body.dark-mode button[type="submit"] {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    color: #ffffff;
    border: none;
}

body.dark-mode input[type="submit"]:hover,
body.dark-mode button[type="submit"]:hover {
    opacity: 0.9;
}

/* ==========================================================================
   Tables Dark Mode
   ========================================================================== */

body.dark-mode table {
    background: #1e293b;
    color: #d1d5db;
}

body.dark-mode th {
    background: #0f172a;
    color: #f1f5f9;
    border-color: #334155;
}

body.dark-mode td {
    border-color: #334155;
}

body.dark-mode tr:hover {
    background: #334155;
}

/* ==========================================================================
   Enhanced Typography Dark Mode Specific
   ========================================================================== */

body.dark-mode .enhanced-typography {
    color: #e4e4e7 !important;
}

/* Override any .enhanced-typography color rules from other CSS files */
body.dark-mode .enhanced-typography,
body.dark-mode .enhanced-typography *:not(a):not(button):not(input):not(code):not(pre) {
    color: #e4e4e7 !important;
}

/* FORCE override the main.css .entry-content color rule */
body.dark-mode .entry-content,
body.dark-mode .entry-content * {
    color: #ffffff !important;
}

/* Preserve link colors */
body.dark-mode .entry-content a {
    color: #60a5fa !important;
}

body.dark-mode .entry-content a:hover {
    color: #93bbfc !important;
}

/* Preserve code colors */
body.dark-mode .entry-content code {
    color: #f472b6 !important;
}

body.dark-mode .entry-content pre {
    color: #e2e8f0 !important;
}

body.dark-mode .enhanced-typography h2::before {
    background: linear-gradient(180deg, #3b82f6, #06b6d4);
}

body.dark-mode .enhanced-typography ul li::marker,
body.dark-mode .enhanced-typography ol li::marker {
    color: #60a5fa;
}

/* ==========================================================================
   Misc Elements Dark Mode
   ========================================================================== */

body.dark-mode hr {
    border-color: #334155;
}

body.dark-mode .wp-caption {
    background: #1e293b;
    color: #94a3b8;
}

body.dark-mode .wp-caption-text {
    color: #94a3b8;
}

body.dark-mode .gallery-caption {
    color: #94a3b8;
}

/* Ensure proper contrast for all text elements */
body.dark-mode p,
body.dark-mode li,
body.dark-mode span,
body.dark-mode div {
    color: inherit;
}

/* Override any conflicting light mode styles */
body.dark-mode .site-content *:not(a):not(button):not(input):not(textarea):not(select) {
    border-color: inherit;
}

/* Ensure links remain visible */
body.dark-mode a:not(.btn):not(.button) {
    color: #60a5fa;
}

body.dark-mode a:not(.btn):not(.button):hover {
    color: #93bbfc;
}

/* ==========================================================================
   FINAL OVERRIDE - Ensure all page/post content is white
   ========================================================================== */
body.dark-mode.single-post .entry-content,
body.dark-mode.single-post .entry-content p,
body.dark-mode.single-post .entry-content div,
body.dark-mode.single-post .entry-content span,
body.dark-mode.single-post .entry-content li,
body.dark-mode.page .entry-content,
body.dark-mode.page .entry-content p,
body.dark-mode.page .entry-content div,
body.dark-mode.page .entry-content span,
body.dark-mode.page .entry-content li,
body.dark-mode .page-template-default .entry-content,
body.dark-mode .page-template-default .entry-content p,
body.dark-mode .page-template-default .entry-content div,
body.dark-mode .page-template-default .entry-content span,
body.dark-mode .page-template-default .entry-content li {
    color: #ffffff !important;
}/* Post Categories on Single Posts */
.post-categories a {
    padding: 4px 10px;
    background: var(--bg-secondary, #f8f9fa);
    color: var(--text-primary, #212529);
    text-decoration: none;
    border: 1px solid var(--border-color, #D0CCC6);
    border-radius: 3px;
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: all 0.3s ease;
    display: inline-block;
    margin-right: 8px;
    margin-bottom: 8px;
}

.post-categories a:hover {
    background: linear-gradient(135deg, #00D9FF 0%, #00F5A0 100%);
    color: #0A0F1C;
    border-color: transparent;
}

body.dark-mode .post-categories a {
    background: #334155;
    color: #cbd5e1;
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-mode .post-categories a:hover {
    background: linear-gradient(135deg, #00D9FF 0%, #00F5A0 100%);
    color: #0A0F1C;
    border-color: transparent;
}