#uctc-form {
  label {
    font-weight: bold;
  }

  select {
    appearance: none;
    font-size: 1rem;
    font-weight: bold;
    padding: 0.2rem 0.5rem;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }

  >div {
    &+div {
      margin-top: 1.5rem;
    }
  }

  thead {
    text-align: left;
  }

  tbody {
    tr {

      &:nth-child(odd),
      &:hover {
        background-color: #eeeeee;
      }
    }
  }

  th,
  td {
    border: 1px solid #cccccc;
    padding: 0.5rem;
  }

  .uctc-table-title {
    margin-bottom: 1rem;
  }

  /* temporarily removing until we can get font awesome to work */
  /* .select-loaded {
    .uctc-select-wrapper {
      position: relative;

      &:after {
        content: '\f107';
        font-family: 'Font Awesome 5 Free';
        font-size: 1.5rem;
        font-weight: bold;
        position: absolute;
        right: 0.5rem;
        top: -5px;
      }
    }
  } */

  .uctc-table {
    border-collapse: collapse;
    display: table;
    width: 100%;
  }
}

#uctc-form .select-wrapper-hide,
#uctc-form .uctc-results-hide {
  display: none;
}

#uctc-form .select-wrapper-display {
  display: flex;
}

#uctc-form .uctc-results-display {
  display: block;
}

#uctc-form .uctc-label-wrapper {
  flex: 1;
}

#uctc-form .uctc-select-wrapper {
  flex: 2;
}

#uctc-form select {
  width: 100%;
}

#uctc-form td {
  vertical-align: top;
}

#uctc-form ul {
  list-style-type: none;
  padding-inline-start: 0;
}

#uctc-form .uctc-table div.class-names {
  max-width: max-content;
  white-space: pre;
}

#uctc-form .uctc-table div.class-names div.divider {
  text-align: center;
}