/* /Components/Layout/MainLayout.razor.rz.scp.css */
#blazor-error-ui[b-opqko77hdm] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-opqko77hdm] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/PageHeader.razor.rz.scp.css */
.tt-user-menu__trigger[b-ya7fav4h5e] {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  color: inherit;
  font-size: 1.2rem;
  transition: background-color 0.15s;
}

.tt-user-menu__trigger:hover[b-ya7fav4h5e] {
  background-color: rgba(0, 0, 0, 0.05);
}

.tt-user-menu__panel[b-ya7fav4h5e] {
  min-width: 260px;
  overflow: hidden;
  border-radius: 6px;
  background: #fff;
}

.tt-user-menu__header[b-ya7fav4h5e] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: linear-gradient(135deg, #1dc9b7 0%, #886aea 100%);
  color: #fff;
}

.tt-user-menu__avatar[b-ya7fav4h5e] {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  flex-shrink: 0;
}

.tt-user-menu__name[b-ya7fav4h5e] {
  font-size: 1rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tt-user-menu__item[b-ya7fav4h5e] {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  padding: 12px 16px;
  width: 100%;
  border: none;
  background: none;
  color: #333;
  text-decoration: none;
  font-size: inherit;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.15s;
}

.tt-user-menu__panel form[b-ya7fav4h5e] {
  margin: 0;
}

.tt-user-menu__item:hover[b-ya7fav4h5e] {
  background-color: #f5f5f5;
  color: #333;
  text-decoration: none;
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-248rq7okzm],
.components-reconnect-repeated-attempt-visible[b-248rq7okzm],
.components-reconnect-failed-visible[b-248rq7okzm],
.components-pause-visible[b-248rq7okzm],
.components-resume-failed-visible[b-248rq7okzm],
.components-rejoining-animation[b-248rq7okzm] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-retrying[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-failed[b-248rq7okzm],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-248rq7okzm] {
    display: block;
}


#components-reconnect-modal[b-248rq7okzm] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-248rq7okzm 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-248rq7okzm 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-248rq7okzm 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-248rq7okzm]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-248rq7okzm 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-248rq7okzm {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-248rq7okzm {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-248rq7okzm {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-248rq7okzm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-248rq7okzm] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-248rq7okzm] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-248rq7okzm] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-248rq7okzm] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-248rq7okzm] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-248rq7okzm] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-248rq7okzm 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-248rq7okzm] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-248rq7okzm {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Administration/CompanyStructure.razor.rz.scp.css */
.mud-company-panel-header[b-o2pi4a1ezq] {
  display: flex;
  align-items: center;
  height: 52px;
  overflow: visible;
  padding: 12px 16px;
  border-bottom: 1px solid var(--mud-palette-lines-default);
}

.mud-company-panel-title[b-o2pi4a1ezq] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
}

.mud-company-panel-body[b-o2pi4a1ezq] {
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px;
}

.mud-company-tree-area[b-o2pi4a1ezq] {
  overflow-y: auto;
}

.mud-company-users-area[b-o2pi4a1ezq] {
  overflow: hidden;
  display: flex;
  min-height: 0;
}

.mud-company-users-area[b-o2pi4a1ezq]  .mud-company-users-table {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  width: 100%;
}

.mud-company-users-area[b-o2pi4a1ezq]  .mud-company-users-table .mud-table-root,
.mud-company-users-area[b-o2pi4a1ezq]  .mud-company-users-table .mud-table-container,
.mud-company-users-area[b-o2pi4a1ezq]  .mud-company-users-table .mud-table-root table {
  width: 100%;
}

.mud-company-users-area[b-o2pi4a1ezq]  .mud-company-users-table .mud-table-container {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  overflow-y: auto;
}

.mud-company-loading[b-o2pi4a1ezq] {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 160px;
}

.mud-company-tree-row[b-o2pi4a1ezq] {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 32px;
  padding-right: 4px;
  border-radius: 4px;
}

.mud-company-tree-row-selected[b-o2pi4a1ezq] {
  background: rgba(25, 118, 210, 0.08);
}

.mud-company-node-icon[b-o2pi4a1ezq] {
  font-size: 14px;
  width: 16px;
}

