/* FXPEDIA360 Dark Mode 0.1.14 — frontend only, no image inversion. */
html[data-fxp-theme="dark"] {
  --fxp-bg: #121417;
  --fxp-surface: #1c2026;
  --fxp-surface-raised: #252a32;
  --fxp-border: #373e48;
  --fxp-text: #f4f5f7;
  --fxp-muted: #bcc3cd;
  --fxp-accent: #fd9800;
  --fxp-accent-hover: #ffb13b;
  --fxp-button-text: #121417;
  --fxp-focus: #fd9800;
  color-scheme: dark;
}

html[data-fxp-theme="dark"] body,
html[data-fxp-theme="dark"] #page,
html[data-fxp-theme="dark"] .site,
html[data-fxp-theme="dark"] .site-content,
html[data-fxp-theme="dark"] .content-area,
html[data-fxp-theme="dark"] .site-main,
html[data-fxp-theme="dark"] .entry-content,
html[data-fxp-theme="dark"] .elementor-location-single,
html[data-fxp-theme="dark"] .elementor-location-archive {
  background-color: var(--fxp-bg);
  color: var(--fxp-text);
}

/* The homepage hero has a fixed cream Elementor background. Dark-mode text is
   intentionally light, so the section must switch with it to retain contrast. */
html[data-fxp-theme="dark"] .elementor-1438 .elementor-element.elementor-element-bf1bd47 {
  background-color: var(--fxp-bg) !important;
}

/* Keep the hero background and its text in the same visual state while the
   visitor toggles themes; Elementor otherwise transitions only the surface. */
.elementor-1438 .elementor-element.elementor-element-bf1bd47 {
  transition: none !important;
}

/* Homepage comparison/roadmap cards use a fixed white surface and the icon
   category labels use a fixed navy color. Match both to the dark palette. */
html[data-fxp-theme="dark"] .elementor-1438 .elementor-element-37f1744 {
  background-color: var(--fxp-bg) !important;
  background-image: none !important;
}

html[data-fxp-theme="dark"] .elementor-1438 :where(
  .elementor-element-b40f161,
  .elementor-element-91427b3
) > .elementor-widget-wrap {
  background-color: var(--fxp-surface-raised) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text) !important;
}

/* Homepage testimonial cards also use fixed white column surfaces. */
html[data-fxp-theme="dark"] .elementor-1438 :where(
  .elementor-element-b5b49a1,
  .elementor-element-5bd143f,
  .elementor-element-037728b
) > .elementor-widget-wrap {
  background-color: var(--fxp-surface-raised) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, figcaption, label, legend),
html[data-fxp-theme="dark"] .entry-title,
html[data-fxp-theme="dark"] .entry-title a,
html[data-fxp-theme="dark"] .elementor-heading-title,
html[data-fxp-theme="dark"] .elementor-widget-text-editor,
html[data-fxp-theme="dark"] .elementor-icon-box-title,
html[data-fxp-theme="dark"] .elementor-icon-box-description,
html[data-fxp-theme="dark"] .elementor-testimonial-content,
html[data-fxp-theme="dark"] .elementor-testimonial-name,
html[data-fxp-theme="dark"] .elementor-icon-list-text {
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] .elementor-testimonial-job {
  color: var(--fxp-muted) !important;
}

html[data-fxp-theme="dark"] :where(.wp-block-heading.has-text-color, .wp-block-paragraph.has-text-color, .widget-title, .widget-title a) {
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] :where(.entry-meta, .entry-meta *, .posted-on, .byline, .cat-links, .tags-links, .wp-block-post-date, .wp-block-post-author, small),
html[data-fxp-theme="dark"] .elementor-widget-text-editor .has-text-color:not(.has-white-color) {
  color: var(--fxp-muted) !important;
}

html[data-fxp-theme="dark"] a:not(.button):not(.elementor-button):not(.wp-element-button):not(.checkout-button) {
  color: var(--fxp-accent);
}

