/* ── Decree — site-wide dark mode ─────────────────────────────────────────────
   Loaded on every front-end page by Decree_Lex_AI_Theme. Every rule is keyed
   off <html data-lex-theme="dark">, which the inline head script sets from the
   Appearance choice in the Lex AI Settings menu, so Light (the default) is
   untouched.

   Most of the rules mirror Twenty Twenty's customizer colour block
   (twentytwenty-style-inline-css): content group, header/footer group,
   accent, borders. The html[...] prefix out-ranks those selectors, so load
   order does not matter. */

html[data-lex-theme="dark"] {
  color-scheme: dark;
  --site-bg: #0f172a;
  --site-surface: #162033;
  --site-surface-2: #1e293b;
  --site-border: #2a3649;
  --site-border-strong: #3b4a61;
  --site-text: #e2e8f0;
  --site-text-strong: #f8fafc;
  --site-text-2: #a3b1c4;
  --site-accent: #cb3915;
  --site-accent-text: #f0805e;
  --site-accent-text-hover: #f6a587;
  --site-on-accent: #ffffff;
  background-color: var(--site-bg);
}

/* ── Content group ───────────────────────────────────────────────────────── */

html[data-lex-theme="dark"] body,
html[data-lex-theme="dark"] body.custom-background {
  background-color: var(--site-bg);
  color: var(--site-text);
}

html[data-lex-theme="dark"] body,
html[data-lex-theme="dark"] .entry-title a,
html[data-lex-theme="dark"] .has-primary-color,
html[data-lex-theme="dark"] h1, html[data-lex-theme="dark"] h2,
html[data-lex-theme="dark"] h3, html[data-lex-theme="dark"] h4,
html[data-lex-theme="dark"] h5, html[data-lex-theme="dark"] h6 {
  color: var(--site-text-strong);
}

html[data-lex-theme="dark"] .entry-content,
html[data-lex-theme="dark"] .entry-content p,
html[data-lex-theme="dark"] .entry-content li,
html[data-lex-theme="dark"] .entry-content td,
html[data-lex-theme="dark"] .entry-content th {
  color: var(--site-text);
}

html[data-lex-theme="dark"] a,
html[data-lex-theme="dark"] .color-accent,
html[data-lex-theme="dark"] .has-drop-cap:not(:focus):first-letter,
html[data-lex-theme="dark"] .wp-block-button.is-style-outline {
  color: var(--site-accent-text);
}
html[data-lex-theme="dark"] a:hover,
html[data-lex-theme="dark"] a:focus,
html[data-lex-theme="dark"] .color-accent-hover:hover,
html[data-lex-theme="dark"] .color-accent-hover:focus {
  color: var(--site-accent-text-hover);
}

html[data-lex-theme="dark"] cite,
html[data-lex-theme="dark"] figcaption,
html[data-lex-theme="dark"] .wp-caption-text,
html[data-lex-theme="dark"] .post-meta,
html[data-lex-theme="dark"] .post-meta a,
html[data-lex-theme="dark"] .entry-content .wp-block-archives li,
html[data-lex-theme="dark"] .entry-content .wp-block-categories li,
html[data-lex-theme="dark"] .entry-content .wp-block-latest-posts li,
html[data-lex-theme="dark"] .wp-block-latest-comments__comment-date,
html[data-lex-theme="dark"] .wp-block-latest-posts__post-date,
html[data-lex-theme="dark"] .wp-block-embed figcaption,
html[data-lex-theme="dark"] .wp-block-image figcaption,
html[data-lex-theme="dark"] .wp-block-pullquote cite,
html[data-lex-theme="dark"] .comment-metadata,
html[data-lex-theme="dark"] .comment-respond .comment-notes,
html[data-lex-theme="dark"] .comment-respond .logged-in-as,
html[data-lex-theme="dark"] .pagination .dots,
html[data-lex-theme="dark"] .entry-content hr:not(.has-background),
html[data-lex-theme="dark"] hr.styled-separator,
html[data-lex-theme="dark"] .has-secondary-color {
  color: var(--site-text-2);
}

