/*
 * Nexus design layer: site-wide rules (docs/design/NEXUS_FOUNDRY_UI_UX_KIT.md; tokens from nexus-tokens.css).
 * 1. BuddyX Pro colour and font variables mapped onto the kit tokens (only with "Apply the kit colours").
 * 2. Page ground, type and focus.  3. Header, sub header and footer chrome.  4. The appearance switch.
 * 5. Kit footer line.  6. Accessibility helpers, reduced motion, print.
 * Rules never target canvas or svg globally and never reset BuddyPress, bbPress or plugin markup.
 */

/* 1. Variable mapping. Declared on :root and on body so body-level kit classes recompute them. */
:root[data-nx-colours="kit"],:root[data-nx-colours="kit"] body{
  /* BuddyX Pro, older variable names */
  --color-theme-primary:var(--nx-accent);--color-theme-loader:var(--nx-accent);--color-theme-secondary:var(--nx-text-muted);
  --color-theme-body:var(--nx-bg-canvas);--color-layout-boxed:var(--nx-bg-canvas);--color-theme-white-box:var(--nx-bg-surface);
  --global-body-lightcolor:var(--nx-bg-elevated);--color-theme-grey:var(--nx-bg-muted);--color-header-bg:var(--nx-bg-canvas);
  --global-font-color:var(--nx-text-secondary);--global-border-color:var(--nx-border-hairline);
  --color-site-title:var(--nx-text-primary);--color-site-title-hover:var(--nx-accent);--color-site-tagline:var(--nx-text-muted);
  --color-menu:var(--nx-text-secondary);--color-menu-hover:var(--nx-text-primary);--color-menu-active:var(--nx-text-primary);
  --color-subheader-title:var(--nx-text-primary);
  --color-link:var(--nx-text-primary);--color-link-hover:var(--nx-accent);--color-link-active:var(--nx-accent);
  --color-h1:var(--nx-text-primary);--color-h2:var(--nx-text-primary);--color-h3:var(--nx-text-primary);
  --color-h4:var(--nx-text-primary);--color-h5:var(--nx-text-primary);--color-h6:var(--nx-text-primary);
  --button-text-color:var(--nx-primary-ink);--button-text-hover-color:var(--nx-primary-ink);
  --button-background-color:var(--nx-primary-bg);--button-background-hover-color:var(--nx-primary-hover);
  --button-border-color:var(--nx-primary-bg);--button-border-hover-color:var(--nx-primary-hover);
  --color-quote-border:var(--nx-accent);--color-quote-citation:var(--nx-text-muted);
  --color-footer-bg:var(--nx-bg-canvas);--color-footer-title:var(--nx-text-primary);--color-footer-content:var(--nx-text-secondary);
  --color-footer-link:var(--nx-text-primary);--color-footer-link-hover:var(--nx-accent);
  --color-copyright-bg:var(--nx-bg-canvas);--color-copyright-content:var(--nx-text-muted);
  --color-copyright-link:var(--nx-text-primary);--color-copyright-link-hover:var(--nx-accent);
  /* BuddyX, newer variable names */
  --bx-color-bg:var(--nx-bg-canvas);--bx-color-bg-page:var(--nx-bg-canvas);--bx-color-bg-elevated:var(--nx-bg-elevated);
  --bx-color-bg-muted:var(--nx-bg-muted);--bx-color-bg-subtle:var(--nx-bg-elevated);--bx-color-fg:var(--nx-text-secondary);
  --bx-color-fg-muted:var(--nx-text-muted);--bx-color-header-bg:var(--nx-bg-canvas);--bx-color-site-title:var(--nx-text-primary);
  --bx-color-site-title-hover:var(--nx-accent);--bx-color-menu-fg:var(--nx-text-secondary);--bx-color-menu-hover:var(--nx-text-primary);
  --bx-color-menu-active:var(--nx-text-primary);--bx-color-accent:var(--nx-accent);--bx-color-link:var(--nx-text-primary);
  --bx-color-link-hover:var(--nx-accent);--bx-color-button-bg:var(--nx-primary-bg);--bx-color-button-bg-hover:var(--nx-primary-hover);
  --bx-color-button-fg:var(--nx-primary-ink);--bx-color-button-fg-hover:var(--nx-primary-ink);
  --bx-color-h1:var(--nx-text-primary);--bx-color-h2:var(--nx-text-primary);--bx-color-h3:var(--nx-text-primary);
  --bx-color-h4:var(--nx-text-primary);--bx-color-h5:var(--nx-text-primary);--bx-color-h6:var(--nx-text-primary);
  --bx-color-border:var(--nx-border-hairline);--bx-color-border-strong:var(--nx-border-hairline-strong);--bx-color-divider:var(--nx-border-hairline);
  --bx-color-footer-bg:var(--nx-bg-canvas);--bx-color-copyright-bg:var(--nx-bg-canvas);--bx-color-input-focus-border:var(--nx-focus);
  --bx-radius-card:var(--nx-radius);--bx-color-subheader-bg:var(--nx-bg-canvas);
}
body.nx-kit-fonts{--global-font-family:var(--nx-font-sans);--highlight-font-family:var(--nx-font-sans);--bx-font-body:var(--nx-font-sans);--bx-font-heading:var(--nx-font-sans)}