html[data-fxp-theme="dark"] a:not(.button):not(.elementor-button):not(.wp-element-button):not(.checkout-button):hover {
  color: var(--fxp-accent-hover);
}

/* Astra and Elementor Header & Footer Builder. */
html[data-fxp-theme="dark"] :where(.site-header, .ast-primary-header-bar, .ast-mobile-header-wrap, .ast-mobile-header-content, .elementor-location-header, .hfe-nav-menu__layout-horizontal, .hfe-dropdown, .main-header-menu .sub-menu),
html[data-fxp-theme="dark"] :where(.site-footer, .site-primary-footer-wrap, .site-footer-primary-section-1, .site-footer-primary-section-2, .site-footer-primary-section-3, .site-footer-primary-section-4, .ast-builder-footer-grid-columns, .ast-small-footer, .elementor-location-footer) {
  background-color: var(--fxp-bg) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text);
}

/* Current About hero uses a fixed cream background with light copy. */
html[data-fxp-theme="dark"] .elementor-645 .elementor-element.elementor-element-ff96dd3 {
  background-color: var(--fxp-surface) !important;
}

/* The About infocard title was wider than its column, so the FXPEDIA360 word
   overlapped the adjacent image. Keep both words inside the text column at
   desktop and mobile widths without changing the Elementor content. */
.elementor-645 .elementor-element-ac5dfa3 .hfe-infocard-title {
  font-size: clamp(46px, 4.2vw, 54px) !important;
  letter-spacing: -0.02em;
  line-height: 1.08 !important;
  max-width: 100%;
  overflow-wrap: normal;
  word-break: normal;
}

/* Mission & Vision contains two fixed white Elementor sections. In dark mode
   their copy is light, so the surfaces must change with the text. */
html[data-fxp-theme="dark"] .elementor-1624 :where(
  .elementor-element-pr5w4w3,
  .elementor-element-4bp41s9
) {
  background-color: var(--fxp-surface) !important;
  border-color: var(--fxp-border) !important;
}

/* Contact uses a cream gradient plus three white icon-card containers. */
html[data-fxp-theme="dark"] .elementor-808 .elementor-element-c12f718 {
  background-color: var(--fxp-bg) !important;
  background-image: none !important;
}

html[data-fxp-theme="dark"] .elementor-808 :where(
  .elementor-element-fa64d47,
  .elementor-element-a6b4400,
  .elementor-element-9582e4b
) > .elementor-widget-container {
  background-color: var(--fxp-surface-raised) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text) !important;
}

@media (max-width: 767px) {
  .elementor-645 .elementor-element-ac5dfa3 .hfe-infocard-title {
    font-size: clamp(36px, 9vw, 42px) !important;
  }
}

html[data-fxp-theme="dark"] :where(.main-header-menu, .main-header-menu a, .ast-header-navigation-arrow, .hfe-nav-menu a, .hfe-menu-toggle, .site-footer a) {
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] :where(.main-header-menu a, .hfe-nav-menu a):hover,
html[data-fxp-theme="dark"] :where(.main-header-menu .current-menu-item > a, .hfe-nav-menu .current-menu-item > a) {
  color: var(--fxp-accent) !important;
}

/* Astra desktop dropdowns need a distinct surface instead of blending into the header. */
html[data-fxp-theme="dark"] #primary-site-navigation-desktop .main-header-menu > .menu-item > .sub-menu {
  background: var(--fxp-surface) !important;
  border: 1px solid var(--fxp-border) !important;
  border-radius: 0 0 10px 10px;
  box-shadow: 0 18px 35px rgb(2 6 23 / 42%) !important;
  min-width: 270px;
  overflow: hidden;
}

html[data-fxp-theme="dark"] #primary-site-navigation-desktop .sub-menu .menu-link {
  background: var(--fxp-surface) !important;
  border-bottom: 1px solid var(--fxp-border) !important;
  color: var(--fxp-text) !important;
  line-height: 1.45;
  min-height: 48px;
  padding: 13px 16px;
  white-space: normal;
}

