@import "js/Flatpickr/flatpickr.min.css";
@import "js/DataTables/datatables.css";

:root {
  --zindex-popover: 1070;
  --tab-hover-color: var(--vz-gray-900);
  --tab-dropdown-background-colour: var(--vz-gray-200);
  --tab-hover-background-colour: rgb(206, 206, 206);
  --sapphire-note-bg: #fff9c4;
  --sapphire-note-border: #f9e97d;
}

.tab-nav-link {
  color: var(--vz-gray-700);
  font-weight: 500;
}

.tab-nav-link:hover {
    color: var(--tab-hover-color);
    background-color: var(--tab-hover-background-colour);
}

.hoverable-dropdown {
    position: relative;
}

.hoverable-dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    top: 100%;
    z-index: 1000;
}

.hoverable-dropdown-item {
    width: 100%;
    padding: 0.25rem 1.5rem;
    background-color: var(--tab-dropdown-background-colour);
}

.hoverable-dropdown-menu .hoverable-dropdown-item:last-child {
    border-bottom-left-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.hoverable-dropdown:hover .hoverable-dropdown-menu {
    display: flex;
    flex-direction: column;
}

.sapphire-popover {
  outline: 0;
  z-index: 1000;
  position: absolute;
  opacity: 0;
}

  .sapphire-popover.sapphire-popover-fixed {
    position: fixed;
  }

  .sapphire-popover.sapphire-popover-relative-width {
    width: 100%;
  }

  .sapphire-popover.sapphire-popover-open {
    opacity: 1;
    transition: opacity;
  }

  .sapphire-popover:not(.sapphire-popover-open) {
    pointer-events: none;
    transition-duration: 0ms !important;
    transition-delay: 0ms !important;
  }

.sapphire-overlay {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 !important;
  align-items: center;
  justify-content: center;
  border-radius: inherit;
  display: flex;
  position: fixed;
  transition: .3s cubic-bezier(.25,.8,.5,1),z-index 1ms;
  z-index: 5;
}

.collapsing {
  transition: height .35s ease !important;
  -webkit-transition: height .35s ease !important;
}

.sapphire-tooltip {
  z-index: 1003 !important;
  background-color: #333333;
  color: white;
}

.sapphire-tooltip-top {
  transform: translateY(-10px);
}

.sapphire-tooltip-bottom {
  transform: translateY(10px);
}

.sapphire-tooltip-left {
  transform: translateX(-10px);
}

.sapphire-tooltip-right {
  transform: translateX(10px);
}

.pointer-cursor {
  cursor: pointer;
}

.paginator {
  display: flex;
  border-top: 1px solid #ccc;
  margin-top: 0.5rem;
  padding: 0.25rem 0;
  align-items: center;
}

.pagination-text {
  margin: 0 0.5rem;
}

.paginator nav {
  display: flex;
  margin-left: auto;
  gap: 0.5rem;
  align-items: center;
}

  .paginator nav button {
    border: 0;
    background: none center center / 1rem no-repeat;
    width: 2rem;
    height: 2rem;
  }

    .paginator nav button[disabled] {
      opacity: 0.4;
    }

    .paginator nav button:not([disabled]):hover {
      --scale: 1.2;
    }

    .paginator nav button:not([disabled]):active {
      background-color: #aaa;
    }

  .paginator nav .go-first,
  .paginator nav .go-last {
    background-color: var(--vz-body-color);
    --jumpSvg: url('data:image/svg+xml,\
  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
    <g stroke="rgb(0, 0, 0)" fill="rgb(0,0,0)" transform="rotate(90) scale(0.4)" transform-origin="12 12">\
      <path d="M2,1.5 L12,19 L22,1.5 L12,9.25 L2,1.5 Z"/>\
      <rect height="2" width="20" y="20.5" x="2"/>\
    </g>\
  </svg>');
    /* Chrome, still requires prefix in 2022 */
    -webkit-mask: var(--jumpSvg);
    /* Firefox and Safari */
    mask: var(--jumpSvg);
  }

  .paginator nav .go-previous,
  .paginator nav .go-next {
    background-color: var(--vz-body-color);
    --moveSvg: url('data:image/svg+xml, \
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
          <g stroke="rgb(0, 0, 0)" fill="rgb(0,0,0)" transform="rotate(90) scale(0.5)" transform-origin="12 12">\
          <path d="M 2 3.25 L 12 20.75 L 22 3.25 L 12 11 z" />\
        </g>\
      </svg>');
    /* Chrome, still requires prefix in 2022 */
    -webkit-mask: var(--moveSvg);
    /* Firefox and Safari */
    mask: var(--moveSvg);
  }

  .paginator nav .go-previous,
  .paginator nav .go-first {
    --scale: 1;
    transform: scale(var(--scale));
  }

  .paginator nav .go-next,
  .paginator nav .go-last {
    --scale: 1;
    transform: scaleX(-1) scale(var(--scale));
  }

/* Contains the title text and sort indicator, and expands to fill as much of the col width as it can */
.col-title {
  display: flex; /* So that we can make col-title-text expand as much as possible, and still hide overflow with ellipsis */
  min-width: 0px;
  flex-grow: 1;
  padding: 0;
  gap: 0.4rem;
}

.col-header-content {
  position: relative;
  display: flex;
  align-items: center;
  gap: 5px;
}

.col-options-button {
  border: none;
  padding: 0;
  width: 1rem;
  align-self: stretch;
  --optionsSvg: url('data:image/svg+xml,\
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="1.5 0 21 24" stroke-width="2">\
        <g stroke="rgb(0, 0, 0)" fill="rgb(0,0,0)" >\
          <path d="M4 6h16M4 12h16M4 18h16" />\
        </g>\
      </svg>') center center / 1rem no-repeat;
  /* Chrome, still requires prefix in 2022 */
  -webkit-mask: var(--optionsSvg);
  /* Firefox and Safari */
  mask: var(--optionsSvg);
  background-color: var(--vz-body-color);
}

.col-options {
  position: absolute;
  background: var(--vz-card-bg);
  border: 1px solid silver;
  left: 0;
  padding: 1rem;
  z-index: 1;
}

/* If the column is sortable, its title is rendered as a button element for accessibility and to support navigation by tab */
button.col-title {
  border: none;
  background: none;
  position: relative;
  cursor: pointer;
  font-weight: 600;
}

.col-justify-center .col-title {
  justify-content: center;
}

.col-justify-end .col-title {
  flex-direction: row-reverse; /* For end-justified cols, the sort indicator should appear before the title text */
}

/* We put the column title text in its own element primarily so that it can use text-overflow: ellipsis */
.col-title-text {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  color: var(--vz-table-color);
}

/* Deep to make it easy for people adding a sort-indicator element in a custom HeaderTemplate */
th .sort-indicator {
  /* Preset width so the column width doen't change as the sort indicator appears/disappears */
  width: 1rem;
  height: 1rem;
  align-self: center;
  text-align: center;
  opacity: 0.5;
}

.col-sort-desc .sort-indicator, .col-sort-asc .sort-indicator {
  --sortSvg: url('data:image/svg+xml,\
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">\
        <g stroke="rgb(0, 0, 0)" fill="rgb(0,0,0)" > \
          <path d="M 2 3.25 L 12 20.75 L 22 3.25 L 12 10 z" />\
        </g> \
      </svg>');
  /* Chrome, still requires prefix in 2022 */
  -webkit-mask: var(--sortSvg);
  /* Firefox and Safari */
  mask: var(--sortSvg);
  background-color: var(--vz-body-color);
}

.col-sort-asc .sort-indicator {
  transform: scaleY(-1);
}

.form-range-runner-primary::-webkit-slider-runnable-track {
  background: #479ee0 !important;
}

.form-range-runner-secondary::-webkit-slider-runnable-track {
  background: #878a99 !important;
}

.form-range-secondary::-webkit-slider-thumb {
  background: #878a99 !important;
}

.form-range-secondary::-moz-range-thumb {
  background: #878a99 !important;
}

.form-range-secondary::-ms-thumb {
  background: #878a99 !important;
}

.form-range-runner-success::-webkit-slider-runnable-track {
  background: #00bd9d !important;
}

.form-range-success::-webkit-slider-thumb {
  background: #00bd9d !important;
}

.form-range-success::-moz-range-thumb {
  background: #00bd9d !important;
}

.form-range-success::-ms-thumb {
  background: #00bd9d !important;
}

.form-range-runner-warning::-webkit-slider-runnable-track {
  background: #ffbc0a !important;
}

.form-range-warning::-webkit-slider-thumb {
  background: #ffbc0a !important;
}

.form-range-warning::-moz-range-thumb {
  background: #ffbc0a !important;
}

.form-range-warning::-ms-thumb {
  background: #ffbc0a !important;
}

.form-range-runner-danger::-webkit-slider-runnable-track {
  background: #f06548 !important;
}

.form-range-danger::-webkit-slider-thumb {
  background: #f06548 !important;
}

.form-range-danger::-moz-range-thumb {
  background: #f06548 !important;
}

.form-range-danger::-ms-thumb {
  background: #f06548 !important;
}

.form-range-runner-info::-webkit-slider-runnable-track {
  background: #32ccff !important;
}

.form-range-info::-webkit-slider-thumb {
  background: #32ccff !important;
}

.form-range-info::-moz-range-thumb {
  background: #32ccff !important;
}

.form-range-info::-ms-thumb {
  background: #32ccff !important;
}

.form-range-runner-dark::-webkit-slider-runnable-track {
  background: #343a40 !important;
}

.form-range-dark::-webkit-slider-thumb {
  background: #343a40 !important;
}

.form-range-dark::-moz-range-thumb {
  background: #343a40 !important;
}

.form-range-dark::-ms-thumb {
  background: #343a40 !important;
}

.form-range-lg::-webkit-slider-runnable-track {
  height: 15px !important;
}

.form-range-lg::-webkit-slider-thumb {
  height: 25px !important;
  width: 25px !important;
}

.form-range-lg::-moz-range-thumb {
  height: 25px !important;
  width: 25px !important;
}

.form-range-lg::-ms-thumb {
  height: 25px !important;
  width: 25px !important;
}

.form-range-sm::-webkit-slider-runnable-track {
  height: 5px !important;
}

.form-range-sm::-webkit-slider-thumb {
  height: 10px !important;
  width: 10px !important;
  transform: translateY(2px);
}

.form-range-sm::-moz-range-thumb {
  height: 10px !important;
  width: 10px !important;
  transform: translateY(2px);
}

.form-range-sm::-ms-thumb {
  height: 10px !important;
  width: 10px !important;
  transform: translateY(2px);
}

/* Navigation Css */

.sapphire-navmenu {
  margin: 0;
  position: relative;
  list-style: none;
  overscroll-behavior-y: contain;
}

.sapphire-nav-group {
  width: 100%;
  display: block;
  justify-content: flex-start;
  color: var(--vz-vertical-menu-item-color-dark);
}

  .sapphire-nav-group > .sapphire-nav-link > .sapphire-nav-link-text {
    font-weight: 500;
  }

  .sapphire-nav-group * .sapphire-nav-group > .sapphire-nav-link > .sapphire-nav-link-text {
    font-weight: 400;
  }

  .sapphire-nav-group * .sapphire-nav-group > .sapphire-nav-link.sapphire-expanded > .sapphire-nav-link-text {
    font-weight: 500;
  }

  .sapphire-nav-group * .sapphire-navmenu .sapphire-nav-item .sapphire-nav-link {
    padding-left: 36px;
    padding-inline-start: 36px;
    padding-inline-end: unset;
  }

.sapphire-nav-group-disabled, .sapphire-nav-group-disabled .sapphire-nav-link-text, .sapphire-nav-group-disabled .sapphire-nav-link-expand-icon, .sapphire-nav-group-disabled .sapphire-nav-link-icon {
  color: var(--sapphire-palette-text-disabled) !important;
  cursor: default;
  pointer-events: none;
}

.sapphire-nav-item {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  text-decoration: none;
  color: var(--vz-vertical-menu-item-color-dark);
}

.sapphire-nav-link {
  width: 100%;
  font-weight: 400;
  padding: 8px 16px 8px 16px;
  color: inherit;
  line-height: 1.75;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  text-transform: inherit;
  background-color: transparent;
  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, padding 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  align-items: flex-start;
  border: none;
}

  .sapphire-nav-link.sapphire-nav-link-disabled {
    color: var(--sapphire-palette-text-disabled) !important;
    cursor: default;
    pointer-events: none;
  }

  .sapphire-nav-link:hover:not(.sapphire-nav-link-disabled) {
    cursor: pointer;
    text-decoration: none;
    background-color: var(--sapphire-palette-action-default-hover);
  }

  .sapphire-nav-link:focus:not(.sapphire-nav-link-disabled) {
    background-color: var(--sapphire-palette-action-default-hover);
  }

  .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
    font-weight: 500 !important;
    color: var(--vz-topnav-item-color-active)
  }

  .sapphire-nav-link:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon.sapphire-nav-link-icon-default {
    color: var(--sapphire-palette-drawer-icon);
  }

  .sapphire-nav-link.sapphire-nav-link-disabled .sapphire-nav-link-icon {
    color: var(--sapphire-palette-text-disabled);
  }

  .sapphire-nav-link .sapphire-nav-link-expand-icon {
    color: var(--sapphire-palette-drawer-icon);
    transition: 0.3s cubic-bezier(0.25, 0.8, 0.5, 1), visibility 0s;
  }

    .sapphire-nav-link .sapphire-nav-link-expand-icon.sapphire-transform {
      transform: rotate(-180deg);
    }

    .sapphire-nav-link .sapphire-nav-link-expand-icon.sapphire-transform-disabled {
      transform: rotate(-180deg);
    }

  .sapphire-nav-link .sapphire-nav-link-text {
    width: 100%;
    text-align: start;
    margin-left: 12px;
    margin-inline-start: 12px;
    margin-inline-end: unset;
    letter-spacing: 0;
  }

.sapphire-navmenu.sapphire-navmenu-dense .sapphire-nav-link {
  padding: 4px 16px 4px 16px;
}

.sapphire-navmenu.sapphire-navmenu-margin-dense .sapphire-nav-link {
  margin: 2px 0;
}

.sapphire-navmenu.sapphire-navmenu-margin-normal .sapphire-nav-link {
  margin: 4px 0;
}

.sapphire-navmenu.sapphire-navmenu-rounded .sapphire-nav-link {
  border-radius: var(--sapphire-default-borderradius);
}

.sapphire-navmenu.sapphire-navmenu-bordered .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  border-inline-end-style: solid;
  border-inline-end-width: 2px;
}

.sapphire-navmenu.sapphire-navmenu-default .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--vz-topnav-item-color-active);
  background-color: var(--sapphire-palette-action-default-hover);
}

  .sapphire-navmenu.sapphire-navmenu-default .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-default .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: var(--sapphire-palette-action-default-hover);
  }

