.mantine-Drawer-title {
  font-weight: 600;
}

svg.shadow {
  color: #f2f2f2;
  filter: drop-shadow(0px 0px 1px black);
}

.underline-on-hover:hover {
  text-decoration: underline;
}

:root {
  --font-family: 'IBM Plex Sans';
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--mantine-font-family-headings);
  font-weight: 600;
}

:root {
  background: #dbdbdb !important;
}

html,
body {
  overflow-x: clip;
}

.mantine-Text-root {
  font-size: var(--text-fz);
  word-break: break-word;
}

.mantine-Text-root,
.mantine-InputWrapper-label {
  word-break: break-word;
}

.mantine-InputBase-input {
  text-overflow: ellipsis;
}

.mantine-InputClearButton-root {
  &:hover {
    border-radius: var(--mantine-radius-xl);
    background-color: var(--mantine-color-gray-1) !important;
  }
}

.hover-title .hover-title--on,
.hover-title:hover .hover-title--off {
  display: none;
}
.hover-title:hover .hover-title--on {
  display: flex;
}

.hover-title-on {
  background-color: blue;
}

.row-marked-for-deletion {
  color: var(--mantine-color-red-7) !important;
  text-decoration: line-through !important;
}

.row-marked-for-deletion .ag-cell {
  text-decoration: line-through !important;
}

:root {
  --mantine-radius-default: 6px;
}
._colorBox_a6hur_1 {
  min-height: 100%;
  cursor: pointer;
  transition: all 0.2s ease-in-out;

  &:hover,
  &._active_a6hur_7 {
    width: 1.1em;
    box-shadow:
      0 0 0 2px #fff,
      0 0 0 4px #000;
    z-index: var(--mantine-z-index-popover);
  }
}
.full-width-label .mantine-InputWrapper-label {
  width: 100%;
}

.part-card {
  background-color: var(--mantine-color-gray-1);
}

.part-card-selectable {
  cursor: pointer;
  &:hover {
    background-color: var(--mantine-color-gray-3);
  }
}

.category-nav {
  overflow: hidden;
  &:hover {
    overflow: visible;
    z-index: 20;
  }
}
.upload-overlay {
  opacity: 0;
  &:hover {
    opacity: 0.5;
  }
}
.attachment-link {
  user-select: initial;
  color: black;
  cursor: pointer;

  &:hover {
    color: var(--mantine-primary-color);
  }
}
.file-upload-box {
  border: 1px dashed var(--mantine-color-gray-4);
  border-radius: 10px;
  overflow: hidden;
  cursor: pointer;

  &:hover {
    background-color: var(--mantine-color-gray-0);
  }
}
/*
 * Autodesk's viewer CSS resets box-sizing to content-box for every element inside the viewer
 * container (.adsk-viewing-viewer *). Our React portals need border-box so Mantine layout works
 * correctly. A wrapper div with this class is applied by useViewerPortals around every portal node,
 * and the selector's extra class gives it higher specificity (0,2,0) than Autodesk's (0,1,0).
 */
.adsk-viewing-viewer .evolve-viewer-portal,
.adsk-viewing-viewer .evolve-viewer-portal * {
  box-sizing: border-box;
}

#forgeViewer {
  width: 100%;
  height: 100%;
  margin: 0;
  background-color: #f0f8ff;
}

/*
 * The rubber-band rectangle drawn while window-selecting in the viewer (see `WindowSelectExtension`).
 * Compounded with `.adsk-viewing-viewer` to outrank the viewer's own `.adsk-viewing-viewer *` reset,
 * which would otherwise force `box-sizing: content-box`.
 */
.adsk-viewing-viewer .window-selection-overlay {
  position: absolute;
  box-sizing: border-box;
  pointer-events: none;
  /* Above the canvas and the viewer toolbar, below the markup toolbars (19+). */
  z-index: 2;
}

