@charset "UTF-8";
:root {
  --c-white: oklch(100% 0 0);
  --c-black: oklch(0% 0 0);
  --c-deep-cove: oklch(0.1928 0.0929 262.51);
  --c-denim: oklch(0.5391 0.1445 249.95);
  --c-navy-100: oklch(0.9774 0.0042 236.5);
  --c-navy-200: oklch(0.92 0.01 275.11);
  --c-navy-300: oklch(0.8 0.029 272.43);
  --c-navy-400: oklch(0.6454 0.0535 273.56);
  --c-navy-500: oklch(0.5382 0.0643 272.24);
  --c-navy-600: oklch(0.3291 0.0528 272.75);
  /* --- Primitive palette --- */
  /* Navy scale (sidebar / dark surfaces) */
  --color-navy-900: #161D31;
  --color-navy-700: #1E2840;
  --color-navy-600: #283352;
  --color-navy-50: #1a56c414;
  /* Blue (primary brand / interactive) */
  --color-blue-600: #1a56c4; /* AA-safe on white (5.2:1) */
  --color-blue-500: #4A8EF5;
  --color-blue-400-alpha: rgba(74,142,245,.18);
  --color-blue-50: #EEF4FF;
  --color-blue-25: #FCF8FE;
  /* Green (success) */
  --color-green-600: #0d7a56; /* AA-safe on white (5.5:1) */
  --color-green-500: #22C98A;
  --color-green-50: #E6FAF3;
  /* Gold / Amber (warning / draft) */
  --color-gold-600: #7a5200; /* AA-safe on white (7.6:1) */
  --color-gold-500: #F5A623;
  --color-gold-50: #FFF5E0;
  /* Red (danger / overdue) */
  --color-red-700: #b24242; /* AA-safe on white (4.5:1) */
  --color-red-600: #c0392b;
  --color-red-500: #F05A5A;
  --color-red-400-alpha: rgba(240, 90, 90, .18);
  --color-red-50: #FEE9E9;
  /* Neutrals */
  --color-white: #ffffff;
  --color-gray-50: #F8F9FC;
  --color-gray-100: #F0F2F7;
  --color-gray-200: #E2E6EF;
  --color-gray-300: #C8CFDE;
  --color-gray-400: #9AA3B8;
  --color-gray-600: #5C6478;
  --color-gray-900: #1E2840;
  /* Purple (avatar gradient end) */
  --color-purple-600: #6741D9;
  --color-purple-500: #7C5CF5;
  /* Microsoft Teams integration colour */
  --color-teams-bg: #e8eeff;
  /* Microsoft Teams integration colour */
  --color-teams-text: #2d3fac; /* 5.3:1 on teams-bg ✓ */
  /* --- Semantic aliases --- */
  /* Text */
  --text-primary: var(--color-gray-900);
  --text-secondary: var(--color-gray-600);
  --text-secondary: var(--color-gray-600);
  --text-muted: var(--color-gray-400);
  --text-placeholder:var(--color-gray-300);
  --text-on-dark: var(--color-white);
  --text-on-dark-muted: rgba(255,255,255,.7);
  /* Brand / interactive */
  --color-primary: var(--color-blue-600);
  --color-primary-hover: #1347a8;
  --color-primary-hover: #1347a8;
  --color-primary-glow: var(--color-blue-400-alpha);
  --color-primary-glow: var(--color-blue-400-alpha);
  /* Status colours */
  --color-success-text: var(--color-green-600);
  --color-success-text: var(--color-green-600);
  --color-success-bg: var(--color-green-50);
  --color-warning-glow: color-mix(in srgb, var(--color-gold-500) 18%, transparent);
  --color-warning: var(--color-gold-500);
  --color-danger-glow: color-mix(in srgb, var(--color-red-500) 18%, transparent);
  --color-success-glow: color-mix(in srgb, var(--color-green-500) 18%, transparent);
  --color-warning-text: var(--color-gold-600);
  --color-warning-bg: var(--color-gold-50);
  --color-danger: var(--color-red-500);
  --color-danger-text: var(--color-red-700);
  --color-danger-bg: var(--color-red-50);
  /* Surfaces */
  --surface-page: var(--color-gray-50);
  --surface-card: var(--color-white);
  --surface-sidebar: var(--color-navy-900);
  --surface-input: var(--color-gray-50);
  /* Borders */
  --border-default: var(--color-gray-200);
  --border-subtle: var(--color-gray-100);
  --border-sidebar: rgba(255,255,255,0.7);
  /* Focus ring — single source of truth for all focus styles */
  --focus-ring: 3px solid #1a56c4;
  --focus-offset: 2px;
  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,.06);
  --shadow-md: 0 4px 16px rgba(0,0,0,.08);
  /* Border radii */
  --radius: 10px;
  --radius-sm: 6px;
  /* Avatar gradient */
  --avatar-gradient: linear-gradient(135deg, var(--color-blue-500), var(--color-purple-500));
  --s-0: 0;
  --s-0_5: .125rem;
  --s-1: .25rem;
  --s-1_5: .375rem;
  --s-2: .5rem;
  --s-2_5: .625rem;
  --s-3: .75rem;
  --s-3_5: .875rem;
  --s-4: 1rem;
  --s-5: 1.25rem;
  --s-6: 1.5rem;
  --s-8: 2rem;
}

