.sidenav {
  width: fit-content;
  z-index: 100;
  border-right: 1px solid var(--p-surface-200);
}
.sidenav-content {
  width: 55px;
  background-color: var(--p-surface-0);
}
.sidenav .sidenav-content .p-menu,
.sidenav .sidenav-content .p-tieredmenu {
  min-width: 100%;
  border-width: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.sidenav .p-menu,
.sidenav .p-tieredmenu,
.sidenav .p-tieredmenu {
  padding: 0;
}
.sidenav a {
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  color: inherit;
  width: 100%;
}
.sidenav .p-tieredmenu-header a,
.sidenav .p-menu a {
  padding-top: 1rem;
  padding-right: 1rem;
  padding-bottom: 1rem;
  padding-left: 1rem;
}
.sidenav .p-submenu-list a {
  padding-top: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: calc(1rem + 24px);
}
/** Items color */
/** active -- .router-link-active doesn't exist in v4 or for tierdmenu Oo */
.sidenav a.active-route {
  background-color: var(--p-primary-color);
  color: var(--p-primary-contrast-color);
}
.sidenav a.active-route .label,
.sidenav a.active-route .pi {
  color: var(--p-primary-contrast-color);
}
/** inactive */
.sidenav .p-tieredmenu .p-tieredmenu-panel .p-tieredmenu-header a,
.sidenav .p-tieredmenu .p-menuitem .p-menuitem-content a,
.sidenav .p-menu .p-menuitem .p-menuitem-content a {
  color: var(--p-text-muted-color);
}

header[data-v-bc68ec40] {
    height: 60px;
}
header .p-breadcrumb[data-v-bc68ec40] {
    background: none;
}
header .p-breadcrumb a[data-v-bc68ec40] {
    text-decoration: none;
}
:root {
  --font-family: Inter, Roboto, 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial,
    'Lucida Grande', sans-serif;
  --text-xs: 0.75rem !important;
  --text-sm: 0.875rem !important;
  --text-base: 1rem !important;
  --text-lg: 1.125rem !important;
  --text-xl: 1.25rem !important;
  --text-2xl: 1.5rem !important;
  --text-3xl: 1.75rem !important;
  --text-4xl: 2rem !important;
  --text-5xl: 2.5rem !important;
  --text-6xl: 3rem !important;
  --text-7xl: 4rem !important;
  --text-8xl: 6rem !important;
  /* to match dt column focus/hover color */
  --surface-focus: var(--p-surface-200); /*rgba(0, 0, 0, .03);*/
  --surface-hover: var(--p-surface-200); /*rgba(0, 0, 0, .04); is being overid no matter what Oo */
  --contrast-focus: rgba(256, 256, 256, 0.03); /* can be transparent bc goes over color */
  --contrast-hover: rgba(256, 256, 256, 0.03); /* can be transparent bc goes over color */
  /* more vibrant green (to use when updating theme) */
  --lime-100: #caf1d8;
  --lime-200: #a0e6ba;
  --lime-300: #76db9b;
  --lime-400: #4cd07d;
  --lime-500: #22c55e;
  --lime-600: #1da750;
  --lime-700: #188a42;
  --lime-800: #136c34;
  --lime-900: #0e4f26; 
  /* default shadow on card/panel */
  --shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14),
    0 1px 3px 0 rgba(0, 0, 0, 0.12);
  /* default gridline color */
  --grid-line: var(--p-surface-200);
  --grid-line-dark: var(--p-surface-400);
  /* prevents see through when there are frozen columns >< */
  --p-datatable-header-cell-selected-background: var(--p-primary-50);
  /* reduce or remove unecesary padding to make compact */
  --p-tieredmenu-list-padding: 0px;
  --p-card-body-padding: 0.75rem;
}
@layer reset {
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
  * {
    margin: 0;
    padding: 0;
  }

  body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  /* Improve scrolling behavior */
  @media (prefers-reduced-motion: no-preference) {
    html {
      scroll-behavior: smooth;
    }
    :has(:target) {
      scroll-behavior: smooth;
      scroll-padding-top: 2rem;
    }
  }

  /* responsive images/videos */
  img,
  picture,
  svg,
  video {
    display: block;
    max-width: 100%;
  }

  /* Improved heading & paragraph in supported browsers */
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    text-wrap: balance;
  }
  p {
    text-wrap: pretty;
  }
}
@layer app-styles {
  /* Font size of button - easier to read */
  .p-button {
    font-weight: 400;
  }
  /** icon matching text color for tooglebutton's button */
  .p-togglebutton .p-button {
    .p-button-icon-left,
    .p-button-icon-right {
      color: inherit;
    }
  }
  /* match theme for SelectButton */
  .p-selectbutton .p-button {
    border: 1px solid rgba(0, 0, 0, 0.38);
    &:not(.p-highlight) {
      color: rgba(0, 0, 0, 0.6);
    }
  }
  .p-selectbutton[severity='primary'] .p-button {
    /*color: var(--p-primary-color);*/
    &.p-highlight {
      color: var(--p-primary-color-text);
      background: var(--p-primary-color);
    }
  }
  .p-selectbutton[severity='info'] .p-button {
    /*color: var(--p-blue-500);*/
    &.p-highlight {
      /*color: var(--p-primary-color-text);*/
      background: var(--p-blue-100);
    }
  }
  .p-selectbutton[severity='help'] .p-button {
    /*color: var(--p-purple-500);*/
    &.p-highlight {
      /*color: var(--p-primary-color-text);*/
      background: var(--p-purple-100);
    }
  }
  .p-selectbutton[severity='success'] .p-button {
    /*color: var(--p-green-500);*/
    &.p-highlight {
      /*color: var(--p-primary-color-text);*/
      background: var(--p-green-100);
    }
  }
  .p-selectbutton[severity='danger'] .p-button {
    /*color: var(--p-red-500);*/
    &.p-highlight {
      /*color: var(--p-primary-color-text);*/
      background: var(--p-red-100);
    }
  }
  .p-selectbutton[severity='warn'] .p-button {
    /*color: var(--p-orange-500);*/
    &.p-highlight {
      /*color: var(--p-primary-color-text);*/
      background: var(--p-orange-100);
    }
  }
  .p-selectbutton[severity='contrast'] .p-button {
    background: black;
    &.p-highlight {
      color: white;
      background: black;
    }
  }
  /** custom general classes */
  /** replace w-full h-full max-w-full max-h-full */
  .self-contained {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
  /** replace w-full h-full max-w-full max-h-full overflow-auto */
  .self-contained-auto {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    overflow: auto !important;
  }
  /** replace w-full h-full max-w-full max-h-full overflow-hidden */
  .self-contained-hidden {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
  }
  /** replace h-full max-h-full */
  .self-contained-h {
    height: 100% !important;
    max-height: 100% !important;
  }
  /** replace h-full max-h-full overflow-x-hidden overflow-y-scroll */
  .self-contained-h-scroll {
    height: 100% !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
  }
  /** replace h-full max-h-full overflow-x-hidden overflow-y-auto */
  .self-contained-h-auto {
    height: 100% !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  /** replace w-full max-w-full */
  .self-contained-w {
    width: 100% !important;
    max-width: 100% !important;
  }
  /** replace w-full max-w-full overflow-x-scroll overflow-y-hidden */
  .self-contained-w-scroll {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: scroll !important;
    overflow-y: hidden !important;
  }
  /** replace w-full max-w-full overflow-x-auto overflow-y-hidden */
  .self-contained-w-auto {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  /* modification and/or overwrite of primevue classes */
  /* add active class for menu (so active and focus/hover are distinguishable */
  .p-tieredmenu-item.p-active > .p-tieredmenu-item-content,
  .p-menu-item.p-active .p-menu-item-content {
    color: var(--p-navigation-item-active-color);
    background: var(--p-navigation-item-active-background);
  }
  .p-tabview .p-tabview-panels {
    /** fix to weird problem:
    * classes on .p-tabview-panel (set with contentClass) 
    * affecting size based on parent can't work because
    * the real parent is .p-tabview-panels and not .p-tabview!
    * afaik, there's no way to put a class on .p-tabview-panels  
    * Structure is: 
    * <div class=".p-tabview [custom classes]">
    *   <div class="p-tabview-panels"> <-- can't put classes here!
    *     <div class="p-tabview-panel [custom classes]">
  */
    width: inherit;
    max-width: inherit;
    height: inherit;
    max-height: inherit;
    overflow: inherit;
    padding: inherit;
  }

  /* Fixes a bug where the tab underline was being cut off by overflow-hidden */
  .p-tablist {
    flex-shrink: 0;
  }
  .p-tabview-nav-container {
    min-height: fit-content;
  }
  .p-column-filter-overlay {
    max-width: 25rem;
  }
  html,
  body {
    height: 100%;
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    font-family: var(--font-family);
  }

  #app {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    color: var(--p-text-color);
    background: var(--p-surface-50);
    line-height: 1.2;
    font-family: var(--font-family);
  }

  /* DATEPICKER */
  /* prevent datepicker from being squished */
  .p-datepicker:not(.p-datepicker-inline) {
    min-width: min-content;
  }
  /* DATATABLE */
  /* size = small*/
  .p-datatable.p-datatable-sm,
  .p-datatable.p-datatable-gridlines.p-datatable-sm {
    .p-datatable-thead > tr > th .p-datatable-column-header-content,
    .p-datatable-tfoot > tr > td {
      font-size: var(--text-sm);
    }
    .p-datatable-tbody > tr > td,
    .p-datatable-tbody > tr > td *,
    .p-datatable-tfoot > tr > td,
    .p-datatable-tfoot > tr > td *,
    .p-editable-column.p-cell-editing {
      font-size: var(--text-xs) !important;
    }
    .p-datatable-tbody > tr > td,
    .p-datatable-tfoot > tr > td {
      .p-inputtext,
      .p-inputtext.p-component.p-inputnumber-input {
        padding: 0.1rem 0.25rem !important;
        width: 100%;
      }
      .p-calendar-w-btn button {
        padding: 0 !important; /* NOTE: this fixes an overlooked size issue in the PrimeVue theme: 'size=small' doesn't apply to calendar */
      }
      &:not(.p-datatable-frozen-column) {
        .p-inputtext,
        .p-inputtext.p-component.p-inputnumber-input {
          text-align: end;
        }
      }
    }
    .p-editable-column.p-cell-editing {
      padding: 0;
    }
    .p-button-icon,
    .p-button-label,
    .p-dropdown-label,
    .p-paginator .p-inputtext,
    .p-paginator .p-select-label,
    .p-paginator .p-paginator-page {
      font-size: var(--text-sm);
    }
    .p-paginator {
      .p-icon {
        width: var(--text-sm);
        height: var(--text-sm);
      }
      .p-paginator-first,
      .p-paginator-prev,
      .p-paginator-next,
      .p-paginator-last,
      .p-paginator-pages .p-paginator-page,
      .p-dropdown {
        height: 2rem;
      }
      .p-paginator-pages .p-paginator-page,
      .p-dropdown .p-dropdown-trigger {
        min-width: 2rem;
        width: 2rem;
      }
    }
    .p-inputtext,
    .p-inputtext.p-component.p-inputnumber-input {
      padding: 0.5rem 0.75rem !important;
    }
  }
  /* general */
  .p-datatable:not(.p-datatable-sm),
  .p-datatable.p-datatable-gridlines:not(.p-datatable-sm) {
    .p-datatable-thead > tr > th .p-datatable-column-header-content,
    .p-datatable-tfoot > tr > td {
      font-size: var(--text-base);
    }
    .p-datatable-tbody > tr > td,
    .p-datatable-tbody > tr > td *,
    .p-datatable-tfoot > tr > td,
    .p-datatable-tfoot > tr > td *,
    .p-editable-column.p-cell-editing {
      font-size: var(--text-sm) !important;
      .p-inputtext,
      .p-inputtext.p-component.p-inputnumber-input {
        padding: 0.2rem 0.5rem !important;
        width: 100%;
        text-align: end;
      }
    }
    .p-editable-column.p-cell-editing {
      padding: 0;
    }
  }
  .p-datatable,
  .p-datatable.p-datatable-gridlines,
  .p-datatable.p-datatable-sm {
    .p-datatable-thead,
    .p-datatable-tbody {
      vertical-align: bottom;
      & > tr {
        & > th {
          padding: 0.25em 0.5em;
        }
        & > td {
          line-height: 1;
          padding: 0.25em 0.5em;
          white-space: nowrap;
        }
      }
    }
    /* conditional formating: color cells */
    .p-datatable-tbody > tr > td,
    .p-datatable-tfoot > tr > td {
      &.yellow,
      &:has(.yellow) {
        background-color: var(--p-yellow-200);
        color: var(--p-yellow-900);
      }
      &.green,
      &:has(.green) {
        background-color: var(--p-green-200);
        color: var(--p-green-900);
      }
      &.blue,
      &:has(.blue) {
        background-color: var(--p-blue-200);
        color: var(--p-blue-900);
      }
      &.orange,
      &:has(.orange) {
        background-color: var(--p-orange-200);
        color: var(--p-orange-900);
      }
      &.purple,
      &:has(.purple) {
        background-color: var(--p-purple-200);
        color: var(--p-purple-900);
      }
      &.red,
      &:has(.red) {
        background-color: var(--p-red-200);
        color: var(--p-red-900);
      }
    }

    td[data-p-editable-column='true'] {
      color: var(--p-blue-700);
    }
  }
  .p-datatable:not(.p-datatable-gridlines) .p-datatable-header {
    border-width: 0;
  }
  .p-datatable,
  .p-datatable.p-datatable-gridlines {
    .p-datatable-thead > tr > th > .p-datatable-column-header-content {
      min-width: 5rem;
    }
    .p-datatable-thead > tr > th > .p-datatable-column-header-content > *:first-child,
    .p-datatable-tbody > tr > td {
      width: 100%;
      text-align: inherit;
    }
    .p-datatable-thead > tr > th:not(.p-datatable-frozen-column),
    .p-datatable-tbody > tr:not(.p-datatable-emptymessage) > td:not(.p-datatable-frozen-column),
    .p-datatable-tfoot > tr > td:not(.p-datatable-frozen-column) {
      text-align: center;
    }
    .p-datatable-tbody > tr.p-datatable-emptymessage > td {
      padding: 1rem 2rem;
    }
  }
  .p-datatable:not(.p-datatable-gridlines) .p-datatable-thead > tr > th {
    border-bottom-width: 0;
  }
  .p-datatable.p-datatable-gridlines,
  .p-datatable:not(.p-datatable-gridlines) {
    border-color: var(--grid-line);
    .p-datatable-thead > tr:nth-last-child(5) > th[rowspan='5'],
    .p-datatable-thead > tr:nth-last-child(4) > th[rowspan='4'],
    .p-datatable-thead > tr:nth-last-child(3) > th[rowspan='3'],
    .p-datatable-thead > tr:nth-last-child(2) > th[rowspan='2'],
    .p-datatable-thead > tr:last-child > th,
    .p-datatable-tbody > tr:last-child > td {
      border-bottom-width: 1px;
      border-bottom-color: var(--grid-line-dark);
    }
    .p-datatable-thead > tr > th:nth-last-child(1 of .p-datatable-frozen-column),
    .p-datatable-tbody > tr > td:nth-last-child(1 of .p-datatable-frozen-column),
    .p-datatable-tfoot > tr > td:nth-last-child(1 of .p-datatable-frozen-column) {
      border-right-width: 1px;
      border-right-color: var(--grid-line-dark);
    }
  }
  .p-datatable:not(.p-datatable-gridlines) .p-datatable-tfoot > tr > td {
    border-width: 0;
  }

  /* prevents see through when there are frozen columns >< */
  /*... on stripped rows */
  .p-datatable:not(.p-datatable-striped) .p-sortable-column,
  .p-datatable:not(.p-datatable-striped) .p-sortable-column.p-datatable-frozen-column,
  .p-datatable.p-datatable-striped .p-row-even td {
    background-color: var(--p-surface-0);
  }
  .p-datatable.p-datatable-striped .p-row-odd td {
    background-color: var(--p-surface-50);
  }

  .p-datatable-scrollable .p-datatable-frozen-column {
    z-index: 1;
  }

  /* from primevue... gets overwritten somehow */
  .p-datatable-tfoot > tr > td {
    background: var(--p-datatable-footer-cell-background);
  }
  /* gridlines are buggy in V3, better to avoid 

/* make gridlines not transparent *
.p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th:not(:first-child),
.p-datatable.p-datatable-gridlines .p-datatable-tbody > tr > td:not(:first-child),
.p-datatable.p-datatable-gridlines .p-datatable-tfoot > tr > td:not(:first-child) {
  border-color: var(--grid-line);
}
/* make gridlines compatible with frozen columns 
.p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th:not(:first-child),
.p-datatable.p-datatable-gridlines .p-datatable-tbody > tr > td:not(:first-child),
.p-datatable.p-datatable-gridlines .p-datatable-tfoot > tr > td:not(:first-child) {
  border-width: 0 1px 1px 0;
}
.p-datatable.p-datatable-gridlines .p-datatable-thead > tr > th:first-child,
.p-datatable.p-datatable-gridlines .p-datatable-tbody > tr > td:first-child,
.p-datatable.p-datatable-gridlines .p-datatable-tfoot > tr > td:first-child {
  border-width: 0 1px 1px 1px;
}
*
/* remove weird gap between frozen columns *
.p-datatable.p-datatable-gridlines .p-datatable-thead,
.p-datatable.p-datatable-gridlines .p-datatable-tbody,
.p-datatable.p-datatable-gridlines .p-datatable-tfoot {
  tr > .p-datatable-frozen-column:not(:first-child) {
    &:not(:has(.footer-row)) {
      border-width: 0 0 1px 1px;
    }
    &:has(.footer-row) {
      border-width: 1px 1px 1px 0;
    }
    &:not(:has(.footer-row)):before,
    .footer-row:before {
      content: '';
      position: absolute;
      height: calc(1px + 100%);
      width: 2px;
      left: -2px;
      top: 0;
      border-width: 0 0 1px 1px;
      border-color: inherit;
      border-style: solid;
      background-color: inherit;
    }
  }
}
/* remove gridlines from header *
.p-datatable.p-datatable-gridlines .p-datatable-header {
  border-width: 0;
}
*/
  .p-datatable:has(.p-column-filter),
  .p-datatable:has(.p-sortable-column),
  .p-datatable.p-datatable-scrollable:has(.p-sortable-column),
  .p-datatable.p-datatable-scrollable:has(.p-column-filter) {
    .p-datatable-header {
      background: var(--p-surface-0);
      display: flex;
      flex-direction: column;
      gap: 0.5rem;
    }
    tr {
      .p-datatable-column-header-content {
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: end;
        span {
          flex-shrink: 0;
        }
        span:not(.p-column-title) {
          margin-top: 0.5em !important;
          margin-bottom: 0.5em !important;
        }
      }
    }
  }
  /* display more entries when selecting colums  */
  #app:has(.p-datatable.analysis) ~ .p-multiselect-panel.p-component .p-multiselect-items-wrapper {
    max-height: 400px !important;
    .p-multiselect-items .p-multiselect-item {
      font-size: var(--text-sm); /* matches input box font-size */
      padding: 0.375rem 0.75rem; /* matches input box padding */
    }
  }

  /* PANELS */
  /* make the toggle icon align right when no title */
  .p-panel .p-panel-header .p-panel-icons {
    margin-left: auto;
  }
}
/* fix size for small inputtext on InputGroup */
.p-inputgroup:has(.p-inputtext-sm) .p-inputgroupaddon {
  font-size: var(--p-inputtext-sm-font-size);
  padding-block: var(--p-inputtext-sm-padding-y);
  padding-inline: var(--p-inputtext-sm-padding-x);
}