html[data-fxp-theme="dark"] #primary-site-navigation-desktop .sub-menu li:last-child > .menu-link {
  border-bottom: 0 !important;
}

html[data-fxp-theme="dark"] #primary-site-navigation-desktop .sub-menu .menu-link:hover,
html[data-fxp-theme="dark"] #primary-site-navigation-desktop .sub-menu .menu-link:focus-visible {
  background: var(--fxp-surface-raised) !important;
  color: var(--fxp-accent) !important;
  outline: 0;
}

html[data-fxp-theme="dark"] #primary-site-navigation-desktop .menu-item-has-children:hover > .menu-link,
html[data-fxp-theme="dark"] #primary-site-navigation-desktop .menu-item-has-children:focus-within > .menu-link {
  color: var(--fxp-accent) !important;
}

/* Mobile submenu remains compact and visually nested. */
html[data-fxp-theme="dark"] #ast-mobile-site-navigation .sub-menu {
  background: var(--fxp-surface) !important;
  border-left: 3px solid var(--fxp-accent) !important;
  margin: 0 12px 8px;
}

html[data-fxp-theme="dark"] #ast-mobile-site-navigation #ast-hf-mobile-menu,
html[data-fxp-theme="dark"] #ast-mobile-site-navigation .main-header-menu {
  background: var(--fxp-bg) !important;
  border-color: var(--fxp-border) !important;
}

html[data-fxp-theme="dark"] #ast-mobile-site-navigation .sub-menu .menu-link {
  background: transparent !important;
  border-bottom: 1px solid var(--fxp-border) !important;
  color: var(--fxp-text) !important;
  padding-left: 18px;
}

html[data-fxp-theme="dark"] #ast-mobile-site-navigation .sub-menu .menu-link:hover,
html[data-fxp-theme="dark"] #ast-mobile-site-navigation .sub-menu .menu-link:focus-visible {
  background: var(--fxp-surface-raised) !important;
  color: var(--fxp-accent) !important;
}

/* The current raster logo has a dark wordmark. In fallback mode show the gold
   monogram cleanly on the dark header instead of placing the logo on a white card. */
html[data-fxp-theme="dark"] :where(.custom-logo-link, .site-logo-img, .hfe-site-logo),
html[data-fxp-theme="dark"] .fxp-dark-logo-safe {
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
}

html[data-fxp-theme="dark"] body:not(.fxp360-has-dark-logo) .site-logo-img {
  height: 76px;
  overflow: hidden;
}

html[data-fxp-theme="dark"] body:not(.fxp360-has-dark-logo) .custom-logo-link {
  display: block;
  height: 76px;
  overflow: hidden;
}

html[data-fxp-theme="dark"] body:not(.fxp360-has-dark-logo) img.custom-logo {
  clip-path: inset(0 0 20% 0);
  display: block;
  transform: translateY(-1px) scale(1.04);
  transform-origin: top center;
}

/* Articles, archives, widgets, cards and common blocks. */
html[data-fxp-theme="dark"] :where(.ast-article-post, .ast-article-single, .blog-layout-1, .widget, .comments-area, .comment-respond, .navigation.post-navigation, .wp-block-group.has-background, .wp-block-media-text.has-background, .wp-block-cover__inner-container, .edd-blocks__row, .fxp-dark-surface) {
  background-color: var(--fxp-surface) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text);
}

/* Astra leaves the category introduction on a fixed white surface. */
html[data-fxp-theme="dark"] .ast-archive-description {
  background-color: var(--fxp-surface) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text) !important;
}

/* Research articles use intentionally light inline callouts in the source
   HTML. Replace their surfaces and text together so the global dark text
   colour never becomes white-on-white. */
