/**
 * TechHub Dark Mode Engine Stylesheet
 * 
 * Tối ưu hóa độ tương phản cao, bảo vệ mắt khi đọc tài liệu đêm,
 * ánh xạ biến màu sắc theo hệ thống tokens của Block Theme.
 */

html.dark-mode {
    color-scheme: dark;

    /* Ghi đè biến màu của theme.json */
    --wp--preset--color--surface-white: #0b1120;
    --wp--preset--color--surface-light: #070c1b;
    --wp--preset--color--surface-muted: #1e293b;
    --wp--preset--color--border-light: #334155;
    --wp--preset--color--border-focus: #3b82f6;
    --wp--preset--color--navy-primary: #f8fafc;
    --wp--preset--color--navy-dark: #e2e8f0;
    --wp--preset--color--navy-medium: #cbd5e1;
    --wp--preset--color--text-main: #f8fafc;
    --wp--preset--color--text-muted: #94a3b8;
    --wp--preset--color--blue-light: #172554;
    --wp--preset--color--purple-light: #2e1065;
    --wp--preset--color--teal-light: #042f2e;
}

html.dark-mode body {
    background-color: #0b1120 !important;
    color: #f8fafc !important;
}

/* Header trong Dark Mode */
html.dark-mode .th-site-header {
    background-color: rgba(15, 23, 42, 0.92) !important;
    border-bottom-color: #1e293b !important;
}

html.dark-mode .wp-block-site-title a {
    color: #f8fafc !important;
}

