html,
body {
  height: 100%;
  overflow: hidden;
}

#unitydesk-service-provider-root {
  z-index: 2147483647;
  margin-right: 16px;
}

#root {
  height: calc(100vh - 50px);
  margin-top: 50px;
  overflow: hidden;
}

#root .h-svh,
#root .min-h-svh {
  height: calc(100svh - 50px) !important;
  min-height: calc(100svh - 50px) !important;
}

#root [data-slot="sidebar-container"].fixed,
#root [data-slot="sidebar-container"] {
  top: 50px !important;
  height: calc(100svh - 50px) !important;
}

#root > main,
#root main {
  overflow: hidden !important;
}

#top-nav {
  position: fixed;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 50px;
  padding-left: 1rem;
  background-color: #ffffff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.dark #top-nav {
  background-color: #141b26db;
}

#top-nav .nav-logo-dark {
  display: none;
}

.dark #top-nav .nav-logo {
  display: none;
}

.dark #top-nav .nav-logo-dark {
  display: block;
}

#top-nav .nav-logo,
#top-nav .nav-logo-dark {
  height: 1.5rem;
  padding-left: 0.75rem;
}

/* The frame of the apps menu panel. */
:root {
  --unitystack-menu-frame: var(--sidebar);
}

/* UnityStack dark palette (the dashboard's --ud-* navy tokens). :root.dark outranks Kaneo's .dark in any load order. */
:root.dark {
  --unitystack-menu-frame: #2a3442;
  color-scheme: dark;
  --background: #0e1420;
  --sidebar: #0e1420;
  --foreground: #f1f5f9;
  --card-foreground: #f1f5f9;
  --popover-foreground: #f1f5f9;
  --muted-foreground: #93a1b4;
  --sidebar-foreground: #d2dbe7;
  --card: #171e2a;
  --popover: #171e2a;
  --code: #171e2a;
  --border: #2a3442;
  --sidebar-border: #2a3442;
  --primary: #124cca;
  --primary-foreground: #ffffff;
  /* Lighter than --primary: focus rings need 3:1 against the navy canvas. */
  --ring: #3b82f6;
  --sidebar-ring: #3b82f6;
  --unitystack-primary-text: #60a5fa;
  /* Task cards, chips and avatars (Kaneo 2.47+) on the same navy tokens instead of Kaneo's neutral greys. */
  --board-card: #171e2a;
  --board-card-selected: #1e2c49;
  --board-card-selected-border: #31456f;
  --board-card-focus: #3b82f6;
  --board-card-ring: #3b82f633;
  --board-id: #6b7a8d;
  --board-title: #f1f5f9;
  --board-title-done: #6b7a8d;
  --chip-foreground: #d2dbe7;
  --chip-muted: #93a1b4;
  --chip-icon: #93a1b4;
  --avatar: #233250;
  --avatar-selected: #31456f;
  --avatar-done: #212a38;
  --avatar-foreground: #d2dbe7;
  --avatar-foreground-done: #6b7a8d;
  --avatar-unassigned: #212a38;
  --avatar-unassigned-foreground: #93a1b4;
}

/* Kaneo also colours text and solid borders with --primary. #124cca is 2.6:1 on navy, so in dark mode these use a
   lighter blue (6:1 or more on every navy surface) while buttons and checkboxes keep the brand blue fill. */
:root.dark .text-primary,
:root.dark .\[\&\>a\:hover\]\:text-primary > a:hover,
:root.dark :is(.not-data-selected\:\*\:text-primary:not([data-selected]) > *),
:root.dark .kaneo-mention {
  color: var(--unitystack-primary-text);
}

:root.dark .border-primary,
:root.dark .group-data-completed\/timeline-item\:border-primary:is(:where(.group\/timeline-item)[data-completed] *) {
  border-color: var(--unitystack-primary-text);
}