/*
 * Sorivelo design tokens (handoff sections 2.1 and 2.3).
 *
 * Only custom properties live here: nothing in this file styles an element,
 * so loading it on the old Bootstrap pages changes nothing they show.
 * Components (static/sv/components.css and friends) read these with var().
 *
 * "@group <kind>: <label>" comments feed the dev gallery (/dev/components):
 * kind is color, stage, radius, space, size, shadow, motion or font. Keep one token per line.
 * Light theme only; dark mode is not designed.
 */
:root {
  /* @group color: Ink (text) */
  --ink: #1A1523; /* primary text */
  --ink-2: #3A3346; /* body text on cards */
  --ink-3: #5E576B; /* secondary text */
  --ink-caption: #6E6779; /* captions, metadata; lightest text allowed on white */
  --ink-faint: #9E96AD; /* decorative only, never for text that must be read */
  --ink-ghost: #BDB6C9; /* faded placeholder numbers (Home day one), decorative only */

  /* @group color: Surfaces */
  --canvas: #F6F5F2; /* page background */
  --surface: #FFFFFF; /* cards, panels */
  --surface-sunken: #FBFAFC; /* table headers, footers, row hover */
  --surface-muted: #F3F1F6; /* neutral chips, segmented control track */
  --hairline: #E8E5EC; /* card borders, section dividers */
  --hairline-soft: #F0EEF3; /* row dividers inside cards, progress track */
  --border: #DCD8E3; /* input borders */
  --border-control: #E2DEE8; /* button borders */
  --control-hover: #ECE9F1; /* icon button hover */
  --button-hover: #F6F4F9; /* secondary and quiet button hover */
  --kbd-bg: #FAF9FB; /* keyboard key background */
  --row-hover: #F8F7FA; /* key-value row hover */
  --row-selected-hover: #F2ECFE; /* selected table row under the pointer (selected rows are --violet-tint-soft) */
  --todo-row-hover: #FAF9FB; /* to-do row under the pointer (Project to-do lists) */
  --internal-text: #4A4458; /* "Internal" chip text on --surface-muted (Project discussions) */
  --card-hover-border: #CFC6E4; /* border of a card that is a link, on hover */
  --quick-border: #EEEBF2; /* quick action tiles and panels in the command palette (Command.dc.html .qc) */
  --skeleton: #EEEBF2; /* skeleton bars */
  --shimmer-highlight: #E6E0F3; /* moving highlight on AI loading bars */
  --pipeline-column: #EFEDF1; /* pipeline stage columns */
  --pipeline-add-hover: #E5E2EA; /* "Add deal" at the foot of a pipeline column, on hover */
  --pipeline-won-bg: #F1FAF5; /* Won drop zone beside the pipeline columns */
  --pipeline-won-border: #9ED4B8; /* its dashed border */
  --pipeline-won-note: #2C6B4C; /* its "Drop here" line */
  --pipeline-lost-bg: #FAF9FB; /* Lost drop zone */
  --pipeline-lost-border: #D2CCD9; /* its dashed border */
  --pipeline-quiet-text: #7A3F00; /* "Quiet for N days" flag on a deal card, on --waiting-tint */
  --pipeline-signal-text: #14603D; /* buying signal flag on a deal card ("Moved up to ..."), on --good-tint */
  --border-strong: #BDB6C9; /* checkbox borders */
  --check-disabled-bg: #FAF9FB; /* a disabled checkbox that is not checked (dashed border) */
  --switch-off: #D6D1DE; /* switch track when off */
  --selected-soft: #FCFAFF; /* selected choice card, file drop zone (Welcome) */
  --dropzone-border: #CFC6E4; /* dashed border of a file drop zone */
  --tag-neutral-text: #4A4458; /* field type tags and the Hidden badge (Settings > Data fields) */
  --panel-note-bg: #FAF9FB; /* a short explaining note in a panel (why a field can't change, Settings) */
  --quote-bg: #FAF9FB; /* the quoted text of a timeline item (Record.dc.html) */
  --canvas-fade: rgba(246, 245, 242, .55); /* the page background, see-through: fades the ghost cards behind an empty state (Projects) */
  --surface-fade: rgba(255, 255, 255, .55); /* a card's white, see-through: fades the ghost rows behind an empty list (EmptyDeals.dc.html) */
  --star-fill: #F2B544; /* a starred project's star (Projects.dc.html) */
  --star-stroke: #C27A12; /* its outline */
  --tray: #EFEDF1; /* a quiet row set into the page, like the completed and archived projects row (Projects.dc.html) */
  --ghost-border: #CFC8DA; /* dashed border of a "start one" tile (Projects.dc.html Start a project) */

  /* @group color: Night (sidebar, dark bands, toasts) */
  --night: #1B1426;
  --night-hover: #2A2138;
  --night-active: #362A4D;
  --night-line: #3A2F4F;
  --night-text: #CFC8DC;
  --night-muted: #A49BB5;
  --night-label: #9A90AC;
  --night-urgent: #FFB4A8; /* urgent counts on the sidebar */
  --night-divider: #2E2540; /* line above the sidebar user row (Main, EmptyHome) */
  --kbd-on-night-text: #B7AEC7; /* keyboard key on night (sidebar search), on --night with a --night-line border */
  --night-good: #7ED3A6; /* success icon on night (toasts) */
  --night-risk: #FFB4A8; /* error icon on night (toasts) */
  --night-info: #C4B0FF; /* other toast icons on night (import, AI) */
  --night-subtle: #B7AEC7; /* secondary text on a night band (sign in value line) */
  --night-card: rgba(255, 255, 255, .06); /* small card on a night band (sign in) */
  --night-card-border: rgba(255, 255, 255, .10);
  --good-on-night: #9ED4B8; /* "good" label on night */
  --good-dot-on-night: #7ED3A6; /* "good" status dot on night */
  --night-step: #9C93AE; /* step names and hints on the first-run rail */

  /* @group color: Brand and action */
  --violet: #6431D9; /* primary buttons, selected states */
  --violet-press: #5326BF; /* hover and pressed */
  --violet-text: #5326BF; /* violet text on light tints */
  --violet-tint: #F1ECFD; /* AI and selected backgrounds */
  --violet-tint-soft: #F7F3FF; /* AI surfaces, selected table rows */
  --violet-border: #D8CCF6; /* AI-filled inputs */
  --violet-on-dark: #B9A2FF;
  --spark-on-night: #C4B0FF; /* AI spark on a night bar (bulk actions) */
  --ai-surface-border: #E4D9FB; /* border of an AI note on violet-tint-soft */
  --ai-field-bg: #FCFAFF; /* AI-filled input background */
  --ai-card-border: #DCD2F5; /* border of an AI card on white ("Or let Sorivelo set it up") */
  --brief-card-bg: #FAF9FB; /* one card of the Sorivelo brief on Home (Main.dc.html) */
  --brief-card-border: #EEEBF2; /* its border */
  --ai-prompt-border: #EEEBF2; /* border of a suggested prompt button */
  --kbd-on-primary-bg: #5326BF;
  --kbd-on-primary-border: #7C52E3;
  --kbd-on-primary-text: #EDE6FF;
  --link: #5B2FC9;
  --link-hover: #3F1E95;
  --focus: #8B5CF6; /* 2px focus outline, 2px offset */
  --focus-halo: #E7DEFC; /* 3px halo on focused inputs */

  /* @group color: Meaning */
  --risk: #A3261C;
  --risk-tint: #FDECEA;
  --risk-solid: #C2413A;
  --risk-border: #F2C9C4; /* outline of a quiet delete button */
  --risk-strong: #8A1F17; /* risk text in a banner on --risk-tint (Project needs attention, form summary) */
  --risk-deep: #8A1F17; /* text and links on a risk tint banner (States form mistakes) */
  --danger-button: #B4322A;
  --waiting: #8F4A00;
  --waiting-tint: #FFF1E2;
  --waiting-solid: #D68A1E;
  --waiting-soft: #FFF8EE; /* amber note background (AddDeal duplicate warning, States offline and conflict) */
  --waiting-border: #F6DFC0; /* outline of an amber note */
  --waiting-deep: #6B3A00; /* text and links on an amber note */
  --good: #146C43;
  --good-tint: #E7F5EE;
  --good-solid: #1F8A5B;
  --good-border: #BFE3CF; /* border of a card whose action went through (Assistant action cards) */
  --good-surface: #F3FBF6; /* background of that card */
  --good-strong: #14603D; /* result line on that card */
  --good-solid-press: #18744B; /* hover of a green Approve button (Team.dc.html) */
  --info: #3346B8;
  --info-tint: #ECEFFE;
  --info-solid: #2F6FDE;
  --info-strong: #2A3A9E; /* info text in a banner on --info-tint (Project needs attention) */
  --teal: #0B637F; /* client-visible, on site, neutral info */
  --teal-tint: #E4F3F8;

  /* @group stage: Pipeline stages (chip background and text; -dot is the stage column dot and bar, a chip's own dot is its text color) */
  --stage-new-bg: #ECEFFE;
  --stage-new-text: #3346B8;
  --stage-new-dot: #7C93EE;
  --stage-qualified-bg: #E4F3F8;
  --stage-qualified-text: #0B637F;
  --stage-qualified-dot: #2B9AC0;
  --stage-proposal-bg: #FFF1E2;
  --stage-proposal-text: #8F4A00;
  --stage-proposal-dot: #D68A1E;
  --stage-negotiation-bg: #F1EAFE;
  --stage-negotiation-text: #5326BF;
  --stage-negotiation-dot: #6431D9;
  --stage-won-bg: #E7F5EE;
  --stage-won-text: #146C43;
  --stage-won-dot: #1F8A5B;
  --stage-lost-bg: #F3F1F6;
  --stage-lost-text: #4A4458;
  --stage-lost-dot: #9E96AD;

  /* @group color: Avatars (white initials, picked from the user id) */
  --avatar-1: #7A4FD8;
  --avatar-2: #0E7C86;
  --avatar-3: #B4541C;
  --avatar-4: #3456C8;
  --avatar-5: #9A3B6B;
  --avatar-6: #3D7A3A;
  --avatar-7: #0B637F;
  --avatar-8: #4A4458;
  --avatar-9: #4F7A28;

  /* @group color: Logo tiles (the two tints not in Meaning; the others use the meaning tints) */
  --logo-violet-bg: #F1EAFE;
  --logo-violet-text: #5326BF;
  --logo-neutral-bg: #F3F1F6;
  --logo-neutral-text: #4A4458;

  /* @group color: Support inbox (Support.dc.html) */
  --queue-row-current: #F4F0FE; /* the ticket open in the support queue (with a 3px violet bar) */
  --context-card-border: #EEEBF2; /* the organization card in the support inbox's customer pane */
  --note-bg: #FFF9EB; /* an internal note in a ticket's conversation (amber) */
  --note-border: #F3E2B8;
  --note-chip-bg: #F6E7C1; /* its "Internal note" chip */
  --note-chip-text: #6B4A00;
  --risk-note-bg: #FFF8EE; /* the customer pane's note when a deal is at stake (amber) */
  --risk-note-border: #F6DFC0;
  --risk-note-text: #6B3A00;
  /* @group color: Projects timeline (ProjectsTimeline.dc.html: a bar's background, its progress fill and its text, by status) */
  --gantt-good-bg: #D3EEDF;
  --gantt-good-fill: #8FD1AE;
  --gantt-good-text: #14603D;
  --gantt-waiting-bg: #FBE3C4;
  --gantt-waiting-fill: #EDB66A;
  --gantt-waiting-text: #6B3A00;
  --gantt-risk-bg: #F8D3CF;
  --gantt-risk-fill: #E58F86;
  --gantt-risk-text: #7E1C14;
  --gantt-neutral-stripe: #E9E6EE; /* the darker stripe of a Not started bar (the lighter one is --surface-muted) */
  --gantt-crowded: rgba(214, 138, 30, .10); /* a crowded week's shading, darker stripe */
  --gantt-crowded-soft: rgba(214, 138, 30, .04); /* its lighter stripe */
  --gantt-crowded-edge: #E6B571; /* its dashed edges */
  --clash-bg: #FFF8EE; /* the crowded week banner */
  --clash-border: #F6DFC0;
  --clash-text: #6B3A00;
  --clash-button-border: #EBCB9C;
  --workload-1-bg: #ECE6FC; /* workload cells by count; text --violet-text */
  --workload-2-bg: #D3C5F7; /* text --link-hover */
  --workload-3-bg: #7C52E3; /* white text; the design's #9A7BEA is too light for it (4.5:1) */
  /* @group color: Who's out (Team.dc.html: a day out, approved solid, pending striped with a dashed edge) */
  --out-approved: #9A7BEA;
  --out-pending-stripe: #E3DAFB; /* the darker stripe; the lighter one is --surface */
  --out-pending-edge: #9A7BEA;

  /* @group radius: Radius */
  --radius-kbd: 5px; /* keyboard keys, checkboxes */
  --radius-tile-sm: 6px; /* small tiles at 20 to 24px, checkbox at 20px */
  --radius-tile: 7px; /* small tiles, logo tile at 28px */
  --radius-control: 8px; /* buttons, inputs, filter chips */
  --radius-seg: 9px; /* segmented control track (7px segments inside 3px padding) */
  --radius-panel: 10px; /* inner panels */
  --radius-card: 12px; /* cards */
  --radius-sheet: 14px; /* side sheets, large cards */
  --radius-dialog: 16px; /* dialogs, command palette */
  --radius-pill: 999px; /* pills, chips, avatars */
  --radius-bubble-tail: 4px; /* the pointed corner of a question bubble (Assistant.dc.html) */
  --radius-cite: 4px; /* a numbered citation marker in an answer (Assistant.dc.html) */

  /* @group space: Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 48px; /* marketing */
  --space-9: 56px; /* marketing */
  --space-10: 72px; /* marketing */
  --space-11: 100px; /* marketing */

  /* @group size: Sizes */
  --control-sm: 30px; /* small buttons, filter chips */
  --control-md: 36px; /* default buttons, icon buttons */
  --control-lg: 44px; /* large buttons, touch targets */
  --control-cta: 52px; /* marketing call to action */
  --input-sm: 38px; /* inputs in dense forms and settings */
  --input-md: 40px; /* default input */
  --input-lg: 44px; /* sign in */
  --input-xl: 48px; /* first-run setup */
  --chip-h: 22px;
  --tab-h: 42px;
  --table-head-h: 38px;
  --table-row-h: 50px; /* compact tables (settings) */
  --table-row-h-list: 52px; /* record list rows (Deals) */
  --table-sticky-top: 0px; /* where table headers stick; a sticky page header can raise it */
  --bulk-bar-bottom: 28px; /* gap under the floating bulk action bar */
  --bulk-bar-space: 0px; /* room kept under the page while a floating bulk bar shows (bulk-bar.js sets it) */
  --loading-bar-h: 3px; /* thin loading bar at the top of the page or of a loading region */
  --icon: 16px;
  --icon-rail: 18px;
  --sidebar-w: 248px;
  --rail-w: 64px;
  --rail-item: 40px; /* a rail item tile (Assistant.dc.html, Settings.dc.html) */
  --header-h: 64px;
  --topbar-h: 56px; /* the app bar under 900px: 44px buttons with 6px above and below */
  --content-max: 1240px;
  --sheet-max: 600px;
  --sheet-inset: 12px;
  --dialog-max: 600px; /* confirm dialogs (States.dc.html); phones keep a 16px gutter */
  --palette-max: 860px;
  --assistant-w: 440px;
  --toast-max: 520px; /* widest toast; long messages wrap */

  /* @group shadow: Elevation (cards use a hairline, no shadow) */
  --shadow-float: 0 12px 32px rgba(27, 20, 38, .28); /* bulk bar, unsaved changes bar */
  --shadow-sheet: 0 24px 64px rgba(27, 20, 38, .30); /* side sheet */
  --shadow-palette: 0 32px 80px rgba(27, 20, 38, .35); /* command palette */
  --shadow-toast: 0 12px 28px rgba(27, 20, 38, .25); /* toasts */
  --shadow-dialog: 0 16px 40px rgba(27, 20, 38, .12); /* confirm dialogs */
  --shadow-raised: 0 1px 2px rgba(27, 20, 38, .12); /* selected segment of a segmented control */
  --shadow-pipeline-card: 0 1px 2px rgba(27, 20, 38, .04); /* deal cards on the pipeline */
  --shadow-pipeline-lift: 0 16px 32px rgba(27, 20, 38, .18); /* a deal card being dragged or moved from the keyboard */
  --shadow-knob: 0 1px 2px rgba(0, 0, 0, .2); /* switch knob */
  --shadow-menu: 0 16px 40px rgba(27, 20, 38, .12); /* menus that open from a button (the shell's New and account menus) */
  --shadow-assistant: -12px 0 32px rgba(27, 20, 38, .06); /* left edge of the Ask Sorivelo panel (Assistant.dc.html) */
  --shadow-card-hover: 0 6px 20px rgba(27, 20, 38, .07); /* a project card under the pointer (Projects.dc.html) */
  --scrim: rgba(27, 20, 38, .40); /* behind sheets and dialogs */

  /* @group motion: Focus and motion (static/sv/base.css; reduced motion stops the animations) */
  --focus-width: 2px; /* focus outline, in --focus */
  --focus-offset: 2px; /* gap between the element and its focus outline */
  --motion-fast: 150ms; /* hover, switch knob, small state changes; 0.01ms with reduced motion */
  --motion-spin: 800ms; /* one turn of a spinner */
  --motion-shimmer: 1400ms; /* one sweep of a shimmer bar */
  --motion-loading-delay: 300ms; /* waits shorter than this show nothing; then skeletons and the loading bar (loading.js reads it) */
  --motion-loading-bar: 8s; /* the loading bar's slow crawl toward the end while it waits */

  /* @group font: Font stacks (fonts load in F2) */
  --font-sans: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-wordmark: 'Pacifico', cursive; /* the Sorivelo wordmark only */
}