html[data-fxp-theme="dark"] .entry-content .fxp-source-review {
  background: var(--fxp-surface-raised) !important;
  border-color: var(--fxp-accent) !important;
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] .entry-content :where(
  [style*="background:#eaf7ef" i],
  [style*="background: #eaf7ef" i]
) {
  background: #052e16 !important;
  border-color: #22c55e !important;
  color: #bbf7d0 !important;
}

html[data-fxp-theme="dark"] .entry-content :where(
  [style*="background:#fff7e6" i],
  [style*="background: #fff7e6" i]
) {
  background: #451a03 !important;
  border-color: #f59e0b !important;
  color: #fde68a !important;
}

html[data-fxp-theme="dark"] .entry-content :where(
  [style*="background:#fdecec" i],
  [style*="background: #fdecec" i]
) {
  background: #450a0a !important;
  border-color: #ef4444 !important;
  color: #fecaca !important;
}

/* Preserve the explicit black text used by the legacy pastel cards. This is
   scoped to the old demo post so it cannot override current article styles. */
html[data-fxp-theme="dark"] body.postid-20 .entry-content .has-background.has-text-color {
  color: #121417 !important;
}

html[data-fxp-theme="dark"] body.postid-20 .entry-content .has-background.has-text-color :where(h1, h2, h3, h4, h5, h6, p, li, strong, a) {
  color: inherit !important;
}

html[data-fxp-theme="dark"] :where(hr, .wp-block-separator) {
  border-color: var(--fxp-border);
  color: var(--fxp-border);
}

html[data-fxp-theme="dark"] :where(blockquote, .wp-block-quote, .wp-block-pullquote) {
  background: var(--fxp-surface);
  border-color: var(--fxp-accent);
  color: var(--fxp-text);
}

html[data-fxp-theme="dark"] :where(pre, code, kbd, samp) {
  background: #171a1f;
  border-color: var(--fxp-border);
  color: #fde68a;
}

html[data-fxp-theme="dark"] :where(.pagination .page-numbers, .post-page-numbers, .nav-links a, .nav-links span) {
  background: var(--fxp-surface);
  border-color: var(--fxp-border);
  color: var(--fxp-text);
}

html[data-fxp-theme="dark"] :where(.pagination .current, .post-page-numbers.current) {
  background: var(--fxp-accent);
  color: var(--fxp-button-text);
}

/* Selective correction for inline white backgrounds without recoloring media. */
html[data-fxp-theme="dark"] :where([style*="background-color: #fff" i], [style*="background-color:#fff" i], [style*="background-color: #ffffff" i], [style*="background-color:#ffffff" i], [style*="rgb(255, 255, 255)"]) {
  background-color: var(--fxp-surface) !important;
}

/* Forms. */
html[data-fxp-theme="dark"] :where(input:not([type="submit"]):not([type="button"]):not([type="reset"]), select, textarea) {
  background-color: #171a1f !important;
  border: 1px solid var(--fxp-border) !important;
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] :where(input, select, textarea)::placeholder {
  color: #9ea6b2;
  opacity: 1;
}

html[data-fxp-theme="dark"] :where(input, select, textarea):focus {
  border-color: var(--fxp-focus) !important;
  box-shadow: 0 0 0 3px rgb(253 152 0 / 24%) !important;
  outline: 0;
}

html[data-fxp-theme="dark"] :where(button:not(.fxp360-theme-toggle), .button, .elementor-button, .wp-element-button, input[type="submit"], .edd-submit, .checkout-button) {
  background-color: var(--fxp-accent) !important;
  border-color: var(--fxp-accent) !important;
  color: var(--fxp-button-text) !important;
}

html[data-fxp-theme="dark"] :where(button:not(.fxp360-theme-toggle), .button, .elementor-button, .wp-element-button, input[type="submit"], .edd-submit, .checkout-button):hover {
  background-color: var(--fxp-accent-hover) !important;
  border-color: var(--fxp-accent-hover) !important;
}

