/*
 * Dark New final palette bridge.
 * Geometry is owned by the shared Light/Dark system; this file only resolves
 * visual tokens for the active dark surface and content states.
 */

body.theme-dark-new.theme-dark[data-theme-area="frontend"] {
    --new-bg: #0b0f17 !important;
    --new-surface: #141a26 !important;
    --new-surface-raised: #1b2331 !important;
    --new-surface-muted: #0f141e !important;
    --new-surface-sunken: #080b12 !important;
    --new-ink: #e7edf6 !important;
    --new-muted: #93a1b8 !important;
    --new-line: #293548 !important;
    --new-line-strong: #3a4960 !important;
    --new-accent: #4f8cff !important;
    --new-accent-strong: #80adff !important;
    --new-accent-soft: rgb(79 140 255 / 16%) !important;
    --new-focus: #80adff !important;
    --ink: #e7edf6 !important;
    --ink-2: #cdd7e6 !important;
    --ink-3: #aab6c9 !important;
    --ink-muted: #93a1b8 !important;
    /* Without this, `--muted` fell back to light's #64748b — 3.7:1 on
       `--surface`, below AA for body text. It follows the theme's own muted
       ink instead: 6.7:1 on `--surface`, 6.9:1 on `--canvas`. */
    --muted: var(--ink-muted) !important;
    --ink-faint: #6c7890 !important;
    --canvas: #0b0f17 !important;
    --surface: #141a26 !important;
    --surface-alt: #1b2331 !important;
    --surface-raised: #1b2331 !important;
    --surface-sunken: #080b12 !important;
    --surface-muted: #1b2331 !important;
    --surface-soft: #161d2b !important;
    --surface-glass: rgb(11 15 23 / 86%) !important;
    --border: #293548 !important;
    --border-strong: #3a4960 !important;
    --border-focus: #80adff !important;
    --accent: #4f8cff !important;
    --accent-hover: #80adff !important;
    --accent-soft: rgb(79 140 255 / 16%) !important;
    --primary: #4f8cff !important;
    --df-system-primary: #4f8cff !important;
    --md-accent: #4f8cff !important;
    --md-accent-2: #62c6e6 !important;
    --df-md-accent: #4f8cff !important;
    --positive: #45d6a0 !important;
    --positive-soft: rgb(69 214 160 / 14%) !important;
    --warning: #f1be61 !important;
    --warning-soft: rgb(241 190 97 / 14%) !important;
    --negative: #ff7e8b !important;
    --negative-soft: rgb(255 126 139 / 14%) !important;
    --link: var(--accent-hover) !important;
    --df-link: var(--accent-hover) !important;
    --md-panel: var(--surface) !important;
    --md-panel-strong: var(--surface-raised) !important;
    --md-page-bg: var(--canvas) !important;
    /* Community module tokens: must beat light-new's non-important overrides
       (the dark preview body carries both theme classes). */
    --community-ink: #e7edf6 !important;
    --community-muted: #93a1b8 !important;
    --community-line: #293548 !important;
    --community-surface: #141a26 !important;
    --community-surface-alt: #1b2331 !important;
    --community-border: #293548 !important;
}

/* light-new ships a legacy V1 community block scoped to .community-page that
   also matches dark-new (dark-new body carries theme-light-new + theme-light).
   Re-assert the dark palette on .community-page with higher specificity +
   !important so the metric strip / feed text stay legible on dark surfaces. */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] .community-page {
    --community-ink: #e7edf6 !important;
    --community-muted: #93a1b8 !important;
    --community-line: #293548 !important;
    --community-surface: #141a26 !important;
    --community-surface-alt: #1b2331 !important;
    --community-border: #293548 !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .dfb-header,
    .dfb-header-inner,
    .dfb-footer,
    .dfb-user-menu-popover,
    .dfb-theme-switcher-menu,
    .dfb-mobile-menu,
    .breadcrumb-bar,
    .breadcrumbs,
    .page-head,
    .page-head-compact,
    .section-head,
    .panel-head,
    .catalog-head,
    .df-filter-bar,
    .query-bar,
    .query-bar-light,
    .compact-query-bar
) {
    background-color: var(--surface);
    border-color: var(--border);
    color: var(--ink);
}

