/* Midnight theme pack ("Тёмная тема"): the true dark scheme.
   color-scheme: dark flips native widgets/scrollbars; Bootstrap follows via
   data-bs-theme="dark" (owner: rewards.theme_service.bootstrap_theme_for_slug).

   The pack overrides system-wide semantic tokens only; domain token owners
   carry their own [data-ui-theme="midnight"] blocks next to their :root
   defaults (header/_tokens.css, cabinet/base_modules.css, cabinet/ai.css,
   css/utilities.css). ContentColor and RichContentTone stay theme-independent.

   Accent policy:
   - buttons use the wallpaper-derived aurora control ramp on 90% graphite plates;
   - action *text* (links, active tabs) moves to brand-300 which is readable
     on night surfaces;
   - feedback roles move to mid-light hues readable as text on night surfaces;
     toast solid backgrounds are pinned back to the strong primitives. */
[data-ui-theme="midnight"] {
  color-scheme: dark;

  /* --- Surfaces --- */
  --ui-surface-base: var(--ui-primitive-night-900);
  --ui-surface-muted: var(--ui-primitive-night-850);
  --ui-surface-raised: var(--ui-primitive-night-800);
  --ui-surface-inverse: var(--ui-primitive-night-50);
  --ui-surface-glass: rgba(23, 23, 26, 0.72);
  --ui-surface-glass-strong: rgba(31, 31, 35, 0.92);
  --ui-surface-hover: rgba(255, 255, 255, 0.06);
  --ui-surface-active: rgba(255, 255, 255, 0.1);
  --ui-surface-card-hover: var(--ui-primitive-night-700);
  --ui-surface-card-active: var(--ui-surface-active);
  --ui-surface-toolbar: var(--ui-surface-glass);
  --ui-surface-empty: var(--ui-primitive-night-850);
  --ui-list-row-bg: var(--ui-surface-muted);

  /* --- Borders --- */
  --ui-border-subtle: var(--ui-primitive-night-700);
  --ui-border-strong: var(--ui-primitive-night-600);
  --ui-border-glass: rgba(255, 255, 255, 0.14);

  /* --- Text + icons --- */
  --ui-text-primary: var(--ui-primitive-night-50);
  --ui-text-secondary: var(--ui-primitive-night-200);
  --ui-text-muted: var(--ui-primitive-night-300);
  --ui-text-inverse: var(--ui-primitive-night-900);
  --ui-focus-ring: 0 0 0 3px rgba(102, 173, 255, 0.42);

  /* --- Action colors (see accent policy above) --- */
  --ui-color-action-text: var(--ui-primitive-brand-300);
  --ui-color-action-hover: var(--ui-primitive-brand-200);
  --ui-color-action-active: var(--ui-primitive-brand-100);
  --ui-color-action-muted: color-mix(in srgb, var(--ui-primitive-brand-500) 24%, var(--ui-surface-base));
  --ui-color-secondary-bg: var(--ui-primitive-night-700);
  --ui-btn-plate-bg: color-mix(in srgb, var(--ui-primitive-night-800) 90%, transparent);
  --ui-btn-plate-hover-bg: color-mix(in srgb, var(--ui-primitive-night-700) 94%, transparent);
  --ui-btn-plate-active-bg: color-mix(in srgb, var(--ui-primitive-night-600) 96%, transparent);
  --ui-btn-plate-disabled-bg: color-mix(in srgb, var(--ui-primitive-night-850) 90%, transparent);
  --ui-btn-control-accent: var(--ui-primitive-control-aurora-300);
  --ui-btn-control-accent-strong: var(--ui-primitive-control-aurora-200);
  --ui-btn-control-accent-soft: color-mix(in srgb, var(--ui-primitive-control-aurora-500) 24%, var(--ui-surface-base));
  --ui-btn-primary-bg: color-mix(in srgb, var(--ui-btn-control-accent-soft) 90%, transparent);
  --ui-btn-primary-border: color-mix(in srgb, var(--ui-btn-control-accent) 72%, var(--ui-primitive-night-800));
  --ui-btn-primary-text: var(--ui-btn-control-accent-strong);
  --ui-btn-primary-hover-bg: color-mix(in srgb, var(--ui-primitive-control-aurora-500) 32%, var(--ui-btn-plate-hover-bg));
  --ui-btn-primary-hover-border: var(--ui-btn-control-accent);
  --ui-btn-primary-active-bg: color-mix(in srgb, var(--ui-primitive-control-aurora-500) 40%, var(--ui-btn-plate-active-bg));
  --ui-btn-primary-active-border: var(--ui-btn-control-accent-strong);
  --ui-btn-secondary-border: var(--ui-primitive-night-600);
  --ui-btn-close-filter: invert(1) grayscale(100%) brightness(180%);

  /* --- Feedback roles --- */
  --ui-color-success: var(--ui-primitive-success-500);
  --ui-color-success-muted: color-mix(in srgb, var(--ui-primitive-success-600) 22%, var(--ui-surface-base));
  --ui-color-success-strong: var(--ui-primitive-success-400);
  --ui-color-warning: var(--ui-primitive-warning-500);
  --ui-color-warning-muted: color-mix(in srgb, var(--ui-primitive-warning-600) 22%, var(--ui-surface-base));
  --ui-color-warning-strong: var(--ui-primitive-warning-400);
  --ui-color-danger: var(--ui-primitive-danger-500);
  --ui-color-danger-muted: color-mix(in srgb, var(--ui-primitive-danger-600) 24%, var(--ui-surface-base));
  --ui-color-danger-strong: var(--ui-primitive-danger-400);
  --ui-color-info: var(--ui-primitive-brand-300);
  --ui-color-info-muted: color-mix(in srgb, var(--ui-primitive-brand-500) 24%, var(--ui-surface-base));
  --ui-color-info-strong: var(--ui-primitive-brand-200);

  /* Toast solid backgrounds keep the strong light-theme hues under white text. */
  --ui-toast-success-bg: var(--ui-primitive-success-600);
  --ui-toast-error-bg: var(--ui-primitive-danger-600);
  --ui-toast-warning-bg: var(--ui-primitive-warning-600);
  --ui-toast-info-bg: var(--ui-primitive-brand-500);

  /* --- SitePattern wallpaper --- */
  /* Night canvas: the doodle glows with the luminous quartet (Telegram-style
     dark wallpaper); the wash becomes a faint aurora over night surfaces. */
  --ui-pattern-paint: linear-gradient(
    35deg,
    var(--ui-primitive-pattern-glow-teal-bright) 0%,
    var(--ui-primitive-pattern-glow-blue-bright) 38%,
    var(--ui-primitive-pattern-glow-violet-bright) 68%,
    var(--ui-primitive-pattern-glow-rose-bright) 100%
  );
  --ui-pattern-paint-opacity: 0.368;
  --ui-pattern-wash: linear-gradient(
    35deg,
    var(--ui-primitive-pattern-glow-teal-bright) 0%,
    var(--ui-primitive-pattern-glow-blue-bright) 38%,
    var(--ui-primitive-pattern-glow-violet-bright) 68%,
    var(--ui-primitive-pattern-glow-rose-bright) 100%
  );
  --ui-pattern-wash-opacity: 0.07;

  /* --- Shadows / overlays --- */
  --ui-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --ui-shadow-md: 0 10px 28px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.4);
  --ui-shadow-panel: 0 6px 22px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.38);
  --ui-shadow-card: 0 3px 12px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.32);
  --ui-card-shadow: var(--ui-shadow-card);
  --ui-shadow-toast-hover: 0 14px 40px rgba(0, 0, 0, 0.6);
  --ui-modal-backdrop-bg: rgba(0, 0, 0, 0.66);
  --ui-overlay-bg: rgba(23, 23, 26, 0.85);
  --ui-overlay-strong-bg: rgba(10, 10, 12, 0.98);
}