.mud-company-node-text[b-o2pi4a1ezq] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mud-company-tree-actions[b-o2pi4a1ezq] {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  opacity: 1;
  visibility: visible;
}

@media (max-width: 960px) {
  .mud-company-content[b-o2pi4a1ezq] {
    min-height: auto;
  }

  .mud-company-panel[b-o2pi4a1ezq] {
    min-height: 420px;
  }
}
/* /Components/Pages/Administration/NoneWorkDays.razor.rz.scp.css */
/* The pager toolbar's own border-top is removed globally in site.css — every admin grid's
   PagerContent shares this layout. */

/* .mud-table-container is overflow-y:auto with a fractional CSS height (needed to size to the last
   row's content). clientHeight/scrollHeight report no overflow, but Chromium's paint-time clip mask
   for that fractional box rounds to slightly less than the true layout height, so the last row's
   border-bottom — sitting right at that edge — gets clipped away almost entirely. This grid never
   needs to scroll vertically (no fixed Height, pagination replaces rows rather than scrolling to
   them), so dropping the vertical clip is safe; horizontal scroll for wide content is unaffected
   since only the Y axis is overridden. */
[b-afsd97h71q] .mud-table-container {
  overflow-y: visible;
}
/* /Components/Pages/Administration/TeamRoles.razor.rz.scp.css */
/* The pager toolbar's own border-top is removed globally in site.css — every admin grid's
   PagerContent shares this layout. */

/* .mud-table-container is overflow-y:auto with a fractional CSS height (needed to size to the last
   row's content). clientHeight/scrollHeight report no overflow, but Chromium's paint-time clip mask
   for that fractional box rounds to slightly less than the true layout height, so the last row's
   border-bottom — sitting right at that edge — gets clipped away almost entirely. This grid never
   needs to scroll vertically (no fixed Height, pagination replaces rows rather than scrolling to
   them), so dropping the vertical clip is safe; horizontal scroll for wide content is unaffected
   since only the Y axis is overridden. */
[b-tqwq3lnkh1] .mud-table-container {
  overflow-y: visible;
}
/* /Components/Pages/Administration/WebApiKeys.razor.rz.scp.css */
/* The pager toolbar's own border-top is removed globally in site.css — every admin grid's
   PagerContent shares this layout. */

/* .mud-table-container is overflow-y:auto with a fractional CSS height (needed to size to the last
   row's content). clientHeight/scrollHeight report no overflow, but Chromium's paint-time clip mask
   for that fractional box rounds to slightly less than the true layout height, so the last row's
   border-bottom — sitting right at that edge — gets clipped away almost entirely. This grid never
   needs to scroll vertically (no fixed Height, pagination replaces rows rather than scrolling to
   them), so dropping the vertical clip is safe; horizontal scroll for wide content is unaffected
   since only the Y axis is overridden. */
[b-f26o0map4x] .mud-table-container {
  overflow-y: visible;
}
/* /Components/Pages/Administration/WhatsNewEditor.razor.rz.scp.css */
/* The pager toolbar's own border-top is removed globally in site.css — every admin grid's
   PagerContent shares this layout. */

/* .mud-table-container is overflow-y:auto with a fractional CSS height (confirmed live: 88.9688px
   for a one-row grid, bottom edge at 321.96875px). clientHeight/scrollHeight report no overflow,
   but Chromium's paint-time clip mask for that fractional box still rounds to slightly less than
   the true layout height, so the last row's border-bottom — sitting right at that edge — gets
   clipped away almost entirely (measured: only its bottommost ~1 device-pixel sliver survived).
   This grid never needs to scroll vertically (no fixed Height, pagination replaces rows rather
   than scrolling to them), so dropping the vertical clip is safe; horizontal scroll for wide
   content is unaffected since only the Y axis is overridden. */
[b-xzsmk0mmfg] .mud-table-container {
  overflow-y: visible;
}
/* /Components/Pages/Administration/WorkTypes.razor.rz.scp.css */
/* The pager toolbar's own border-top is removed globally in site.css — every admin grid's
   PagerContent shares this layout. */

