@font-face {
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  src: url("/static/fonts/material_icons.woff2") format("woff2");
}

.material-icons {
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

@font-face {
  font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 400;
  src: url("/static/fonts/material_icons_outlined.woff2") format("woff2");
}

.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

.animated-background {
  animation-duration: 2s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: placeHolderShimmer;
  animation-timing-function: linear;
  background-color: #f6f7f8;
  background: linear-gradient(
    to right,
    #eeeeee9c -58%,
    #e4e4e496 18%,
    #eeeeee61 33%
  );
  background-size: 800px 64px;
  height: 300px;
  position: relative;
}

@keyframes placeHolderShimmer {
  0% {
    background-position: -800px 0;
  }

  100% {
    background-position: 800px 0;
  }
}

.oh-modal {
  position: fixed;
  background-color: rgba(28.05, 28.05, 28.05, 0.2);
  z-index: 1021;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  display: none;
  transition: all 0.4 ease-in-out;
  animation: fade-in-animation 0.2s 0s ease-in-out forwards;
}

@keyframes fade-in-animation {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@media (max-width: 575.98px) {
  .oh-modal {
    padding-left: 0.7rem;
    padding-right: 0.7rem;
  }
}

.oh-modal--show {
  display: block;
  transition: all 0.4 ease-in-out;
  overflow-x: hidden;
}

.oh-modal__dialog {
  background-color: hsl(0, 0%, 100%);
  max-width: 700px;
  border-radius: 10px;
  overflow: hidden;
  box-shadow:
    rgba(0, 0, 0, 0.2) 0px 12px 28px 0px,
    rgba(0, 0, 0, 0.1) 0px 2px 4px 0px,
    rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
  margin: 1.75rem auto;
}

.oh-modal__dialog-header {
  position: relative;
  padding: 1.75rem 1.75rem 0.5rem;
  width: 100%;
}
.oh-modal ion-icon {
  font-size: 1.5rem;
}
.oh-modal__dialog-body {
  padding: 0 1.75rem 1.75rem 1.75rem;
}

.oh-modal .oh-btn ion-icon {
  font-size: 1rem !important;
}

.oh-modal__dialog-title {
  font-size: 1.05rem;
}

.oh-modal__close {
  border: none;
  background: none;
  font-size: 1.5rem;
  opacity: 0.7;
  position: absolute;
  top: 25px;
  right: 15px;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.oh-modal__close:hover {
  opacity: 1;
  transition: all 0.3s ease-in-out;
}

.oh-modal__close--custom {
  border: none;
  background: none;
  font-size: 1.5rem;

  position: absolute;
  top: 25px;
  right: 25px;
  cursor: pointer;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.oh-modal__section-head {
  border-bottom: 1px solid hsl(0, 0%, 95%);
  padding-bottom: 0.75rem;
  color: hsl(0, 0%, 37%);
  margin-bottom: 0.75rem;
}

.oh-modal__dialog-footer {
  padding: 0.25rem 1.75rem 1.75rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.oh-modal__dialog--timeoff {
  max-width: 350px;
}

.oh-modal__label {
  display: block;
  font-size: 0.8rem;
  color: hsl(0, 0%, 45%);
  margin-bottom: 0.25rem;
}

.oh-modal__value {
  font-size: 1.05rem;
  font-weight: bold;
}

.oh-modal__description {
  max-height: 150px;
  overflow-y: auto;
}

.oh-modal__dialog--confirm {
  max-width: 350px;
}

.oh-modal__dialog--confirm .oh-modal__dialog-title {
  font-weight: bold;
}

.oh-modal__dialog--confirm .oh-modal__dialog-footer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

.oh-info {
  display: flex;
  align-items: center;
  position: relative;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIGZpbGw9IiM5YzljOWMiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyIDJDNi40ODYgMiAyIDYuNDg2IDIgMTJzNC40ODYgMTAgMTAgMTAgMTAtNC40ODYgMTAtMTBTMTcuNTE0IDIgMTIgMlptMSAxNWgtMnYtNmgydjZabTAtOGgtMlY3aDJ2MloiPjwvcGF0aD4KPC9zdmc+");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}

.oh-label {
  font-size: 0.75rem;
  font-weight: 500;
  margin-top: 10px;
  margin-bottom: 10px;
  display: inline-block;
}

.oh-switch {
  display: flex;
  align-items: center;
}

.oh-switch .oh-switch__checkbox {
  appearance: none;
  background-color: #dfe1e4;
  border-radius: 72px;
  border-style: none;
  flex-shrink: 0;
  height: 20px;
  margin: 0;
  position: relative;
  width: 30px;
  display: inline-block;
  cursor: pointer;
}

.oh-switch .oh-switch__checkbox::before {
  bottom: -6px;
  content: "";
  left: -6px;
  position: absolute;
  right: -6px;
  top: -6px;
}

.oh-switch .oh-switch__checkbox,
.oh-switch .oh-switch__checkbox::after {
  transition: all 100ms ease-out;
}

.oh-select-2--large + .select2-container .select2-selection--multiple {
  height: 48.84px;
}

.oh-switch .oh-switch__checkbox::after {
  background-color: #fff;
  border-radius: 50%;
  content: "";
  height: 14px;
  left: 3px;
  position: absolute;
  top: 3px;
  width: 14px;
}

.oh-switch input[type="checkbox"] {
  cursor: pointer;
}

.oh-switch .oh-switch__checkbox:hover {
  background-color: #c9cbcd;
  transition-duration: 0s;
}

.oh-switch .oh-switch__checkbox:checked {
  background-color: hsl(8, 77%, 56%);
}

.oh-switch .oh-switch__checkbox:checked::after {
  background-color: #fff;
  left: 13px;
}

.oh-switch :focus:not(.focus-visible) {
  outline: 0;
}

.oh-switch .oh-switch__checkbox:checked:hover {
  background-color: hsl(8, 77%, 56%);
}

.oh-input,
.oh-select,
input[type="file"] {
  width: 100%;
  font-size: 0.75rem;
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.75rem;
  color: hsl(0, 0%, 11%);
  background-color: white;
  border-radius: 0.375rem;
  transition:
    border-color 0.3s ease,
    outline 0.3s ease;
  height: 35px;
}

.oh-input::placeholder,
.oh-select::placeholder {
  font-size: 0.75rem;
  color: hsl(216, 18%, 64%);
}

.oh-input:focus,
.oh-input:focus-visible,
.oh-select:focus,
.oh-select:focus-visible {
  outline: none;
  border: 1px solid hsl(221, 83%, 53%) !important;
}

.oh-input:not([type="file"]),
select {
  border: 1px solid #e6e6e6;
}

input[type="file"] {
  font-size: 0.75rem;
}

.sortable-placeholder {
  background-color: #e5e7eb;
  border: 2px dashed #fc8578;
  height: 100px;
  margin: 0.5rem 0;
  border-radius: 0.5rem;
  width: 100%;
}

.group-placeholder {
  background-color: #e5e7eb;
  border: 2px dashed #fc8578;
  margin: 0.5rem 0;
  border-radius: 0.5rem;
  width: 50px;
}

.row-status--purple {
  border-left: 4px solid rgba(128, 128, 128, 0.482) !important;
  border-radius: 5px;
}

.row-status--cyan {
  border-left: 4px solid cyan !important;
  border-radius: 5px;
}

.row-status--yellow {
  border-left: 4px solid yellowgreen !important;
  border-radius: 5px;
}

.row-status--red {
  border-left: 4px solid red !important;
  border-radius: 5px;
}

.row-status--black {
  border-left: 4px solid black !important;
  border-radius: 5px;
}

.row-status--gray {
  border-left: 4px solid gray !important;
  border-radius: 5px;
}

.row-status--orange {
  border-left: 4px solid orange !important;
  border-radius: 5px;
}

.row-status--blue {
  border-left: 4px solid rgb(103, 171, 238) !important;
  border-radius: 5px;
}

.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -0.5);
  margin-left: calc(var(--bs-gutter-x) * -0.5);
}

.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.col {
  flex: 1 0 0%;
}

.row-cols-auto > * {
  flex: 0 0 auto;
  width: auto;
}

.row-cols-1 > * {
  flex: 0 0 auto;
  width: 100%;
}

.row-cols-2 > * {
  flex: 0 0 auto;
  width: 50%;
}

.row-cols-3 > * {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.row-cols-4 > * {
  flex: 0 0 auto;
  width: 25%;
}

.row-cols-5 > * {
  flex: 0 0 auto;
  width: 20%;
}

.row-cols-6 > * {
  flex: 0 0 auto;
  width: 16.6666666667%;
}

@media (min-width: 576px) {
  .col-sm {
    flex: 1 0 0%;
  }

  .row-cols-sm-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-sm-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-sm-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-sm-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-sm-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-sm-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-sm-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }

  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 992px) {
  .col-lg {
    flex: 1 0 0%;
  }

  .row-cols-lg-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-lg-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-lg-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-lg-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-lg-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-lg-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-lg-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 1200px) {
  .col-xl {
    flex: 1 0 0%;
  }

  .row-cols-xl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-xl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-xl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-xl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-xl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-xl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-xl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

@media (min-width: 1400px) {
  .col-xxl {
    flex: 1 0 0%;
  }

  .row-cols-xxl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-xxl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-xxl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-xxl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-xxl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-xxl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-xxl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}

.col-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}

.col-3 {
  flex: 0 0 auto;
  width: 25%;
}

.col-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}

.col-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}

.col-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}

.col-9 {
  flex: 0 0 auto;
  width: 75%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}

.col-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

@media (min-width: 576px) {
  .col-sm-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-sm-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-sm-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-sm-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-sm-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-sm-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-sm-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-sm-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-sm-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-sm-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-sm-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

@media (min-width: 992px) {
  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-lg-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-lg-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-lg-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-lg-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

@media (min-width: 1200px) {
  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-xl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-xl-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-xl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xl-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-xl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-xl-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

@media (min-width: 1400px) {
  .col-xxl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xxl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-xxl-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-xxl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xxl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xxl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xxl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xxl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xxl-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-xxl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xxl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-xxl-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}

.oh-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: none;
  border-radius: 0.375rem;
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
  color: hsl(219, 9%, 29%);
  background-color: transparent;
  transition: all 0.3s ease;
  text-decoration: none;
}
.modal-box .oh-btn {
  font-size: 0.9rem;
}

@media (max-width: 575.98px) {
  .oh-btn {
    font-size: 0.7rem !important;
  }
}

.oh-btn:hover {
  background-color: hsl(0, 0%, 90%);
}

.oh-btn:focus,
.oh-btn:focus-visible {
  outline: hsl(0, 0%, 13%) solid 2px;
  outline-offset: 2px;
}

.oh-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.oh-btn--shadow {
  box-shadow:
    0 1px 3px 0 rgba(0, 0, 0, 0.1),
    0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.oh-btn--sq-sm {
  width: 28px;
  height: 28px;
  padding: 0;
}

.oh-btn--inline {
  display: inline-flex;
}

.oh-btn--transparent {
  background-color: transparent;
  color: rgba(28, 28, 28, 0.8);
}

.oh-btn--transparent:hover,
.oh-btn--transparent:focus,
.oh-btn--transparent:focus-visible {
  background-color: transparent;
  color: rgb(28, 28, 28);
}

.oh-btn--secondary {
  background-color: hsl(8, 77%, 56%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--secondary:hover,
.oh-btn--secondary:focus,
.oh-btn--secondary:focus-visible {
  background-color: hsl(8, 77%, 48%);
  color: white;
}

.oh-btn--secondary:disabled {
  background-color: hsl(8, 77%, 56%);
}

.oh-btn--secondary-outline {
  color: hsl(8, 77%, 56%);
}

.oh-btn--secondary-outline:hover,
.oh-btn--secondary-outline:focus,
.oh-btn--secondary-outline:focus-visible {
  color: hsl(8, 77%, 48%);
}

.oh-btn--success {
  background-color: hsl(148, 71%, 44%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--success:hover,
.oh-btn--success:focus,
.oh-btn--success:focus-visible {
  background-color: hsl(148, 71%, 38%);
}

.oh-btn--danger {
  background-color: hsl(1, 100%, 61%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--danger:hover,
.oh-btn--danger:focus,
.oh-btn--danger:focus-visible {
  background-color: hsl(1, 100%, 55%);
}

.oh-btn--danger-outline {
  color: hsl(1, 100%, 61%);
}

.oh-btn--danger-outline:hover,
.oh-btn--danger-outline:focus,
.oh-btn--danger-outline:focus-visible {
  color: hsl(1, 100%, 55%);
}

.oh-btn--primary {
  background-color: hsl(0, 0%, 13%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--primary:hover,
.oh-btn--primary:focus,
.oh-btn--primary:focus-visible {
  background-color: hsl(0, 0%, 7%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--primary-outline {
  color: hsl(0, 0%, 13%);
}

.oh-btn--primary-outline:hover,
.oh-btn--primary-outline:focus,
.oh-btn--primary-outline:focus-visible {
  color: hsl(0, 0%, 7%);
}

.oh-btn--white-outline {
  color: hsl(0, 0%, 100%);
}

.oh-btn--white-outline:hover,
.oh-btn--white-outline:focus,
.oh-btn--white-outline:focus-visible {
  color: hsl(0, 0%, 90%);
}

.oh-btn--warning {
  background-color: hsl(40, 91%, 60%);
  color: hsl(0, 0%, 11%);
}

.oh-btn--warning:hover,
.oh-btn--warning:focus,
.oh-btn--warning:focus-visible {
  background-color: hsl(40, 91%, 54%);
  color: hsl(0, 0%, 11%);
}

.oh-btn--warning-outline {
  color: hsl(40, 91%, 60%);
}

.oh-btn--warning-outline:hover,
.oh-btn--warning-outline:focus,
.oh-btn--warning-outline:focus-visible {
  color: hsl(40, 91%, 54%);
}

.oh-btn--success-outline {
  color: hsl(148, 71%, 44%);
}

.oh-btn--success-outline:hover,
.oh-btn--success-outline:focus,
.oh-btn--success-outline:focus-visible {
  color: hsl(148, 71%, 38%);
}

.oh-btn--info {
  background-color: hsl(204, 70%, 53%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--info:hover,
.oh-btn--info:focus,
.oh-btn--info:focus-visible {
  background-color: hsl(204, 70%, 47%);
  color: hsl(0, 0%, 100%);
}

.oh-btn--info-outline {
  color: hsl(204, 70%, 53%);
}

.oh-btn--info-outline:hover,
.oh-btn--info-outline:focus,
.oh-btn--info-outline:focus-visible {
  color: hsl(204, 70%, 47%);
}

.oh-btn--dropdown {
  position: relative;
}

.oh-btn--dropdown::after {
  content: url("data:image/svg+xml,%3Csvg width='12' height='12' fill='%23ffffff' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m4.594 8.912 6.553 7.646a1.126 1.126 0 0 0 1.708 0l6.552-7.646c.625-.73.107-1.857-.854-1.857H5.447c-.961 0-1.48 1.127-.853 1.857Z'%3E%3C/path%3E%3C/svg%3E");
  width: 16px;
  height: 16px;
  margin-left: 0.25rem;
}

.oh-input--medium {
  font-size: 0.75rem;
  padding: 0.5rem 1rem;
  height: 36px;
}

.oh-btn--small {
  font-size: 0.75rem;
  padding: 0.375rem 0.75rem;
}

.oh-btn--x-small {
  font-size: 0.7rem;
  padding: 0.25rem 0.5rem;
}

.oh-btn--f-md {
  font-size: 0.875rem;
}

@media (max-width: 767.98px) {
  .oh-btn--w-100-resp {
    width: 100%;
  }
}

.oh-btn--secondary-link {
  color: hsl(8, 77%, 56%);
  background-color: transparent;
}

.oh-btn--secondary-link:hover,
.oh-btn--secondary-link:focus,
.oh-btn--secondary-link:focus-visible {
  color: hsl(8, 77%, 48%);
  background-color: transparent;
}

.oh-btn--danger-link {
  color: hsl(1, 100%, 61%);
  background-color: transparent;
}

.oh-btn--danger-link:hover,
.oh-btn--danger-link:focus,
.oh-btn--danger-link:focus-visible {
  color: hsl(1, 100%, 55%);
  background-color: transparent;
}

.oh-btn--light {
  background-color: hsl(0, 0%, 97.5%);
  color: hsl(8, 77%, 56%);
}

.oh-btn--light:hover,
.oh-btn--light:focus,
.oh-btn--light:focus-visible {
  color: hsl(8, 77%, 48%);
  background-color: hsl(213, 22%, 93%);
}

.oh-btn--light-dark-text {
  background-color: hsl(0, 0%, 97.5%);
  color: hsl(0, 0%, 11%);
}

.oh-btn--light-dark-text:hover,
.oh-btn--light-dark-text:focus,
.oh-btn--light-dark-text:focus-visible {
  color: hsl(0, 0%, 11%);
  background-color: hsl(213, 22%, 93%);
}

.oh-btn--light-danger {
  color: hsl(1, 100%, 61%);
  background-color: transparent;
}

.oh-btn--light-danger:hover,
.oh-btn--light-danger:focus,
.oh-btn--light-danger:focus-visible {
  color: hsl(1, 100%, 55%);
  background-color: hsl(1, 100%, 97%);
}

.oh-btn--view {
  background-color: hsl(0, 0%, 100%);
  border: 1px solid hsl(0, 0%, 90%);
}

.oh-btn--view:hover,
.oh-btn--view:focus,
.oh-btn--view:focus-visible {
  background-color: hsl(0, 0%, 97.5%);
  border-color: hsl(0, 0%, 85%);
}

.oh-btn--view-active {
  background-color: hsl(0, 0%, 93%);
  color: hsl(0, 0%, 11%);
  border: 1px solid hsl(0, 0%, 80%);
}

.oh-btn-group {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
}

table .oh-btn-group {
  display: inline-flex;
  margin: 0 5px;
}
table .oh-btn-group a {
  flex: 1 0 auto;
  width: max-content !important;
}

.option-col-cell,
.action-col-cell {
  text-align: center;
}

.oh-btn-group > * {
  border-radius: 0;
  border-right: 1px solid hsl(213, 22%, 93%);
}

.oh-btn-group > *:first-child {
  border-top-left-radius: 0.375rem;
  border-bottom-left-radius: 0.375rem;
}

.oh-btn-group > *:last-child {
  border-top-right-radius: 0.375rem;
  border-bottom-right-radius: 0.375rem;
}

.oh-btn--light-bkg {
  background-color: hsl(0, 0%, 97.5%) !important;
}

.oh-btn--light-bkg:hover {
  background-color: hsl(0, 0%, 95%) !important;
}

/* .oh-btn--light-bkg forces a near-white background; color modifiers like
   .oh-btn--danger/.oh-btn--success/.oh-btn--secondary set the icon color to
   white (assuming a solid background). Combined, the icon becomes invisible
   (white-on-white). When both are used together, keep the light background
   but tint the icon with the modifier's color instead of white. */
.oh-btn--light-bkg.oh-btn--danger {
  color: hsl(1, 100%, 61%) !important;
}
.oh-btn--light-bkg.oh-btn--danger:hover,
.oh-btn--light-bkg.oh-btn--danger:focus,
.oh-btn--light-bkg.oh-btn--danger:focus-visible {
  color: hsl(1, 100%, 55%) !important;
}
.oh-btn--light-bkg.oh-btn--success {
  color: hsl(148, 71%, 44%) !important;
}
.oh-btn--light-bkg.oh-btn--success:hover,
.oh-btn--light-bkg.oh-btn--success:focus,
.oh-btn--light-bkg.oh-btn--success:focus-visible {
  color: hsl(148, 71%, 38%) !important;
}
.oh-btn--light-bkg.oh-btn--secondary {
  color: hsl(8, 77%, 56%) !important;
}
.oh-btn--light-bkg.oh-btn--secondary:hover,
.oh-btn--light-bkg.oh-btn--secondary:focus,
.oh-btn--light-bkg.oh-btn--secondary:focus-visible {
  color: hsl(8, 77%, 48%) !important;
}

.oh-btn--disabled {
  opacity: 0.5;
  cursor: not-allowed !important;
}

.oh-btn--disabled:focus,
.oh-btn--disabled:focus-visible {
  outline: none;
}

.oh-btn--chat {
  display: inline-flex;
  background-color: transparent;
  border-radius: 50%;
  padding: 0.5rem;
}

.oh-btn--chat::after {
  width: 20px;
  height: 20px;
  position: relative;
  display: block;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  transition: all 0.3s ease;
}

.oh-btn--chat:hover {
  background-color: hsl(0, 0%, 95%);
}

.oh-btn--chat-send::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon s-ion-icon' fill='darkgrey' viewBox='0 0 512 512'%3E%3Cpath d='M16 464l480-208L16 48v160l320 48-320 48z'%3E%3C/path%3E%3C/svg%3E");
}

.oh-btn--chat-send:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='ionicon s-ion-icon' fill='grey' viewBox='0 0 512 512'%3E%3Cpath d='M16 464l480-208L16 48v160l320 48-320 48z'%3E%3C/path%3E%3C/svg%3E");
}

.oh-btn--chat-attachments {
  position: relative;
}

.oh-btn--chat-attachments::after {
  content: "";
  width: 22px;
  height: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M14.8287 7.75737L9.1718 13.4142C8.78127 13.8047 8.78127 14.4379 9.1718 14.8284C9.56232 15.219 10.1955 15.219 10.586 14.8284L16.2429 9.17158C17.4144 8.00001 17.4144 6.10052 16.2429 4.92894C15.0713 3.75737 13.1718 3.75737 12.0002 4.92894L6.34337 10.5858C4.39075 12.5384 4.39075 15.7042 6.34337 17.6569C8.29599 19.6095 11.4618 19.6095 13.4144 17.6569L19.0713 12L20.4855 13.4142L14.8287 19.0711C12.095 21.8047 7.66283 21.8047 4.92916 19.0711C2.19549 16.3374 2.19549 11.9053 4.92916 9.17158L10.586 3.51473C12.5386 1.56211 15.7045 1.56211 17.6571 3.51473C19.6097 5.46735 19.6097 8.63317 17.6571 10.5858L12.0002 16.2427C10.8287 17.4142 8.92916 17.4142 7.75759 16.2427C6.58601 15.0711 6.58601 13.1716 7.75759 12L13.4144 6.34316L14.8287 7.75737Z' fill='rgba(169,169,169,1)'%3E%3C/path%3E%3C/svg%3E");
}

.oh-btn--chat-attachments:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath fill='none' d='M0 0h24v24H0z'%3E%3C/path%3E%3Cpath d='M14.8287 7.75737L9.1718 13.4142C8.78127 13.8047 8.78127 14.4379 9.1718 14.8284C9.56232 15.219 10.1955 15.219 10.586 14.8284L16.2429 9.17158C17.4144 8.00001 17.4144 6.10052 16.2429 4.92894C15.0713 3.75737 13.1718 3.75737 12.0002 4.92894L6.34337 10.5858C4.39075 12.5384 4.39075 15.7042 6.34337 17.6569C8.29599 19.6095 11.4618 19.6095 13.4144 17.6569L19.0713 12L20.4855 13.4142L14.8287 19.0711C12.095 21.8047 7.66283 21.8047 4.92916 19.0711C2.19549 16.3374 2.19549 11.9053 4.92916 9.17158L10.586 3.51473C12.5386 1.56211 15.7045 1.56211 17.6571 3.51473C19.6097 5.46735 19.6097 8.63317 17.6571 10.5858L12.0002 16.2427C10.8287 17.4142 8.92916 17.4142 7.75759 16.2427C6.58601 15.0711 6.58601 13.1716 7.75759 12L13.4144 6.34316L14.8287 7.75737Z' fill='rgba(91,91,91,1)'%3E%3C/path%3E%3C/svg%3E");
}

.oh-btn--sq {
  width: 32px;
  height: 32px;
  padding: 0;
}

.oh-btn--danger-text {
  color: hsl(1, 100%, 61%);
  background-color: transparent;
}

.oh-btn--danger-text:hover {
  color: hsl(1, 100%, 55%);
  background-color: hsl(1, 100%, 97%);
}

.oh-apply_btn {
  font-weight: 500;
  border: 1px solid hsl(8, 77%, 56%);
  background-color: hsl(0, 0%, 97.5%);
  color: hsl(8, 77%, 56%);
  text-decoration: none;
}

.oh-apply_btn:active {
  background-color: hsl(8, 77%, 56%);
  color: hsl(0, 0%, 100%);
}

.oh-apply_btn:focus {
  background-color: hsl(8, 77%, 56%);
  color: hsl(0, 0%, 100%);
  border: none;
  outline: none;
}

.oh-apply_btn:hover {
  background-color: hsl(8, 77%, 56%);
  color: hsl(0, 0%, 100%);
  text-decoration: none;
}

.oh-floatin-btn {
  position: fixed;
  right: 1.5rem;
  bottom: 2.5rem;
  display: flex;
  align-items: center;
  border: none;
  border-radius: 25px;
  padding: 1rem 1.5rem;
  background-color: hsl(0, 0%, 100%);
  box-shadow: rgba(0, 0, 0, 0.1) 0px 3px 8px;
  transition: all 0.3s ease-in-out;
}

.oh-floatin-btn:hover {
  transition: all 0.3s ease-in-out;
}

.oh-floatin-btn--success:hover {
  color: hsl(148, 71%, 44%);
  transition: all 0.3s ease-in-out;
}

.oh-floatin-btn--danger:hover {
  color: hsl(1, 100%, 61%);
  transition: all 0.3s ease-in-out;
}

.oh-hover-btn {
  border: 2px solid rgb(28.05, 28.05, 28.05);
  background-color: transparent;
  border-radius: 3px;
  padding: 0.15rem 0.4rem;
}

.oh-hover-btn:hover {
  background-color: hsl(213, 22%, 93%);
}

.oh-hover-btn-container {
  position: relative;
  display: inline-block;
}

.oh-hover-btn-container::before {
  content: "";
  display: block;
  background-color: transparent;
  position: absolute;
  width: 100%;
  height: 20px;
  bottom: 100%;
}

.oh-hover-btn__small {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: hsl(0, 0%, 100%);
  border: 1px solid hsl(213, 22%, 93%);
  /* box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px,
    rgba(17, 17, 26, 0.05) 0px 8px 32px; */
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}
.oh-hover-btn__small ion-icon {
  font-size: 0.9rem;
}
.oh-hover-btn__main {
  transition: 0.3s;
}

.oh-hover-btn__small:hover {
  background-color: hsl(8, 77%, 56%);
  border: 1px solid hsl(8, 61%, 50%);
  color: hsl(0, 0%, 100%);
  transition: 0.3s;
  transform: scale(105%);
}

.oh-hover-btn-drawer {
  align-items: center;
  position: absolute;
  display: flex;
  gap: 5px;
  z-index: 99;
  right: -20px;
  bottom: 130%;
  visibility: hidden;
  pointer-events: none;
  opacity: 0;
}

.oh-hover-btn-container:hover .oh-hover-btn-drawer {
  display: flex;
  visibility: visible;
  pointer-events: all;
  opacity: 1;
}

.oh-profile {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

.oh-profile__avatar {
  border-radius: 50%;
  flex-shrink: 0;
}

.oh-profile__image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 50%;
}

.oh-profile--md .oh-profile__avatar {
  width: 30px;
  height: 30px;
}

.oh-profile--md .oh-profile__name {
  font-size: 0.8rem;
}

.oh-timeoff-modal__profile-content .oh-profile__image {
  width: 64px;
  height: 64px;
  object-fit: cover;
  object-position: center;
}

.oh-history_user-img {
  width: 40px;
  height: 40px;
  margin-right: 0.6rem;
  position: relative;
}

.oh-history_user-pic {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}

.oh-view-btn--active {
  border: 1px solid hsl(8, 77%, 56%) !important;
}

.swal2-styled.swal2-confirm {
  background-color: rgb(0, 128, 0);
}

.swal2-styled.swal2-cancel {
  background-color: rgb(221, 51, 51);
}

.oh-accordion-header {
  position: relative;
  padding: 8px 10px;
  background: #fff5f1;
  border: unset;
  border-radius: 5px;
  font-size: 13px;
  color: #e54f38;
  font-weight: 600;
  margin-bottom: 10px;
}

.oh-accordion-header:hover {
  background-color: #fceae5;
}

.oh-accordion-header::after {
  content: "";
  width: 25px;
  height: 25px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9IiMxZjFmMWYiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJtNyAxMCA1IDUgNS01SDdaIj48L3BhdGg+Cjwvc3ZnPg==");
  background-size: contain;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: 0;
  margin: auto;
}

.oh-accordion:not(.oh-accordion--show):last-child .oh-accordion-header {
  border-bottom: none;
}

.oh-accordion--show .oh-accordion-header::after {
  content: "";
  width: 25px;
  height: 25px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9IiMxZjFmMWYiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJtNyAxNC41IDUtNSA1IDVIN1oiPjwvcGF0aD4KPC9zdmc+");
  background-size: contain;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: 0;
  margin: auto;
}

.oh-accordion-body {
  opacity: 0;
  /* max-height: 0; */
  transition: all 500ms ease;
  display: none;
}

/* Plus/close indicator on the newer (no-after) accordion header used by
   group_by_table.html — rotate the "+" glyph 45deg into an "x" so the
   open/closed state is visually distinct, since this design has no
   background-image chevron like the legacy accordion header does. */
.oh-accordion-header .icon {
  display: inline-block;
  transition: transform 200ms ease;
}

.oh-accordion--show .oh-accordion-header .icon {
  transform: rotate(45deg);
}

.oh-accordion--show .oh-accordion-body {
  display: block;
  opacity: 1;
  transition: all 500ms ease;
  /* max-height: 400px; */
}

.oh-accordion-meta {
  width: 100%;
}

.oh-accordion-meta__header {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid hsl(213, 22%, 93%);
  background-color: hsl(0, 0%, 100%);
  padding: 0.5rem 0.5rem 0.5rem 2.5rem;
  cursor: pointer;
}

.oh-accordion-meta__header:hover {
  background-color: rgba(233.223, 236.7573, 241.077, 0.4);
}

.oh-accordion-meta__header::before {
  content: "";
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzFjMWMxYyIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEuNSIgdmlld0JveD0iMCAwIDI0IDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxwYXRoIGQ9Ik0xMiA1LjI1djEzLjUiPjwvcGF0aD4KICA8cGF0aCBkPSJNMTguNzUgMTJINS4yNSI+PC9wYXRoPgo8L3N2Zz4=");
  background-position: center;
  background-repeat: no-repeat;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  object-fit: contain;
  position: absolute;
  left: 8px;
}

.oh-accordion-meta__header.oh-accordion-meta__header--show::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9Im5vbmUiIHN0cm9rZT0iIzFjMWMxYyIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjEuNSIgdmlld0JveD0iMCAwIDI0IDI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxwYXRoIGQ9Ik0xOC43NSAxMkg1LjI1Ij48L3BhdGg+Cjwvc3ZnPg==");
}

.oh-accordion-meta__body {
  border: 1px solid hsl(213, 22%, 93%);
  border-top: none;
  padding: 0.5rem;
  background-color: hsl(0, 0%, 100%);
}

.oh-accordion-meta__item {
  margin-bottom: 0.5rem;
}

.oh-accordion-meta__item:last-child {
  margin-bottom: 0;
}

.oh-accordion-meta__btn,
.oh-accordion-meta__btn-icon {
  color: hsl(0, 0%, 11%);
}

.no-after::after {
  content: none !important;
}

.oh-kanban-card__subtitle {
  font-size: 0.85rem;
  color: hsl(0, 0%, 45%);
  margin: 0.25rem 0;
}

@media (max-width: 575.98px) {
  .oh-kanban-card__subtitle {
    font-size: 0.7rem;
  }
}

/* Kanban folded styles */

.folded {
  width: 70px !important;
  transition: all 0.5s ease-in-out;
}
.folded .kanban-head {
  border: none;
}

.folded .oh-kanban__section-body {
  display: none;
  opacity: 0;
  transform: scaleY(0);
  transition: all 0.5s ease-in-out;
}

.folded .kanban-title {
  transform: rotate(90deg) translateX(0);
  transform-origin: top left;
  position: absolute;
  top: 40px;
  left: 40px;
  width: max-content;
  transition: transform 0.5s ease-in-out;
}

.folded .folderBtn {
  transform: rotate(180deg);
  transition: transform 0.5s ease-in-out;
}
.folded .oh-kanban__button-contaner > :not(.folderBtn) {
  display: none;
}

.oh-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.oh-dot--small {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.oh-timeoff-modal__stat-count {
  font-weight: 600;
}

.oh-password-input--toggle {
  position: absolute;
  top: 1px;
  right: 1px;
  height: 100%;
  font-size: 1.25rem;
}

.oh-helpdesk_attached--content {
  display: flex;
  align-items: center;
}

.oh-helpdesk__icon {
  min-width: 42px;
  width: 42px;
  min-height: 42px;
  height: 42px;
  border-radius: 5px;
  background-color: hsl(0, 0%, 96%);
  display: flex;
  align-items: center;
  justify-content: center;
}

.oh-file-icon {
  display: block;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.oh-file-icon--pdf {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgOC40NjcgOC40NjciIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiIGNsYXNzPSIiPjxnPjxwYXRoIGQ9Ik0yLjM1Ny41M2EuODQ0Ljg0NCAwIDAgMC0uODU4LjgzMnY1Ljc0MmMwIC40NTkuMzguODMzLjg1OC44MzNoMy43NTFjLjQ3OCAwIC44Ni0uMzc0Ljg2LS44MzNWMi44MjJsLTIuMDYtLjMzN2EuNzUuNzUgMCAwIDEtLjYxNS0uOTE5TDQuNTYuNTN6bTIuNDYyLjEzLS4yNS45NzhhLjQ2Mi40NjIgMCAwIDAgLjM4NS41NjhsMS43MzMuMjgxem0tLjU4IDIuNzg4YS40LjQgMCAwIDEgLjM0My4xOTNjLjExOS4xNi4xMjguMzY3LjA4NC41NzdhMi41OSAyLjU5IDAgMCAxLS4yMzYuNjAxYy4xOC4zLjM4NC42MDYuNTM3LjgzOC4xMjktLjAxOS4yNTYtLjAzMS4zNzYtLjAzNy4yMzUtLjAxLjQ0Ni4wMDYuNjE2LjA5N2EuNDc4LjQ3OCAwIDAgMSAuMjI3LjU5NS40NC40NCAwIDAgMS0uMjY5LjI0OC41Ny41NyAwIDAgMS0uMzYyLjAwOGMtLjI2LS4wOC0uNDc4LS4zMzQtLjY4OC0uNTk0bC0xLjM5Ni4zMjVjLS4xNzMuMzU4LS4zMjguNjY4LS41NjcuODE0YS40NS40NSAwIDAgMS0uMjMyLjA2NS40NjEuNDYxIDAgMCAxLS4yODgtLjEwN2MtLjE4My0uMTctLjE3MS0uNDYzIDAtLjY1Ni4yMDQtLjIzLjU0NS0uMjcyLjktLjM1Ni4yNzQtLjM2LjU4OC0uODEzLjgxNi0xLjIyOC0uMDEzLS4wMjMtLjAyOC0uMDM5LS4wNC0uMDYyYTIuNDU3IDIuNDU3IDAgMCAxLS4yNS0uNjFjLS4wNDMtLjE5NC0uMDM4LS4zOTUuMDkyLS41NGEuNDcxLjQ3MSAwIDAgMSAuMzM4LS4xNzF6bS0uMDAzLjI4Nkg0LjIzYS4xNC4xNCAwIDAgMC0uMTE2LjA3NGMtLjAzOC4wNTYtLjA2MS4xMzktLjAyOC4yODguMDI1LjExMS4wOTcuMjU3LjE2Ni40LjA0OS0uMTE2LjExNi0uMjQzLjEzNS0uMzM3LjAzNi0uMTcuMDE4LS4yODUtLjAzNC0uMzUxLS4wMy0uMDQtLjA2Ni0uMDc1LS4xMTgtLjA3NHptLjAzMiAxLjM2Yy0uMTU2LjI2NS0uMzUzLjU1Ny0uNTQyLjg0M2wuOTM1LS4yMjdjLS4xMTctLjE4LS4yNi0uNDAyLS4zOTMtLjYxNXptMS4xNDUuODA4LS4wNTcuMDAyYS43MTYuNzE2IDAgMCAwLS4xMzEuMDJjLjE1LjE1NC4zMTMuMzQyLjQxNC4zNzMuMDc1LjAyNy4yNDUuMDAzLjI4LS4wODguMDM3LS4wOTkuMDA2LS4xODYtLjA5Ny0uMjQyYS45MzYuOTM2IDAgMCAwLS40MDktLjA2NXptLTIuMzgzLjU1Yy0uMjI3LjAzOC0uMzQ3LjA3Mi0uNDMxLjE1Mi0uMDgyLjA5My0uMDczLjIwNy0uMDIuMjU3YS4xMzkuMTM5IDAgMCAwIC4xNzUuMDFjLjA2NS0uMDQuMTc3LS4yNTcuMjc2LS40MTh6IiBmaWxsPSIjZTU0ZjM5IiBvcGFjaXR5PSIxIiBkYXRhLW9yaWdpbmFsPSIjMDAwMDAwIiBjbGFzcz0iIj48L3BhdGg+PC9nPjwvc3ZnPg==");
}

.oh-file-icon--image {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiIGNsYXNzPSIiPjxnPjxnIGZpbGw9IiMwMDAiPjxwYXRoIGQ9Ik02LjUgOWEyLjUgMi41IDAgMSAwIDAtNSAyLjUgMi41IDAgMCAwIDAgNXpNMTQgN2wtNS4yMjMgOC40ODdMNyAxM2wtNSA3aDIweiIgZmlsbD0iI2U1NGYzOSIgb3BhY2l0eT0iMSIgZGF0YS1vcmlnaW5hbD0iIzAwMDAwMCIgY2xhc3M9IiI+PC9wYXRoPjwvZz48L2c+PC9zdmc+");
}

.oh-file-icon--audio {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgNjQgNjQiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGQ9Ik03LjcyIDI0LjgzQTMuNzI2IDMuNzI2IDAgMCAwIDQgMjguNTV2Ni45YTMuNzE1IDMuNzE1IDAgMSAwIDcuNDMgMHYtNi45YTMuNzE3IDMuNzE3IDAgMCAwLTMuNzEtMy43MnpNMTkuODYgMTlhMy43MjYgMy43MjYgMCAwIDAtMy43MiAzLjcydjE4LjU2YTMuNzE1IDMuNzE1IDAgMSAwIDcuNDMgMFYyMi43MkEzLjcxNyAzLjcxNyAwIDAgMCAxOS44NiAxOXpNMzIgNS4wNGEzLjcyNiAzLjcyNiAwIDAgMC0zLjcyIDMuNzJ2NDYuNDhhMy43MiAzLjcyIDAgMSAwIDcuNDQgMFY4Ljc2QTMuNzI2IDMuNzI2IDAgMCAwIDMyIDUuMDR6TTQ0LjE0IDExLjkyYTMuNzE3IDMuNzE3IDAgMCAwLTMuNzEgMy43MnYzMi43MmEzLjcxNSAzLjcxNSAwIDEgMCA3LjQzIDBWMTUuNjRhMy43MjYgMy43MjYgMCAwIDAtMy43Mi0zLjcyek01Ni4yOCAxNy45OWEzLjcxNyAzLjcxNyAwIDAgMC0zLjcxIDMuNzJ2MjAuNThhMy43MTUgMy43MTUgMCAxIDAgNy40MyAwVjIxLjcxYTMuNzI2IDMuNzI2IDAgMCAwLTMuNzItMy43MnoiIGZpbGw9IiNlNTRmMzkiIG9wYWNpdHk9IjEiIGRhdGEtb3JpZ2luYWw9IiMwMDAwMDAiPjwvcGF0aD48L2c+PC9zdmc+");
}

.oh-file-icon--file {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgMzIgMzIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnPjxwYXRoIGQ9Ik0yMiA4VjIuNjNMMjcuNDYgOUgyM2ExIDEgMCAwIDEtMS0xem0xIDNhMyAzIDAgMCAxLTMtM1YySDdhMyAzIDAgMCAwLTMgM3YyMmEzIDMgMCAwIDAgMyAzaDE4YTMgMyAwIDAgMCAzLTNWMTF6IiBkYXRhLW5hbWU9IkxheWVyIDEwIiBmaWxsPSIjZTU0ZjM5IiBvcGFjaXR5PSIxIiBkYXRhLW9yaWdpbmFsPSIjMDAwMDAwIj48L3BhdGg+PC9nPjwvc3ZnPg==");
}

.oh-file-icon--html {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNlNTRmMzkiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDxwYXRoIGQ9Im0xMiAxOC4xNzggNC42Mi0xLjI1Ni42MjMtNi43NzhIOS4wMjZMOC44MjIgNy44OWg4LjYyNmwuMjI3LTIuMjExSDYuMzI1bC42MzYgNi42NzhoNy44MmwtLjI2MSAyLjg2Ni0yLjUyLjY2Ny0yLjUyLS42NjctLjE1OC0xLjg0NGgtMi4yN2wuMzI5IDMuNTQ0TDEyIDE4LjE3OFpNMyAyaDE4bC0xLjYyMyAxOEwxMiAyMmwtNy4zNzctMkwzIDJaIj48L3BhdGg+Cjwvc3ZnPg==");
}

.oh-file-icon--excel {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNlNTRmMzkiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDxwYXRoIGQ9Im0yLjg1OSAyLjg3OCAxMi41Ny0xLjc5NWEuNS41IDAgMCAxIC41NzEuNDk1djIwLjg0NmEuNS41IDAgMCAxLS41Ny40OTVMMi44NTggMjEuMTI0YTEgMSAwIDAgMS0uODU5LS45OVYzLjg2OGExIDEgMCAwIDEgLjg1OS0uOTloLjAwMVpNMTcgMy4wMDFoNGExIDEgMCAwIDEgMSAxdjE2YTEgMSAwIDAgMS0xIDFoLTR2LTE4Wm0tNi44IDkgMi44LTRoLTIuNEw5IDEwLjI4NyA3LjQgOC4wMDFINWwyLjggNC0yLjggNGgyLjRMOSAxMy43MTVsMS42IDIuMjg2SDEzbC0yLjgtNFoiPjwvcGF0aD4KPC9zdmc+");
}

.oh-file-icon--word {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNlNTRmMzkiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDxwYXRoIGQ9Ik0xMi4xODYgMTQuNTU1Yy0uNjE3IDAtLjk3Ny41ODctLjk3NyAxLjM3MyAwIC43OS4zNzEgMS4zNS45ODMgMS4zNS42MTcgMCAuOTcxLS41ODguOTcxLTEuMzc0IDAtLjcyNi0uMzQ4LTEuMzUtLjk3Ny0xLjM1WiI+PC9wYXRoPgogPHBhdGggZD0iTTE0IDJINmEyIDIgMCAwIDAtMiAydjE2YTIgMiAwIDAgMCAyIDJoMTJhMiAyIDAgMCAwIDItMlY4bC02LTZaTTkuMTU1IDE3LjQ1NGMtLjQyNi4zNTQtMS4wNzMuNTIxLTEuODY0LjUyMS0uNDc1IDAtLjgxLS4wMy0xLjAzOC0uMDZ2LTMuOTcxYTguMTY1IDguMTY1IDAgMCAxIDEuMjM1LS4wODNjLjc2OCAwIDEuMjY2LjEzOCAxLjY1NS40MzIuNDIuMzEyLjY4NC44MS42ODQgMS41MjIgMCAuNzc1LS4yODIgMS4zMDktLjY3MiAxLjYzOVptMi45OS41NDZjLTEuMiAwLTEuOTAxLS45MDYtMS45MDEtMi4wNTggMC0xLjIxMS43NzMtMi4xMTYgMS45NjctMi4xMTYgMS4yNDEgMCAxLjkxOS45MjkgMS45MTkgMi4wNDUtLjAwMSAxLjMyNS0uODA1IDIuMTI5LTEuOTg1IDIuMTI5Wm00LjY1NS0uNzYyYy4yNzUgMCAuNTgxLS4wNjEuNzYyLS4xMzJsLjEzOC43MTNjLS4xNjguMDg0LS41NDYuMTc0LTEuMDM3LjE3NC0xLjM5NyAwLTIuMTE3LS44NjktMi4xMTctMi4wMjEgMC0xLjM3OS45ODMtMi4xNDYgMi4yMDctMi4xNDYuNDc0IDAgLjgzMy4wOTYuOTk1LjE4bC0uMTg2LjcyNmExLjk4IDEuOTggMCAwIDAtLjc2OC0uMTVjLS43MjYgMC0xLjI5LjQzOC0xLjI5IDEuMzM4IDAgLjgwOS40OCAxLjMxOCAxLjI5NiAxLjMxOFpNMTQgOWgtMVY0bDUgNWgtNFoiPjwvcGF0aD4KIDxwYXRoIGQ9Ik03LjU4NCAxNC41NjNjLS4yMDMgMC0uMzM1LjAxOC0uNDEzLjAzNXYyLjY0NmMuMDc4LjAxOC4yMDQuMDE4LjMxNy4wMTguODI4LjAwNSAxLjM2Ny0uNDUgMS4zNjctMS40MTUuMDA2LS44NC0uNDg1LTEuMjg0LTEuMjcxLTEuMjg0WiI+PC9wYXRoPgo8L3N2Zz4=");
}

.oh-file-icon--default {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNlNTRmMzkiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDxwYXRoIGQ9Ik0xOCAyMmEyIDIgMCAwIDAgMi0yVjhsLTYtNkg2YTIgMiAwIDAgMC0yIDJ2MTZhMiAyIDAgMCAwIDIgMmgxMlpNMTMgNGw1IDVoLTVWNFpNNyA4aDN2Mkg3VjhabTAgNGgxMHYySDd2LTJabTAgNGgxMHYySDd2LTJaIj48L3BhdGg+Cjwvc3ZnPg==");
}

.oh-file-icon--powerpoint {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNlNTRmMzgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJtMTYgMiA1IDV2MTQuMDA4YS45OTMuOTkzIDAgMCAxLS45OTMuOTkySDMuOTkzQTEgMSAwIDAgMSAzIDIxLjAwOFYyLjk5MkMzIDIuNDQ0IDMuNDQ1IDIgMy45OTMgMkgxNlpNOCA4djhoMnYtMmg2VjhIOFptMiAyaDR2MmgtNHYtMloiPjwvcGF0aD4KPC9zdmc+");
}

.oh-rate {
  display: inline-block;
  padding: 0;
}

.oh-rate:not(:checked) > input {
  position: absolute;
  top: -9999px;
}

.oh-rate:not(:checked) > label {
  float: right;
  width: 1.15em;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  font-size: 1rem;
  color: #ccc;
}

.oh-rate:not(:checked) > label:before {
  content: "\f005";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}

.oh-rate > input:checked ~ label {
  color: #ffc700;
}

.oh-rate:not(:checked) > label:hover,
.oh-rate:not(:checked) > label:hover ~ label {
  color: #deb217;
}

.oh-rate > input:checked + label:hover,
.oh-rate > input:checked + label:hover ~ label,
.oh-rate > input:checked ~ label:hover,
.oh-rate > input:checked ~ label:hover ~ label,
.oh-rate > label:hover ~ input:checked ~ label {
  color: #c59b08;
}

.oh-tabs__movable {
  border: 1px solid #e6e6e6;
  background-color: hsl(0, 0%, 100%);
  margin-top: 1rem;
  margin-bottom: 1rem;
  /* box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px; */
  border-radius: 6px;
  font-weight: 500;
  font-size: medium;
  padding: inherit;
  transition: 0.3s;
}

.oh-tabs__movable:first-child {
  margin-top: 0;
}

.oh-tabs__movable:last-child {
  margin-bottom: 0;
}

.oh-tabs__movable-header {
  padding: 0.3rem 0.75rem;
  /* border-bottom: 1px solid hsl(213, 22%, 84%); */
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: move;
  border-radius: inherit;
  font-size: 0.875rem;
  font-weight: 500;
}

.oh-tabs__movable-header--w-80 {
  width: 80%;
  position: relative;
}

.oh-tabs__movable-header--w-80:after {
  content: "";
  bottom: -1px;
  position: absolute;
  border-bottom: 1px solid hsl(213, 22%, 84%);
  left: 100%;
  width: 25%;
}

.oh-dashbaord__events-reel {
  display: flex;
  transition: all 0.3s ease-in-out;
}

.oh-dashboard__event {
  width: 100%;
  color: hsl(0, 0%, 100%);
  box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
  padding: 1.25rem 1.25rem 2.5rem;
  display: flex;
  align-items: flex-start;
  flex-shrink: 0;
  flex-grow: 1;
}

.oh-dashboard__event--purple {
  background-color: rebeccapurple;
  border-radius: 4%;
}

.oh-dashboard__event--crimson {
  background-color: crimson;
  height: 20px;
}

.oh-dasboard__event-photo {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  overflow: hidden;
  margin-right: 0.75rem;
  border: 4px solid rgba(255, 255, 255, 0.3);
}

.oh-dasboard__event-photo,
.oh-dasboard__event-details {
  flex-shrink: 0;
}

.oh-dashboard__event-userphoto {
  width: 100%;
  height: 100%;
}

.oh-dasboard__event-details {
  display: flex;
  flex-direction: column;
}

.oh-dashboard__event-title {
  font-weight: bold;
  font-size: 0.8rem;
}

.oh-dashboard__event-main {
  font-size: 1.35rem;
  margin-bottom: 0.15rem;
}

.oh-dashboard__event-date {
  font-size: 0.8rem;
}

.oh-dashboard__events {
  position: relative;
  max-width: 100%;
  overflow: hidden;
  display: flex;
}

.oh-dashboard__events-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  padding-left: 0;
}

.oh-dashboard__events-nav-item {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.3);
  margin-right: 0.25rem;
  cursor: pointer;
}

.oh-dashboard__events-nav-item:hover {
  background-color: rgba(255, 255, 255, 0.5);
}

.oh-dashboard__events-nav-item:last-child {
  margin-right: 0;
}

.oh-dashboard__events-nav-item--active {
  background-color: rgba(255, 255, 255, 0.8);
}

.oh-card-dashboard__user-list {
  padding-left: 0;
  list-style: none;
  margin-bottom: 0;
}

.oh-card-dashboard__user-item {
  margin-bottom: 0.5rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px dashed hsl(213, 22%, 93%);
  border-radius: 6px;
}

.oh-card-dashboard__user-item:last-child {
  margin-bottom: 0;
  border: none;
}

.oh-card-dashboard {
  width: 100%;
  background-color: hsl(0, 0%, 100%);
  padding: 1rem;
  transition: all 0.4s ease-in-out;
  cursor: pointer;
  border-radius: 5px;
}

.oh-card__footer--border-top {
  border-top: 1px solid hsl(213, 22%, 93%);
}

.oh-tabs__movable-title {
  font-weight: 500;
  font-size: 0.875rem;
}

/* @media (max-width: 767.98px) {
    .oh-main__titlebar-button-container .oh-btn-group.ml-2 {
      margin-left: 0 !important;
    }
    .oh-view-types.ml-2 {
      margin-left: 0;
      margin-right: 10px;
    }
    .oh-btn-group.ml-2:last-child {
      margin-left: 0 !important;
    }
    .oh-main__titlebar-button-container {
      margin-top: 0 !important;
    }
    .oh-main__titlebar--right {
      width: unset;
    }
    .oh-dropdown__filter {
      z-index: 9999;
      left: 50%;
      position: fixed;
      width: 80%;
      transform: translateX(-50%);
    }
  } */

@media (max-width: 575.98px) {
  .oh-tabs__movable-title {
    font-size: 1rem;
    max-width: 200px;
  }
}

.oh-tabs__movable-body {
  padding: 1.25rem;
}

.oh-tabs__action-bar {
  border-bottom: 1px solid hsl(213, 22%, 93%);
  padding-bottom: 0.8rem;
  margin-bottom: 1.25rem;
}

.oh-tabs__movable-close {
  background-color: transparent;
}

.oh-tabs__movable:only-child .oh-tabs__movable-close {
  display: none;
}

.oh-tabs__movable:nth-child(1):nth-last-child(2) .oh-tabs__movable-close {
  display: none;
}

ul.errorlist {
  color: #d9534f;
  background-color: #f0d8d8;
  border: 1px solid #d6e9c6;
  font-size: 0.875rem;
  list-style-type: disc;
  padding: 1rem 1rem 1rem 2rem;
  border-radius: 4px;
  margin: 12px 0;
}

ul.errorlist li {
  margin-bottom: 0.25rem;
  padding-left: 0.25rem;
}

ul.errorlist ul.errorlist {
  list-style-type: none;
  margin-left: 1rem;
  margin-top: 0.25rem;
  padding: 0;
  border: none;
}

ul.errorlist ul.errorlist li {
  margin-bottom: 0.125rem;
  padding-left: 0;
}

.required-star::after {
  content: "*";
  padding-left: 5px;
  color: red;
}

.highlight-selected {
  background: #00d6ff1f !important;
}

.oh-recuritment_tag {
  background-color: hsl(0, 75%, 97%);
  color: hsl(1, 100%, 61%);
  padding: 0.4rem 0.6rem;
  border-radius: 0.2rem;
  margin-right: 0.2rem;
  font-size: 0.8rem;
  height: fit-content;
}

/* SIDEBAR  */

.sidebarModal {
  width: 400px;
  max-width: calc(100% - 1rem);
  height: calc(-2rem + 100vh);
  position: fixed;
  z-index: 999;
  border-radius: 1rem;
  top: 1rem;
  right: 1rem;
  background-color: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(2px);
  padding: 1rem;
  transform: translateX(calc(100% + 1rem));
  transition: 0.3s;
}

.sidebarModal.active {
  transform: translateX(0px);
  box-shadow: rgba(0, 0, 0, 0.1) -15px 5px 20px;
}

@media (max-width: 575px) {
  .sidebarModal {
    width: 300px;
  }
}

/* LIST DESIGN */
.list-checked {
  display: flex;
  flex-flow: column;
}

.list-checked li {
  margin: 5px 0;
  position: relative;
  padding-left: 20px;
}

.list-checked li:before {
  content: "\f058";
  font-family: "Font Awesome 6 Free";
  font-weight: 600;
  font-size: 12px;
  color: #e54f38;
  position: absolute;
  left: 0;
}

.sidebar {
  width: 75px;
  display: flex;
  flex-flow: column;
  align-items: center;
  padding: 15px;
}

.sidebox {
  opacity: 0;
  transition: 0.3s;
  top: 0;
  height: 100vh;
  top: 75px;
  visibility: hidden;
  font-size: 0.85rem;
}

/* Hover-open disabled: the submenu panel now opens only on click via
   the `.sidebox-active` class (see sidebar.html's delegated click
   handler and global.css). This prevents the panel from popping open
   whenever the cursor grazes a sidebar icon. */
/*
.sideboxmain:hover .sidebox {
  opacity: 1;
  visibility: visible;
  background: rgb(255 255 255 / 95%);
  backdrop-filter: blur(3px);
}
*/

.sideboxmain {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  height: 45px;
  padding: 5px;
  border-radius: 50%;
  background-color: #0000000e;
  transition: 0.3s;
}

.sideboxmain:hover:not(.sidebox-current) {
  background-color: var(--sidebar-accent-soft, #fef6f5);
}

.sideboxmain:hover:not(.sidebox-current) img {
  filter: brightness(0) opacity(0.55);
}

.sideboxmain.active {
  background-color: #e34e38;
}

.sideboxmain img,
.sideboxmain svg {
  width: 20px;
  filter: brightness(0);
}

.sideboxmain.active img,
.sideboxmain.active svg {
  filter: brightness(0) invert(1);
}

.sidebox ul li {
  border-bottom: 1px solid #0000000c;
  padding-bottom: 6px;
  margin-bottom: 6px;
}

.sidebox ul li a {
  transition: 0.3s;
  display: flex;
  font-size: 13px;
  padding: 6px 10px;
  border-radius: 5px;
  position: relative;
  transition: 0.3s;
  overflow: hidden;
}

.sidebox ul li a:after {
  content: "";
  position: absolute;
  width: 2px;
  height: 100%;
  background-color: #e34e38;
  opacity: 0;
  inset: 0;
  right: 0;
  left: auto;
  transition: 0.3s;
}

.sidebox ul li a:hover {
  background: rgb(227 78 56 / 10%);
  color: #e34e38;
  /* border-right: 2px solid #e54f38; */
}

.sidebox ul li a:hover:after,
.sidebox ul li a.active:after {
  opacity: 1;
}

.sidebox ul li a.active {
  background: rgb(227 78 56 / 10%);
  color: #e34e38;
}

.oh-permission-panel,
.oh-user-panel {
  background-color: hsl(0, 0%, 97.5%);
  border: 2px solid hsl(213, 22%, 93%);
  font-size: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 0 0 1rem;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.oh-permission-panel:hover,
.oh-user-panel:hover {
  background-color: hsl(0, 0%, 96%);
}

.oh-user-panel {
  padding: 0.5rem 0 0.5rem 0.75rem;
}

.oh-permission-panel__remove,
.oh-user-panel__remove {
  background-color: transparent;
  border: none;
  border-left: 2px solid hsl(213, 22%, 93%);
  width: 35px;
  height: 35px;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 0.5rem;
}

.oh-permission-panel__remove:hover,
.oh-user-panel__remove:hover {
  color: hsl(1, 100%, 61%);
}

.oh-user-panel__remove {
  border-left: none;
}

/* .fixed-table td {
  max-width: 0;
} */

.oh-permission-table__collapse {
  border: none;
  display: flex;
  align-items: center;
  /* padding: 0.5rem; */
  font-size: 1rem;
  visibility: hidden;
}

.oh-sticky-table__tr:hover .oh-permission-table__collapse {
  visibility: visible;
}

.oh-permission-table--toggle:hover .oh-permission-table__collapse {
  visibility: visible;
}

.oh-permission-table__tr .oh-sticky-table__sd {
  width: 35%;
}

.oh-permission-count {
  display: none;
}

.oh-permission-table--collapsed .oh-permission-count {
  width: 100%;
  display: flex;
  padding: 0.5rem 0rem;
  font-style: italic;
  color: hsl(0, 0%, 37%);
  width: 100%;
}

.oh-permission-table--collapsed .oh-permission-panel,
.oh-permission-table--collapsed .oh-user-panel {
  display: none;
}

.oh-permission-table--collapsed
  .oh-permission-table__collapse
  .oh-permission-table__collapse-up {
  display: none;
}

.oh-permission-table--collapsed
  .oh-permission-table__collapse
  .oh-permission-table__collapse-down {
  display: block;
}

.oh-permission-table__collapse .oh-permission-table__collapse-up {
  display: block;
}

.oh-permission-table__collapse .oh-permission-table__collapse-down {
  display: none;
}

@media (max-width: 575.98px) {
  .oh-permission-table__collapse {
    display: none !important;
  }
}

.oh-filter-tag-container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.oh-filter-tag {
  position: relative;
  background-color: hsl(0, 0%, 100%);
  color: hsl(0, 0%, 11%);
  border-radius: 25px;
  border: 1px solid hsl(213, 22%, 93%);
  padding: 0.25rem 0.5rem;
  font-size: 0.7rem;
  font-weight: bold;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  transition: all 0.4s ease-in-out;
}

.oh-filter-tag:hover {
  border-color: hsl(213, 22%, 84%);
  transition: all 0.4s ease-in-out;
}

.oh-filter-tag:hover .oh-filter-tag__close {
  color: hsl(8, 77%, 56%);
}

.oh-filter-tag:hover .oh-filter-tag__close::before {
  background-color: hsl(213, 22%, 84%);
  transition: all 0.4s ease-in-out;
}

.oh-filter-tag__close {
  background-color: transparent;
  color: hsl(0, 0%, 37%);
  padding: 0;
  margin-left: 0.75rem;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s ease-in-out;
}

.oh-filter-tag__close::before {
  content: "";
  width: 0.5px;
  position: relative;
  left: -3px;
  height: 27px;
  background-color: hsl(213, 22%, 93%);
  transition: all 0.4s ease-in-out;
}

.oh-filter-tag__close:hover {
  color: hsl(8, 61%, 50%);
  transition: all 0.4s ease-in-out;
}

.oh-titlebar-container__filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  margin-top: 1.5rem;
  gap: 0.75rem;
}

.oh-titlebar__tag {
  display: inline-block;
  background-color: hsl(0, 0%, 100%);
  color: hsl(0, 0%, 11%);
  border-radius: 25px;
  font-size: 0.85rem;
  padding: 0.25rem 0.75rem;
  font-weight: bold;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid rgba(229.194, 79.4444, 56.406, 0.15);
  transition: background-color 0.3s ease-in-out;
}

.oh-titlebar__tag:hover {
  background-color: rgba(255, 255, 255, 0.8);
  transition: background-color 0.3s ease-in-out;
}

.oh-titlebar__tag-close {
  background-color: hsl(8, 77%, 56%);
  color: hsl(0, 0%, 100%);
  width: 16px;
  height: 16px;
  padding: 0;
  display: inline-flex;
  justify-content: center;
  font-weight: bold;
  align-items: center;
  border: none;
  border-radius: 50%;
  margin-left: 0.75rem;
}

.oh-titlebar__tag-close:hover {
  background-color: hsl(8, 61%, 50%);
}

.oh-titlebar__save {
  background-color: hsl(148, 71%, 44%);
  border: 1px solid hsl(148, 70%, 40%);
  border-radius: 25px;
  font-size: 0.85rem;
  padding: 0.25rem 0.75rem;
  color: hsl(0, 0%, 100%);
  display: flex;
  align-items: center;
  gap: 2px;
}

.oh-titlebar__save:hover {
  background-color: hsl(148, 70%, 40%);
}

.oh-titlebar__tag.filter-field {
  border: solid 1px #ff450033;
}

.oh-titlebar__tag--custom {
  background-color: rgba(255, 68, 0, 0.543) !important;
  color: white;
}

.oh-alert-container {
  top: 75px;
  right: 2rem;
  position: fixed;
  z-index: 9999 !important;
  max-width: 500px;
  width: 95%;
  pointer-events: none;
}

@media (max-width: 575.98px) {
  .oh-alert-container {
    left: auto;
    right: auto;
    width: 95%;
  }
}

.oh-alert {
  opacity: 0;
  width: 100%;
  padding: 1rem;
  background-color: hsl(0, 0%, 100%);
  box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  margin-bottom: 0.75rem;
}

.oh-alert:last-child {
  margin-bottom: 0;
}

.oh-alert::before {
  content: "";
  position: relative;
  display: inline-block;
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 0.75rem;
}

.oh-alert--animated {
  animation: slide-right-in-pop-animation 3.5s 0s ease-in-out forwards;
}

@keyframes slide-right-in-pop-animation {
  0% {
    transform: translate3d(100%, 0, 0);
    visibility: hidden;
    opacity: 0;
  }

  30% {
    transform: translate3d(0, 0, 0);
    visibility: visible;
    opacity: 1;
  }

  80% {
    transform: translate3d(0, 0, 0);
    visibility: visible;
    opacity: 1;
  }

  100% {
    transform: translate3d(-10%, 0, 0);
    visibility: hidden;
    opacity: 0;
  }
}

.oh-alert--danger {
  background-color: hsl(0, 75%, 97%);
  border: 1px solid hsl(357, 72%, 89%);
  border-left: 5px solid hsl(0, 71%, 54%);
}

.oh-alert--danger::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNkZDM2MzYiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNMTIgMi4yNWMtNS4zNzYgMC05Ljc1IDQuMzc0LTkuNzUgOS43NXM0LjM3NCA5Ljc1IDkuNzUgOS43NSA5Ljc1LTQuMzc0IDkuNzUtOS43NVMxNy4zNzYgMi4yNSAxMiAyLjI1Wm0uOTM4IDE0Ljk5NmgtMS44NzZWMTUuMzdoMS44NzZ2MS44NzVabS0uMTg4LTIuOTk2aC0xLjVsLS4yODEtNy41aDIuMDYybC0uMjgxIDcuNVoiPjwvcGF0aD4KPC9zdmc+");
}

.oh-alert--warning {
  background-color: hsl(48, 100%, 94%);
  border: 1px solid hsl(46, 97%, 88%);
  border-left: 5px solid hsl(44, 89%, 62%);
}

.oh-alert--warning::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiNmNGM3NDkiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNMTIgMi4yNWMtNS4zNzYgMC05Ljc1IDQuMzc0LTkuNzUgOS43NXM0LjM3NCA5Ljc1IDkuNzUgOS43NSA5Ljc1LTQuMzc0IDkuNzUtOS43NVMxNy4zNzYgMi4yNSAxMiAyLjI1Wm0uOTM4IDE0Ljk5NmgtMS44NzZWMTUuMzdoMS44NzZ2MS44NzVabS0uMTg4LTIuOTk2aC0xLjVsLS4yODEtNy41aDIuMDYybC0uMjgxIDcuNVoiPjwvcGF0aD4KPC9zdmc+");
}

.oh-alert--info {
  background-color: hsl(212, 89%, 96%);
  border: 1px solid hsl(218, 75%, 87%);
  border-left: 5px solid hsl(225, 72%, 48%);
}

.oh-alert--info::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiMwNDQ0Y2UiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNMTIgMi4yNWMtNS4zNzYgMC05Ljc1IDQuMzc0LTkuNzUgOS43NXM0LjM3NCA5Ljc1IDkuNzUgOS43NSA5Ljc1LTQuMzc0IDkuNzUtOS43NVMxNy4zNzYgMi4yNSAxMiAyLjI1Wm0uOTM4IDE0Ljk5NmgtMS44NzZWMTUuMzdoMS44NzZ2MS44NzVabS0uMTg4LTIuOTk2aC0xLjVsLS4yODEtNy41aDIuMDYybC0uMjgxIDcuNVoiPjwvcGF0aD4KPC9zdmc+");
}

.oh-alert--success {
  background-color: hsl(137, 78%, 93%);
  border: 1px solid hsl(136, 51%, 84%);
  border-left: 5px solid hsl(119, 39.1304347826%, 46%);
}

.oh-alert--success::before {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDYiIGhlaWdodD0iNDYiIGZpbGw9IiM0OWEyNDgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNMTIgMi4yNWMtNS4zNzYgMC05Ljc1IDQuMzc0LTkuNzUgOS43NXM0LjM3NCA5Ljc1IDkuNzUgOS43NSA5Ljc1LTQuMzc0IDkuNzUtOS43NVMxNy4zNzYgMi4yNSAxMiAyLjI1Wm0uOTM4IDE0Ljk5NmgtMS44NzZWMTUuMzdoMS44NzZ2MS44NzVabS0uMTg4LTIuOTk2aC0xLjVsLS4yODEtNy41aDIuMDYybC0uMjgxIDcuNVoiPjwvcGF0aD4KPC9zdmc+");
}

.oh-dropdown {
  position: relative;
}

.oh-dropdown__menu,
.oh-dropdown__import {
  position: absolute;
  min-width: 200px;
  background-color: hsl(0, 0%, 100%);
  padding: 0px 15px;
  border-radius: 10px;
  color: hsl(0, 0%, 11%);
  border: 1px solid hsl(0, 0%, 95%);
  box-shadow:
    rgba(0, 0, 0, 0.1) 0px 10px 15px -3px,
    rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
  z-index: 999;
}

.oh-dropdown__menu--hidden {
  display: none;
}

.oh-dropdown__menu--right,
.oh-dropdown__import--right {
  right: 0;
}

.oh-dropdown__import {
  width: 350px;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

@media (max-width: 575.98px) {
  .oh-dropdown__import {
    width: 95%;
    position: fixed;
    left: 10px;
    right: unset;
  }
}

.oh-dropdown__import-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100px;
  border: 1px dashed hsl(213, 22%, 84%);
  padding: 1rem;
  background: rgba(233.223, 236.7573, 241.077, 0.2);
  cursor: pointer;
}

.oh-dropdown__import-label:hover {
  background: rgba(233.223, 236.7573, 241.077, 0.4);
}

.oh-dropdown__import-form-icon {
  font-size: 4rem;
  color: rgba(28.05, 28.05, 28.05, 0.85);
}

.oh-dropdown__import-form-title {
  font-size: 1rem;
  font-weight: bold;
  color: rgba(28.05, 28.05, 28.05, 0.85);
}

.oh-dropdown__import-form-text {
  font-size: 0.85rem;
  color: hsl(0, 0%, 45%);
}

.oh-dropdown__menu--top-100 {
  top: 100%;
}

.oh-dropdown__menu hr {
  border-style: solid;
  border-color: hsl(0, 0%, 95%);
}

.oh-dropdown__items {
  list-style-type: none;
  padding-left: 0;
}

.oh-dropdown__item {
  margin-top: 15px;
  margin-bottom: 15px;
}

.oh-dropdown__link {
  color: hsl(0, 0%, 11%) !important;
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.oh-dropdown__link:hover {
  color: hsl(8, 77%, 56%) !important;
  text-decoration: none !important;
}

@media (max-width: 575.98px) {
  .oh-dropdown__link {
    font-size: 0.85rem;
  }
}

.oh-dropdown__link--danger {
  color: hsl(1, 100%, 61%) !important;
  border: none;
  background-color: transparent;
  padding: 0;
  width: unset;
  text-align: left;
}

.oh-dropdown__link--danger:hover {
  color: rgba(255, 59.415, 56.1, 0.9) !important;
}

.oh-dropdown__footer {
  display: flex;
  align-items: center;
}

.oh-dropdown__footer * {
  flex-shrink: 0;
}

.oh-dropdown__menu--dark-border {
  border: 1px solid hsl(213, 22%, 84%);
}

.oh-dropdown__menu--highlight {
  border-color: hsl(213, 22%, 84%);
  box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
}

.oh-dropdown__filter-footer {
  border-top: 1px solid hsl(213, 22%, 93%);
  padding-top: 1rem;
}

.oh-dropdown__menu {
  z-index: 15;
  font-size: 12px;
}

.oh-sticky-table_dropdown {
  right: 0;
  width: max-content;
}

.oh-sticy-dropdown-item {
  font-weight: 400;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
}

.oh-empty {
  width: 100%;
  height: calc(100vh - 400px);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.oh-empty__message {
  font-size: 1rem;
  color: hsl(0, 0%, 45%);
  text-align: center;
  max-width: 600px;
}

.oh-empty__title {
  font-size: 1.25rem;
  font-weight: bold;
  margin-top: 1rem;
}

.oh-empty__subtitle {
  color: hsl(0, 0%, 45%);
}

.oh-404 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media screen and (max-width: 576px) {
  .oh-404 {
    width: 80%;
  }
}

.oh-404__image {
  width: 80px;
  height: 80px;
}

.oh-404__title {
  font-size: 1.75rem;
  font-weight: bold;
  margin-top: 1rem;
  text-align: center;
}

@media screen and (max-width: 576px) {
  .oh-404__title {
    font-size: 1.25rem;
  }
}

.oh-404__subtitle {
  color: hsl(0, 0%, 45%);
  text-align: center;
}

@media screen and (max-width: 576px) {
  .oh-404__subtitle {
    font-size: 0.9rem;
  }
}

.oh-activity-sidebar {
  position: fixed;
  top: 0;
  right: 0;
  background-color: hsl(0, 0%, 100%);
  height: 100%;
  min-height: 100vh;
  width: 50%;
  max-width: 1000px;
  box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
  padding: 1rem;
  display: none;
  overflow: hidden;
  z-index: 15;
}

@media (max-width: 767.98px) {
  .oh-activity-sidebar {
    width: 95%;
  }
}

.oh-activity-sidebar--show {
  display: block;
  animation: slide-right-in-animation 0.4s 0s ease-in-out forwards;
}

@keyframes slide-right-in-animation {
  from {
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.oh-activity-sidebar__title,
.oh-activity-sidebar__header-icon {
  font-size: 1rem;
}

.oh-activity-sidebar__header {
  display: flex;
  align-items: center;
  margin-bottom: 1.05rem;
}

.oh-activity-sidebar__body {
  overflow-y: auto;
  height: calc(100% - 90px);
}

.oh-activity-sidebar__qa-list {
  padding-left: 0;
  list-style: none;
}

.oh-activity-sidebar__qa-item {
  background-color: hsl(0, 0%, 100%);
  padding: 1.25rem;
  border-radius: 0.5rem;
  border: 1px solid hsl(213, 22%, 93%);
  box-shadow:
    rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
    rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  transition: background-color 0.4s ease-in-out;
  margin: 1rem auto;
}

.oh-activity-sidebar__qa-item:last-child {
  margin-bottom: 0rem;
}

.oh-activity-sidebar__qa-item:hover {
  background-color: rgba(233.223, 236.7573, 241.077, 0.4);
  transition: background-color 0.4s ease-in-out;
  cursor: pointer;
}

.oh-activity-sidebar__q {
  display: block;
  font-weight: bold;
}

.oh-activity-sidebar__a {
  display: block;
  color: hsl(0, 0%, 45%);
  margin-top: 0.35rem;
}

span.oh-activity-sidebar__a img {
  height: unset !important;
}

.oh-activity-sidebar__close:hover {
  cursor: pointer;
  opacity: 0.6;
  transition: all 0.4s ease-in-out;
}

.ui-tooltip {
  background-color: #1e293b;
  color: white;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  font-size: 0.75rem;
  z-index: 9999 !important;
  display: block;
  max-width: 300px;
  width: auto;
  position: absolute;
}

.ui-helper-hidden-accessible {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.progress {
  height: 20px;
  width: 110px;
  background-color: lightgrey;
  border: 2px solid #27c20c;
  border-radius: 5px;
  overflow: hidden;
}

.progress-bar {
  height: 100%;
  background-color: #27c20c;
  /* Set your desired progress bar color */
}

.progress-text {
  width: 100%;
  text-align: center;
}

.text-center {
  text-align: center !important;
}

.oh-404__image {
  width: 80px;
  height: 80px;
}

.w-25 {
  width: 25% !important;
}

.w-50 {
  width: 50% !important;
}

.w-75 {
  width: 75% !important;
}

.w-100 {
  width: 100% !important;
}

.d-none {
  display: none;
}

.d-flex {
  display: flex !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.justify-content-between {
  justify-content: space-between !important;
}

.align-items-center {
  align-items: center !important;
}

/* ===========================
*         Employee Forms
* ============================ */
.oh-main__org-chart-data {
  display: none;
}

.oh-profile-section {
  background-color: hsl(0, 0%, 100%);
  /* border: 1px solid hsl(213, 22%, 84%); */
  padding: 0 !important;
}

.oh-profile-section__sidebar {
  height: 100%;
  border-right: 1px solid hsl(213, 22%, 84%);
}

.oh-profile-section__sidebar-items {
  padding-left: 0px;
  list-style-type: none;
}

.oh-profile-section__sidebar-item {
  padding: 0.75rem 0;
}

.oh-profile-section__sidebar-item--active {
  border-right: 4px solid hsl(8, 77%, 56%);
}

.oh-profile-section__sidebar-link:hover,
.oh-profile-section__sidebar-link:focus,
.oh-profile-section__sidebar-link:focus-visible {
  text-decoration: none;
}

.oh-profile-section__edit-photo {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  transition: all 0.4s ease-in-out;
}

.oh-profile-section__edit-photo:hover::after {
  content: "Edit";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 30px;
  display: flex;
  justify-content: center;
  color: hsl(0, 0%, 100%);
  background: rgba(0, 0, 0, 0.6);
  padding: 0.25rem;
  transition: all 0.4s ease-in-out;
}

.oh-profile-section__avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 767.98px) {
  .oh-profile-section__topbar {
    flex-direction: row !important;
  }
}

@media (max-width: 575.98px) {
  .oh-profile-section__topbar {
    padding-bottom: 0.75rem;
    flex-direction: column !important;
  }

  .oh-profile-section__topbar .oh-profile-section__tab {
    margin-top: 1.5rem;
  }
}

.oh-profile-section__modal-avatar {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  overflow: hidden;
}

@media (max-width: 767.98px) {
  .oh-profile-section__modal-avatar {
    max-width: 100px;
    height: 100px;
  }
}

.oh-profile-section__modal-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.oh-profile-section__image-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.oh-input--filter,
.oh-dropdown__filter-body
  .oh-select--sm
  + .select2-container
  .select2-selection--single {
  font-size: 0.85rem !important;
  height: 28px !important;
}

.oh-main__topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

@media (max-width: 767.98px) {
  .oh-main__topbar {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 1000px) {
  .oh-main__titlebar .oh-main__titlebar-button-container {
    display: none;
  }
}

.oh-main__titlebar-title {
  font-size: 1.5rem;
}

/* ==================================
    *     Employee Form GENERAL TABS
    * ================================= */
.oh-general__tabs {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  align-content: center;
}

.oh-general__tab {
  margin-right: 1rem;
  flex-grow: 1;
}

.oh-general__tab:last-child {
  margin-right: 0;
}

@media (max-width: 575.98px) {
  .oh-general__tab {
    margin-bottom: 1rem;
  }
}

.oh-general__tab-link {
  color: hsl(0, 0%, 11%);
  border-bottom: 3px solid transparent;
  padding-bottom: 0.75rem;
}

.oh-general__tab-link:hover {
  opacity: 0.7;
}

.oh-general__tab-link:hover,
.oh-general__tab-link:focus,
.oh-general__tab-link:focus-visible {
  text-decoration: none;
}

@media (max-width: 575.98px) {
  .oh-general__tab-link {
    padding: 0.5rem 0.75rem;
    border-bottom: none;
  }
}

.oh-general__tab-link--active {
  border-bottom: 3px solid hsl(8, 77%, 56%);
}

@media (max-width: 575.98px) {
  .oh-general__tab-link--active {
    border-bottom: none;
    background-color: rgba(229.194, 79.4444, 56.406, 0.1);
    color: hsl(8, 77%, 56%);
    border-radius: 0.25rem;
  }

  .oh-general__tab-link--active:focus,
  .oh-general__tab-link--active:focus-visible {
    color: hsl(8, 77%, 56%);
  }
}

.oh-modal__dialog--custom .oh-general__tab .oh-general__tab-link {
  padding: 0;
  transition: 0s;
}

.oh-modal__dialog--custom .oh-general__tab .oh-general__tab-link--active {
  background-color: #e54f38;
  border: 1px solid #e54f38;
  color: #fff;
  padding: 5px 12px;
  border-radius: 23px;
  transition: none;
}

.oh-select:disabled + .select2-container .select2-selection {
  background-color: transparent !important;
  border: none !important;
}

.oh-select:disabled
  + .select2-container
  .select2-selection
  .select2-selection__arrow {
  display: none !important;
}

.select2-container--open .select2-selection {
  border-radius: 0rem !important;
}

input[type="range"] {
  -webkit-appearance: none;
  /* Remove default */
  width: 100%;
  height: 6px;
  background: #ddd;
  border-radius: 5px;
  outline: none;
}

/* Chrome, Safari, Edge */
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #e54f38;
  /* 🔴 Thumb color */
  cursor: pointer;
  margin-top: -7px;
  /* Align thumb vertically */
  border: none;
}

input[type="range"]::-webkit-slider-runnable-track {
  background: #ddd;
  /* 🔘 Track color */
  height: 6px;
  border-radius: 5px;
}

/* Firefox */
input[type="range"]::-moz-range-thumb {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #e54f38;
  cursor: pointer;
  border: none;
}

input[type="range"]::-moz-range-track {
  background: #ddd;
  height: 6px;
  border-radius: 5px;
}

/* Internet Explorer */
input[type="range"]::-ms-thumb {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background: #e54f38;
  cursor: pointer;
  border: none;
}

input[type="range"]::-ms-track {
  background: transparent;
  border-color: transparent;
  color: transparent;
  height: 6px;
}

input[type="range"]::-ms-fill-lower {
  background: #ddd;
  border-radius: 5px;
}

input[type="range"]::-ms-fill-upper {
  background: #ddd;
  border-radius: 5px;
}

/* REPORT MODULE STYLE */

#pivot-container {
  border: 1px solid #ddd;
}

#pivot-container .pvtUiCell {
  background-color: #fff;
}

#pivot-container .pvtUiCell .pvtRenderer,
#pivot-container .pvtUiCell .pvtAggregator {
  border: transparent;
}

.pvtRenderer {
  background-color: transparent !important;
}

.pvtRenderer :focus {
  border: none !important;
  outline: none !important;
}

.pvtRenderer :focus {
  border: none !important;
  outline: none !important;
}

#pivot-container .pvtColLabel,
#pivot-container .pvtRowLabel {
  font-weight: 500 !important;
}

#pivot-container .pvtTable tbody tr th,
#pivot-container .pvtTable thead tr th {
  background-color: #fff !important;
  border: 1px solid #e9edf1 !important;
}

.pvtAxisContainer li {
  display: flex;
}

.pvtAxisContainer li span.pvtAttr {
  border-radius: 0 !important;
  flex: 1 1 auto;
  background-color: #f9f9f9 !important;
  position: relative;
}

/* Triangle opens a per-field "filter this field's values" popup. */
.pvtAxisContainer li span.pvtAttr .pvtTriangle {
  position: absolute;
  right: 8px;
}

.pvtHorizList .ui-sortable-handle .pvtAttr {
  padding: 2px 26px 2px 22px !important;
}

.pvtAxisContainer,
.pvtVals {
  border: 1px solid #e9edf1 !important;
}

.pvtRendererArea {
  padding: 0 !important;
}

#pivot-container {
  width: 100%;
  overflow-x: auto;
}

#pivot-container .pvtTable {
  min-width: 1200px;
  width: 100%;
  min-width: unset;
  max-width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  background-color: #ffffff;
  table-layout: auto;
}

/* .pvtUi is a real <table> (the library's markup). Converted to CSS Grid so
   each cell can be positioned explicitly and the 3 columns get independent,
   controllable widths: `display:contents` on <tr> removes the row wrapper
   from the box tree so its <td> children become direct grid items. Cells
   still stretch to fill their grid row's height by default (same visual
   effect as the original table), which is intentional -- see the note by
   .pvtAxisContainer.pvtUnused below for why. This only changes visual
   layout -- the DOM tree (and therefore the jQuery UI Sortable drag-and-
   drop wiring, which only cares about element positions, not display mode)
   is completely untouched. */
.pvtUi {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 170px 170px 1fr;
  grid-template-rows: auto auto;
}

.pvtUi > tr {
  display: contents;
}

.pvtUi > tr:first-child > td.pvtUiCell:first-child {
  grid-column: 1;
  grid-row: 1;
}

.pvtVals.pvtUiCell {
  grid-column: 2;
  grid-row: 1;
}

.pvtAxisContainer.pvtCols {
  grid-column: 3;
  grid-row: 1;
}

/* align-self left at its default (stretch) here on purpose: with `start`,
   the box shrinks to fit just its own field pills, which looked fine when
   the pill list was long but left a jarring, abruptly-short white box with
   a gray gap underneath whenever the field list was shorter than the
   actual data table next to it. Stretching keeps the white background
   filling the same height as the table, regardless of which one has more
   content, so the layout never looks visually "cut off". */
.pvtAxisContainer.pvtUnused {
  grid-column: 1;
  grid-row: 2;
}

.pvtAxisContainer.pvtRows {
  grid-column: 2;
  grid-row: 2;
}

.pvtRendererArea {
  grid-column: 3;
  grid-row: 2;
}

#pivot-container .pvtUiCell .pvtAggregator,
#pivot-container .pvtUiCell .pvtRenderer {
  background-color: transparent !important;
}

.pvtAttrDropdown {
  border: 1px solid #eaeaea !important;
}

.pvtSearch {
  border: 1px solid hsl(213, 22%, 84%) !important;
  border-radius: 6px !important;
  padding: 0.8rem 1.25rem !important;
  color: hsl(0, 0%, 11%) !important;
  margin-bottom: 4px !important;
}

/* The per-field value filter popup (opened via the ▾ triangle) previously
   had flat, sharp-cornered, shadow-less styling that made it look like a
   stray box sitting on the page rather than a floating overlay -- give it
   the same elevated-card treatment (rounded corners, drop shadow) used by
   modals/dropdowns elsewhere in the app. */
.pvtFilterBox {
  padding: 16px;
  width: auto !important;
  border: 1px solid #e9edf1 !important;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  background-color: #ffffff;
}

.pvtFilterBox h4,
.pvtFilterBox .h4 {
  font-weight: bold;
  font-size: 0.9rem;
  text-align: left;
  margin-left: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 8px;
  margin-bottom: 8px !important;
  border-bottom: 1px solid #e9edf1;
}

.pvtFilterBox input[type="checkbox"].pvtFilter {
  accent-color: #e54f38;
  width: 15px;
  height: 15px;
  cursor: pointer;
}

.pvtFilterBox .pvtCheckContainer label {
  cursor: pointer;
  border-radius: 4px;
  padding: 2px 4px;
  transition: background-color 0.15s ease;
}

.pvtFilterBox .pvtCheckContainer label:hover {
  background-color: #f4f5f7;
}

/* Report pivot builder: make the drag-and-drop mechanics understandable.
   The library gives every zone (available fields / rows / columns) the
   same look with no labels or drag affordance, so people can't tell what
   they're looking at or that the field pills can be dragged around.

   The "drag fields..." hint itself is NOT a ::before on .pvtUi (the
   <table> the library generates) -- a pseudo-element's content there
   still participates in the table's own auto-layout width calculation
   (specifically it was inflating the Available Fields column), so it's a
   real, separate <p class="oh-report-drag-hint"> placed in the template
   above #pivot-container instead, completely independent of the table. */
.oh-report-drag-hint {
  font-size: 13px;
  color: #6b7280;
  margin-bottom: 8px;
  font-weight: bold;
  padding: 10px;
}

.pvtAxisContainer.pvtUnused,
.pvtAxisContainer.pvtRows,
.pvtAxisContainer.pvtCols {
  position: relative;
  padding-top: 26px !important;
}

/* Available Fields was taking up way more width than it needs (the table's
   auto-layout was giving it several times the Rows column's width). A plain
   `width` on the <td> doesn't stick because the table's auto-layout sizes
   each column to its widest content in the column -- which turned out to
   be the "Table" renderer <select> above it (native selects size to their
   widest option, e.g. "Horizontal Stacked Bar Chart"), not the field pills.
   Constrain the select too, and the field pills (li/span), so nothing in
   the column forces it wider than intended. */
.pvtUi select.pvtRenderer {
  width: 150px;
  max-width: 150px;
  min-width: 150px;
}

/* The field-picker select that appears next to aggregators needing a target
   field (e.g. "Sum" of <field>) isn't covered by the Renderer/Aggregator
   border-reset rule above, so the browser's native widget chrome (appearance:
   auto) was overriding the shared border-radius/border-color and rendering
   as a plain, square-cornered, unstyled box. Forcing appearance:none makes
   the custom border actually take effect, matching the rest of the pivot
   table's inputs. */
.pvtUi select.pvtAttrDropdown {
  appearance: none;
  -webkit-appearance: none;
  width: 150px;
  max-width: 150px;
  min-width: 150px;
  border: 1px solid #e6e6e6 !important;
  border-radius: 5px !important;
  background-color: #fff;
}

/* Row/column sort-order toggles (cycle through key/asc/desc order) -- not
   a control this app's reports need, and left as visual clutter next to
   the aggregator box. */
.pvtRowOrder,
.pvtColOrder {
  display: none !important;
}

/* When there's no data, the library renders zero field pills, so these
   columns have no content left to hold their width open -- without a
   min-width the whole table collapses/reflows into a broken-looking mess.
   A floor width keeps the layout stable whether it's full or empty.

   Cap both Available Fields AND Rows at the same width -- different report
   types have a different split of how many fields land in each (e.g. a
   report with few Available Fields but many Row fields), and whichever one
   has more fields otherwise balloons to fill the leftover table width. */
.pvtAxisContainer.pvtUnused,
.pvtAxisContainer.pvtRows {
  width: 1%;
  min-width: 170px;
  max-width: 170px;
}

.pvtVals.pvtUiCell {
  min-width: 170px;
}

.pvtAxisContainer.pvtCols,
.pvtRendererArea {
  min-width: 300px;
}

.pvtAxisContainer.pvtUnused li,
.pvtAxisContainer.pvtRows li {
  width: 160px;
  max-width: 160px;
}

.pvtAxisContainer.pvtUnused li span.pvtAttr,
.pvtAxisContainer.pvtRows li span.pvtAttr {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-sizing: border-box;
}

/* Visual split between the report builder controls (renderer/aggregator
   pickers, Available Fields, Rows, Columns) on the left/top and the actual
   report table on the right, so the two are easy to tell apart at a glance. */
.pvtUiCell {
  background-color: #fafbfc;
}

.pvtVals.pvtUiCell,
.pvtAxisContainer.pvtRows {
  border-right: 2px solid #9aa1ab !important;
}

/* The actual report table gets its own darker, fully-enclosing border, PLUS
   a light tinted background behind it (with real padding -- an earlier rule
   set padding to 0, which would have hidden any tint) so the table reads as
   its own clearly bordered, distinctly colored area rather than blending
   into the same white background as the rest of the page. The table's own
   cells stay white (set elsewhere) so the data itself stays crisp against
   this tinted "frame". */
.pvtRendererArea {
  border: 2px solid #9aa1ab !important;
  background-color: #eef2f7;
  padding: 10px !important;
}

.pvtAxisContainer.pvtUnused::before,
.pvtAxisContainer.pvtRows::before,
.pvtAxisContainer.pvtCols::before {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: block;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #9aa1ab;
  padding: 5px 8px;
  background-color: #f4f5f7;
  border-bottom: 1px solid #e9edf1;
}

.pvtAxisContainer.pvtUnused::before {
  content: "Available Fields";
}

.pvtAxisContainer.pvtRows::before {
  content: "Columns";
}

.pvtAxisContainer.pvtCols::before {
  content: "Rows";
}

/* Available Fields is an inert shelf, not part of the active report
   configuration -- give it a visually "dimmer" pool look so it doesn't
   read the same as the active Rows/Columns zones next to it. */
.pvtAxisContainer.pvtUnused {
  background-color: #fbfbfc;
}

/* Empty-state placeholder so an empty Rows/Columns zone reads as a real
   drop target instead of unexplained blank space. Kept compact -- this sits
   in the Columns zone, which is in the SAME table row as the "Table"
   renderer select; a tall placeholder here stretches that whole row (table
   rows share one height across all cells) and pushes Available Fields/Rows
   down with an empty-looking gap above them. */
.pvtAxisContainer.pvtRows:not(:has(li)),
.pvtAxisContainer.pvtCols:not(:has(li)) {
  min-height: 24px;
}

.pvtAxisContainer.pvtRows:not(:has(li))::after,
.pvtAxisContainer.pvtCols:not(:has(li))::after {
  content: "Drag a field here";
  display: block;
  text-align: center;
  font-size: 12px;
  font-style: italic;
  color: #b5b9c0;
  border: 1px dashed #d7dbe0;
  border-radius: 4px;
  margin: 4px;
  padding: 6px 6px;
}

/* Drag handle: a 6-dot grip before each field's label, plus a grab cursor,
   so fields visually announce that they can be dragged (the chevron next
   to the label is a separate, unrelated "filter this field's values"
   control, not a drag handle). */
.pvtAxisContainer li span.pvtAttr {
  cursor: grab;
  padding-left: 22px !important;
}

.pvtAxisContainer li span.pvtAttr::before {
  content: "";
  position: absolute;
  left: 9px;
  top: 50%;
  width: 3px;
  height: 3px;
  background-color: #b0b5bd;
  border-radius: 50%;
  box-shadow:
    0 -5px 0 #b0b5bd,
    0 5px 0 #b0b5bd,
    6px -5px 0 #b0b5bd,
    6px 0 0 #b0b5bd,
    6px 5px 0 #b0b5bd;
  transform: translateY(-50%);
}

.pvtAxisContainer li span.pvtAttr:active,
.pvtAxisContainer li.ui-sortable-helper span.pvtAttr {
  cursor: grabbing;
}

.pvtAxisContainer li.ui-sortable-helper span.pvtAttr {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.pvtFilterBox p {
  margin-bottom: 0 !important;
  display: flex;
  gap: 8px;
}

.pvtFilterBox p :nth-child(1) {
  width: 100%;
  border-radius: 6px !important;
  background-color: hsl(8, 77%, 56%);
  color: hsl(0, 0%, 100%);
  text-decoration: none;
  font-size: 0.9rem;
  padding: 0.65rem 1rem;
  border: none;
}

.pvtFilterBox p :nth-child(2) {
  width: 100%;
  border-radius: 6px !important;
  background-color: #f0f0f0;
  color: hsl(0, 0%, 16%);
  text-decoration: none;
  font-size: 0.9rem;
  padding: 0.65rem 1rem;
  border: none;
}

.pvtFilterBox p input {
  background-color: transparent !important;
}

.pvtFilterBox p button {
  border: none !important;
  margin-bottom: 4px;
  font-size: 0.9rem;
  padding: 0 8px;
  border-radius: 5px;
}

.pvtFilterBox .pvtCheckContainer p :nth-child(1) {
  background-color: unset !important;
  width: auto;
  padding: 0.5rem 0 !important;
}

.pvtFilterBox .pvtCheckContainer p :nth-child(2) {
  background-color: transparent !important;
  width: auto;
}

#pivot-container .pvtTable td {
  border: 1px solid #e9edf1 !important;
}

#pivot-container .pvtTable tr:nth-child(2n) td {
  background-color: #fff !important;
  border: 1px solid #e9edf1 !important;
}

#pivot-container .pvtTable th {
  background-color: #007bff;
  padding: 12px;
  border: 1px solid #ccc;
  font-size: 18px;
}

#pivot-container .pvtTable td {
  padding: 12px;
  border: 1px solid #ccc;
  font-size: 16px;
  background-color: #fdfdfd;
  color: #333;
}

#pivot-container .pvtTable tr:nth-child(even) td {
  background-color: #f2f2f2;
}

#pivot-container .pvtRowLabel,
#pivot-container .pvtColLabel {
  background-color: #e9ecef;
  font-weight: bold;
  font-size: 16px;
}

#pivot-container .pvtTotalLabel {
  background-color: #6c757d;
  font-weight: bold;
  font-size: 16px;
}

#pivot-container .pvtGrandTotal {
  background-color: #343a40;
  font-weight: bold;
  font-size: 16px;
  color: #fff;
}

