/* Nuboc IP LLC. All rights reserved. */

/* =============================================================================
   02. Design Tokens
   ============================================================================= */

:root {
  /* Ink scale */
  --nax-ink: #0c0e11;
  --nax-ink-70: rgba(12, 14, 17, .70);
  --nax-ink-45: rgba(12, 14, 17, .45);
  --nax-ink-40: rgba(12, 14, 17, .40);
  --nax-ink-35: rgba(12, 14, 17, .35);
  --nax-ink-30: rgba(12, 14, 17, .30);
  --nax-ink-20: rgba(12, 14, 17, .20);
  --nax-ink-10: rgba(12, 14, 17, .10);
  --nax-ink-08: rgba(12, 14, 17, .08);
  --nax-ink-07: rgba(12, 14, 17, .07);
  --nax-ink-06: rgba(12, 14, 17, .06);
  --nax-ink-05: rgba(12, 14, 17, .05);
  --nax-ink-04: rgba(12, 14, 17, .04);
  --nax-ink-03: rgba(12, 14, 17, .03);

  /* Text-role inks — 4.5:1 minimum for small text (WCAG 1.4.3).
     Keep ink-40/45 for icons and decorative rules (3:1 non-text minimum). */
  --nax-ink-text-2: rgba(12, 14, 17, .64);
  --nax-ink-text-3: rgba(12, 14, 17, .58);
  --nax-green-text: #0a7a48;
  --nax-amber-text: #8a5606;
  --nax-red-text: #c22317;

  /* Solid fills that carry white text — ≥4.5:1 against #fff in both themes. */
  --nax-green-solid: #0c8552;
  --nax-green-solid-hover: #0a6f45;
  --nax-amber-solid: #a56809;
  --nax-amber-solid-hover: #8a5606;

  /* Surfaces */
  --nax-canvas: #f3f2ef;
  --nax-surface: #ffffff;
  --nax-body: #1a1a1a;
  --nax-paper: #ffffff;   /* a document's page, white as printed in either theme */

  /* Accent */
  --nax-accent: #1547d4;
  --nax-accent-rgb: 21, 71, 212;
  --nax-accent-lt: #e6edfb;
  --nax-accent-dim: rgba(21, 71, 212, .09);
  --nax-accent-dark: #1240bb;
  --nax-accent-darker: #0e35a0;
  --nax-on-accent: #fff;            /* text on an accent fill */

  /* Success */
  --nax-green: #0d9f5e;
  --nax-green-rgb: 13, 159, 94;
  --nax-green-bg: #e8f8f1;
  --nax-green-light: #5ecb9a;
  --nax-green-dark: #0b8b52;

  /* Danger */
  --nax-red: #d63b30;
  --nax-red-rgb: 214, 59, 48;
  --nax-red-bg: #fdf0ef;
  --nax-red-light: #e87b72;
  --nax-red-dark: #be342a;

  /* Warning */
  --nax-amber: #c97b0a;
  --nax-amber-rgb: 201, 123, 10;
  --nax-amber-bg: #fdf5e6;
  --nax-amber-light: #e8a84d;
  --nax-amber-dark: #b36e09;

  /* Info */
  --nax-blue: #1a56f0;
  --nax-blue-rgb: 26, 86, 240;
  --nax-blue-bg: #e8effe;
  --nax-blue-dark: #1449cc;

  /* Typography */
  --nax-font-sans: 'DM Sans', system-ui, -apple-system, sans-serif;
  --nax-font-mono: 'IBM Plex Mono', 'DM Mono', 'Menlo', monospace;
  --nax-font-serif: 'Instrument Serif', 'Georgia', serif;

  /* Shape */
  --nax-r: 5px;
  --nax-r-sm: 3px;
  --nax-r-lg: 8px;
  --nax-r-xl: 12px;

  /* Tree connector — the guide line, elbow and arrowhead joining a child row
     to its parent: the sidebar's sub-nav, the folder tree */
  --nax-tree-line-w: 1px;
  --nax-tree-elbow-r: 2px;
  --nax-tree-arrow-w: 4px;   /* the arrowhead's length */
  --nax-tree-arrow-h: 3px;   /* half the arrowhead's height */
  --nax-tree-step-deep: 16px; /* a deep row's indent under its parent, and its disclosure column */

  /* Spacing — 4px rhythm; the one scale every margin/padding speaks */
  --nax-space-1: 4px;
  --nax-space-2: 8px;
  --nax-space-3: 12px;
  --nax-space-4: 16px;
  --nax-space-5: 20px;
  --nax-space-6: 24px;
  --nax-space-7: 32px;
  --nax-space-8: 48px;
  --nax-row: 38px;
  --nax-row-compact: 30px; /* a record page's header actions */
  --nax-control-sm: 26px; /* a small button: a toolbar's, a segmented switch's */
  --nax-control-xs: 20px; /* an icon button inside a heading's row: the folder tree's group actions */
  --nax-row-condensed: var(--nax-row); /* a list's row size: no pictures, the default */
  --nax-row-comfortable: 48px; /* room for a picture */
  --nax-row-expanded: 64px; /* a picture you can recognise */
  --nax-touch: 44px; /* the smallest a finger can hit, on phones */
  --nax-list-max-h: calc(12 * var(--nax-row)); /* a list that scrolls past a dozen rows */

  /* Shadows */
  --nax-sh: 0 1px 2px rgba(0, 0, 0, .05), 0 1px 1px rgba(0, 0, 0, .03);
  --nax-sh-md: 0 4px 16px rgba(0, 0, 0, .08), 0 1px 3px rgba(0, 0, 0, .04);
  --nax-sh-lg: 0 16px 48px rgba(0, 0, 0, .13), 0 4px 12px rgba(0, 0, 0, .05);

  /* Motion */
  --nax-t: .13s ease;
  --nax-t-med: .20s cubic-bezier(.4, 0, .2, 1);

  /* Layout */
  --nax-sidebar-w: 248px;
  --nax-sidebar-collapsed: 56px;
  --nax-rail-w: 48px;
  --nax-topbar-h: 56px;
  --nax-detail-pane-w: 380px;
  --nax-record-rail-w: 300px;      /* a record page's list rail; the page may override */
  --nax-popover-w: 240px;          /* a popover's list of choices */
  --nax-popover-form-w: 280px;     /* a popover holding a form: choices, then Apply */
  --nax-popover-wide-w: 640px;     /* a popover holding a small table */
  --nax-pdf-sidebar-w: 176px;      /* the PDF viewer's page thumbnails */
  --nax-preview-window-h: 400px;   /* a document preview inside the detail drawer */
  --nax-record-aside-w: 360px;     /* a record page's details column beside its document */
  --nax-icon-tile-w: 112px;        /* an icon view's narrowest tile */
  --nax-icon-art: 64px;            /* an icon view's icon or thumbnail box */
  --nax-icon-glyph: 48px;          /* the icon drawn inside that box */
  --nax-grid-gutter-w: 4.5rem;     /* a spreadsheet grid's row-number gutter */
  --nax-workspace-offset: 220px;   /* shell and page header above a workspace */
  --nax-workspace-offset-crumbs: 168px; /* shell and crumb bar alone, for a page with no header */
  --nax-workspace-min-h: 520px;

  /* ── Chrome (signature shell — "Holdings House") ──────────────────────── */
  /* Cool ink-blue slate, warmer than #1a1a1a, deeper than midnight */
  --nax-chrome:        #0e1219;        /* topbar, sidebar, rail */
  --nax-chrome-2:      #161b24;        /* raised pill, hover surface */
  --nax-chrome-3:      #1f2530;        /* pressed/active surface */
  --nax-chrome-bg:     #060810;        /* body behind the rounded panel */
  --nax-chrome-line:   rgba(214, 198, 168, .07);   /* hairline (warm) */
  --nax-chrome-line-2: rgba(214, 198, 168, .14);   /* stronger rule */
  --nax-chrome-text:   #f1ead9;                    /* warm parchment */
  --nax-chrome-mute:   rgba(241, 234, 217, .55);
  --nax-chrome-faint:  rgba(241, 234, 217, .32);
  --nax-chrome-ghost:  rgba(241, 234, 217, .18);

  /* Signal accent — cool cobalt, on-brand with the Nuboc mark. */
  --nax-signal:         #8aaaf0;
  --nax-signal-bright:  #b8ccff;
  --nax-signal-deep:    #4a6bc4;
  --nax-signal-dim:     rgba(138, 170, 240, .12);
  --nax-signal-line:    rgba(138, 170, 240, .38);

  /* Live signal — for presence/status only */
  --nax-live:          #6dc1cb;
  --nax-live-dim:      rgba(109, 193, 203, .22);

  /* Z-index scale */
  --nax-z-sidebar: 100;
  --nax-z-topbar: 200;
  --nax-z-overlay: 300;
  --nax-z-modal: 400;
  --nax-z-toast: 500;
  --nax-z-cmd: 600;
}