@layer base {
  :root {
    --s-0: 0;
    --s-0_5: 2rem;
    --s-1: 4rem;
    --s-1_5: 6rem;
    --s-2: 8rem;
    --s-2_5: 10rem;
    --s-3: 12rem;
    --s-3_5: 14rem;
    --s-4: 16rem;
    --s-5: 20rem;
    --s-6: 24rem;
    --s-8: 32rem;
  }
  :root {
    --c-background: var(--c-navy-100);
    --c-border: var(--c-navy-200);
    --c-input: oklch(0.98 0 0);
    --c-ring: var(--c-navy-300);
  }
  @font-face {
    font-family: "Galano Grotesque";
    src: url("/client/fonts/galano-grotesque-medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: "Galano Grotesque";
    src: url("/client/fonts/galano-grotesque-regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
  }
  :root {
    --f-family: "Galano Grotesque", sans-serif;
    --f-xxs: 10rem;
    --f-xs: 12rem;
    --f-sm: 14rem;
    --f-base: 16rem;
    --f-lg: 18rem;
    --f-xl: rem20;
    --f-2xl: 24rem;
    --t-instant: 0ms;
    --t-fast: 100ms;
    --t-base: 150ms;
    --t-slow: 250ms;
    --t-slower: 400ms;
    --e-linear: linear;
    --e-in: cubic-bezier(0.4, 0, 1, 1);
    --e-out: cubic-bezier(0, 0, 0.2, 1);
    --e-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --r-none: 0;
    --r-xs: 2rem;
    --r-sm: 4rem;
    --r-md: 6rem;
    --r-lg: 8rem;
    --r-xl: 12rem;
    --r-2xl: 16rem;
    --r-3xl: 24rem;
    --r-full: calc(infinity * 1px);
  }
  @keyframes pulse {
    0% {
      opacity: 1;
    }
    50% {
      opacity: 0.5;
    }
    100% {
      opacity: 1;
    }
  }
}
body {
  position: relative;
}
body #dvPopupContainer {
  position: absolute;
}
body #dvIndexMain .dvFullPageWithoutHeader {
  max-height: calc(100vh - 30px);
}
.pagefooter {
  height: 18px;
  line-height: 18px;
  bottom: 0;
  border-top: 1px solid rgb(188.7931034483, 208.1034482759, 241.2068965517);
  color: #000e3c;
  left: 0;
  position: fixed;
  width: 100%;
  min-width: 424px;
  background-color: white;
  z-index: 5;
  cursor: default;
  box-sizing: border-box;
}
.pagefooter::selection,
.pagefooter *:not(input):not(textarea)::selection {
  background: transparent;
  color: none;
  outline: none;
}
.pagefooter img {
  float: left;
}
.pagefooter a {
  margin-left: 15px;
  margin-right: 10px;
  text-decoration: underline;
  color: #000e3c;
}

#dvAppContainer {
  width: 100%;
  padding: 0px;
  margin: 0px;
}

#dvViewBlocker {
  width: 100vw;
  height: 100vh;
  position: fixed;
  left: 0px;
  top: 0px;
  display: block;
  z-index: 10;
  background: white;
}