/* Page/post title band and archive header (white in light). */
html[data-lex-theme="dark"] .archive-header,
html[data-lex-theme="dark"] .singular .entry-header,
html[data-lex-theme="dark"] .singular .featured-media:before,
html[data-lex-theme="dark"] .wp-block-pullquote:before {
  background-color: var(--site-surface);
}

html[data-lex-theme="dark"] blockquote,
html[data-lex-theme="dark"] .border-color-accent {
  border-color: var(--site-accent);
}

html[data-lex-theme="dark"] pre,
html[data-lex-theme="dark"] fieldset,
html[data-lex-theme="dark"] input,
html[data-lex-theme="dark"] textarea,
html[data-lex-theme="dark"] select,
html[data-lex-theme="dark"] table,
html[data-lex-theme="dark"] table *,
html[data-lex-theme="dark"] hr {
  border-color: var(--site-border);
}

html[data-lex-theme="dark"] caption,
html[data-lex-theme="dark"] code,
html[data-lex-theme="dark"] kbd,
html[data-lex-theme="dark"] samp,
html[data-lex-theme="dark"] pre,
html[data-lex-theme="dark"] .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
html[data-lex-theme="dark"] .has-subtle-background-background-color {
  background-color: var(--site-surface-2);
  color: var(--site-text);
}
/* WordPress's colour-preset classes are !important, so these must be too. */
html[data-lex-theme="dark"] .has-subtle-background-background-color { background-color: var(--site-surface-2) !important; }

html[data-lex-theme="dark"] .has-background-background-color { background-color: var(--site-bg) !important; }
html[data-lex-theme="dark"] .has-primary-background-color { background-color: var(--site-text-strong) !important; }

/* Block-editor colour settings. Light fills picked in the editor (the White
   palette swatch, or a custom #f…/#fff… value written inline) become a raised
   surface, and dark text colours picked for them become body text. Saturated
   brand fills are left alone. */
html[data-lex-theme="dark"] .has-white-background-color,
html[data-lex-theme="dark"] .has-background[style*="background-color:#f" i],
html[data-lex-theme="dark"] .has-background[style*="background-color: #f" i],
html[data-lex-theme="dark"] .has-background[style*="background-color:white" i],
html[data-lex-theme="dark"] .has-background[style*="background-color:rgb(255" i] {
  background-color: var(--site-surface) !important;
}
html[data-lex-theme="dark"] .has-black-color,
html[data-lex-theme="dark"] .has-text-color[style*="color:#0"],
html[data-lex-theme="dark"] .has-text-color[style*="color:#1"],
html[data-lex-theme="dark"] .has-text-color[style*="color:#2"],
html[data-lex-theme="dark"] .has-text-color[style*="color:#3"],
html[data-lex-theme="dark"] .has-text-color[style*="color:#4"],
html[data-lex-theme="dark"] .has-text-color[style*="color:black" i] {
  color: var(--site-text) !important;
}

/* Forms (Twenty Twenty paints inputs white and selects with a dark arrow). */
html[data-lex-theme="dark"] input[type="text"],
html[data-lex-theme="dark"] input[type="email"],
html[data-lex-theme="dark"] input[type="password"],
html[data-lex-theme="dark"] input[type="search"],
html[data-lex-theme="dark"] input[type="tel"],
html[data-lex-theme="dark"] input[type="url"],
html[data-lex-theme="dark"] input[type="number"],
html[data-lex-theme="dark"] input[type="date"],
html[data-lex-theme="dark"] textarea,
html[data-lex-theme="dark"] select {
  background-color: var(--site-surface-2);
  color: var(--site-text);
  border-color: var(--site-border-strong);
}
html[data-lex-theme="dark"] ::placeholder { color: var(--site-text-2); opacity: 1; }

/* Buttons keep the brand fill; only the text colour needs pinning. */
html[data-lex-theme="dark"] button:not(.toggle),
html[data-lex-theme="dark"] .button,
html[data-lex-theme="dark"] .faux-button,
html[data-lex-theme="dark"] .wp-block-button__link,
html[data-lex-theme="dark"] input[type="button"],
html[data-lex-theme="dark"] input[type="reset"],
html[data-lex-theme="dark"] input[type="submit"] {
  color: var(--site-on-accent);
}

