/* Dark mode v2 - public since 2026-10-13 (anonymous visitors, registered members, editors).
   History: began as an administrator-only test, which is why the machine name is dark_mode_admin_test.
   The name is kept on purpose so the history stays traceable. Do not delete it as a leftover test.
   Companion script: JS Injector "Dark mode toggle" (machine name dark_mode_toggle_admin_test). */
html[data-theme="dark"]{
  color-scheme:dark;
  --color-text:#e3e6e8; --color-text-light:#9fa8ae; --color-white:#13171a; --color-gray:#e3e6e8;
  --color-gray-900:#d3d7da; --color-gray-800:#bcc2c6; --color-gray-700:#a3abb0; --color-gray-600:#8d969c;
  --color-gray-500:#79838a; --color-gray-400:#5d676e; --color-gray-300:#454e54; --color-gray-200:#272e33;
  --color-gray-100:#20262a; --color-gray-050:#1a1f23; --color-gray-025:#13171a;
  --color-absolutezero:#7aa2ff; --color-absolutezero-hover:#9bb9ff; --color-absolutezero-active:#b5caff;
  --color-bgblue-hover:#1e2a44; --color-bgblue-active:#26365a;
  --vk-head:#262e34; --vk-alt:#1d2328; --vk-even:#12161a; --vk-border:#3a434a; --vk-neg:#ff7b7b;
}
html[data-theme="dark"] body,
html[data-theme="dark"] #page-wrapper,
html[data-theme="dark"] #header-nav,
html[data-theme="dark"] .layout-main-wrapper,
html[data-theme="dark"] .main-content{background-color:#0b0d0f;color:#e3e6e8}
html[data-theme="dark"] .text-content{color:#e3e6e8}
html[data-theme="dark"] .text-content :is(p,li,h1,h2,h3,h4,h5,h6,td,th,blockquote,figcaption,dd,dt):not(.ch5viz *){color:#e3e6e8}
html[data-theme="dark"] a:not(.ch5viz *){color:#8fb0ff}
html[data-theme="dark"] .text-content figure{background-color:transparent}
html[data-theme="dark"] .text-content img{filter:brightness(.9)}
/* tables: (A) legacy tables with inline !important colours cannot be overridden by CSS -> invert the whole table */
html[data-theme="dark"] .text-content table:not(.vk-table):not(.ch5viz table){filter:invert(.9) hue-rotate(180deg)}
html[data-theme="dark"] .text-content table:not(.vk-table):not(.ch5viz table) :is(td,th),html[data-theme="dark"] .text-content table:not(.vk-table):not(.ch5viz table) :is(td,th) :is(p,li,div,strong,em){color:#0e1619}
html[data-theme="dark"] .text-content table:not(.vk-table):not(.ch5viz table) a{color:#1a3a8f}
/* (B) new tables from convert_gutenberg.py (class vk-table) read these variables, no filter needed */
html[data-theme="dark"] .text-content table.vk-table{border-color:var(--vk-border) !important}
html[data-theme="dark"] input:not(.ch5viz *),html[data-theme="dark"] textarea:not(.ch5viz *),html[data-theme="dark"] select:not(.ch5viz *){background-color:#13171a;color:#e3e6e8;border-color:#3a434a}
/* toggle button */
#theme-toggle{position:fixed;right:16px;bottom:72px;z-index:9999;width:44px;height:44px;border-radius:50%;border:1px solid rgba(128,128,128,.5);background:#fff;color:#222;font-size:22px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center}
html[data-theme="dark"] #theme-toggle{background:#20262a;color:#e3e6e8}
#theme-toggle:focus-visible{outline:3px solid #26a769;outline-offset:2px}
#theme-toggle svg{display:block;pointer-events:none}

/* v3: remaining light blocks */
html[data-theme="dark"] #site-header__inner{background-color:#0b0d0f}
html[data-theme="dark"] .field--name-field-tags,
html[data-theme="dark"] .text-content figcaption,
html[data-theme="dark"] .tabs__link{background-color:#13171a !important;color:#e3e6e8}
html[data-theme="dark"] .tabs__link.is-active{background-color:#1a1f23 !important}

/* v4: Olivero text variables + chart headings */
html[data-theme="dark"]{--color-text-neutral-loud:#f0f2f3;--color-text-neutral-medium:#d3d7da;--color-text-neutral-soft:#9fa8ae;--color-text-primary-loud:#a9c2ff;--color-text-primary-medium:#8fb0ff}
html[data-theme="dark"] .ch5viz :is(h1,h2,h3,h4){color:var(--txt,#e8eaee)}

/* v5: chart headings readable in BOTH modes (Olivero heading colour was near-black on the chart's black) */
.ch5viz :is(h1,h2,h3,h4){color:var(--txt,#e8eaee)}
/* v5: Drupal contextual-links pencil button (editors only) */
html[data-theme="dark"] .contextual .trigger{background-color:#20262a;border-color:#3a434a;filter:invert(.88)}

/* v6: pager + price text */
html[data-theme="dark"] .pager__item{background-color:#13171a !important}
html[data-theme="dark"] .pager__item .pager__link{color:#8fb0ff}
html[data-theme="dark"] .field--name-field-price{color:#4cc46a !important}

/* v7: Olivero breadcrumb edge-fade (was fading to white) + price text in list views */
html[data-theme="dark"] .breadcrumb::after{background-image:linear-gradient(to right,rgba(11,13,15,0),#0b0d0f)}
html[data-theme="dark"] .views-field-field-price .field-content{color:#4cc46a !important}

/* v8: Gutenberg explicit black text */
html[data-theme="dark"] .text-content .has-black-color:not(.ch5viz *){color:#e3e6e8 !important}

/* inline highlight / grey background in older articles: keep the light fill, force dark text */
html[data-theme="dark"] .text-content :is(span,mark)[style*="background"]:not(table *):not(.ch5viz *){color:#0e1619}
html[data-theme="dark"] .text-content :is(span,mark)[style*="background"]:not(table *):not(.ch5viz *) :is(strong,em,b,i,span,u){color:#0e1619}
html[data-theme="dark"] .text-content :is(span,mark)[style*="background"]:not(table *):not(.ch5viz *) a{color:#1a3a8f}