/* .mud-table-container is overflow-y:auto with a fractional CSS height (needed to size to the last
   row's content). clientHeight/scrollHeight report no overflow, but Chromium's paint-time clip mask
   for that fractional box rounds to slightly less than the true layout height, so the last row's
   border-bottom — sitting right at that edge — gets clipped away almost entirely. This grid never
   needs to scroll vertically (no fixed Height, pagination replaces rows rather than scrolling to
   them), so dropping the vertical clip is safe; horizontal scroll for wide content is unaffected
   since only the Y axis is overridden. */
[b-q1opzf9pnu] .mud-table-container {
  overflow-y: visible;
}
/* /Components/Pages/Dashboard/ManagerWidget.razor.rz.scp.css */
/* Make branch nodes (with expand toggle) the same height as leaf nodes */
.dashboard-tree[b-61wbw85j27]  .mud-treeview-item-expand-button {
  padding: 0;
  height: auto;
  width: auto;
}

.dashboard-tree[b-61wbw85j27]  .mud-treeview-item-expand-button .mud-icon-root {
  font-size: 1.125rem;
}

/* Doughnut + HTML legend. The legend lives outside the canvas so it can be scrolled to when it does
   not fit; a native canvas legend is clipped at the canvas edge and cannot scroll (#473). */
.chart-scroll[b-61wbw85j27] {
  overflow-x: auto;
}

.chart-row[b-61wbw85j27] {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: min-content;
  height: 260px;
}

.chart-canvas-box[b-61wbw85j27] {
  position: relative;
  flex: 0 0 auto;
  width: 240px;
  height: 240px;
}

/* Column-wrapping legend: fills a column up to max-height, then wraps into the next column to the
   right, so the row grows horizontally and .chart-scroll shows a horizontal scrollbar. */
.chart-legend[b-61wbw85j27] {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
  max-height: 240px;
  margin: 0;
  padding: 0;
  list-style: none;
  column-gap: 24px;
}

.chart-legend[b-61wbw85j27]  .chart-legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
  cursor: pointer;
  white-space: nowrap;
  font-size: 13px;
}

.chart-legend[b-61wbw85j27]  .chart-legend-swatch {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  border-radius: 3px;
}
/* /Components/Pages/Dashboard/ProjectsSummaryWidget.razor.rz.scp.css */
/* Doughnut + HTML legend. The legend lives outside the canvas so it can be scrolled to when it does
   not fit; a native canvas legend is clipped at the canvas edge and cannot scroll (#473). */
.chart-scroll[b-148ksrlj9k] {
  overflow-x: auto;
}

.chart-row[b-148ksrlj9k] {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: min-content;
  height: 260px;
}

.chart-canvas-box[b-148ksrlj9k] {
  position: relative;
  flex: 0 0 auto;
  width: 240px;
  height: 240px;
}

/* Column-wrapping legend: fills a column up to max-height, then wraps into the next column to the
   right, so the row grows horizontally and .chart-scroll shows a horizontal scrollbar. */
.chart-legend[b-148ksrlj9k] {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
  max-height: 240px;
  margin: 0;
  padding: 0;
  list-style: none;
  column-gap: 24px;
}

.chart-legend[b-148ksrlj9k]  .chart-legend-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0;
  cursor: pointer;
  white-space: nowrap;
  font-size: 13px;
}

.chart-legend[b-148ksrlj9k]  .chart-legend-swatch {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  border-radius: 3px;
}
/* /Components/Pages/Dashboard/SpecialWorkTypesManagerWidget.razor.rz.scp.css */
/* Make branch nodes (with expand toggle) the same height as leaf nodes */
.dashboard-tree[b-l2espwkfqb]  .mud-treeview-item-expand-button {
  padding: 0;
  height: auto;
  width: auto;
}

.dashboard-tree[b-l2espwkfqb]  .mud-treeview-item-expand-button .mud-icon-root {
  font-size: 1.125rem;
}

/* HTML legend injected by ttChart.createBarChart: a filter checkbox plus a rounded colour pill per
   work type, mirroring the legacy TimeTracker.UI legend. The items are created in JS, so they are
   reached through ::deep. */
.bar-legend[b-l2espwkfqb] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 16px;
  margin-bottom: 10px;
}

.bar-legend[b-l2espwkfqb]  .bar-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  cursor: pointer;
}

.bar-legend[b-l2espwkfqb]  .bar-legend-checkbox {
  cursor: pointer;
}

