ilios/frontend

@use "../../ilios-common/colors" as c;
@use "../../ilios-common/mixins" as m;

.learner-group-instructor-manager {
  @include m.detail-container(c.$orange);
  border-top: 1px dotted c.$orange;

  .detail-header {
    @include m.detail-container-header;

    .title {
      @include m.detail-container-title;
    }

    .actions {
      @include m.detail-container-actions;
    }
  }

  .detail-content {
    .assigned-instructors {
      @include m.ilios-tag-list;
    }

    .removable-instructors {
      @include m.ilios-removable-list;
      margin-bottom: 1rem;
    }

    .removable-instructor-group {
      & > span {
        background-color: c.$culturedGrey;
        border-radius: 4px;
        cursor: pointer;
        font-weight: bold;
        padding: 0.2rem 0.4rem 0.2rem 0.6rem;
        vertical-align: middle;

        .fa-users {
          margin-right: 0.5rem;
        }
        .remove {
          margin-left: 0.5rem;
        }
      }
      margin: 1rem 0;
    }

    .user-search {
      margin-top: 1rem;
    }
  }
}