/* ======================================================
   GF Hearts — The Events Calendar dark-mode overrides
   Tribe Events themes its own UI through a --tec-color-* design-token
   system (see the-events-calendar's variables-skeleton.css) with no
   dark-mode variant defined, so every token stays pinned to its light
   value (white toolbar/panel backgrounds, near-black text) even when
   BuddyX's data-bx-mode toggle switches to dark. Re-pointing the base
   tokens here (rather than overriding individual Tribe selectors) lets
   every dependent Tribe rule - search bar, view selector, notices,
   icons - cascade to the cocoa palette automatically. Gated on
   BuddyX's own dark-mode state, paired with the prefers-color-scheme
   companion for data-bx-mode="auto", matching the pattern in
   buddypress.css. Button/link colors driven by BuddyX's own
   --button-* theme-mod tokens (Find Events, Subscribe to calendar)
   aren't touched here - they already adapt independently.
   ====================================================== */

:root[data-bx-mode="dark"] {
  --tec-color-background: var(--gfh-surface);
  --tec-color-background-secondary: var(--bx-color-bg-muted);
  --tec-color-background-messages: color-mix(in srgb, var(--gfh-accent) 10%, transparent);
  --tec-color-text-primary: var(--gfh-text);
  --tec-color-text-secondary: var(--gfh-text-muted);
  --tec-color-border-default: rgba(255, 255, 255, 0.15);
  --tec-color-border-secondary: rgba(255, 255, 255, 0.1);
  --tec-color-accent-primary: var(--gfh-teal);
  --tec-color-accent-secondary: var(--gfh-teal);
  --tec-color-icon-primary: var(--gfh-text-muted);
}

@media (prefers-color-scheme: dark) {
  :root[data-bx-mode="auto"] {
    --tec-color-background: var(--gfh-surface);
    --tec-color-background-secondary: var(--bx-color-bg-muted);
    --tec-color-background-messages: color-mix(in srgb, var(--gfh-accent) 10%, transparent);
    --tec-color-text-primary: var(--gfh-text);
    --tec-color-text-secondary: var(--gfh-text-muted);
    --tec-color-border-default: rgba(255, 255, 255, 0.15);
    --tec-color-border-secondary: rgba(255, 255, 255, 0.1);
    --tec-color-accent-primary: var(--gfh-teal);
    --tec-color-accent-secondary: var(--gfh-teal);
    --tec-color-icon-primary: var(--gfh-text-muted);
  }
}