.bar-legend[b-l2espwkfqb]  .bar-legend-pill {
  padding: 6px 20px;
  border-radius: 13px;
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
}
/* /Components/Pages/Dashboard/SpecialWorkTypesWidget.razor.rz.scp.css */
/* HTML legend injected by ttChart.createBarChart: a filter checkbox plus a rounded colour pill per
   work type, mirroring the legacy TimeTracker.UI legend. The items are created in JS, so they are
   reached through ::deep. */
.bar-legend[b-rz56558fk9] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px 16px;
  margin-bottom: 10px;
}

.bar-legend[b-rz56558fk9]  .bar-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  cursor: pointer;
}

.bar-legend[b-rz56558fk9]  .bar-legend-checkbox {
  cursor: pointer;
}

.bar-legend[b-rz56558fk9]  .bar-legend-pill {
  padding: 6px 20px;
  border-radius: 13px;
  color: #fff;
  font-size: 13px;
  white-space: nowrap;
}
/* /Components/Pages/Identity/IdentityLayout.razor.rz.scp.css */
#blazor-error-ui[b-3o6phlvep0] {
  color-scheme: light only;
  background: lightyellow;
  bottom: 0;
  box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  display: none;
  left: 0;
  padding: 0.6rem 1.25rem 0.7rem 1.25rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

  #blazor-error-ui .dismiss[b-3o6phlvep0] {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
  }
/* /Components/Pages/Reports/LackTimeReport.razor.rz.scp.css */
.ltr-panel-header[b-n9v7h7lq1m] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 52px;
  overflow: visible;
  padding: 8px 16px;
  border-bottom: 1px solid var(--mud-palette-lines-default);
}

.ltr-panel-title[b-n9v7h7lq1m] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Honor the <col> widths strictly so the hours columns stay narrow
   and Full name absorbs the remaining width. */
.pa-4[b-n9v7h7lq1m]  table {
  table-layout: fixed;
}

/* Allow narrow column headers to wrap onto multiple lines instead of
   being clipped by the fixed column widths. */
.pa-4[b-n9v7h7lq1m]  th,
.pa-4[b-n9v7h7lq1m]  th .column-header,
.pa-4[b-n9v7h7lq1m]  th .sortable-column-header {
  white-space: normal;
}

/* Top-align the header title cells so wrapped two-line titles start at the top. */
.pa-4[b-n9v7h7lq1m]  thead tr:first-child th {
  vertical-align: top;
}

/* Vertically center the filter (search) row so its inputs sit at the same
   height as on the Time Board grid, rather than pinned to the top of the cell. */
.pa-4[b-n9v7h7lq1m]  thead tr:nth-child(2) th {
  vertical-align: middle;
}

/* Center the header text of the numeric (hours) columns. The sortable
   header spans the full cell width (.sortable-column-header{width:100%})
   and reserves space for the sort icon, so center the text inside it and
   trim the cell padding to leave room for the text + icon in the narrow
   fixed-width columns. */
.pa-4[b-n9v7h7lq1m]  th.ltr-num-header {
  padding-left: 6px;
  padding-right: 6px;
}

