:root { --stt-page-bg:#fff; --stt-page-text:#171717; }
/* Original, CSS-based theme approach: no DOM-wide color rewriting or inline-style snapshots. */
html.stt-dark-mode,
html.stt-dark-mode body {
  background-color: var(--stt-page-bg) !important;
  color: var(--stt-page-text) !important;
}
html.stt-dark-mode body,
html.stt-dark-mode body :where(main, article, section, header, footer, nav, aside, .site, .site-content, .site-main, .content-area, .entry-content, .wp-site-blocks, .wp-block-group, .wp-block-cover, .elementor, .elementor-section, .elementor-widget-wrap) {
  background-color: var(--stt-page-bg);
  color: var(--stt-page-text);
}
html.stt-dark-mode body :where(p, li, dt, dd, blockquote, label, figcaption, h1, h2, h3, h4, h5, h6, strong, em, small) { color: var(--stt-page-text); }
html.stt-dark-mode body :where(a:not(.stt-toggle), .entry-content a) { color: inherit; }
html.stt-dark-mode body :where(input, textarea, select) { background-color: var(--stt-page-bg); color: var(--stt-page-text); }
/* Media are not filtered or color-adjusted. */
html.stt-dark-mode img, html.stt-dark-mode video, html.stt-dark-mode iframe, html.stt-dark-mode canvas, html.stt-dark-mode picture, html.stt-dark-mode svg:not(.stt-icon) { color: initial; }
/* Current moon button retained from v3.1 */
.stt-toggle{position:fixed;z-index:999999;display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;padding:0;border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;mix-blend-mode:difference;font:inherit;line-height:1;cursor:pointer;box-shadow:none!important;appearance:none;-webkit-appearance:none}
.stt-toggle:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.stt-toggle.stt-bottom-right{right:22px;bottom:10px}.stt-toggle.stt-bottom-left{left:22px;bottom:10px}.stt-toggle.stt-bottom-center{left:50%;bottom:10px;transform:translateX(-50%)}.stt-toggle.stt-top-right{right:22px;top:22px}.stt-toggle.stt-top-left{left:22px;top:22px}
.stt-icon{display:block;width:46px;height:46px;flex:0 0 46px;transform:rotate(45deg)}.stt-icon path{fill:transparent;transition:fill .16s ease}.stt-toggle:hover .stt-icon path,.stt-toggle:focus-visible .stt-icon path{fill:currentColor}
@media(max-width:800px){.stt-toggle{display:none!important}}
@media(prefers-reduced-motion:reduce){.stt-icon path{transition:none}}


/* v4.1: keep link hover contrast and common typing/animated headline elements in sync */
html.stt-dark-mode body a:hover,
html.stt-dark-mode body a:focus,
html.stt-dark-mode body a:active,
html.stt-dark-mode body a:hover *,
html.stt-dark-mode body a:focus *,
html.stt-dark-mode body a:active * {
  color: var(--stt-page-text) !important;
}

/* Typing effects often render text in nested spans or dedicated plugin wrappers. */
html.stt-dark-mode body .typed,
html.stt-dark-mode body .typed-cursor,
html.stt-dark-mode body .typed-text,
html.stt-dark-mode body .typewrite,
html.stt-dark-mode body .typing,
html.stt-dark-mode body .typing-text,
html.stt-dark-mode body .elementor-headline-plain-text,
html.stt-dark-mode body .elementor-headline-dynamic-text,
html.stt-dark-mode body .elementor-headline-dynamic-wrapper,
html.stt-dark-mode body .cd-words-wrapper,
html.stt-dark-mode body [class*="typed"],
html.stt-dark-mode body [class*="typing"],
html.stt-dark-mode body [class*="typewrite"] {
  color: var(--stt-page-text) !important;
}


/* v4.2: preserve Final Tiles Gallery caption colors in dark mode */
html.stt-dark-mode body .ftg-caption,
html.stt-dark-mode body .ftg-caption *,
html.stt-dark-mode body .final-tiles-gallery .caption,
html.stt-dark-mode body .final-tiles-gallery .caption *,
html.stt-dark-mode body .final-tiles-gallery .tile-caption,
html.stt-dark-mode body .final-tiles-gallery .tile-caption *,
html.stt-dark-mode body .ftg-items .caption,
html.stt-dark-mode body .ftg-items .caption * {
  color: inherit !important;
}


/* v4.3: Final Tiles Gallery captions are deliberately outside the dark-mode text rules.
   Restore theme/plugin-provided caption colors and hover colors. */
html.stt-dark-mode body .final-tiles-gallery,
html.stt-dark-mode body .final-tiles-gallery *,
html.stt-dark-mode body .ftg-items,
html.stt-dark-mode body .ftg-items *,
html.stt-dark-mode body .ftg,
html.stt-dark-mode body .ftg * {
  color: revert !important;
}
html.stt-dark-mode body .final-tiles-gallery a:hover,
html.stt-dark-mode body .final-tiles-gallery a:hover *,
html.stt-dark-mode body .ftg-items a:hover,
html.stt-dark-mode body .ftg-items a:hover *,
html.stt-dark-mode body .ftg a:hover,
html.stt-dark-mode body .ftg a:hover * {
  color: revert !important;
}


/* v4.4: Final Tiles Gallery captions must remain black, including hover states. */
html.stt-dark-mode body .final-tiles-gallery .ftg-caption,
html.stt-dark-mode body .final-tiles-gallery .ftg-caption *,
html.stt-dark-mode body .final-tiles-gallery .caption,
html.stt-dark-mode body .final-tiles-gallery .caption *,
html.stt-dark-mode body .final-tiles-gallery .tile-caption,
html.stt-dark-mode body .final-tiles-gallery .tile-caption *,
html.stt-dark-mode body .ftg-items .ftg-caption,
html.stt-dark-mode body .ftg-items .ftg-caption *,
html.stt-dark-mode body .ftg-items .caption,
html.stt-dark-mode body .ftg-items .caption *,
html.stt-dark-mode body .ftg-items .tile-caption,
html.stt-dark-mode body .ftg-items .tile-caption *,
html.stt-dark-mode body .ftg .ftg-caption,
html.stt-dark-mode body .ftg .ftg-caption *,
html.stt-dark-mode body .ftg .caption,
html.stt-dark-mode body .ftg .caption *,
html.stt-dark-mode body .ftg .tile-caption,
html.stt-dark-mode body .ftg .tile-caption *,
html.stt-dark-mode body .final-tiles-gallery a:hover,
html.stt-dark-mode body .final-tiles-gallery a:hover *,
html.stt-dark-mode body .ftg-items a:hover,
html.stt-dark-mode body .ftg-items a:hover *,
html.stt-dark-mode body .ftg a:hover,
html.stt-dark-mode body .ftg a:hover * {
  color: #222222 !important;
}