.sapphire-navmenu.sapphire-navmenu-default .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-primary);
}

.sapphire-navmenu.sapphire-navmenu-primary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-primary);
  background-color: var(--sapphire-palette-primary-hover);
}

  .sapphire-navmenu.sapphire-navmenu-primary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-primary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-primary-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-primary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-primary);
  }

.sapphire-navmenu.sapphire-navmenu-primary .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-primary);
}

.sapphire-navmenu.sapphire-navmenu-secondary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-secondary);
  background-color: var(--sapphire-palette-secondary-hover);
}

  .sapphire-navmenu.sapphire-navmenu-secondary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-secondary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-secondary-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-secondary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-secondary);
  }

.sapphire-navmenu.sapphire-navmenu-secondary .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-secondary);
}

.sapphire-navmenu.sapphire-navmenu-tertiary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-tertiary);
  background-color: var(--sapphire-palette-tertiary-hover);
}

  .sapphire-navmenu.sapphire-navmenu-tertiary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-tertiary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-tertiary-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-tertiary .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-tertiary);
  }

.sapphire-navmenu.sapphire-navmenu-tertiary .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-tertiary);
}

.sapphire-navmenu.sapphire-navmenu-info .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-info);
  background-color: var(--sapphire-palette-info-hover);
}

  .sapphire-navmenu.sapphire-navmenu-info .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-info .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-info-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-info .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-info);
  }