.pa-4[b-n9v7h7lq1m]  th.ltr-num-header .sortable-column-header {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

/* Keep the first-column header + filter cells as real table cells so they
   stretch to the header row height like every other column (a flex <th> would
   drop out of the table row's height equalization and render shorter). Center
   their content vertically; horizontal placement of the buttons and the body
   person icon is handled by the flex wrappers in the column templates, matching
   the Web API Keys actions column (header icons end-aligned, the single body
   icon start-aligned under the leftmost header icon). */
.pa-4[b-n9v7h7lq1m]  thead tr th:first-child {
  display: table-cell;
  vertical-align: middle;
}

/* Trim the default cell padding on the actions column so its content box is
   exactly the width of the two header icons (Refresh + filter toggle). That
   makes the start-aligned body person icon line up under Refresh and the
   end-aligned filter-row clear button line up under the filter toggle. */
.pa-4[b-n9v7h7lq1m]  thead tr th:first-child,
.pa-4[b-n9v7h7lq1m]  tbody tr td:first-child {
  padding-left: 6px;
  padding-right: 6px;
}

/* The body person icon is a plain (non-interactive) icon, so it starts flush at
   the cell content edge; the header icons are icon buttons with 3px of internal
   padding, so nudge the person icon 3px to keep its glyph under the Refresh glyph. */
.pa-4[b-n9v7h7lq1m]  td:first-child .ltr-person-cell {
  padding-left: 3px;
}
/* /Components/Pages/Reports/TimeControl.razor.rz.scp.css */
.tc-panel-header[b-hno1wvwe1o] {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: calc(48px + 32px + 1px);
  flex: 0 0 auto;
  overflow: visible;
  padding: 16px;
  border-bottom: 1px solid var(--mud-palette-lines-default);
}

.tc-panel-title[b-hno1wvwe1o] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tc-panel-body[b-hno1wvwe1o] {
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px;
}

.tc-tree-area[b-hno1wvwe1o] {
  overflow-y: auto;
}

.tc-content-area[b-hno1wvwe1o] {
  overflow-y: auto;
}

.tc-loading[b-hno1wvwe1o] {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 160px;
}

.tc-tree-row[b-hno1wvwe1o] {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 32px;
  padding-right: 4px;
  border-radius: 4px;
  cursor: pointer;
}

.tc-tree-row-selected[b-hno1wvwe1o] {
  background: rgba(25, 118, 210, 0.08);
}

.tc-node-icon[b-hno1wvwe1o] {
  font-size: 14px;
  width: 16px;
}

.tc-node-text[b-hno1wvwe1o] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Highlight users who reported fewer hours than the period target (legacy "text-danger" parity). */
.tc-content-area[b-hno1wvwe1o]  .tc-row-danger td {
  color: var(--mud-palette-error);
}
/* /Components/Pages/TimeBoard/SummaryPanel.razor.rz.scp.css */
.summary-table[b-4rgupo19mo] {
  border-collapse: collapse;
  font-size: 0.85rem;
}

.summary-table th[b-4rgupo19mo],
.summary-table td[b-4rgupo19mo] {
  border: 1px solid #dee2e6;
  padding: 6px 8px;
}

.summary-label-cell[b-4rgupo19mo] {
  min-width: 140px;
  background: #f8f9fa;
  vertical-align: bottom;
}

.summary-header-cell[b-4rgupo19mo] {
  text-align: center;
  vertical-align: bottom;
  min-width: 40px;
  padding: 4px !important;
}

.summary-sum-cell[b-4rgupo19mo] {
  font-size: 1.1rem;
  font-weight: bold;
}

.summary-rotated[b-4rgupo19mo] {
  height: 46px;
  width: 45px;
  white-space: nowrap;
  position: relative;
  vertical-align: bottom;
  padding: 0 !important;
}

.summary-rotated > div[b-4rgupo19mo] {
  position: relative;
  top: -15px;
  left: 1px;
  transform: rotate(-50deg);
  font-size: 0.8rem;
}

[b-4rgupo19mo] .summary-weekend {
  color: #c62828;
  background-color: rgba(198, 40, 40, 0.06);
}

.summary-value-cell[b-4rgupo19mo] {
  text-align: center;
  color: #999;
}

.summary-has-value[b-4rgupo19mo] {
  color: #333;
  font-weight: 600;
}

.summary-expected[b-4rgupo19mo] {
  color: #999;
  font-weight: 600;
  white-space: nowrap;
}

[b-4rgupo19mo] .summary-weekend-cell {
  background-color: rgba(198, 40, 40, 0.06);
}

[b-4rgupo19mo] .summary-row-billable td {
  background-color: rgba(40, 167, 69, 0.1);
}

[b-4rgupo19mo] .summary-row-billable .summary-weekend-cell {
  background-color: rgba(40, 167, 69, 0.15);
}

[b-4rgupo19mo] .summary-row-nonbillable td {
  background-color: rgba(255, 193, 7, 0.1);
}

[b-4rgupo19mo] .summary-row-nonbillable .summary-weekend-cell {
  background-color: rgba(255, 193, 7, 0.15);
}

[b-4rgupo19mo] .summary-row-total td {
  background-color: rgba(0, 123, 255, 0.08);
}

[b-4rgupo19mo] .summary-row-total .summary-weekend-cell {
  background-color: rgba(0, 123, 255, 0.12);
}
/* /Components/Pages/WhatsNew/WhatsNewPage.razor.rz.scp.css */
/* The release notes are authored in the Quill editor and stored verbatim, then rendered here as a raw
   MarkupString. None of Quill's editor stylesheet reaches this page, so the list markers, list indentation
   and heading rhythm the author sees in the editor are reproduced here to match it. */

/* Quill encodes a list's kind in a data-list attribute and always uses <ol> as the element, so native <ol>
   numbering is switched off and the marker is drawn from data-list instead: a bullet for "bullet", a running
   number for "ordered". The counter restarts per list so each block numbers from one. */
.whats-new-content[b-ifxmtjjokb]  ol,
.whats-new-content[b-ifxmtjjokb]  ul {
  list-style: none;
  margin: 0.5em 0;
  padding-left: 2em;
  counter-reset: whats-new-ordered;
}

.whats-new-content[b-ifxmtjjokb]  li {
  position: relative;
  margin: 0.15em 0;
}

.whats-new-content[b-ifxmtjjokb]  li[data-list="ordered"] {
  counter-increment: whats-new-ordered;
}

.whats-new-content[b-ifxmtjjokb]  li[data-list="bullet"]::before {
  content: "\2022";
  position: absolute;
  left: -1em;
}

.whats-new-content[b-ifxmtjjokb]  li[data-list="ordered"]::before {
  content: counter(whats-new-ordered) ". ";
  position: absolute;
  left: -1.5em;
}

/* Quill leaks empty spacer spans (its runtime marker holders) into the saved markup; they carry nothing on
   this page and the marker is drawn from the li itself, so they are hidden to avoid stray inline boxes. */
.whats-new-content[b-ifxmtjjokb]  .ql-ui {
  display: none;
}

/* Heading rhythm matching the editor: headings are separated from what precedes them and sit close to the
   content they introduce. The first block never carries a leading gap. */
.whats-new-content[b-ifxmtjjokb]  h1,
.whats-new-content[b-ifxmtjjokb]  h2,
.whats-new-content[b-ifxmtjjokb]  h3 {
  margin: 1em 0 0.4em;
  line-height: 1.2;
  font-weight: 600;
}

/* Sizes match the editor. Each level steps up noticeably from the body text, with the largest relative jump
   at h3 so a third-level heading still reads as a heading rather than emphasised body text. The global
   FontProperties.css collapses h1/h2/h3 to 26/16/16px with !important, so these sizes need !important to win
   inside the release notes without disturbing headings elsewhere. */
.whats-new-content[b-ifxmtjjokb]  h1 {
  font-size: 2.1em !important;
}

.whats-new-content[b-ifxmtjjokb]  h2 {
  font-size: 1.65em !important;
}

.whats-new-content[b-ifxmtjjokb]  h3 {
  font-size: 1.4em !important;
}

.whats-new-content[b-ifxmtjjokb]  p {
  margin: 0.5em 0;
}

.whats-new-content[b-ifxmtjjokb]  > :first-child {
  margin-top: 0;
}
/* /Components/Shared/AppPageHeader.razor.rz.scp.css */
/* The current page is the last breadcrumb, which MudBlazor renders as a disabled link and therefore
   near-transparent. Give that link full-emphasis text and a medium weight so "you are here" reads
   clearly instead of fading out; the palette token keeps it correct in both the light and dark themes. */
[b-xkdr86mpys] .mud-breadcrumbs .mud-breadcrumb-item:last-child a {
  color: var(--mud-palette-text-primary);
  font-weight: 500;
}
/* /Components/Shared/DateRangeSelector.razor.rz.scp.css */
.tt-date-range-selector[b-9jrdwyie61] {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

/* Fix the picker input to a stable width via scoped CSS rather than an inline Style on the
   MudDateRangePicker. MudPicker splats its Style onto both the input and the teleported popover
   paper, so an inline "width:300px" also capped the popover and clipped the range picker's second
   month calendar (#487 regression). This ::deep rule targets only the in-place .mud-picker inside
   the wrapper; the popover teleports to <body>, outside the wrapper, so it keeps auto-sizing to
   both months. */
.tt-date-range-selector[b-9jrdwyie61]  .mud-picker {
  width: 300px;
}
/* /Components/Shared/GridFilterToggle.razor.rz.scp.css */
/* Active state of the filter-row toggle: a light chip (info colour at 14%) behind the icon.
   Same treatment as TimeBoard.razor.css from #511. */
.tt-filter-toggle[b-llqzi9v8md] {
    display: inline-flex;
    border-radius: var(--mud-default-borderradius);
}

.tt-filter-toggle--active[b-llqzi9v8md] {
    background-color: rgba(33, 150, 243, 0.14);
}
/* /Components/Shared/InlineDataGrid.razor.rz.scp.css */
[b-k0si66g6n0] .inline-editing-row td {
  background-color: lightcyan !important;
  padding: 4px 8px;
  overflow: hidden;
}

/* ── Strip top-level MudBlazor input control wrapper margins ─────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-input-control {
  margin: 0;
  height: 1.25em;
  overflow: hidden;
}

[b-k0si66g6n0] .inline-editing-row td .mud-input {
  margin: 0;
}

/* ── Hide helper / hint / validation text (removes reserved space below input) */
[b-k0si66g6n0] .inline-editing-row td .mud-input-helper-text {
  display: none;
}

/* ── Input slot — strip vertical padding, centred flex ───────────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-input-slot {
  padding-top: 0;
  padding-bottom: 0;
  min-height: 0;
  display: flex;
  align-items: center;
}

/* ── Native inputs and textareas — match cell font size, constrain height ── */
[b-k0si66g6n0] .inline-editing-row td input.mud-input-slot,
[b-k0si66g6n0] .inline-editing-row td textarea.mud-input-slot,
[b-k0si66g6n0] .inline-editing-row td input {
  font-size: inherit !important;
  line-height: inherit !important;
  vertical-align: middle;
  height: 1.25em;
  padding: 0;
}

/* ── MudSelect display value ─────────────────────────────────────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-select-input {
  font-size: inherit !important;
  line-height: inherit !important;
  vertical-align: middle;
  height: 1.25em;
  padding: 0;
}

/* ── Outlined / text input variant wrappers ──────────────────────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-input-outlined,
[b-k0si66g6n0] .inline-editing-row td .mud-input-text {
  padding-top: 0;
  padding-bottom: 0;
  height: 1.25em;
}

/* ── Fieldset (outlined variant border box) — strip spacing, remove border ─ */
[b-k0si66g6n0] .inline-editing-row td fieldset {
  padding-top: 0;
  padding-bottom: 0;
  margin: 0;
  min-height: 0;
  border: none !important;
}

/* ── Control-input-slot inner container ─────────────────────────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-input-control-input-slot {
  margin: 0;
  padding: 0;
}

/* ── Floating labels — collapse so they don't add height ────────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-input-label {
  font-size: inherit !important;
  line-height: inherit !important;
  position: static;
  transform: none;
  overflow: hidden;
  max-height: 0;
  visibility: hidden;
}

/* ── Checkbox label text ─────────────────────────────────────────────────── */
[b-k0si66g6n0] .inline-editing-row td .mud-checkbox .mud-button-label {
  font-size: inherit;
  line-height: inherit;
  vertical-align: middle;
}

[b-k0si66g6n0] .inline-inserted-row td {
  background-color: #f5f5f5 !important;
}

/* ── Grid separators (#518) ──────────────────────────────────────────────────
   1. MudDataGridPager draws the footer separator as its own toolbar's
      border-top. TimeBoard fills PagerContent with Add / Bulk add + a spacer
      before the pager, so the pager (and that border) is pushed to the right
      and the line floats mid-grid. Remove it — the row/header cell borders
      already separate the body from the footer. */
[b-k0si66g6n0] .mud-table-pagination .mud-table-pagination-toolbar {
  border-top: none;
}

/* 2. MudBlazor draws the row/header separators as a 1px border on each
      <td>/<th>. When the grid lands on a fractional device-Y — which happens
      once the Summary panel expands and the page gains a vertical scrollbar —
      Chromium drops those hairlines on every column except the first, so the
      grid's bottom edge renders only under the icons column and "hangs in the
      air". Promoting the grid to its own compositing layer snaps it to whole
      device pixels, keeping the per-cell borders crisp and continuous. This is
      layer-snapping, not a paint primitive, so it behaves the same across
      Chrome versions (unlike box-shadow on a <tr>, which some builds ignore). */
[b-k0si66g6n0] .mud-data-grid {
  transform: translateZ(0);
}
/* /Components/Shared/QuillEditor.razor.rz.scp.css */
.tt-quill[b-epeqn3tfpb] {
  position: relative;
  margin-top: 8px;
}

.tt-quill-label[b-epeqn3tfpb] {
  position: absolute;
  top: -9px;
  left: 10px;
  z-index: 1;
  background: var(--mud-palette-surface);
  padding: 0 4px;
  font-size: 0.75rem;
  color: var(--mud-palette-text-secondary);
  pointer-events: none;
}

/* Progressive enhancement, CSS-only: the host is empty until Quill fills it, so it stays collapsed and the
   plain textarea fallback shows. Once Quill has populated the host, the fallback is no longer needed. */
.tt-quill-host:empty[b-epeqn3tfpb] {
  display: none;
}

.tt-quill-host:not(:empty) + .tt-quill-fallback[b-epeqn3tfpb] {
  display: none;
}

.tt-quill-fallback[b-epeqn3tfpb] {
  width: 100%;
  box-sizing: border-box;
  min-height: 240px;
  padding: 8px 12px;
  border: 1px solid var(--mud-palette-lines-inputs);
  border-radius: 4px;
  font: inherit;
  resize: vertical;
  background: var(--mud-palette-surface);
  color: var(--mud-palette-text-primary);
}

/* Quill injects its toolbar and editor into the host, outside Blazor's control, so they are reached with
   ::deep and themed from the MudBlazor palette so the editor tracks light/dark like the rest of the dialog. */
.tt-quill-host[b-epeqn3tfpb]  .ql-toolbar {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-color: var(--mud-palette-lines-inputs);
}

.tt-quill-host[b-epeqn3tfpb]  .ql-container {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  border-color: var(--mud-palette-lines-inputs);
  min-height: 240px;
  font-family: inherit;
  font-size: 0.95rem;
  background: var(--mud-palette-surface);
}

.tt-quill-host[b-epeqn3tfpb]  .ql-editor {
  min-height: 240px;
  color: var(--mud-palette-text-primary);
}

.tt-quill-host[b-epeqn3tfpb]  .ql-editor.ql-blank::before {
  color: var(--mud-palette-text-disabled);
  font-style: normal;
}

/* Quill's stylesheet zeroes every heading margin inside the editor, so consecutive headings and the text
   below them run together. Restore vertical rhythm around headings to match the rendered What's New page;
   the first block keeps no leading gap. */
.tt-quill-host[b-epeqn3tfpb]  .ql-editor h1,
.tt-quill-host[b-epeqn3tfpb]  .ql-editor h2,
.tt-quill-host[b-epeqn3tfpb]  .ql-editor h3 {
  margin: 1em 0 0.4em;
  line-height: 1.2;
  font-weight: 600;
}

/* Sizes match the rendered What's New page, with the largest relative jump at h3 so a third-level heading
   stays visibly a heading. The global FontProperties.css collapses h1/h2/h3 to 26/16/16px with !important —
   which otherwise flattens Quill's own heading sizes here too — so these sizes need !important to win. */
.tt-quill-host[b-epeqn3tfpb]  .ql-editor h1 {
  font-size: 2.1em !important;
}

.tt-quill-host[b-epeqn3tfpb]  .ql-editor h2 {
  font-size: 1.65em !important;
}

.tt-quill-host[b-epeqn3tfpb]  .ql-editor h3 {
  font-size: 1.4em !important;
}

.tt-quill-host[b-epeqn3tfpb]  .ql-editor > :first-child {
  margin-top: 0;
}

/* Keep the toolbar glyphs visible on the dark theme (Quill hard-codes dark strokes/fills for the light one). */
.tt-quill-host[b-epeqn3tfpb]  .ql-toolbar .ql-stroke {
  stroke: var(--mud-palette-text-primary);
}

.tt-quill-host[b-epeqn3tfpb]  .ql-toolbar .ql-fill {
  fill: var(--mud-palette-text-primary);
}

.tt-quill-host[b-epeqn3tfpb]  .ql-toolbar .ql-picker {
  color: var(--mud-palette-text-primary);
}