/* 2. Ground, type, focus. */
:root[data-nx-colours="kit"]{background-color:var(--nx-bg-canvas)}
:root[data-nx-colours="kit"] body.nx-site{background-color:var(--nx-bg-canvas);color:var(--nx-text-secondary)}
body.nx-kit-fonts{font-family:var(--nx-font-sans);font-feature-settings:"kern";-webkit-font-smoothing:antialiased}
body.nx-kit-fonts :where(h1,h2,h3,h4,h5,h6,.site-title,.entry-title,.page-title){font-family:var(--nx-font-sans);font-weight:500;letter-spacing:-.02em}
body.nx-kit-fonts :where(code,kbd,pre,samp){font-family:var(--nx-font-mono)}
:root[data-nx-colours="kit"] body.nx-site :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--nx-focus);outline-offset:2px}

/* 3. Chrome: the parent theme's header and footer are left exactly as the theme draws them (3.8.7-nexus.15). */
:root[data-nx-colours="kit"] body.nx-site :where(.wp-block-button__link,.button:not(.bp-tooltip),input[type="submit"]){border-radius:var(--nx-radius)}
#masthead .desktop-icons:has([data-nx-switch]){display:flex;flex-wrap:nowrap;align-items:center;gap:8px}
/* One switch on the page: the Nexus article's own toggle gives way to the site switch (they share one state). */
body.nx-one-switch .nx-article .nx-theme-toggle{display:none!important}

/* 4. The appearance switch (kit segmented control, 5px frame, active segment inverted). */
.nx-switch{display:inline-flex;align-items:center;margin:0 12px 0 0;padding:0;border:1px solid var(--nx-border-hairline-strong);border-radius:var(--nx-radius);background:var(--nx-bg-canvas);vertical-align:middle;flex:none}
.nx-switch[hidden]{display:none}
.nx-switch .nx-switch__btn{appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:0;border:0;border-radius:4px;background:transparent;color:var(--nx-text-muted);font:500 10.5px/1 var(--nx-font-mono);letter-spacing:.12em;text-transform:uppercase;min-height:30px;min-width:32px;padding:0 8px;cursor:pointer;box-shadow:none}
.nx-switch .nx-switch__i{display:block;width:16px;height:16px;flex:none}
/* In the parent header the switch is icons only (labels stay as the accessible names and titles). */
#masthead .nx-switch .nx-switch__t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nx-switch--floating .nx-switch__i{display:none}
.nx-switch .nx-switch__btn:hover{color:var(--nx-text-primary);background:transparent}
.nx-switch .nx-switch__btn[aria-pressed="true"]{background:var(--nx-primary-bg);color:var(--nx-primary-ink)}
.nx-switch .nx-switch__btn:focus-visible{outline:2px solid var(--nx-focus);outline-offset:2px}
.nx-switch--floating{position:fixed;inset-inline-end:16px;bottom:16px;z-index:9990;box-shadow:var(--nx-shadow)}
@media (max-width:1023px){.nx-switch{margin:0 8px 0 0}.nx-switch .nx-switch__btn{min-width:36px;padding:0 8px;min-height:36px}}
.nx-switch .nx-switch__btn[aria-pressed="true"] .nx-switch__i{stroke:currentColor}

/* 5. Kit footer line: institution mark, mono line, hairline above. */
.nx-footline{background:var(--nx-bg-canvas);border-top:1px solid var(--nx-border-hairline)}
.nx-footline__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;max-width:var(--nx-wide);margin:0 auto;padding:20px var(--nx-gutter)}
.nx-footline__brand{display:flex;align-items:center;gap:12px;color:var(--nx-text-primary);text-decoration:none}
.nx-footline__tile{display:inline-grid;place-items:center;min-width:32px;height:32px;padding:0 6px;box-sizing:border-box;border-radius:var(--nx-radius-chip);background:var(--nx-primary-bg);color:var(--nx-primary-ink);font:600 12px/1 var(--nx-font-sans);letter-spacing:.04em}
.nx-footline__name{font:600 13px/1.2 var(--nx-font-sans);letter-spacing:.04em;text-transform:uppercase}
.nx-footline__meta,.nx-footline__nav a{font:500 11px/1.4 var(--nx-font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--nx-text-muted)}
.nx-footline__meta{display:flex;align-items:center;gap:10px}
.nx-footline__meta::before{content:"";width:20px;height:2px;background:var(--nxi-grad)}
.nx-footline__nav{display:flex;gap:16px}
.nx-footline__nav a{text-decoration:none}
.nx-footline__nav a:hover{color:var(--nx-text-primary)}

