/*
 * SuiteXray portal v2 — design tokens.
 * Direction "Aurora": a dark, calm canopy with a slow aurora glow carries the page title
 * and the one main action; content sits on light, airy cards that overlap the canopy.
 * Status is never conveyed by colour alone: every status pairs a shape icon with text.
 */
:root {
  /* Typography */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, Arial, sans-serif;
  --font-display: "Inter Display", "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", Roboto, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --text-2xs: 11px;
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 15px;
  --text-md: 17px;
  --text-lg: 20px;
  --text-xl: 26px;
  --text-hero: clamp(34px, 4.2vw, 56px);
  --tracking-display: -0.028em;
  --tracking-tight: -0.012em;
  --leading-tight: 1.08;
  --leading-snug: 1.3;
  --leading-body: 1.55;

  /* Spacing — 4px base */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px;

  /* Layout */
  --content-max: 1200px;
  --gutter: 40px;
  --gutter-tablet: 28px;
  --gutter-mobile: 18px;
  --touch-min: 44px;

  /* Light surface */
  --ink: #0f172a;
  --ink-2: #334155;
  --muted: #5b6576;
  --bg: #f4f6fb;
  --surface: #ffffff;
  --surface-2: #f8fafd;
  --line: #e4e8f0;
  --line-strong: #cdd4e0;

  /* SuiteXray brand (from the logo). Use the gradient for decoration and display text on dark;
   * body text and controls use --accent, which keeps AA contrast. */
  --brand-cyan: #00d9f9;
  --brand-blue: #3ba0ff;
  --brand-indigo: #7779f9;
  --brand-violet: #bd73f9;
  --brand-navy: #0a1330;
  --brand-gradient: linear-gradient(100deg, #00d9f9 0%, #3ba0ff 35%, #7779f9 67%, #bd73f9 100%);
  --brand-gradient-on-dark: linear-gradient(92deg, #ffffff 0%, #8fe9ff 38%, #9fb4ff 70%, #d3b0ff 100%);
  --btn-gradient: linear-gradient(100deg, #2a6cf0 0%, #4f57f2 55%, #6d4ff0 100%);

  /* Accent (indigo-blue) */
  --accent: #3b5bfd;
  --accent-hover: #2f4de6;
  --accent-soft: #eef1ff;
  --accent-ink: #2438b8;
  --on-accent: #ffffff;

  /* Canopy (dark band) */
  --canopy-0: #030a1f;
  --canopy-1: #0a1330;
  --canopy-2: #10205a;
  --on-canopy: #ffffff;
  --on-canopy-2: rgba(226, 232, 255, 0.78);
  --on-canopy-3: rgba(226, 232, 255, 0.56);
  --glass: rgba(255, 255, 255, 0.07);
  --glass-strong: rgba(255, 255, 255, 0.12);
  --glass-line: rgba(255, 255, 255, 0.14);
  --aurora-blue: #3ba0ff;
  --aurora-violet: #8f6cf8;
  --aurora-teal: #00d9f9;

  /* Report sections — identity colours used for icons and cover bands only */
  --sec-accounts: #0d9488;  --sec-accounts-2: #22d3ee;
  --sec-admin: #7c3aed;     --sec-admin-2: #c084fc;
  --sec-identity: #2563eb;  --sec-identity-2: #60a5fa;

  /* Status: text / background / border */
  --st-info-fg: #1d4ed8;     --st-info-bg: #eff4ff;     --st-info-line: #c7d6fe;
  --st-progress-fg: #3b5bfd; --st-progress-bg: #eef1ff; --st-progress-line: #c9d2ff;
  --st-success-fg: #13723d;  --st-success-bg: #ecfdf3;  --st-success-line: #a6e8c0;
  --st-limited-fg: #9a4a06;  --st-limited-bg: #fff8eb;  --st-limited-line: #f7d49a;
  --st-danger-fg: #b42318;   --st-danger-bg: #fff2f1;   --st-danger-line: #f8c3be;
  --st-neutral-fg: #475467;  --st-neutral-bg: #f2f4f7;  --st-neutral-line: #d6dbe3;
  --st-preview-fg: #6427c9;  --st-preview-bg: #f6f2ff;  --st-preview-line: #d9c9fb;

  /* Shape */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;
  --shadow-1: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-2: 0 1px 2px rgba(15, 23, 42, 0.04), 0 14px 36px -12px rgba(15, 23, 42, 0.16);
  --shadow-3: 0 2px 6px rgba(15, 23, 42, 0.06), 0 28px 64px -20px rgba(15, 23, 42, 0.30);
  --shadow-glow: 0 10px 34px -8px rgba(59, 120, 253, 0.6);

  /* Focus */
  --focus: #2f6bff;
  --focus-on-dark: #a9c1ff;

  /* Motion */
  --ease-out: cubic-bezier(.2, .8, .2, 1);
  --dur-1: 160ms;
  --dur-2: 320ms;
  --dur-3: 620ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; }
}
