/*
 * ResolveIQ local chat: design tokens.
 * Dark theme only. Every value used by components.css is defined here.
 * Contrast ratios (WCAG 2.x) are documented in design-spec.md section 2.
 */
:root {
  color-scheme: dark;

  /* ---- Colour: surfaces (Squid Ink family) ---------------------------- */
  --riq-color-bg:            #0E141B; /* page backdrop, behind canvas glow */
  --riq-color-canvas:        #131A22; /* Squid Ink dark: main app canvas   */
  --riq-color-surface:       #1B2430; /* RIQ bubble, composer, cards       */
  --riq-color-raised:        #232F3E; /* Squid Ink: header, toast, chips   */
  --riq-color-user:          #2B3A4C; /* user bubble                       */
  --riq-color-code-bg:       #0B1016; /* code blocks, inline code          */
  --riq-color-overlay:       rgba(14, 20, 27, 0.72);

  /* ---- Colour: lines ------------------------------------------------- */
  --riq-color-border:        rgba(174, 187, 200, 0.14); /* decorative hairline */
  --riq-color-border-strong: #66788C; /* input / control boundary (>= 3:1)   */

  /* ---- Colour: text -------------------------------------------------- */
  --riq-color-text:          #F1ECE4; /* primary body text: warm off-white */
  --riq-color-text-2:        #AEBBC8; /* secondary: meta, labels           */
  --riq-color-text-3:        #8A9AAC; /* tertiary: placeholders, footer.
                                         NOT for use on --riq-color-user   */
  --riq-color-ink:           #131A22; /* text on orange / blue fills       */

  /* ---- Colour: accents ----------------------------------------------- */
  --riq-color-primary:       #FF9900; /* Amazon Orange: send, focus, badge */
  --riq-color-primary-hover: #FFAD33;
  --riq-color-primary-press: #E68A00;
  --riq-color-primary-tint:  rgba(255, 153, 0, 0.12);
  --riq-color-primary-line:  rgba(255, 153, 0, 0.40);

  --riq-color-secondary:     #00A7FA; /* RIQ blue: avatar, sources, links  */
  --riq-color-secondary-text:#4CC2FF; /* blue for small text / links        */
  --riq-color-secondary-tint:rgba(0, 167, 250, 0.12);
  --riq-color-secondary-line:rgba(0, 167, 250, 0.40);

  --riq-color-danger:        #FF7A6E;
  --riq-color-danger-bg:     #3A1F22;
  --riq-color-danger-line:   rgba(255, 122, 110, 0.45);
  --riq-color-success:       #3DD68C;
  --riq-color-brand-gold:    #F2B347; /* wiki overline                      */
  --riq-brand-wrench:        #FFB400; /* wordmark wrench (asset fill + inline fallback) */

  /* ---- Colour: ticket semantics (built from the palette above) -------- */
  --riq-sev2-bg:    var(--riq-color-danger);      /* solid: SEV2 must stand out */
  --riq-sev2-fg:    var(--riq-color-ink);
  --riq-sev3-bg:    rgba(255, 153, 0, 0.14);
  --riq-sev3-fg:    var(--riq-color-primary);
  --riq-sev4-bg:    rgba(0, 167, 250, 0.14);
  --riq-sev4-fg:    var(--riq-color-secondary-text);
  --riq-sev5-bg:    rgba(174, 187, 200, 0.10);
  --riq-sev5-fg:    var(--riq-color-text-2);
  --riq-conf-high:  var(--riq-color-success);
  --riq-conf-med:   var(--riq-color-brand-gold);
  --riq-conf-low:   var(--riq-color-text-2);
  --riq-owner-rme:  var(--riq-color-brand-gold);   /* RME on-site */
  --riq-owner-ops:  var(--riq-color-secondary-text);/* Ops         */
  --riq-owner-arts: var(--riq-color-primary);      /* ARTS (you)  */
  --riq-sla-breached-bg: var(--riq-color-danger);   /* solid + ink, like SEV2 */
  --riq-sla-breached-fg: var(--riq-color-ink);
  --riq-sla-risk-bg:     rgba(242, 179, 71, 0.14);
  --riq-sla-risk-fg:     var(--riq-color-brand-gold);
  --riq-sla-ok-bg:       rgba(61, 214, 140, 0.12);
  --riq-sla-ok-fg:       var(--riq-color-success);
  --riq-color-spark:     var(--riq-color-secondary);  /* sparklines: one hue; state is text */
  --riq-color-skeleton:   #2A3646;
  --riq-color-skeleton-hi:#34435A;
  --riq-color-backdrop:   rgba(8, 12, 17, 0.62);
  --riq-color-chart-bar:  var(--riq-color-secondary);
  --riq-color-chart-grid: rgba(174, 187, 200, 0.12);

  /* ---- Texture ------------------------------------------------------- */
  /* Static film grain over the canvas (inline SVG noise, no request).
     The xmlns URL is a namespace identifier, not a fetch. */
  --riq-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --riq-grain-opacity: 0.035;

  /* ---- Typography (system stacks, nothing downloaded) ----------------- */
  --riq-font-sans: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI Variable Text",
                   "Segoe UI", system-ui, "Helvetica Neue", "Noto Sans", sans-serif,
                   "Apple Color Emoji", "Segoe UI Emoji";
  /* Wordmark only. Amazon Ember exists on corp-managed machines; others fall back. */
  --riq-font-brand: "Amazon Ember", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --riq-font-mono: ui-monospace, "SF Mono", SFMono-Regular, "Cascadia Code", "JetBrains Mono",
                   Menlo, Consolas, "Liberation Mono", monospace;

  --riq-text-xs:   0.75rem;   /* 12px: badge, footer, meta           */
  --riq-text-sm:   0.8125rem; /* 13px: chips, status line, code      */
  --riq-text-md:   0.9375rem; /* 15px: message body, composer        */
  --riq-text-lg:   1.125rem;  /* 18px: md h3, header title           */
  --riq-text-xl:   1.375rem;  /* 22px: md h2                          */
  --riq-text-2xl:  1.75rem;   /* 28px: empty-state headline          */
  --riq-text-brand: 1.3125rem;/* 21px: header wordmark               */
  --riq-text-overline: 0.6875rem; /* 11px: wiki-style overline       */

  --riq-leading-tight: 1.25;
  --riq-leading-body:  1.6;
  --riq-weight-regular: 400;
  --riq-weight-medium:  500;
  --riq-weight-semi:    600;
  --riq-weight-bold:    700;
  --riq-tracking-caps:  0.08em; /* uppercase micro labels            */
  --riq-tracking-tight: -0.015em; /* headlines                         */
  --riq-tracking-brand: -0.02em;  /* wordmark (matches the wiki)        */
  --riq-tracking-overline: 0.18em;/* wiki overline                      */

  /* ---- Spacing (4px base) -------------------------------------------- */
  --riq-space-0:  0;
  --riq-space-1:  0.25rem; /*  4 */
  --riq-space-2:  0.5rem;  /*  8 */
  --riq-space-3:  0.75rem; /* 12 */
  --riq-space-4:  1rem;    /* 16 */
  --riq-space-5:  1.25rem; /* 20 */
  --riq-space-6:  1.5rem;  /* 24 */
  --riq-space-8:  2rem;    /* 32 */
  --riq-space-10: 2.5rem;  /* 40 */
  --riq-space-12: 3rem;    /* 48 */
  --riq-space-16: 4rem;    /* 64 */

  --riq-thread-max: 46rem;  /* readable measure for the thread + composer */
  --riq-avatar-size: 2rem;
  --riq-header-h: 3.5rem;
  --riq-drawer-w: 17rem;
  --riq-rail-w: 17rem;     /* chat sessions rail */
  --riq-tlist-w: 23rem;   /* ticket list column on wide layouts */

  /* ---- Radii --------------------------------------------------------- */
  --riq-radius-xs:   4px;   /* inline code, kbd                    */
  --riq-radius-sm:   8px;   /* code blocks, copy button, tables     */
  --riq-radius-md:   12px;  /* toast, empty-state prompt cards       */
  --riq-radius-lg:   18px;  /* composer                              */
  --riq-radius-bubble: 20px; /* message bubbles (softer than lg)    */
  --riq-radius-tail: 8px;   /* the "tail" corner of a bubble        */
  --riq-radius-grouped: 10px; /* inner corners of grouped bubbles   */
  --riq-radius-pill: 999px; /* chips, badge, send button            */

  /* ---- Elevation ----------------------------------------------------- */
  --riq-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.35);
  --riq-shadow-2: 0 4px 14px rgba(0, 0, 0, 0.35), 0 1px 3px rgba(0, 0, 0, 0.30);
  --riq-shadow-3: 0 12px 32px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.30);
  --riq-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.04);

  /* Glow: reserved for (a) focus, (b) the avatar while thinking, (c) composer focus.
     Never on static content. */
  --riq-glow-primary:   0 0 0 3px rgba(255, 153, 0, 0.28), 0 0 18px rgba(255, 153, 0, 0.18);

  /* ---- Motion -------------------------------------------------------- */
  --riq-ease-out:    cubic-bezier(0.22, 1, 0.36, 1);    /* entrances        */
  --riq-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);    /* loops, morphs    */
  --riq-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* small pops only  */
  --riq-ease-in:     cubic-bezier(0.55, 0, 1, 0.45);    /* exits            */

  --riq-dur-instant: 80ms;   /* press feedback                     */
  --riq-dur-fast:    150ms;  /* hover, colour changes              */
  --riq-dur-base:    240ms;  /* message entrance, chip entrance    */
  --riq-dur-slow:    400ms;  /* toast, empty-state stagger         */
  --riq-dur-reveal:  320ms;  /* one word's fade-in                 */
  --riq-reveal-stagger: 14ms;/* delay per word                     */
  --riq-reveal-cap:  1400ms; /* max delay any word waits           */
  /* Rhythm (read by riqReveal JS via getComputedStyle) */
  --riq-reveal-jitter: 0.3;        /* +-30% per-word pace variation   */
  --riq-reveal-pause-comma: 60ms;  /* after , ; : and dashes          */
  --riq-reveal-pause-stop: 130ms;  /* after . ! ?                     */
  --riq-reveal-pause-break: 170ms; /* before a new paragraph/item/block */
  --riq-dur-settle:  900ms;  /* avatar done: particles decelerate to rest */
  --riq-dur-ripple:  700ms;  /* avatar done: blue ripple from the nucleus */
  --riq-dur-pulse:   0.9s;   /* nucleus glow pulse while thinking  */
  /* Atom orbits: per-orbit periods, deliberately non-harmonic so they never sync */
  --riq-orbit-idle-1:  14s;
  --riq-orbit-idle-2:  16s;
  --riq-orbit-idle-3:  12.5s;
  --riq-orbit-think-1: 1.6s;
  --riq-orbit-think-2: 2.3s;
  --riq-orbit-think-3: 1.9s;
  --riq-orbit-flatten: 68deg; /* rotateX that turns each orbit circle into an ellipse */
  --riq-dur-breathe: 4.8s;   /* avatar idle breathing              */
  --riq-dur-shimmer: 1.8s;   /* status-line shimmer                */
  --riq-dur-drawer:  280ms;  /* drawer slide                       */
  --riq-dur-skeleton: 1.4s;  /* skeleton sweep                     */

  /* ---- Layering ------------------------------------------------------ */
  --riq-z-header: 10;
  --riq-z-composer: 20;
  --riq-z-rail: 25;
  --riq-z-backdrop: 30;
  --riq-z-drawer: 40;
  --riq-z-toast: 50;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --riq-dur-base: 1ms;
    --riq-dur-slow: 1ms;
    --riq-dur-reveal: 1ms;
    --riq-reveal-stagger: 0ms;
    --riq-reveal-cap: 0ms;
    --riq-reveal-pause-comma: 0ms;
    --riq-reveal-pause-stop: 0ms;
    --riq-reveal-pause-break: 0ms;
    --riq-reveal-jitter: 0;
  }
}