/* ── Header / footer group ───────────────────────────────────────────────── */

html[data-lex-theme="dark"] #site-header,
html[data-lex-theme="dark"] .footer-nav-widgets-wrapper,
html[data-lex-theme="dark"] #site-footer,
html[data-lex-theme="dark"] .menu-modal,
html[data-lex-theme="dark"] .menu-modal-inner,
html[data-lex-theme="dark"] .search-modal-inner {
  background-color: var(--site-surface);
}

html[data-lex-theme="dark"] .header-footer-group,
html[data-lex-theme="dark"] body:not(.overlay-header) #site-header .toggle,
html[data-lex-theme="dark"] .menu-modal .toggle,
html[data-lex-theme="dark"] .header-footer-group h1,
html[data-lex-theme="dark"] .header-footer-group h2,
html[data-lex-theme="dark"] .header-footer-group h3,
html[data-lex-theme="dark"] .header-footer-group .widget-title {
  color: var(--site-text);
}

html[data-lex-theme="dark"] body:not(.overlay-header) .primary-menu > li > a,
html[data-lex-theme="dark"] body:not(.overlay-header) .primary-menu > li > .icon,
html[data-lex-theme="dark"] .modal-menu a,
html[data-lex-theme="dark"] .footer-menu a,
html[data-lex-theme="dark"] .footer-widgets a:where(:not(.wp-block-button__link)),
html[data-lex-theme="dark"] #site-footer .wp-block-button.is-style-outline,
html[data-lex-theme="dark"] .wp-block-pullquote:before,
html[data-lex-theme="dark"] .singular:not(.overlay-header) .entry-header a,
html[data-lex-theme="dark"] .archive-header .archive-title-prefix,
html[data-lex-theme="dark"] .header-footer-group .color-accent,
html[data-lex-theme="dark"] .header-footer-group .color-accent-hover:hover {
  color: var(--site-accent-text);
}

/* Dropdown sub-menus are black in light; a raised surface in dark. */
html[data-lex-theme="dark"] body:not(.overlay-header) .primary-menu ul {
  background-color: var(--site-surface-2);
  color: var(--site-text);
}
html[data-lex-theme="dark"] body:not(.overlay-header) .primary-menu ul a { color: var(--site-text); }
html[data-lex-theme="dark"] body:not(.overlay-header) .primary-menu > li > ul:after {
  border-bottom-color: var(--site-surface-2);
}
html[data-lex-theme="dark"] body:not(.overlay-header) .primary-menu ul ul:after {
  border-left-color: var(--site-surface-2);
}

html[data-lex-theme="dark"] .site-description,
html[data-lex-theme="dark"] body:not(.overlay-header) .toggle-inner .toggle-text,
html[data-lex-theme="dark"] .widget .post-date,
html[data-lex-theme="dark"] .widget .rss-date,
html[data-lex-theme="dark"] .widget_archive li,
html[data-lex-theme="dark"] .widget_categories li,
html[data-lex-theme="dark"] .widget cite,
html[data-lex-theme="dark"] .widget_pages li,
html[data-lex-theme="dark"] .widget_meta li,
html[data-lex-theme="dark"] .widget_nav_menu li,
html[data-lex-theme="dark"] .powered-by-wordpress,
html[data-lex-theme="dark"] .footer-credits .privacy-policy,
html[data-lex-theme="dark"] .to-the-top,
html[data-lex-theme="dark"] .singular .entry-header .post-meta,
html[data-lex-theme="dark"] .singular:not(.overlay-header) .entry-header .post-meta a {
  color: var(--site-text-2);
}