/* 5b. Nonprofit trust block: support, funding, independence, licence and permissions. */
.nx-trust{display:grid;grid-template-columns:minmax(0,1fr);gap:24px 40px;max-width:var(--nx-wide);margin:0 auto;padding:28px var(--nx-gutter) 36px;border-top:1px solid var(--nx-border-hairline)}
.nx-trust__col{min-width:0}
.nx-footline .nx-trust__k{margin:0 0 10px;letter-spacing:.16em;font:500 11px/1.3 var(--nx-font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--nx-text-muted)}
.nx-trust p{margin:0;font-size:14px;line-height:1.55;color:var(--nx-text-secondary)}
.nx-trust a{color:var(--nx-text-primary)}
.nx-trust__col--lead p:first-of-type{font-size:16px;color:var(--nx-text-primary)}
.nx-trust__act{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px!important}
.nx-trust__btn{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid var(--nx-border-hairline-strong);border-radius:var(--nx-radius);font:500 14px/1 var(--nx-font-sans);text-decoration:none}
.nx-trust__btn[data-variant="primary"]{background:var(--nx-primary-bg);border-color:var(--nx-primary-bg);color:var(--nx-primary-ink)!important}
.nx-trust__btn:hover{border-color:var(--nx-text-primary)}
.nx-trust__links{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px!important}
@media (min-width:900px){.nx-trust{grid-template-columns:minmax(0,4fr) repeat(3,minmax(0,3fr))}}

/* WebGL and maps in Nexus articles: undo parent rules that resize or filter canvases (scoped, never global). */
.nx-article :where(.maplibregl-map,.nxa-map,.nxt-twin) canvas{max-width:none;filter:none}
.nx-article :where(.maplibregl-map,.nxa-map,.nxt-twin){transform:none}

/* 6. Accessibility helpers, reduced motion, print. */
.nx-sr,.nx-visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.nx-skip{position:absolute;inset-inline-start:-9999px;top:8px;z-index:100000;padding:8px 12px;background:var(--nx-primary-bg);color:var(--nx-primary-ink);border-radius:var(--nx-radius)}
.nx-skip:focus{inset-inline-start:8px}
@media (prefers-reduced-motion:reduce){body.nx-site *{scroll-behavior:auto!important}}
@media print{.nx-trust__act,.nx-switch,.nx-footline__nav,.nx-progress,.bx-color-mode-toggle{display:none!important}:root[data-nx-colours="kit"],:root[data-nx-colours="kit"] body.nx-site{background:#fff!important;color:#000!important}.site-header-wrapper{border-bottom:1px solid #000}}

/* 3.8.7-nexus.11: BuddyX Pro's reading progress as a 2px line across the top of the window, not a box in the header */
.buddyx-progress-bar{position:fixed;top:0;left:0;right:0;height:2px;z-index:100001;pointer-events:none;background:transparent}
.admin-bar .buddyx-progress-bar{top:32px}
#progressBar{-webkit-appearance:none;appearance:none;display:block;width:100%;height:2px;border:0;margin:0;background:transparent;color:var(--nx-accent,#999)}
#progressBar::-webkit-progress-bar{background:transparent}
#progressBar::-webkit-progress-value{background:linear-gradient(90deg,var(--nxd-a,var(--nx-accent)),var(--nxd-b,var(--nx-accent)))}
#progressBar::-moz-progress-bar{background:linear-gradient(90deg,var(--nxd-a,var(--nx-accent)),var(--nxd-b,var(--nx-accent)))}
/* the floating theme switch sits bottom left, clear of the help, cookie and back-to-top buttons on the right */
.nx-switch--floating{inset-inline-end:auto;inset-inline-start:16px;bottom:16px}

/* 3.8.7-nexus.13: a Nexus article package carries its own section index; BuddyX Pro's automatic table of contents is not printed above it */
.nx-entry:has(.nx-article) .bx-toc,article:has(.nx-article) .bx-toc{display:none}

/* 3.8.7-nexus.16 (owner approved 2026-10-28): on phones a long site title ran under the header icons. The BuddyX header
   row may wrap: title and tagline on their own line, the icons, Log in and Register on the next. Nothing hidden or moved
   out of the header; desktop unchanged. */
@media (max-width:767px){header#masthead.site-header{flex-wrap:wrap;row-gap:6px}header#masthead .site-branding{flex:1 1 100%;max-width:100%}header#masthead .site-title{overflow-wrap:break-word}}