/* Attention — something waiting on someone: a count of files to review.
   Warning's hues under their own name, so a quick-access count can change
   tone without touching warnings. Set again under every theme, so each
   resolves to its own theme's amber. */
:root,
[data-theme] {
  --nax-attention-bg: var(--nax-amber-bg);
  --nax-attention-text: var(--nax-amber-text);
  --nax-attention-solid: var(--nax-amber-solid);
}

[data-theme="dark"] {
  --nax-ink: #f3f2ef;
  --nax-ink-70: rgba(243, 242, 239, .70);
  --nax-ink-45: rgba(243, 242, 239, .45);
  --nax-ink-40: rgba(243, 242, 239, .40);
  --nax-ink-35: rgba(243, 242, 239, .35);
  --nax-ink-30: rgba(243, 242, 239, .30);
  --nax-ink-20: rgba(243, 242, 239, .20);
  --nax-ink-10: rgba(243, 242, 239, .10);
  --nax-ink-08: rgba(243, 242, 239, .08);
  --nax-ink-07: rgba(243, 242, 239, .07);
  --nax-ink-06: rgba(243, 242, 239, .06);
  --nax-ink-05: rgba(243, 242, 239, .05);
  --nax-ink-04: rgba(243, 242, 239, .04);
  --nax-ink-03: rgba(243, 242, 239, .03);
  --nax-ink-text-2: rgba(243, 242, 239, .72);
  --nax-ink-text-3: rgba(243, 242, 239, .64);
  --nax-green-text: #5ecb9a;
  --nax-amber-text: #e8a84d;
  --nax-red-text: #e87b72;
  --nax-canvas: #0e1018;
  --nax-surface: #161921;
  --nax-accent: #8aaaf0;
  --nax-accent-lt: rgba(138, 170, 240, .12);
  --nax-accent-dim: rgba(138, 170, 240, .15);
  --nax-accent-dark: #adc4f7;
  --nax-green: #5ecb9a;
  --nax-green-bg: rgba(94, 203, 154, .10);
  --nax-red: #e87b72;
  --nax-red-bg: rgba(232, 123, 114, .10);
  --nax-red-lt: #fdf0ef;
  --nax-amber: #e8a84d;
  --nax-amber-bg: rgba(232, 168, 77, .10);
  --nax-blue: #6b95f5;
  --nax-blue-bg: rgba(107, 149, 245, .10);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