/* Home/entry surfaces are authored in the shared light stylesheet. Rebind
 * their paint only; their grid, sizing and responsive behavior stay shared. */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .df26-hero,
    .df26-hero-side,
    .df26-console,
    .df26-terminal,
    .df26-search-shell,
    .df26-search-main,
    .df26-hero-logo-side,
    .df-typewriter-panel
) {
    background: var(--surface) !important;
    background-color: var(--surface) !important;
    border-color: var(--border);
    color: var(--ink);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .df-hero-logo-live,
    .df-typewriter-panel,
    .search-shell,
    .home-search-shell,
    .search-main,
    .home-search-main,
    .search-input-wrap,
    .search-target-wrap
) {
    background: var(--surface) !important;
    border-color: var(--border) !important;
    color: var(--ink-2);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .df26-hero-title,
    .df26-hero-lead,
    .df26-console h1,
    .df26-console h2,
    .df26-console p,
    .df-typewriter-word,
    .df-typewriter-word-ghost
) {
    color: var(--ink);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .df26-search-shell .search-input-wrap,
    .df26-search-shell .search-target-wrap,
    .df26-search-shell .form-control,
    .df26-search-shell .form-select,
    .df26-search-shell input,
    .df26-search-shell select,
    .dfb-theme-switcher-toggle,
    .search-shell .form-control,
    .search-shell .form-select,
    .search-shell input,
    .search-shell select
) {
    background: var(--surface-sunken) !important;
    background-color: var(--surface-sunken) !important;
    border-color: var(--border-strong);
    color: var(--ink-2);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .search-target-wrap,
    .search-target,
    .home-search-target,
    .search-target-label
) {
    background-color: var(--surface-sunken) !important;
    border-color: var(--border-strong) !important;
    color: var(--ink-2) !important;
}

/* Wiki uses the shared library search form rather than the home search
 * shell. Keep its controls on the same dark surface so document pages do
 * not inherit the light form paint from the shared system stylesheet. */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .wiki-library-search,
    .wiki-library-search .form-control,
    .wiki-library-search input,
    .wiki-library-search select
) {
    background-color: var(--surface-sunken) !important;
    border-color: var(--border-strong) !important;
    color: var(--ink-2) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] .wiki-library-search input::placeholder {
    color: var(--ink-muted) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .dfb-theme-switcher-toggle,
    .dfb-theme-switcher-current-label,
    .dfb-theme-switcher-caret
) {
    color: var(--ink-2) !important;
}

/* The shared markdown system scopes its own light reading tokens on
 * `.prose`; rebind those local tokens here instead of changing typography or
 * document spacing. This keeps Wiki and every other markdown surface legible
 * in dark mode. */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .prose,
    .prose-reading,
    .wiki-docs-prose
) {
    --md-ink: var(--ink-2) !important;
    --md-ink-soft: var(--ink-3) !important;
    --md-ink-muted: var(--ink-muted) !important;
    --md-line: var(--border-strong) !important;
    --md-line-soft: var(--border) !important;
    --md-panel: var(--surface) !important;
    --md-panel-strong: var(--surface-raised) !important;
    color: var(--ink-2) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .prose,
    .prose-reading,
    .wiki-docs-prose
) :is(p, li, dt, dd, blockquote, td, th) {
    color: var(--ink-2) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .prose,
    .prose-reading,
    .wiki-docs-prose
) :is(h1, h2, h3, h4, h5, h6, strong) {
    color: var(--ink) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .prose,
    .prose-reading,
    .wiki-docs-prose
) em {
    color: var(--ink-3) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .dfb-theme-switcher-toggle:hover,
    .dfb-theme-switcher-toggle:focus-visible
) {
    background-color: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent-hover);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .dfb-header,
    .dfb-footer,
    .dfb-user-menu-popover,
    .dfb-theme-switcher-menu,
    .dfb-mobile-menu,
    .breadcrumb-bar,
    .breadcrumbs,
    .page-head,
    .page-head-compact
) a {
    color: var(--accent-hover);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .dfb-theme-switcher-item,
    .dfb-user-menu-popover a,
    .dfb-user-menu-popover button,
    .dropdown-item
) {
    color: var(--ink-2);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .dfb-theme-switcher-item:hover,
    .dfb-theme-switcher-item.is-active,
    .dfb-user-menu-popover a:hover,
    .dfb-user-menu-popover button:hover,
    .dropdown-item:hover
) {
    background-color: var(--accent-soft);
    color: var(--accent-hover);
}