html[data-lex-theme="dark"] .header-footer-group pre,
html[data-lex-theme="dark"] .header-footer-group fieldset,
html[data-lex-theme="dark"] .header-footer-group input,
html[data-lex-theme="dark"] .header-footer-group textarea,
html[data-lex-theme="dark"] .header-footer-group table,
html[data-lex-theme="dark"] .header-footer-group table *,
html[data-lex-theme="dark"] .footer-nav-widgets-wrapper,
html[data-lex-theme="dark"] #site-footer,
html[data-lex-theme="dark"] .menu-modal nav *,
html[data-lex-theme="dark"] .footer-widgets-outer-wrapper,
html[data-lex-theme="dark"] .footer-top {
  border-color: var(--site-border);
}
html[data-lex-theme="dark"] body:not(.overlay-header) .header-inner .toggle-wrapper::before {
  background-color: var(--site-border);
}

/* Search overlay: Twenty Twenty dims the page with a near-black veil. */
html[data-lex-theme="dark"] .search-modal { background: rgba(0, 0, 0, 0.6); }
html[data-lex-theme="dark"] .search-modal form { color: var(--site-text); }

/* Dark-ink logo: invert lightness, keep the orange. */
html[data-lex-theme="dark"] .site-logo img,
html[data-lex-theme="dark"] .custom-logo {
  filter: invert(1) hue-rotate(180deg);
}

/* ── Plugins that sit in page content ────────────────────────────────────── */

/* MemberPress forms are boxed in white by the site's custom CSS. */
html[data-lex-theme="dark"] .mepr-form {
  background-color: var(--site-surface);
  color: var(--site-text);
}

/* Jetpack Instant Search overlay (the header's Search button). It ships a
   light theme only; recolour its results panel. */
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-results,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay #jetpack-instant-search__overlay-focus-anchor {
  background-color: var(--site-surface);
  color: var(--site-text);
}
html[data-lex-theme="dark"] .jetpack-instant-search__overlay,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-result,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-results-wrapper,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-filter-list-label,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__widget-area,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-result-minimal-content,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__box-gridicon {
  color: var(--site-text);
}
html[data-lex-theme="dark"] .jetpack-instant-search__overlay a,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-sort-option,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-sort-option.is-selected {
  color: var(--site-accent-text);
}
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-sort-separator,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-results-filter-button,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__scroll-button,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-result-minimal-cats,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-result-minimal-tags {
  color: var(--site-text-2);
}
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-result,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-results-controls,
html[data-lex-theme="dark"] .jetpack-instant-search__overlay .jetpack-instant-search__search-filters {
  border-color: var(--site-border);
}
html[data-lex-theme="dark"] .jetpack-instant-search__overlay mark {
  background-color: rgba(240, 128, 94, 0.25);
  color: var(--site-text-strong);
}

/* Jetpack prints its "highlight colour" setting after this file with a more
   specific selector. */
html[data-lex-theme="dark"] .jetpack-instant-search .jetpack-instant-search__search-results mark {
  background-color: rgba(240, 128, 94, 0.28) !important;
  color: var(--site-text-strong) !important;
}

/* ── arabic.decree.om Additional CSS ─────────────────────────────────────────
   Its Qanoon-style customizer CSS forces heading/title links black and meta
   text #666, both !important; restate them for dark. */
html[data-lex-theme="dark"][lang^="ar"] .entry-title a,
html[data-lex-theme="dark"][lang^="ar"] .post-title a,
html[data-lex-theme="dark"][lang^="ar"] .archive-title a,
html[data-lex-theme="dark"][lang^="ar"] h1 a,
html[data-lex-theme="dark"][lang^="ar"] h2 a,
html[data-lex-theme="dark"][lang^="ar"] h3 a {
  color: var(--site-text-strong) !important;
}
html[data-lex-theme="dark"][lang^="ar"] .entry-meta,
html[data-lex-theme="dark"][lang^="ar"] .post-meta,
html[data-lex-theme="dark"][lang^="ar"] .entry-date,
html[data-lex-theme="dark"][lang^="ar"] .posted-on,
html[data-lex-theme="dark"][lang^="ar"] time,
html[data-lex-theme="dark"][lang^="ar"] .meta-wrapper {
  color: var(--site-text-2) !important;
}