/* A left-to-right drag, which selects only fully contained elements. */
.adsk-viewing-viewer .window-selection-overlay-contains {
  border: 1px solid #06a7df;
  background-color: rgba(6, 167, 223, 0.2);
}

/* A right-to-left drag, which also selects partially contained elements. */
.adsk-viewing-viewer .window-selection-overlay-intersects {
  border: 1px dashed #06a7df;
  background-color: rgba(6, 167, 223, 0.1);
}

.forge-header {
  height: 32px;
  border-bottom: 1px solid var(--mantine-color-gray-3);
}

.forge-container {
  overflow: hidden;
  /*height: calc(100% - 32px);*/
  & .adsk-control .clickoff {
    max-width: 100%;
  }
  & .adsk-toolbar {
    z-index: 1;
  }
}

.autodesk-prev-page-btn .adsk-button-icon {
  transform: translateY(-1px) rotate(180deg) scale(0.75);
}

.autodesk-next-page-btn .adsk-button-icon {
  transform: scale(0.75);
}

.autodesk-page_num_btn {
  width: 96px !important;
  margin: 4px 0px !important;
  padding: 6px 0px !important;
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.autodesk-page_num_btn:hover {
  color: white !important;
  border: 1px solid #292929 !important;
}

.autodesk-page_num_btn .adsk-button-icon {
  display: none;
}

.autodesk-page_num_btn .adsk-page-num-input {
  width: 42px;
  height: 26px;
  text-align: center;
  color: white;
  background-color: rgba(48, 48, 48, 1);
  border-radius: 4px;
  border: 1px solid #cccccc;
  appearance: textfield;
  -moz-appearance: textfield;
}

.adsk-page-num-input::-webkit-outer-spin-button,
.adsk-page-num-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.autodesk-page_num_btn .adsk-page-num-text {
  margin: 0 !important;
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.15px;
}

.autodesk-btn-disabled {
  cursor: not-allowed !important;
  pointer-events: none !important;
}

.autodesk-btn-disabled .adsk-button-icon {
  color: rgba(255, 255, 255, 0.25) !important;
}

/* Used to style toolbar buttons using custom SVG icons as the inner HTML. */
.custom-icon-toolbar-button {
  svg {
    height: 32px;
    width: 32px;
    position: absolute;
    left: 50%;
    /* Autodesk's button styling does some hard coding of its own. */
    top: calc(50% - 2px);
    transform: translate(-50%, -50%);
  }
}

/* PDF markup styles: */

/* The properties panel displayed when creating or editing markup. */
.properties-panel {
  --input-border-radius: 4px;

  --input-bg: white;
  --input-color: black;
  --input-color-secondary: rgba(0, 0, 0, 0.8);
  --input-icon-color: rgba(0, 0, 0, 0.6);
  --input-border-color: transparent;
  --color-input-border-color: rgba(0, 0, 0, 0.6);
  --button-hover-bg: rgba(235, 235, 235);
  --button-active-bg: rgba(225, 225, 225);

  line-height: 1;

  /** Autodesk's panel container. */
  .docking-panel-scroll {
    background-color: rgba(40, 40, 40, 0.95);
    backdrop-filter: blur(2px);
  }

  /** Top-level content container. */
  .content-container {
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  /* Wraps a field and its label. */
  .field-wrapper {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }

  /* Wraps a collection of property fields. */
  .field-group {
    display: flex;
    flex-direction: column;
    gap: 12px;

    padding: 14px 10px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: var(--input-border-radius);
  }

  p,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0;
    font-weight: unset;
  }

  h2 {
    font-size: 16px;
  }

  input[type='color'] {
    width: 20px;
    height: 20px;
    border-radius: var(--input-border-radius);
    padding: 0;
    cursor: pointer;

    /* Reset browser default styles. */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  /* Reset browser default styles. */
  input[type='color']::-webkit-color-swatch-wrapper {
    padding: 0;
  }
  input[type='color']::-webkit-color-swatch {
    border: none;
  }

  /* Consistent styles for inputs except for color inputs. */
  input:not([type='color']),
  select {
    height: 16px;
    padding: 8px 12px;
    border-radius: var(--input-border-radius);
    line-height: normal;
    background-color: var(--input-bg);
    color: var(--input-color);
  }

  /* Remove spinners from number inputs. */
  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  input[type='number'] {
    -moz-appearance: textfield;
  }

  .select-wrapper {
    position: relative;

    select {
      cursor: pointer;
      width: stretch;
      padding-right: 32px; /* Make space for the dropdown arrow icon. */

      /* Reset browser default styles. */
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border: 1px solid var(--input-border-color);
    }

    .adsk-icon-arrow {
      position: absolute;
      right: 12px;
      top: 50%;
      transform: translateY(-50%) rotate(90deg);
      pointer-events: none;
      color: var(--input-icon-color);
    }
  }

  /* Wraps a color input and its display value. */
  .color-input-container {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: var(--input-bg);
    color: var(--input-color);
    padding: 6px 12px 6px 6px;
    border-radius: var(--input-border-radius);
    cursor: pointer;
    min-width: 85px;
  }

  /* Wraps just the color input. */
  .color-input-wrapper {
    display: flex;
    box-shadow: 0 0 0 1px var(--color-input-border-color);
    border-radius: var(--input-border-radius);
  }

  .number-input-wrapper {
    display: grid;
    grid-template-columns: auto 1fr auto;
    cursor: text;
    background-color: var(--input-bg);
    border-radius: var(--input-border-radius);
    border: 1px solid var(--input-border-color);
    align-items: baseline;

    input {
      min-width: 1ch;
      /* Shrink the input to fit its value so the UOM label trails right behind it. */
      field-sizing: content;
      padding-right: 0;
      background-color: transparent;
    }

    /* The unit of measure for the number input (e.g. "pt" or "%"). */
    .number-input-uom {
      display: flex;
      align-items: center;
      padding: 0 6px 0 2px;
      color: var(--input-color-secondary);
      font-size: 12px;
      white-space: nowrap;
      line-height: normal;
    }

    .number-input-spinner-buttons {
      display: flex;
      flex-direction: column;
      overflow: hidden;
      padding: 2px 2px 2px 0;
      align-self: stretch;

      .spinner-button {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
        width: 20px;
        padding: 0;
        border-radius: var(--input-border-radius);
        background-color: transparent;
        color: var(--input-icon-color);
        border: none;
        cursor: pointer;
        user-select: none;

        .adsk-icon-arrow {
          font-size: 10px;
          display: flex;
          justify-content: center;
          pointer-events: none;
        }

        /* Increment arrow button. */
        &:first-child .adsk-icon-arrow {
          transform: rotate(-90deg);
        }

        /* Decrement arrow button. */
        &:last-child .adsk-icon-arrow {
          transform: rotate(90deg);
        }

        &:hover {
          background: var(--button-hover-bg);
        }

        &:active {
          background: var(--button-active-bg);
        }
      }
    }
  }

  /* Used to group related color and opacity fields. */
  .color-and-opacity-group {
    display: flex;
    align-items: center;
    gap: 2px;

    > :first-child {
      width: 100%;
    }

    .color-input-container {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      border: 1px solid var(--input-border-color);
    }

    .opacity-input {
      width: 80px;
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      border: 1px solid var(--input-border-color);

      input {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
      }
    }
  }

  .adsk-button {
    font-size: 16px;
    margin: 0;
    padding: 0;
    background-color: var(--input-bg);
    color: var(--input-color);
    border: 1px solid var(--input-border-color);

    &.active,
    &:focus {
      box-shadow: unset !important;
    }
  }

  .button-group {
    display: flex;
    align-items: center;
    gap: 8px;
  }
}

.forge-container {
  /* The main toolbar while editing markup. */
  & .markup-toolbar {
    z-index: 20;
  }

  & .adsk-toolbar {
    /* Override styles for Autodesk's label buttons. */
    .adsk-label-button {
      font-weight: 700;
      height: 100%;
    }
    .adsk-label-button.disabled {
      pointer-events: none;
      opacity: 0.7;

      label {
        background: var(--mantine-color-gray-7);
      }
    }
    .adsk-control-group .adsk-label-button {
      margin: 0 6px;
      padding: 7px 0 6px 0;
    }
    .adsk-control-group.toolbar-vertical-group .adsk-label-button {
      margin: 6px 0;
      padding: 0 6px;
    }

    /* If a label button follows another label button, don't add a left margin to keep the spacing even. */
    .adsk-control-group .adsk-label-button + .adsk-label-button {
      margin: 0 6px 0 0;
    }
    .adsk-control-group.toolbar-vertical-group .adsk-label-button + .adsk-label-button {
      margin: 0 0 6px 0;
    }

    .label-button-outline {
      label {
        background-color: unset;
        border: 1px solid #06a7df;
        padding: 7px 10px;
      }

      &:hover {
        label {
          background-color: rgba(6, 167, 223, 0.2);
        }
      }
    }

    .tooltip-label-button {
      /* Workaround for Autodesk's popover width calculation. */
      width: calc(100% - 14px);

      label {
        background-color: unset;
        border: 1px solid transparent;
        padding: 7px 10px;
        text-align: start;
        white-space: nowrap;
      }

      &:hover {
        label {
          background-color: unset;
          border: 1px solid #06a7df;
          color: #06a7df;
        }
      }
    }
  }
}

/* The hovering toolbar shown when selecting markup. */
.markup-selection-toolbar {
  position: absolute;
  display: none;
  align-items: center;
  gap: 2px;
  /* Original background color from the mockup is #D9FAFB. */
  background: rgba(217, 250, 251, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 4px;
  padding: 2px 4px;
  /* The properties panel z-index is 20 by default. */
  z-index: 19;
  pointer-events: all;
  box-shadow: 0 2px 8px rgba(42, 55, 55, 0.45);
  user-select: none;
  backdrop-filter: blur(2px);

  button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: transparent;
    border: none;
    border-radius: 3px;
    color: #1c1b1f;
    cursor: pointer;
    font-size: 13px;
    flex-shrink: 0;

    &:hover {
      background: #b9ebec;
    }
  }

  button.delete {
    color: #fa5252;

    &:hover {
      background: #ffcccc;
    }
  }

  .separator {
    width: 1px;
    height: 12px;
    background: #7a7685;
    margin: 0 3px;
    flex-shrink: 0;
  }
}
.spoolSelectorPanel {
  top: 10px;
  left: 10px;
  width: auto;
  height: auto;
  max-height: 700px;
}
._root_1lb7o_1 {
  cursor: pointer;
  user-select: none;

  &:hover {
    background-color: var(--mantine-color-gray-0);
  }
}

._iconOnly_1lb7o_10 {
  margin-inline-end: 0;
}
.hover-node .hover-node--on,
.hover-node:hover .hover-node--off {
  opacity: 0;
}
.hover-node:hover .hover-node--on {
  opacity: 1;
}

.hover-node {
  border-width: 2px;
  border-style: dashed;
  border-color: rgba(0, 0, 0, 0);
  border-radius: 10px;
}
.selected .hover-node {
  border-color: var(--mantine-primary-color-8);
}

.connectingfrom {
  visibility: visible !important;
}
.analytics-card {
  opacity: 0;
}
.analytics-card:hover {
  opacity: 0.3;
  background-color: var(--mantine-primary-color-1);
}
.editable-cell-renderer {
  border: 1px solid transparent;
  transition:
    color 150ms ease,
    border-color 150ms ease,
    background-color 150ms ease;

  .editable-clear-button {
    display: none;
  }

  &.editable {
    cursor: pointer;

    &:hover,
    &.active {
      border: 1px solid var(--mantine-color-gray-6);
      background-color: #fcfcfc !important;

      .editable-clear-button {
        display: inline-flex;
      }
    }
  }
}

.empty-background {
  background-color: transparent !important;
}
.activity-feed .mantine-Timeline-item {
  margin-top: var(--mantine-spacing-lg);
}
.activity-feed .mantine-Timeline-item:first-of-type {
  margin-top: 0;
}
@media print {
  /* Remove app content and modal siblings from layout to prevent blank pages.
       display: none is needed so they take up no page space; visibility: hidden alone still occupies layout. */
  body:has(._printContent_1ebcg_4) > *:not(:has(._printContent_1ebcg_4)),
    
    *[data-portal]:has(._printContent_1ebcg_4) > *:not(:has(._printContent_1ebcg_4)),
    
    .mantine-Modal-header,
    
    ._printableModal_1ebcg_10 > *:not(._printContent_1ebcg_4) {
    display: none !important;
    visibility: hidden;
  }

  /* Hide every element that doesn't contain .printContent. */
  body:has(._printContent_1ebcg_4) *:not(:has(._printContent_1ebcg_4)) {
    visibility: hidden;
  }

  /* Ensure the .printContent is visible */
  ._printContent_1ebcg_4,
  ._printContent_1ebcg_4 * {
    visibility: visible !important;
  }

  /* Modal.Inner is position: fixed by default, which causes it to repeat on every
       printed page. Reset it to static so print layout uses normal document flow. */
  .mantine-Modal-inner:has(._printContent_1ebcg_4) {
    position: static !important;
  }

  /* Ensure that all other modal containers have `block` display to
       let the browser's table paging algorithm work correctly. */
  .mantine-Modal-content:has(._printContent_1ebcg_4),
  .mantine-Modal-body:has(._printContent_1ebcg_4),
  .mantine-ScrollArea-root:has(._printContent_1ebcg_4),
  .mantine-ScrollArea-viewport:has(._printContent_1ebcg_4),
  ._printableModal_1ebcg_10 {
    display: block !important;
  }

  /* Remove overflow/height/spacing constraints so the table renders fully across pages. */
  .mantine-Modal-content:has(._printContent_1ebcg_4),
  .mantine-Modal-inner:has(._printContent_1ebcg_4),
  .mantine-Modal-body:has(._printContent_1ebcg_4),
  .mantine-ScrollArea-root:has(._printContent_1ebcg_4),
  .mantine-ScrollArea-viewport:has(._printContent_1ebcg_4),
  ._printContent_1ebcg_4,
  ._tableContainer_1ebcg_49,
  ._tableScroll_1ebcg_50,
  ._printableModal_1ebcg_10 {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* Prevent data rows from being split across page boundaries. */
  ._printContent_1ebcg_4 tr {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  ._printContent_1ebcg_4 th {
    background: transparent !important;
  }

  ._printableBlock_1ebcg_71 {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Dissolved so the table, not this div, is the box that fragments across pages.
     `!important` is required: this @media block precedes the base rules, which would win. */
  ._tableContainer_1ebcg_49,
  ._tableScroll_1ebcg_50 {
    display: contents !important;
  }

  @page {
    /* Get rid of the browser default headers. */
    @top-left {
      content: '';
    }
    @top-center {
      content: '';
    }
    @top-right {
      content: '';
    }
    margin-bottom: 1.5cm; /* creates physical space for the margin box */
    /* Relative so Vite resolves and bundles the asset. A root-absolute path resolves against
           container/public/, which holds only favicon.ico and robots.txt. */
    @bottom-left {
      content: url("data:image/svg+xml,%3csvg%20width='79'%20height='14'%20viewBox='0%200%2079%2014'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_3731_47766)'%3e%3cpath%20d='M0%200.251221H10.4061V2.866H2.88078V5.16166L8.16426%205.17644V7.70861H2.88078V10.7547H10.4236V13.3756H0V0.251221Z'%20fill='currentColor'/%3e%3cpath%20d='M26.3262%206.80522C26.3262%202.97739%2029.3992%200%2033.4075%200C37.4158%200%2040.4915%202.97739%2040.4915%206.80522C40.4915%2010.633%2037.4184%2013.6313%2033.4075%2013.6313C29.3966%2013.6313%2026.327%2010.633%2026.327%206.80522H26.3262ZM37.5985%206.81131C37.5985%204.39739%2035.7176%202.68522%2033.4014%202.68522C31.0852%202.68522%2029.2043%204.39652%2029.2043%206.81131C29.2043%209.22609%2031.0817%2010.94%2033.4014%2010.94C35.7211%2010.94%2037.5985%209.2287%2037.5985%206.81131V6.81131Z'%20fill='currentColor'/%3e%3cpath%20d='M43.3124%200.251221H46.2072L46.1923%2010.7521H52.8664V13.3695H43.3115V0.251221H43.3124Z'%20fill='currentColor'/%3e%3cpath%20d='M51.6416%200.251221H54.8659L58.9799%208.40513L63.1245%200.251221H66.2894L59.0157%2013.9364L51.6416%200.251221Z'%20fill='currentColor'/%3e%3cpath%20d='M67.8887%200.251221H78.2948V2.866H70.7695V5.16166L76.0529%205.17644V7.70861H70.7695V10.7547H78.3132V13.3756H67.8895V0.251221H67.8887Z'%20fill='currentColor'/%3e%3cpath%20d='M26.3268%200.251221L26.214%200.462525L25.9344%200.988612H25.9335L19.0357%2013.9356L11.6816%200.251221H12.4927L19.0357%2012.4964L25.1372%200.988612H24.3401L19.0357%2011.0573L13.6954%200.988612L13.3038%200.251221H15.7371L16.1121%200.988612L19.0357%206.74079L22.3316%200.251221H23.1314L19.0357%208.17992L15.308%200.988612H14.5021L19.0357%209.61905L23.5448%200.988612L23.9302%200.251221H26.3268Z'%20fill='currentColor'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3731_47766'%3e%3crect%20width='78.4'%20height='14'%20fill='currentColor'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
      color: black;
    }
    /* Add our page counter */
    @bottom-right {
      content: counter(page) ' of ' counter(pages);
      font-family:
        IBM Plex Sans,
        sans-serif;
      color: var(--mantine-color-gray-4);
    }
  }
}

/* printContent fills remaining space in the Stack (after ModalButtons).
   Scrolls on screen so a document taller than the modal stays reachable; the print
   block above drops the constraint so every page still renders. */
._printContent_1ebcg_4 {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}

/* The border lives on the table (`withTableBorder`) so it survives print. clip, not hidden,
   avoids becoming a scroll container so the sticky thead keeps working. */
._tableContainer_1ebcg_49 {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  border-radius: var(--mantine-radius-sm);
  overflow: clip;
}

/* Inner scroll container — the sticky thead anchors to this element. */
._tableScroll_1ebcg_50 {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.active-table {
  --ag-header-background-color: var(--mantine-color-gray-3);
}
.draft-table {
  --ag-header-background-color: var(--mantine-primary-color-1);
}

.work-cell-setup .ag-row-selected {
  box-shadow: inset 0 1px 0 #444;
  --ag-selected-row-background-color: initial;
}

.dragged-to-end .ag-row-last {
  box-shadow: inset 0 -1px 0 #444;
}
.selectable-spool .visibility-toggle {
  opacity: 0;
}
.selectable-spool .visibility-toggle.inactive {
  opacity: 0.4;
}
.selectable-spool:hover .visibility-toggle {
  opacity: 1;
}
._colorBox_a6hur_1 {
  min-height: 100%;
  cursor: pointer;
  transition: all 0.2s ease-in-out;

  &:hover,
  &._active_a6hur_7 {
    width: 1.1em;
    box-shadow:
      0 0 0 2px #fff,
      0 0 0 4px #000;
    z-index: var(--mantine-z-index-popover);
  }
}
.time-tracking-member {
  user-select: none;
  cursor: pointer;

  &:hover {
    background-color: var(--mantine-color-gray-1);
  }

  &.selected {
    background-color: var(--mantine-primary-color-0);
    cursor: unset;
  }
}
.detail-page-item-thin {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.detail-page-right-align {
  flex-direction: row-reverse;
}

.edit-description-button {
  transition: all 0.2s ease;
}

.editable-work-order-item {
  cursor: pointer;
  background-color: var(--mantine-color-gray-0) !important;

  &:hover {
    background-color: var(--mantine-color-gray-2) !important;
  }
}

.transparent-editable-cell {
  background-color: transparent !important;
}
.big-calendar div[data-month-level='true'],
.big-calendar div[data-year-level='true'],
.big-calendar div[data-decade-level='true'] {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.big-calendar .mantine-Calendar-pickerControl,
.big-calendar .mantine-PickerControl-pickerControl {
  font-size: 16;
  font-weight: 500;
}
.kanban-work-order-link {
  color: var(--mantine-color-gray-7);
  text-decoration: none;
  &:hover {
    color: var(--mantine-color-gray-9);
    text-decoration: underline;
  }
}

.kanban-work-order-small-link {
  color: var(--mantine-color-gray-6);
}
.nav-link-icon-collapsed {
  color: var(--mantine-color-app-shell-gray-5);
  transition: color 0.2s ease-in;
}

.nav-container-thumb {
  opacity: 0;
  transition: opacity 0.2s;
  &.visible {
    opacity: 0.5;
  }
  &:hover {
    opacity: 0.9;
  }

  &:active {
    opacity: 0.7;
  }
}

.nav-bar-collapsed .nav-container-thumb {
  &.visible {
    opacity: 0.2;
  }
  &:hover {
    opacity: 0.7;
  }
  &:active {
    opacity: 0.5;
  }
}

.ad-spot {
  cursor: pointer;
  background-color: #0f1013;
  color: var(--mantine-primary-color-5);

  &:hover {
    background-color: #2a292c;
    color: var(--mantine-primary-color-4);
  }
}
._navDropdown_16oh5_1 {
  border-radius: var(--mantine-radius-lg);
  border-color: var(--mantine-color-app-shell-gray-8);
  border-width: 0.5px;
}

._navDropdown_16oh5_1[data-position='right'],
._navDropdown_16oh5_1[data-position='right-start'],
._navDropdown_16oh5_1[data-position='right-end'] {
  margin-left: 9px;
}
._text_b6uuu_1 {
  color: var(--mantine-color-app-shell-gray-5);
  text-wrap: nowrap;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
}

._section_b6uuu_9[data-position='left'] {
  margin-inline-end: 5px;
}

._section_b6uuu_9[data-position='right'] {
  margin-inline-start: 5px;
}

._collapseCaret_b6uuu_17 {
  opacity: 0;
  transition: opacity 0.2s ease-in;
}

button:hover ._collapseCaret_b6uuu_17 {
  opacity: 1;
}
._navLink_q5vqb_1 {
  color: var(--mantine-color-app-shell-gray-3);
  &:hover * {
    color: var(--mantine-color-app-shell-gray-0);
    transition: color 0.2s ease-in;
  }
}

._navStackItem_q5vqb_9 {
  transition: border-left-color 300ms ease-in;
  border-left: 1px solid;
  border-left-color: var(--mantine-color-dark-6);
  padding-left: 8px;
  &._activeItem_q5vqb_14 {
    border-left-color: var(--mantine-color-dark-2);
  }
}

._newMarker_q5vqb_19 {
  color: var(--mantine-primary-color-4);
}

._root_q5vqb_23 {
  border-radius: 6px;
}

._body_q5vqb_27 {
  text-overflow: clip;
}

._label_q5vqb_31 {
  text-wrap: nowrap;
  text-overflow: clip;
  white-space: nowrap;
}