.sapphire-navmenu.sapphire-navmenu-info .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-info);
}

.sapphire-navmenu.sapphire-navmenu-success .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-success);
  background-color: var(--sapphire-palette-success-hover);
}

  .sapphire-navmenu.sapphire-navmenu-success .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-success .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-success-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-success .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-success);
  }

.sapphire-navmenu.sapphire-navmenu-success .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-success);
}

.sapphire-navmenu.sapphire-navmenu-warning .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-warning);
  background-color: var(--sapphire-palette-warning-hover);
}

  .sapphire-navmenu.sapphire-navmenu-warning .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-warning .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-warning-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-warning .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-warning);
  }

.sapphire-navmenu.sapphire-navmenu-warning .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-warning);
}

.sapphire-navmenu.sapphire-navmenu-error .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-error);
  background-color: var(--sapphire-palette-error-hover);
}

  .sapphire-navmenu.sapphire-navmenu-error .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-error .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-error-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-error .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-error);
  }

.sapphire-navmenu.sapphire-navmenu-error .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-error);
}

.sapphire-navmenu.sapphire-navmenu-dark .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) {
  color: var(--sapphire-palette-dark);
  background-color: var(--sapphire-palette-dark-hover);
}

  .sapphire-navmenu.sapphire-navmenu-dark .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):hover:not(.sapphire-nav-link-disabled), .sapphire-navmenu.sapphire-navmenu-dark .sapphire-nav-link.active:not(.sapphire-nav-link-disabled):focus-visible:not(.sapphire-nav-link-disabled) {
    background-color: rgba(var(--sapphire-palette-dark-rgb), 0.12);
  }

  .sapphire-navmenu.sapphire-navmenu-dark .sapphire-nav-link.active:not(.sapphire-nav-link-disabled) .sapphire-nav-link-icon {
    color: var(--sapphire-palette-dark);
  }