/* Data tables, Easy Digital Downloads and WooCommerce. */
html[data-fxp-theme="dark"] :where(table, th, td, .edd_cart_header_row, .edd_cart_item, .edd-checkout, .edd-blocks-form, .woocommerce table.shop_table, .woocommerce-cart-form, .woocommerce-checkout-review-order, .woocommerce form.checkout, .woocommerce .cart_totals, .woocommerce .product) {
  background-color: var(--fxp-surface) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-text) !important;
}

html[data-fxp-theme="dark"] :where(thead th, .edd_cart_header_row, .woocommerce table.shop_table thead th) {
  background-color: #171a1f !important;
}

html[data-fxp-theme="dark"] :where(.edd_errors, .edd-alert-error, .woocommerce-error) {
  background: #450a0a !important;
  border-color: #ef4444 !important;
  color: #fecaca !important;
}

html[data-fxp-theme="dark"] :where(.edd-alert-success, .woocommerce-message) {
  background: #052e16 !important;
  border-color: #22c55e !important;
  color: #bbf7d0 !important;
}

html[data-fxp-theme="dark"] :where(.edd-alert-warn, .woocommerce-info) {
  background: #451a03 !important;
  border-color: #f59e0b !important;
  color: #fde68a !important;
}

/* Accessible menu switch. */
.fxp360-theme-menu-item {
  align-items: center;
  display: flex !important;
  justify-content: center;
}

.fxp360-theme-toggle {
  align-items: center;
  appearance: none;
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  color: #0f172a;
  cursor: pointer;
  display: inline-flex;
  height: 38px;
  justify-content: center;
  line-height: 1;
  margin: 4px 8px;
  padding: 0;
  width: 38px;
}

.fxp360-theme-toggle:hover {
  background: #fff4cc;
  border-color: #fd9800;
}

.fxp360-theme-toggle:focus-visible {
  box-shadow: 0 0 0 3px rgb(253 152 0 / 35%);
  outline: 2px solid #fd9800;
  outline-offset: 2px;
}

.fxp360-theme-toggle svg {
  fill: none;
  height: 20px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  width: 20px;
}

.fxp360-theme-toggle__moon {
  display: none;
}

html[data-fxp-theme="dark"] .fxp360-theme-toggle {
  background: var(--fxp-surface-raised) !important;
  border-color: var(--fxp-border) !important;
  color: var(--fxp-accent) !important;
}

html[data-fxp-theme="dark"] .fxp360-theme-toggle__sun {
  display: none;
}

html[data-fxp-theme="dark"] .fxp360-theme-toggle__moon {
  display: inline-flex;
}

/* Media retains its original colors. */
html[data-fxp-theme="dark"] :where(img, picture, video, iframe, canvas, svg),
html[data-fxp-theme="dark"] .fxp-dark-preserve {
  filter: none !important;
}

@media (prefers-reduced-motion: no-preference) {
  .fxp360-dark-mode-ready,
  .fxp360-dark-mode-ready :where(.site-header, .site-content, .site-footer, .ast-article-post, .widget, button, input, select, textarea) {
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
  }
}

@media (max-width: 921px) {
  .fxp360-theme-menu-item {
    justify-content: flex-start;
    padding: 6px 14px;
  }
}

@media (max-width: 767px) {
  /* Keep comparison tables usable without widening the whole page. */
  html[data-fxp-theme="dark"] .entry-content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
  }
}

@media print {
  html[data-fxp-theme="dark"] {
    color-scheme: light;
  }

  html[data-fxp-theme="dark"] body,
  html[data-fxp-theme="dark"] :where(#page, .site, .site-content, .content-area, .site-main, .entry-content, .ast-article-single, .wp-block-group) {
    background: #fff !important;
    color: #111827 !important;
  }

  html[data-fxp-theme="dark"] :where(h1, h2, h3, h4, h5, h6, p, li, td, th, a) {
    color: #111827 !important;
  }

  .fxp360-theme-toggle {
    display: none !important;
  }
}
