/* ro-crm design tokens. Our own names and values, tuned by eye to sit close to the
   Pipedrive look described in intake-crm/research/pipedrive-ui/README.md. Never paste
   Pipedrive's own stylesheet here. Light theme only for now. */
:root {
  /* Type */
  --font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --fs-xs: 11px;
  --fs-sm: 12px;
  --fs-md: 14px;
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-title: 25px;
  --lh-sm: 16px;
  --lh-md: 20px;
  --lh-lg: 24px;
  --fw-regular: 400;
  --fw-semibold: 600;

  /* Text */
  --text: #22242d;
  --text-2: #64676e;
  --text-muted: #94959b;
  --text-inverse: #ffffff;
  --link: #0e69c4;

  /* Surfaces */
  --bg-app: #f4f4f6;
  --bg-surface: #ffffff;
  --bg-hover: #f0f1f3;
  --bg-selected: #e3eeff;
  --bg-info: #eef5ff;
  --bg-note: #fff5d8;
  --bg-dark: #22242d;
  --border: #dcdde0;
  --border-strong: #c3c5ca;
  --border-focus: #2c75d9;

  /* Brand / actions */
  --green: #2e8748;
  --green-hover: #087a39;
  --green-press: #01682b;
  --green-disabled: #84b988;
  --red: #d73d39;
  --red-hover: #c62828;
  --blue: #0e69c4;
  --blue-bright: #2c75d9;
  --blue-toast-link: #74aeff;
  --yellow: #ffd34c;
  --yellow-icon: #e59c01;
  --yellow-text: #935c01;
  --gold: #dfae5b; /* R&O brand accent, used sparingly */

  /* Left menu */
  --nav-bg: #221d53;
  --nav-hover: #6a63f1;
  --nav-active: #6251e0;
  --nav-icon: rgba(255, 255, 255, 0.82);

  /* Label colours (10) */
  --label-blue: #4265d3;
  --label-green: #80d5b7;
  --label-yellow: #f9df22;
  --label-red: #d53134;
  --label-purple: #a1429c;
  --label-grey: #e3e4e5;
  --label-brown: #995a2c;
  --label-orange: #feae59;
  --label-darkgrey: #6c6f70;
  --label-pink: #f790bf;

  /* Lead quality (funnel.QUALITY): sidebar dots and the board card bar */
  --quality-hot: #e0483e;
  --quality-medium: #f2a33a;
  --quality-unsure: #8b8f99;
  --quality-low: #6d9bd8;
  --quality-not-good: #4a4d55;

  /* Leads inbox sections (Build Q): band colours, sizes and the waiting chip */
  --sec-new: var(--blue-bright);
  --sec-hot: var(--quality-hot);
  --sec-medium: var(--quality-medium);
  --sec-low: var(--quality-low);
  --sec-unsure: var(--quality-unsure);
  --sec-notgood: var(--quality-not-good);
  --sec-neutral: var(--border-strong);
  --sec-band-h: 40px;
  --sec-band-empty-h: 28px;
  --sec-gap: 12px;
  --wait-amber: var(--yellow-text);
  --wait-amber-bg: var(--bg-note);
  --wait-red: var(--red);
  --wait-red-bg: var(--rotting-bg);

  /* Timeline */
  --tl-line: #c9cbd0;
  --mention-bg: #e3eeff;

  /* Spacing scale */
  --sp-1: 2px;
  --sp-2: 4px;
  --sp-3: 6px;
  --sp-4: 8px;
  --sp-5: 12px;
  --sp-6: 16px;
  --sp-7: 24px;
  --sp-8: 32px;
  --sp-9: 40px;
  --sp-10: 48px;

  /* Radius */
  --r-sm: 4px;
  --r-md: 8px;
  --r-tile: 6px;   /* 24px hover tiles (participant remove x) */
  --r-lg: 12px;
  --r-pill: 999px;

  /* Sizes */
  --control-h: 32px;
  --control-h-lg: 40px;
  --nav-w: 56px;
  --topbar-h: 56px;
  --column-w: 300px;

  /* Shadows */
  --shadow-raised: 0 0 1px 1px rgba(0, 0, 0, 0.05), 0 1px 2px -2px rgba(0, 0, 0, 0.06), 0 1px 3px 0 rgba(0, 0, 0, 0.07);
  --shadow-raised-hover: 0 3px 5px 0 rgba(0, 0, 0, 0.08), 0 0 4px 0 rgba(0, 0, 0, 0.12);
  --shadow-popover: 0 4px 12px 0 rgba(0, 0, 0, 0.12), 0 0 1px 0 rgba(0, 0, 0, 0.16);
  --shadow-modal: 0 8px 24px 0 rgba(0, 0, 0, 0.18);
  --shadow-button: 0 1px 2px 0 rgba(40, 52, 70, 0.05);
  --shadow-topbar: 0 1px 0 0 rgba(0, 0, 0, 0.08);

  /* Motion */
  --ease: cubic-bezier(0.5, 0, 0.2, 1);
  --ease-enter: cubic-bezier(0.2, 0.8, 0.3, 1);
  --t-fast: 100ms;
  --t-med: 150ms;
  --t-slow: 300ms;
  --t-toast: 400ms;
  --ease-exit: cubic-bezier(0.7, 0, 1, 1);

  /* Overlays (UI kit) */
  --backdrop: rgba(34, 36, 45, 0.48);
  --tooltip-bg: #22242d;
  --tooltip-key-bg: rgba(255, 255, 255, 0.16);
  --row-highlight: #2c75d9;
  --skeleton-base: #e8e9eb;
  --skeleton-shine: #f6f6f7;
  --badge-blue: #2c75d9;
  --badge-red: #d73d39;
  --nav-flyout-w: 240px;
  --shadow-floating: 0 0 1px 0 rgba(0, 0, 0, 0.16), 0 2px 4px 0 rgba(0, 0, 0, 0.06),
    0 6px 12px 0 rgba(0, 0, 0, 0.08), 0 12px 24px 0 rgba(0, 0, 0, 0.08);
  --z-popover: 60;
  --z-modal: 50;
  --z-confirm: 70;
  --z-tooltip: 90;
  --z-toast: 100;

  /* Top bar, search, banner (round 2) */
  --placeholder: #6a6d75;
  --mark-bg: #ffd85c;
  --tile-blue-bg: #e3eeff;
  --tile-blue: #2c6fc8;
  --pill-won: #2e8748;
  --pill-lost: #d73d39;
  --banner-bg: #eef5ff;
  --banner-border: #cfe0fb;
  --z-search-dim: 55;

  /* Shared menu rows: popover menus, select options, user menu (round 3, UX-006/007/014) */
  --menu-hover-bg: #2c75d9;
  --menu-hover-text: #ffffff;
  --label-row-selected: #e8f1fc; /* labels picker: a ticked row (UX-044) */
  --label-row-check: #2c75d9;
  --menu-radius: 8px;
  --menu-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.16), 0 4px 12px 0 rgba(0, 0, 0, 0.12), 0 12px 24px 0 rgba(0, 0, 0, 0.08);
  --menu-row-h: 36px;
  --menu-option-h: 34px;
  --menu-user-row-h: 44px;
  --menu-pill-bg: #2c75d9;

  /* Deals board (round 3, B-014) */
  --card-bg: #ffffff;
  --card-radius: 6px;
  --card-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.14), 0 1px 2px 0 rgba(0, 0, 0, 0.08);
  --card-shadow-hover: 0 3px 5px 0 rgba(0, 0, 0, 0.08), 0 0 4px 0 rgba(0, 0, 0, 0.12);
  --column-bg: #f4f4f6;
  --column-gap: 8px;
  --rotting-bg: #fdecea;
  --rotting-pill: #d73d39;
  --won-bg: #e5f5e8;
  --won-edge: #2e8748;
  --lost-bg: #fbe9e8;
  --lost-edge: #d73d39;
  --won-bg-hover: #d3eed9;
  --lost-bg-hover: #f6d8d6;
  --act-none: #f5c300;
  --act-today: #2e8748;
  --act-overdue: #d73d39;
  --act-planned: #b4b6bb;
  --act-ring: rgba(34, 36, 45, 0.18);
  --view-active-bg: #e3eeff;
  --view-active-border: #2c75d9;
  --new-pill-bg: #2c75d9;
  --reply-blue: #2c75d9;
  --stage-pick-bg: #e3e4e6;
  --stage-pick-hover: #cfd1d5;
  --stage-pick-on: #2e8748;
  --field-disabled-bg: #f0f1f3;

  /* Board drag and drop (round 4, B-016) */
  --card-shadow-drag: 0 6px 14px 0 rgba(0, 0, 0, 0.16), 0 0 4px 0 rgba(0, 0, 0, 0.14);
  --column-drop-bg: #e4e5e8;
  --drop-bar-bg: #ffffff;
  --drop-bar-h: 64px;
  --drop-bar-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.06), 0 -4px 12px 0 rgba(0, 0, 0, 0.06);
  --drop-zone-border: #d6d7da;
  --drop-zone-text: #64676e;
  --drop-zone-hover-bg: #d6d7da;
  --drop-lost: #d83c38;
  --drop-won: #2d8647;
  --z-drag: 80;

  /* Column quick add, pipeline menu (round 5, B-017 / B-018) */
  --col-add-h: 32px;
  --col-add-border: #c9cbd0;
  --col-add-icon: #8d9097;
  --col-add-hover-bg: #e8e9ec;
  --menu-check: #2c75d9;
  --pipeline-menu-w: 320px;

  /* Activities (round 5, B-036) */
  --prio-high: #d73d39;
  --prio-medium: #f2b500;
  --prio-medium-text: #6b4a00;
  --prio-low: #2c75d9;
  --act-type-active-bg: #e3eeff;
  --act-type-active-border: #2c75d9;
  --act-subject-fs: 20px;
  --daycal-hour-h: 48px;
  --daycal-line: #e6e7ea;
  --daycal-block-new: #2c75d9;
  --daycal-block-bg: #dce9fc;
  --daycal-block-edge: #2c75d9;
  --daycal-block-text: #173d72;
  --daycal-done-bg: #ecedef;
  --daycal-done-text: #6c6f76;
  --daycal-now: #d73d39;
  --chip-bg: #f0f1f3;

  /* Round 6: won follow-up tip, card activity popover, notifications, activities list, kit polish */
  --tip-bg: #eaf3ff;
  --tip-border: #c4dbfb;
  --tip-icon: #2c75d9;
  --tip-x-hover: rgba(44, 117, 217, 0.12);
  --actpop-w: 360px;
  --actpop-overdue: #d73d39;
  --actpop-today: #2e8748;
  --actpop-check: #b4b6bb;
  --actpop-check-hover: #2e8748;
  --notif-panel-w: 352px;
  --notif-unread-dot: #2c75d9;
  --notif-badge-bg: #d73d39;
  --ring-calls: #5aaee8;
  --ring-emails: #b4b6bb;
  --ring-activities: #3a9f9a;
  --ring-track: #e6e7ea;
  --delta-up: #2e8748;
  --delta-down: #d73d39;
  --missing-head-bg: #fde8e7;
  --missing-head-text: #c62828;
  --stage-done: #2e8748;
  --stage-todo: #e6e7ea;
  --chip-active-bg: #e3eeff;
  --chip-active-text: #0e69c4;
  --grid-line: #e6e7ea;
  --grid-head-bg: #ffffff;
  --grid-row-hover: #f5f6f7;
  --modal-head-h: 48px;
  --modal-foot-h: 56px;
  --modal-foot-bg: #f7f7f8;
  --placeholder-soft: #a0a3ab;
  --label-fs: 14px;
}