.sapphire-navmenu.sapphire-navmenu-dark .sapphire-nav-link-expand-icon.sapphire-transform {
  fill: var(--sapphire-palette-dark);
}

.sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group .sapphire-nav-link {
  padding-left: 36px;
  padding-inline-start: 36px;
  padding-inline-end: 16px;
}

.sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu .sapphire-nav-item .sapphire-nav-link {
  padding-left: 48px;
  padding-inline-start: 48px;
}

.sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group .sapphire-nav-link {
  padding-left: 48px;
  padding-inline-start: 48px;
  padding-inline-end: 16px;
}

.sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu .sapphire-nav-item .sapphire-nav-link {
  padding-left: 60px;
  padding-inline-start: 60px;
  padding-inline-end: 0;
}

.sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group .sapphire-nav-link {
  padding-left: 60px;
  padding-inline-start: 60px;
  padding-inline-end: 16px;
}

.sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu > .sapphire-nav-group * .sapphire-navmenu .sapphire-nav-item .sapphire-nav-link {
  padding-left: 72px;
  padding-inline-start: 72px;
  padding-inline-end: 0;
}

.spinner-border-lg {
  width: 3rem !important;
  height: 3rem !important;
  border-width: 0.2em;
}

.spinner-grow-lg {
  width: 3rem !important;
  height: 3rem !important;
  border-width: 0.2em;
}

