/**
 * Modalities — dark mode (reuses .gr-page / .mod-* shared layout)
 */

body.hh-ct-dark .gr-page,
html[data-hh-ct-dark-mode="dark"] .gr-page {
    --sv-border: rgba(255, 255, 255, 0.1);
    --sv-surface: #1e262e;
    --sv-ink: #eef2f6;
    --sv-text-muted: #9aa8b6;
    --sv-accent-soft: rgba(89, 211, 180, 0.14);
    --gr-accent: #6dd4c4;
    --gr-accent-soft: rgba(109, 212, 196, 0.16);
    --gr-surface: var(--sv-surface);
    --gr-border: var(--sv-border);
    --gr-text-muted: var(--sv-text-muted);
}

body.hh-ct-dark .gr-filters,
body.hh-ct-dark .gr-empty,
body.hh-ct-dark .mod-card,
body.hh-ct-dark .mod-grid .panel,
body.hh-ct-dark .mod-type-nav {
    background: var(--sv-surface) !important;
    border-color: var(--sv-border) !important;
    color: var(--sv-ink);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28) !important;
}

body.hh-ct-dark .gr-filters__title,
body.hh-ct-dark .mod-card__title,
body.hh-ct-dark .gr-page h1,
body.hh-ct-dark .gr-page h2,
body.hh-ct-dark .gr-page h3 {
    color: var(--sv-ink) !important;
}

body.hh-ct-dark .gr-filter-chip {
    background: #28323c !important;
    color: #c8d1da !important;
}

body.hh-ct-dark .gr-empty {
    background: #232c35 !important;
}

body.hh-ct-dark .mod-type-pill,
body.hh-ct-dark .gs-order-pill,
body.hh-ct-dark .gr-tier-pill {
    background: var(--sv-surface) !important;
    border-color: var(--sv-border) !important;
    color: var(--sv-ink) !important;
}

body.hh-ct-dark .mod-type-pill.is-active,
body.hh-ct-dark .gs-order-pill.is-active {
    background: linear-gradient(180deg, #1a2e2a, #1e262e) !important;
    border-color: var(--gr-accent) !important;
    color: #8aebd4 !important;
}

body.hh-ct-dark .gr-page .form-control,
body.hh-ct-dark .gr-page select {
    background-color: #171d24 !important;
    border-color: #404d5c !important;
    color: #eef2f6 !important;
}

body.hh-ct-dark .gr-page .panel,
body.hh-ct-dark .gr-page .panel-default,
body.hh-ct-dark .gr-page .panel-body,
body.hh-ct-dark .gr-page .panel-heading {
    background-color: var(--sv-surface) !important;
    border-color: var(--sv-border) !important;
    color: var(--sv-ink);
}

body.hh-ct-dark .gr-page .text-muted {
    color: var(--sv-text-muted) !important;
}

body.hh-ct-dark .gr-page a:not(.btn):not(.mod-type-pill) {
    color: #6dd4c4;
}

body.hh-ct-dark .mod-card__meta,
body.hh-ct-dark .mod-card__desc {
    color: var(--sv-text-muted) !important;
}