/* Datafly CRM - design refresh.
 *
 * Injected by the nginx sidecar over Twenty's PUBLIC --t-* design tokens
 * (993 of them, 3,647 references), so this survives upstream upgrades and
 * needs no fork.
 *
 * The problem being fixed: Twenty's stock light palette sits entirely within
 * 8% of white - body #fcfcfc against cards #fff, borders #ebebeb. There is
 * almost no figure/ground separation, so nothing reads as a box. Its greys are
 * also neutral, which reads as unstyled.
 *
 * The approach: HubSpot's structural contrast, in Datafly's own slate
 * (#6080a0) rather than HubSpot's blues, with Datafly green (#00c98d) as the
 * accent. Real separation between page and surface, borders you can actually
 * see, and slate-tinted text instead of flat #333.
 */
.light, :root {
  --t-background-primary: #ffffff;
  --t-background-secondary: #f4f6f8;
  --t-background-tertiary: #ecf0f4;
  --t-background-quaternary: #e2e8ee;
  --t-border-color-light: #dfe6ec;
  --t-border-color-medium: #ccd6e1;
  --t-border-color-strong: #acbdce;
  --t-font-color-primary: #20303f;
  --t-font-color-secondary: #435c74;
  --t-font-color-tertiary: #8da4bb;
  --t-font-color-light: #a8b9cb;
  --t-font-color-extra-light: #c3cfdb;
  --t-border-radius-sm: 6px;
  --t-border-radius-md: 10px;
  --t-border-radius-lg: 16px;
  --t-box-shadow-light: 0 1px 2px rgba(32,48,63,.06), 0 2px 6px rgba(32,48,63,.05);
  --t-box-shadow-strong: 0 2px 4px rgba(32,48,63,.08), 0 8px 24px rgba(32,48,63,.12);
  /* Card surfaces for the deal board (read by the fork's RecordCard). */
  --datafly-card-surface: #ffffff;
  --datafly-card-border: #dfe6ec;
  --datafly-card-border-hover: #c3cfdb;
  --datafly-card-shadow: 0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.05);
  --datafly-card-shadow-hover: 0 6px 16px rgba(16,24,40,.10);
  /* Deal board: columns stretch to fill the screen but never shrink below this;
     under it the board scrolls sideways. Read by the fork's board columns. */
  --datafly-board-column-min-width: 220px;
  --t-accent-accent1: #fafcfc;
  --t-accent-accent2: #f2faf8;
  --t-accent-accent3: #e3f7f1;
  --t-accent-accent4: #cff5e9;
  --t-accent-accent5: #b4f3e0;
  --t-accent-accent6: #94f2d6;
  --t-accent-accent7: #6df3cb;
  --t-accent-accent8: #38fac0;
  --t-accent-accent9: #00f4ab;
  --t-accent-accent10: #00e09d;
  --t-accent-accent11: #0fb382;
  --t-accent-accent12: #174f3e;
  --t-accent-primary: #b4f3e0;
  --t-accent-secondary: #b4f3e0;
  --t-accent-tertiary: #e3f7f1;
  --t-accent-quaternary: #f2faf8;
  --t-accent-accent3570: #38fac0;
  --t-accent-accent4060: #38fac0;
  --t-color-blue1: #fafcfc;
  --t-color-blue2: #f2faf8;
  --t-color-blue3: #e3f7f1;
  --t-color-blue4: #cff5e9;
  --t-color-blue5: #b4f3e0;
  --t-color-blue6: #94f2d6;
  --t-color-blue7: #6df3cb;
  --t-color-blue8: #38fac0;
  --t-color-blue9: #00f4ab;
  --t-color-blue10: #00e09d;
  --t-color-blue11: #0fb382;
  --t-color-blue12: #174f3e;
  --t-color-blue: #00f4ab;
}

.dark {
  --t-background-primary: #121a23;
  --t-background-secondary: #0c1218;
  --t-background-tertiary: #16222c;
  --t-background-quaternary: #1b2835;
  --t-border-color-light: #3b4956;
  --t-border-color-medium: #4d5965;
  --t-border-color-strong: #6c7680;
  --t-font-color-primary: #eff2f6;
  --t-font-color-secondary: #98acc1;
  --t-font-color-tertiary: #6080a0;
  --t-font-color-light: #4d6883;
  --t-font-color-extra-light: #405870;
  --t-border-radius-sm: 6px;
  --t-border-radius-md: 10px;
  --t-border-radius-lg: 16px;
  --t-box-shadow-light: 0 1px 2px rgba(32,48,63,.06), 0 2px 6px rgba(32,48,63,.05);
  --t-box-shadow-strong: 0 2px 4px rgba(32,48,63,.08), 0 8px 24px rgba(32,48,63,.12);
  /* Card surfaces. background-primary is darker than the column in this
     palette, so cards need their own, lighter surface to sit ON the column. */
  --datafly-card-surface: #1b2835;
  --datafly-card-border: rgba(255,255,255,.07);
  --datafly-card-border-hover: rgba(255,255,255,.16);
  --datafly-card-shadow: 0 1px 2px rgba(0,0,0,.25);
  --datafly-card-shadow-hover: 0 6px 18px rgba(0,0,0,.45);
  --t-accent-accent1: #0d1915;
  --t-accent-accent2: #0d231d;
  --t-accent-accent3: #10372c;
  --t-accent-accent4: #104c3a;
  --t-accent-accent5: #10634a;
  --t-accent-accent6: #0f7d5c;
  --t-accent-accent7: #0da074;
  --t-accent-accent8: #05d194;
  --t-accent-accent9: #00f4ab;
  --t-accent-accent10: #0fffb7;
  --t-accent-accent11: #68f3c9;
  --t-accent-accent12: #d7f4eb;
  --t-accent-primary: #10634a;
  --t-accent-secondary: #10634a;
  --t-accent-tertiary: #10372c;
  --t-accent-quaternary: #0d231d;
  --t-accent-accent3570: #05d194;
  --t-accent-accent4060: #05d194;
  --t-color-blue1: #0d1915;
  --t-color-blue2: #0d231d;
  --t-color-blue3: #10372c;
  --t-color-blue4: #104c3a;
  --t-color-blue5: #10634a;
  --t-color-blue6: #0f7d5c;
  --t-color-blue7: #0da074;
  --t-color-blue8: #05d194;
  --t-color-blue9: #00f4ab;
  --t-color-blue10: #0fffb7;
  --t-color-blue11: #68f3c9;
  --t-color-blue12: #d7f4eb;
  --t-color-blue: #00f4ab;
}