/*Home made table*/

tr.sapphire-selected-row {
  background-color: #ddd;
}

/*Fullscreen button*/

.sapphire-editor-wrapper {
  position: relative;
}

  .sapphire-editor-wrapper .sapphire-editor.expanded {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1060;
  }

  .sapphire-editor-wrapper .sapphire-editor .sapphire-fullscreen-icon {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 18px;
    height: 16px;
    cursor: pointer;
    z-index: 3;
  }

.sapphire-editor-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.7);
  z-index: 2;
  opacity: 0;
}

/* Sapphire Stepper */

.sapphire-stepper-progress-container {
  display: flex;
  justify-content: space-between;
  margin-bottom: 30px;
  position: relative;
  align-items: center;
}

.sapphire-stepper-progress {
  height: 4px;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.4s ease;
  width: 100%;
}

.sapphire-stepper-circle {
  align-items: center;
  background-color: #fff;
  border: 3px solid;
  border-radius: 50%;
  color: #999;
  display: flex;
  height: 30px;
  justify-content: center;
  transition: 0.4s ease;
  width: 30px;
  z-index: 1;
}

.sapphire-step {
}

.sapphire-custom-step > * {
  transition: 0.4s ease;
}

.sapphire-step-container {
  position: relative;
  z-index: 1;
  transform-origin: center;
}

