/* Make It Urs look for Twenty (crm.makeiturs.co), served by Orbit at
   https://tasks.makeiturs.co/miu-crm/embed.css and linked after Twenty's own
   stylesheet (the CRM's compose file adds the tag; README "CRM in Orbit").

   Twenty's colours and font are CSS variables (--t-…) in .light and .dark
   blocks inside @layer twenty-ui; rules outside a layer win over them, so
   these replace Twenty's indigo with Orbit's Spanish Blue (#0773b5, Deep Blue
   #004b7a; #3d9ad6 in the dark theme) and its font with Orbit's. Plain hex
   values only: Twenty's theme copies the variables' text into JavaScript.

   Inside Orbit (the bridge sets data-miu-embedded and data-miu-nav on <html>)
   Twenty's own sidebar is hidden outside Settings: Orbit's sidebar lists the
   CRM's places instead. */

html.light,
html .light {
  --t-color-blue: #0773b5;
  --t-color-blue1: #fafcfe;
  --t-color-blue2: #f4f9fc;
  --t-color-blue3: #e9f2f8;
  --t-color-blue4: #daeaf4;
  --t-color-blue5: #c8e0ef;
  --t-color-blue6: #b2d4e8;
  --t-color-blue7: #94c3df;
  --t-color-blue8: #65a8d1;
  --t-color-blue9: #0773b5;
  --t-color-blue10: #06659f;
  --t-color-blue11: #004b7a;
  --t-color-blue12: #0b2c45;
  --t-color-transparent-blue1: #0773b505;
  --t-color-transparent-blue2: #0773b50c;
  --t-color-transparent-blue3: #0773b517;
  --t-color-transparent-blue4: #0773b526;
  --t-color-transparent-blue5: #0773b538;
  --t-color-transparent-blue6: #0773b54f;
  --t-color-transparent-blue7: #0773b56d;
  --t-color-transparent-blue8: #0773b59e;
  --t-color-transparent-blue9: #0773b5f7;
  --t-color-transparent-blue10: #06659ffa;
  --t-color-transparent-blue11: #004b7af2;
  --t-color-transparent-blue12: #0b2c45f2;
  --t-accent-accent1: #fafcfe;
  --t-accent-accent2: #f4f9fc;
  --t-accent-accent3: #e9f2f8;
  --t-accent-accent4: #daeaf4;
  --t-accent-accent5: #c8e0ef;
  --t-accent-accent6: #b2d4e8;
  --t-accent-accent7: #94c3df;
  --t-accent-accent8: #65a8d1;
  --t-accent-accent9: #0773b5;
  --t-accent-accent10: #06659f;
  --t-accent-accent11: #004b7a;
  --t-accent-accent12: #0b2c45;
  --t-accent-accent3570: #65a8d1;
  --t-accent-accent4060: #65a8d1;
  --t-accent-primary: #c8e0ef;
  --t-accent-secondary: #c8e0ef;
  --t-accent-tertiary: #e9f2f8;
  --t-accent-quaternary: #f4f9fc;
  --t-background-transparent-blue: #0773b517;
  --t-border-color-blue: #94c3df;
  --t-tag-background-blue: #e9f2f8;
  --t-tag-text-blue: #004b7a;
  --t-illustration-icon-color-blue: #65a8d1;
  --t-illustration-icon-fill-blue: #c8e0ef;
  --t-font-family: "Neue Haas Grotesk Text Pro", "Neue Haas Grotesk Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

html.dark,
html .dark {
  --t-color-blue: #3d9ad6;
  --t-color-blue1: #161b1e;
  --t-color-blue2: #171f24;
  --t-color-blue3: #1b2b35;
  --t-color-blue4: #1e3443;
  --t-color-blue5: #213e50;
  --t-color-blue6: #244860;
  --t-color-blue7: #285471;
  --t-color-blue8: #2d678c;
  --t-color-blue9: #3d9ad6;
  --t-color-blue10: #55a8df;
  --t-color-blue11: #7cbde8;
  --t-color-blue12: #d3e9f8;
  --t-color-transparent-blue1: #3d9ad60f;
  --t-color-transparent-blue2: #3d9ad617;
  --t-color-transparent-blue3: #3d9ad63c;
  --t-color-transparent-blue4: #3d9ad657;
  --t-color-transparent-blue5: #3d9ad66b;
  --t-color-transparent-blue6: #3d9ad67c;
  --t-color-transparent-blue7: #3d9ad690;
  --t-color-transparent-blue8: #3d9ad6ac;
  --t-color-transparent-blue9: #3d9ad6db;
  --t-color-transparent-blue10: #55a8dfe3;
  --t-color-transparent-blue11: #7cbde8;
  --t-color-transparent-blue12: #d3e9f8;
  --t-accent-accent1: #161b1e;
  --t-accent-accent2: #171f24;
  --t-accent-accent3: #1b2b35;
  --t-accent-accent4: #1e3443;
  --t-accent-accent5: #213e50;
  --t-accent-accent6: #244860;
  --t-accent-accent7: #285471;
  --t-accent-accent8: #2d678c;
  --t-accent-accent9: #3d9ad6;
  --t-accent-accent10: #55a8df;
  --t-accent-accent11: #7cbde8;
  --t-accent-accent12: #d3e9f8;
  --t-accent-accent3570: #2d678c;
  --t-accent-accent4060: #2d678c;
  --t-accent-primary: #213e50;
  --t-accent-secondary: #213e50;
  --t-accent-tertiary: #1b2b35;
  --t-accent-quaternary: #171f24;
  --t-background-transparent-blue: #3d9ad657;
  --t-border-color-blue: #285471;
  --t-tag-background-blue: #1b2b35;
  --t-tag-text-blue: #7cbde8;
  --t-illustration-icon-color-blue: #55a8df;
  --t-illustration-icon-fill-blue: #d3e9f8;
  --t-font-family: "Neue Haas Grotesk Text Pro", "Neue Haas Grotesk Text", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Twenty also sets Inter on body directly. */
html body {
  font-family: var(--t-font-family);
}

/* Inside Orbit: Twenty's own sidebar gives way to Orbit's (outside Settings,
   whose menu lives there), and so does the button that would bring it back. */
html[data-miu-nav]:not([data-miu-settings]) [data-click-outside-id="navigation-drawer"],
html[data-miu-nav]:not([data-miu-settings]) button[aria-label="Expand sidebar"] {
  display: none !important;
}

/* Phones: Twenty's bottom bar keeps Search and the AI chat; its Home (Twenty's
   own menu page) is Orbit's sidebar here. */
html[data-miu-nav] nav button[aria-label="Home"] {
  display: none !important;
}

/* The bridge's notes in the sign-in popup and the frame. */
#miu-crm-done,
#miu-crm-continue {
  position: fixed;
  z-index: 2147483647;
  left: 50%;
  bottom: 24px;
  transform: translateX(-50%);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  max-width: calc(100vw - 32px);
  padding: 12px 16px;
  border-radius: 12px;
  background: #ffffff;
  color: #353535;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
  font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#miu-crm-continue p {
  margin: 0;
}
#miu-crm-continue button {
  border: 0;
  border-radius: 8px;
  padding: 6px 12px;
  font: inherit;
  cursor: pointer;
  background: #f1f1f1;
  color: #353535;
}
#miu-crm-continue button:first-of-type {
  background: #0773b5;
  color: #ffffff;
}