/**
 * Nexus Foundry WordPress edge-client design tokens.
 * Custom properties only. No global element selectors.
 * Prefix: nxf / --nxf-
 *
 * The tokens are declared on :root, not only on .nxf-root, because the module blocks (.nxf-cmp, .nxf-spn, .nxf-dn,
 * .nxf-partners, .nxf-rec, .nxf-form, .nxf-assistant, .nxf-consent-*, .nxf-acct) do not carry .nxf-root, and a
 * var(--nxf-*) with no declaration in scope is invalid at computed value (visual QA finding F3). Every module
 * stylesheet lists this file as a dependency (NexusFoundry\WordPress\Support\Tokens).
 */

/*
 * nxf-literals:start (mode fallbacks)
 * The only literal colours the module stylesheets ever reach. They apply when no theme presets exist
 * (--wp--preset--color--* undefined): light by default, dark when html[data-theme] says so, exactly as
 * nexus-estate/assets/css/modes.css switches the presets ("dark", or "auto" with a dark system preference).
 * The dark values are the kit's dark palette (kits/tokens.json), so a plugin-only site matches the estate.
 */
:root {
  --nxf-fallback-fg: #14222c;
  --nxf-fallback-fg-muted: #4b5d6b;
  --nxf-fallback-bg: #f4f7f9;
  --nxf-fallback-surface: #ffffff;
  --nxf-fallback-accent: #0f6e8c;
  --nxf-fallback-accent-fg: #ffffff;
  --nxf-fallback-danger: #9b2c2c;
  --nxf-fallback-border: #d5dee5;
  --nxf-fallback-focus: #0c4a6e;
}
:root[data-theme="dark"] {
  --nxf-fallback-fg: #ffffff;
  --nxf-fallback-fg-muted: #a3a3a3;
  --nxf-fallback-bg: #141414;
  --nxf-fallback-surface: #0a0a0a;
  --nxf-fallback-accent: #ffffff;
  --nxf-fallback-accent-fg: #000000;
  --nxf-fallback-danger: #f28b82;
  --nxf-fallback-border: rgba(255, 255, 255, 0.2);
  --nxf-fallback-focus: #8ab4f8;
}
@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --nxf-fallback-fg: #ffffff;
    --nxf-fallback-fg-muted: #a3a3a3;
    --nxf-fallback-bg: #141414;
    --nxf-fallback-surface: #0a0a0a;
    --nxf-fallback-accent: #ffffff;
    --nxf-fallback-accent-fg: #000000;
    --nxf-fallback-danger: #f28b82;
    --nxf-fallback-border: rgba(255, 255, 255, 0.2);
    --nxf-fallback-focus: #8ab4f8;
  }
}
/* nxf-literals:end */

/*
 * The colour tokens follow the theme presets first, so Foundry surfaces switch with the estate's light and dark
 * modes (visual QA finding F4: placeholders stayed #f4f7f9 on the black page). No literal colour below this line.
 */
:root,
.nxf-root,
:host {
  --nxf-color-fg: var(--wp--preset--color--ink, var(--nxf-fallback-fg));
  --nxf-color-fg-muted: var(--wp--preset--color--ink-muted, var(--nxf-fallback-fg-muted));
  --nxf-color-bg: var(--wp--preset--color--muted, var(--nxf-fallback-bg));
  --nxf-color-surface: var(--wp--preset--color--surface, var(--nxf-fallback-surface));
  --nxf-color-accent: var(--wp--preset--color--primary, var(--nxf-fallback-accent));
  --nxf-color-accent-fg: var(--wp--preset--color--primary-ink, var(--nxf-fallback-accent-fg));
  --nxf-color-danger: var(--wp--preset--color--critical, var(--nxf-fallback-danger));
  --nxf-color-border: var(--wp--preset--color--hairline-strong, var(--nxf-fallback-border));
  --nxf-color-focus: var(--wp--preset--color--focus, var(--nxf-fallback-focus));
  --nxf-font: inherit;
  --nxf-font-size: 1rem;
  --nxf-line: 1.45;
  --nxf-space-1: 0.25rem;
  --nxf-space-2: 0.5rem;
  --nxf-space-3: 0.75rem;
  --nxf-space-4: 1rem;
  --nxf-space-5: 1.5rem;
  --nxf-radius: 0.5rem;
  --nxf-shadow: 0 1px 2px color-mix(in srgb, var(--nxf-color-fg) 8%, transparent);
  --nxf-touch: 2.75rem;
  /* WCAG 2.2 SC 2.5.8 floor (24 CSS px) for controls that sit inside a larger label target, such as checkboxes. */
  --nxf-target-min: 1.5rem;
  --nxf-iframe-min-height: 240px;
  --nxf-iframe-max-height: 900px;
  --nxf-z-widget: 1;
}

.nxf-root,
:host {
  color: var(--nxf-color-fg);
  background: var(--nxf-color-bg);
  font-family: var(--nxf-font);
  font-size: var(--nxf-font-size);
  line-height: var(--nxf-line);
}

.nxf-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/*
 * nxf-literals:start (globe fixed palette)
 * Hosted globe embed (Foundry MapRuntimeHost). Dark canvas by design: the globe
 * is painted inside the Foundry embed page, not on the WordPress canvas. The
 * sequential ramp is single-hue (accent family), colourblind-safe by luminance;
 * NO_DATA is a neutral grey class of its own. The Foundry globe module reads
 * these tokens at mount and never ships its own palette as the source of truth.
 */
.nxf-embed-body--globe,
.nxf-globe,
.nxf-portal {
  --nxf-globe-canvas: #000000;
  --nxf-globe-ocean: #0b0f14;
  --nxf-globe-land: #161c24;
  --nxf-globe-outline: #3a4450;
  --nxf-globe-graticule: #1e2630;
  --nxf-globe-cell-line: #0b0f14;
  --nxf-globe-select: #ffffff;
  --nxf-globe-hover: #d4d4d4;
  --nxf-globe-nodata: #4b5159;
  --nxf-globe-point: #fdd663;
  --nxf-globe-hub: #ffffff;
  --nxf-globe-neutral: #a3a3a3;
  --nxf-globe-domain: #8ab4f8;
  --nxf-globe-alert: #f28b82;
  --nxf-globe-ramp-1: #223963;
  --nxf-globe-ramp-2: #24427a;
  --nxf-globe-ramp-3: #2e59a3;
  --nxf-globe-ramp-4: #4679cc;
  --nxf-globe-ramp-5: #78a3e6;
  --nxf-globe-ramp-6: #b3cdf5;
  --nxf-globe-text: #ffffff;
  --nxf-globe-text-muted: #a3a3a3;
  --nxf-globe-surface: rgba(0, 0, 0, 0.88);
  --nxf-globe-hairline: rgba(255, 255, 255, 0.1);
  --nxf-globe-hairline-strong: rgba(255, 255, 255, 0.2);
  --nxf-globe-focus: #8ab4f8;
  --nxf-globe-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --nxf-globe-font-sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --nxf-globe-radius: 5px;
  --nxf-globe-radius-chip: 4px;
  --nxf-globe-bg-hover: #1a1a1a;
  --nxf-globe-primary-bg: #ffffff;
  --nxf-globe-primary-ink: #000000;
  --nxf-globe-motion-fast: 120ms;
  --nxf-globe-ease: cubic-bezier(0.2, 0, 0, 1);
}
/* nxf-literals:end */