/* Three rules stood here for the tab strips: `.leaderboard-period-tabs`,
   `.segmented-control`, `.community-tabs` and `.community-filter-chips`. None
   of the four is rendered by any view, script or command — the leaderboard's
   period tabs became the text tab strip in competition-index.css and the
   community's became `.community-period-tabs` — so the rules styled nothing
   in either theme. Removed rather than left inert, because the duplicate set
   below existed only to out-specify them. */

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .alert-info,
    .notice-info,
    .registration-access-notice
) {
    background-color: var(--accent-soft);
    border-color: var(--border);
    color: var(--ink-2);
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(.alert-danger, .notice-danger) {
    background-color: var(--negative-soft);
    border-color: rgb(255 126 139 / 42%);
    color: #ffb8c0;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .meta-tag,
    .recommended-mark,
    .status-text,
    .df-meta) {
    color: var(--accent-hover);
}

/* ============================================================
   Hard override for controls the inherited "new structure" layer
   (light-new/refined.css) still paints white with !important.
   This file loads last in the chain, and these rules add !important
   on top of the already-higher body+attr+class specificity, so they
   defeat the light layer's explicit #ffffff / #eef1f6 paint.
   Geometry stays owned by the shared system — only tokens/colors
   are rebinding here, keeping layout identical to light mode.
   ============================================================ */

/* Page canvas + base ink (light-new sets body background !important). */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] {
    background-color: var(--canvas) !important;
    color: var(--ink) !important;
}

/* Generic text-like form controls: auth (login/register/2FA/forgot),
 * feedback, writeup/VDitor, and any other Bootstrap .form-control. */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .form-control,
    .form-select,
    textarea,
    textarea.form-control,
    input.form-control,
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="search"],
    input[type="url"],
    input[type="tel"],
    input[type="number"],
    input[type="date"],
    select
) {
    background-color: var(--surface-sunken) !important;
    border-color: var(--border-strong) !important;
    color: var(--ink) !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .form-control,
    .form-select,
    textarea,
    input
)::placeholder {
    color: var(--ink-muted) !important;
    opacity: 1 !important;
}

body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .form-control,
    .form-select,
    textarea,
    input
):focus,
body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .form-control,
    .form-select,
    textarea,
    input
).is-focused {
    background-color: var(--surface-sunken) !important;
    border-color: var(--accent) !important;
    color: var(--ink) !important;
    box-shadow: 0 0 0 3px var(--accent-soft) !important;
}

/* Card / panel surfaces the light layer paints white. */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] :is(
    .auth-panel,
    .df26-auth-panel,
    .df-panel,
    .workspace-panel,
    .writeup-card,
    .card,
    .info-block,
    .q-card,
    .stat-card,
    .modal-content,
    .dropdown-menu,
    .dfb-user-menu-popover,
    .dfb-mobile-menu,
    .dfb-theme-switcher-menu
) {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
    color: var(--ink) !important;
}

/* Explicit surface enforcement for the theme switcher popover
 * (already in the grouped rule above, repeated for certainty). */
body.theme-dark-new.theme-dark[data-theme-area="frontend"] .dfb-theme-switcher-menu {
    background-color: var(--surface) !important;
    border-color: var(--border) !important;
}

/* The `!important` twins of the three tab-strip rules above are gone with
   them. They existed to defeat light's #ffffff paint on classes neither theme
   renders. */