.sapphire-step-title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

/* Sapphire Progress Bar */
.progress-bar.indeterminate {
  position: relative;
  animation: progress-indeterminate 3s linear infinite;
}

@keyframes progress-indeterminate {
  0% {
    left: 0%;
    width: 0%;
  }

  40% {
    left: 0%;
    width: 40%;
  }

  100% {
    left: 100%;
    width: 50%;
  }
}

/* Full screen */
.sapphire-full-screen {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh !important;
  overflow: auto;
  z-index: 9999;
}

.sapphire-loading-overlay-container {
  pointer-events: none;
  display: grid;
  place-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255);
  color: white;
  text-align: center;
  line-height: 100%; /* Center the text vertically */
  z-index: 1000; /* Ensure it is above other elements */
}

  .sapphire-loading-overlay-container.show {
    pointer-events: auto;
  }

.sapphire-fade-1 {
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

  .sapphire-fade-1.show {
    opacity: 1;
  }

/* Sapphire Note Card */

.sapphire-note-card::after,
.sapphire-note-modal-flat::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 0;
  border-top: 30px solid #f9e97d;
  border-left: 30px solid transparent;
  border-top-right-radius: var(--vz-border-radius-lg);
}





  .sapphire-note-card-menu-icon:hover {
    color: var(--vz-gray-800);
  }

/* Sapphire Note Modal*/
.sapphire-note-modal .modal-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.sapphire-note-textarea {
  outline: none;
  min-height: 160px;
  resize: none;
  overflow-y: hidden;
  field-sizing: content;
}

.sapphire-note-ruled {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='31'%3E%3Cline x1='0' y1='30.5' x2='100' y2='30.5' stroke='%23f4e17a' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") local;
  background-size: 100% 31px;
  line-height: 31px;
}

.sapphire-note-submit-btn {
  background: #f9e97d;
  border-radius: 6px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.04);
  transition: background 0.2s;
}

  .sapphire-note-submit-btn:hover {
    background: #fff8b5;
  }