#pivot-container .pvtTable tbody tr th,
#pivot-container .pvtTable thead tr th {
  background-color: #e6eeee;
  border: 2px solid #cdcdcd;
  font-size: 10pt;
  padding: 8px;
}

.swal2-actions {
  direction: ltr;
}
.swal2-styled.swal2-confirm {
  background-color: rgb(0, 128, 0);
}
.swal2-styled.swal2-cancel {
  background-color: rgb(221, 51, 51);
}

.note-editable {
  background: white;
}
select {
  padding: 5px 10px !important;
  font-size: 0.8rem !important;
  border-radius: 5px;
}

.form-group label h6 {
  font-size: 0.9rem;
}
.oh-timeoff-modal__profile-info {
  display: flex;
  flex-flow: column;
}
ion-icon {
  font-size: 1rem;
}
.oh-input__label {
  font-size: 0.9rem;
}
input[type="file"] {
  border: unset !important;
  padding-bottom: 32px;
}
table .oh-input,
table .oh-select,
table input[type="file"] {
  margin-bottom: 0;
}
a,
.oh-accordion-header {
  cursor: pointer;
}
.oh-profile-section__card {
  padding: 20px;
}
.stickyright {
  min-width: 130px;
}
.oh-main__titlebar-title {
  font-size: 1rem;
}

.oh-tabs__tab {
  padding: 8px 8px !important;
  border-radius: 6px !important;
  font-size: 0.85rem !important;
  border: 1px solid #efefef !important;
}
.ansbox {
  border: 1px solid #ffffffff;
  padding: 30px;
  margin: 50px;
  background: white;
  border-radius: 10px;
}
.oh-activity-sidebar__header span {
  display: flex;
}

.sha h3 {
  text-align: left !important;
}