/* Nút Toggle & Search trong Dark Mode */
html.dark-mode .th-theme-toggle-btn,
html.dark-mode .th-header-search-btn {
    background-color: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

html.dark-mode .th-theme-toggle-btn:hover,
html.dark-mode .th-header-search-btn:hover {
    background-color: #2e1065 !important;
    border-color: #8b5cf6 !important;
    color: #c4b5fd !important;
}

/* Content Cards trong Dark Mode */
html.dark-mode .th-post-card,
html.dark-mode .th-tool-card,
html.dark-mode .th-resource-card {
    background-color: #0f172a !important;
    border-color: #1e293b !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4) !important;
}

html.dark-mode .th-post-card:hover,
html.dark-mode .th-tool-card:hover,
html.dark-mode .th-resource-card:hover {
    border-color: #3b82f6 !important;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6), 0 0 15px -3px rgba(59, 130, 246, 0.2) !important;
}

/* Headings & Texts trong Card */
html.dark-mode .wp-block-post-title a,
html.dark-mode h1,
html.dark-mode h2,
html.dark-mode h3,
html.dark-mode h4 {
    color: #f8fafc !important;
}

html.dark-mode .wp-block-post-excerpt,
html.dark-mode .wp-block-post-date,
html.dark-mode .wp-block-post-author {
    color: #94a3b8 !important;
}

/* Badges phân loại */
html.dark-mode .wp-block-post-terms a {
    background-color: #172554 !important;
    color: #60a5fa !important;
}

/* Form Controls & Search Boxes */
html.dark-mode .wp-block-search__input,
html.dark-mode input[type="text"],
html.dark-mode input[type="search"],
html.dark-mode textarea {
    background-color: #1e293b !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

html.dark-mode .wp-block-search__input:focus,
html.dark-mode input:focus {
    border-color: #3b82f6 !important;
    outline: none;
}

/* Phân trang Pagination */
html.dark-mode .wp-block-query-pagination-numbers a,
html.dark-mode .wp-block-query-pagination-previous,
html.dark-mode .wp-block-query-pagination-next {
    background-color: #0f172a !important;
    border-color: #334155 !important;
    color: #f8fafc !important;
}

html.dark-mode .wp-block-query-pagination-numbers span.current {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
}

/* Footer trong Dark Mode */
html.dark-mode .th-site-footer {
    background-color: #070c1b !important;
    border-top-color: #1e293b !important;
}

html.dark-mode .th-footer-list a {
    color: #94a3b8 !important;
}

html.dark-mode .th-footer-list a:hover {
    color: #60a5fa !important;
}

html.dark-mode .th-footer-bottom-list a {
    color: #94a3b8 !important;
}

html.dark-mode .th-footer-bottom-list a:hover {
    color: #60a5fa !important;
}

html.dark-mode .th-format-filter-btn {
    background: #0f172a !important;
    border-color: #1e293b !important;
    color: #cbd5e1 !important;
}

html.dark-mode .th-format-filter-btn:hover {
    border-color: #3b82f6 !important;
    color: #60a5fa !important;
}

html.dark-mode .th-format-filter-btn.is-active {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #ffffff !important;
}

/* Catalog Tabs & Product Cards trong Dark Mode */
html.dark-mode .th-catalog-tab-btn {
    background: #0f172a !important;
    border-color: #1e293b !important;
    color: #cbd5e1 !important;
}

html.dark-mode .th-catalog-tab-btn:hover {
    background: #1e293b !important;
    border-color: #3b82f6 !important;
    color: #60a5fa !important;
}

html.dark-mode .th-catalog-tab-btn.is-active {
    background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
    color: #ffffff !important;
    border-color: transparent !important;
}

html.dark-mode .th-product-card {
    background: #0f172a !important;
    border-color: #1e293b !important;
}

html.dark-mode .th-product-card:hover {
    border-color: #3b82f6 !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.6), 0 0 15px rgba(59, 130, 246, 0.25) !important;
}

html.dark-mode .th-product-cover {
    background: #0b1120 !important;
}

html.dark-mode .th-product-cover.cat-ai-tool { background: linear-gradient(135deg, #1e1035, #0f172a) !important; }
html.dark-mode .th-product-cover.cat-software { background: linear-gradient(135deg, #0c2340, #0f172a) !important; }
html.dark-mode .th-product-cover.cat-game { background: linear-gradient(135deg, #062e24, #0f172a) !important; }
html.dark-mode .th-product-cover.cat-device { background: linear-gradient(135deg, #331508, #0f172a) !important; }

html.dark-mode .th-badge-top-left {
    background: rgba(15, 23, 42, 0.85) !important;
}

html.dark-mode .th-badge-bottom-right {
    background: rgba(15, 23, 42, 0.9) !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

html.dark-mode .th-product-title {
    color: #f8fafc !important;
}

html.dark-mode .th-product-platform-pill {
    background: #1e293b !important;
    color: #94a3b8 !important;
    border-color: #334155 !important;
}

html.dark-mode .th-product-actions {
    background: #090e1a !important;
    border-top-color: #1e293b !important;
}

html.dark-mode .th-btn-secondary-review {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}

html.dark-mode .th-btn-secondary-review:hover {
    background: #273549 !important;
    border-color: #3b82f6 !important;
    color: #60a5fa !important;
}

/* Single Product Review Hero & Balanced 2-Column Single Tool trong Dark Mode */
html.dark-mode .th-single-header-card {
    background: #0f172a !important;
    border-color: #1e293b !important;
}

html.dark-mode .th-single-header-title {
    color: #f8fafc !important;
}

html.dark-mode .th-single-header-score-card {
    background: #0b1120 !important;
    border-color: #1e293b !important;
}

html.dark-mode .th-single-app-icon {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

html.dark-mode .th-single-app-icon.cat-ai-tool { background: linear-gradient(135deg, #2e1065, #1e1b4b) !important; }
html.dark-mode .th-single-app-icon.cat-software { background: linear-gradient(135deg, #0c2340, #172554) !important; }
html.dark-mode .th-single-app-icon.cat-game { background: linear-gradient(135deg, #062e24, #064e3b) !important; }
html.dark-mode .th-single-app-icon.cat-device { background: linear-gradient(135deg, #431407, #3b1d11) !important; }

html.dark-mode .th-single-verdict-box {
    background: rgba(30, 41, 59, 0.7) !important;
    border-color: rgba(59, 130, 246, 0.3) !important;
    border-left-color: #3b82f6 !important;
}

html.dark-mode .th-single-verdict-text {
    color: #e2e8f0 !important;
}

html.dark-mode .th-sticky-action-card {
    background: #0f172a !important;
    border-color: #1e293b !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
}

html.dark-mode .th-sticky-price-box {
    background: #0b1120 !important;
    border-color: #1e293b !important;
}

html.dark-mode .th-sticky-price-val {
    color: #f8fafc !important;
}

html.dark-mode .th-sticky-spec-val {
    color: #f1f5f9 !important;
}

html.dark-mode .th-sticky-specs-list {
    border-top-color: #1e293b !important;
}

html.dark-mode .th-sticky-disclaimer {
    border-top-color: #334155 !important;
    color: #94a3b8 !important;
}

html.dark-mode .th-single-product-hero {
    background: #0f172a !important;
    border-color: #1e293b !important;
}

html.dark-mode .th-single-visual-col {
    background: #070c1b !important;
    border-color: #1e293b !important;
}

html.dark-mode .th-single-title {
    color: #f8fafc !important;
}

html.dark-mode .th-single-action-box {
    background: #090e1a !important;
    border-color: #2563eb !important;
}


