.section .modal-content-body {
  margin-top: 2em;
}

.profile {
  display: flex;
  align-items: center;
  gap: 1em;
}
.profile-avatar {
  flex-shrink: 0;
}

.Sheep-Teams-ResourceList .resource-list-header {
  margin-bottom: 2em;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 1em;
}
.Sheep-Teams-ResourceList .resource-list-header .resource-list-header-title {
  gap: 2em;
  flex-wrap: nowrap;
  white-space: nowrap;
}
.Sheep-Teams-ResourceList .resource-list-header .resource-list-header-title .tip {
  white-space: normal;
}
.Sheep-Teams-ResourceList .resource-list-header .resource-list-header-title h1 {
  margin-bottom: 0;
  white-space: normal;
}
.Sheep-Teams-ResourceList .resource-list-header .resource-list-header-actions {
  gap: 1em;
  flex-wrap: nowrap;
}
.Sheep-Teams-ResourceList .resource-list-header .resource-list-header-actions .add-button {
  flex-shrink: 0;
  padding: 0.5em 0.5em 0.5em 1em;
  margin-bottom: 0;
}
.Sheep-Teams-ResourceList .resource-list-header-search {
  margin-bottom: 0;
}
.Sheep-Teams-ResourceList .resource-list-header-search.SearchBar {
  min-width: 250px;
}
.Sheep-Teams-ResourceList .resource-list-export-button,
.Sheep-Teams-ResourceList .resource-list-copy-emails-button,
.Sheep-Teams-ResourceList .resource-list-email-all-button,
.Sheep-Teams-ResourceList .resource-list-configure-button {
  cursor: pointer;
}
.Sheep-Teams-ResourceList .resource-list-export-button:hover,
.Sheep-Teams-ResourceList .resource-list-copy-emails-button:hover,
.Sheep-Teams-ResourceList .resource-list-email-all-button:hover,
.Sheep-Teams-ResourceList .resource-list-configure-button:hover {
  color: var(--darker-grey);
}
.Sheep-Teams-ResourceList.resource-list .TableComponent {
  max-height: calc(100vh - 14rem);
}
.Sheep-Teams-ResourceList.resource-list .TableComponent.TableComponent-with-footer {
  max-height: calc(100vh - 18.5rem);
}
.Sheep-Teams-ResourceList {
  /* Print styles for teams */
}
@media print {
  .Sheep-Teams-ResourceList.resource-list .TableComponent {
    max-height: none !important;
  }
  .Sheep-Teams-ResourceList.resource-list .TableComponent.TableComponent-with-footer {
    max-height: none !important;
  }
}
.Sheep-Teams-ResourceList .TableComponent thead tr th.attendees-action {
  z-index: 1;
  pointer-events: none;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr:last-child {
  border-bottom: 1px solid var(--medium-grey);
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td {
  overflow: hidden;
  overflow-wrap: break-word;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary {
  font-weight: 600;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary div,
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary strong {
  max-width: 250px;
  overflow: hidden;
  overflow-wrap: break-word;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary div.wide,
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary strong.wide {
  max-width: 475px;
  overflow-wrap: anywhere;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary div.PersonProfile,
.Sheep-Teams-ResourceList .TableComponent tbody tr td.primary strong.PersonProfile {
  display: flex;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.no-break {
  overflow-wrap: inherit;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.member-title > div {
  max-width: 250px;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.member-title > div .PersonProfile-name {
  overflow: hidden;
  overflow-wrap: break-word;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.member-email > span {
  max-width: 225px;
  display: block;
  overflow-wrap: initial;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.member-phone > span {
  max-width: 180px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.member-status > span {
  max-width: 100px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.session-title > strong {
  max-width: 250px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.session-date > span {
  max-width: 250px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.session-attended > span {
  width: 40px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.session-no-show > span {
  width: 40px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.achievement-title > span {
  max-width: 250px;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.achievement-title > span strong {
  overflow: hidden;
  overflow-wrap: break-word;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.achievement-category > span {
  max-width: 200px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.achievement-steps > span {
  width: 40px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.achievement-progress {
  min-width: 25vw;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.achievement-progress > div {
  max-width: 35vw;
  min-width: 25vw;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-title {
  max-width: 475px;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-title > strong {
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-regarding > span {
  max-width: 140px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-date > span {
  width: 90px;
  display: block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-assigned > div {
  max-width: 200px;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-assigned > div .PersonProfile-name {
  overflow: hidden;
  overflow-wrap: break-word;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.task-actions > span {
  width: 120px;
  display: inline-block;
}
.Sheep-Teams-ResourceList .TableComponent tbody tr td.attendees-action {
  width: 120px;
}

.AchievementsDetailSection .modal-content-header .AchievementProfileComponent {
  flex: 0 0 49%;
  width: 50%;
  padding: 0.5em;
}
.AchievementsDetailSection .modal-content-header .AchievementProfileComponent .profile-title {
  line-height: 1.3em;
  overflow: hidden;
  overflow-wrap: break-word;
}

.GroupAchievementDetailSection .modal-content-header {
  display: grid;
  grid-template-columns: 9% 56% 1fr;
  width: 100%;
  gap: 0.8em;
  align-items: center;
}
.GroupAchievementDetailSection .modal-content-header .header-text {
  padding: 0.5em 0;
  border-bottom: 1px solid var(--medium-grey);
}
.GroupAchievementDetailSection .modal-content-header .header-text .title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 0;
  line-height: 1.5em;
}
.GroupAchievementDetailSection .modal-content-header .header-text .subtitle {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 0;
  line-height: 1.5em;
}
.GroupAchievementDetailSection .modal-content-header .helper-text {
  margin-left: 2em;
  line-height: 1.5em;
}
.GroupAchievementDetailSection-member .search {
  margin-bottom: 0;
}

.GroupSessionDetailSection.loading-container {
  height: 100%;
  margin-top: 25%;
}
.GroupSessionDetailSection .modal-content-header {
  display: grid;
  grid-template-columns: 65% 1fr;
  width: 100%;
  gap: 0.8em;
  align-items: center;
}
.GroupSessionDetailSection .modal-content-header .header-text {
  padding: 0.5em 0;
  border-bottom: 1px solid var(--medium-grey);
}
.GroupSessionDetailSection .modal-content-header .header-text .title {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 0;
  line-height: 1.5em;
}
.GroupSessionDetailSection .modal-content-header .header-text .subtitle {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 0;
  line-height: 1.5em;
}
.GroupSessionDetailSection .modal-content-header .helper-text {
  margin-left: 2em;
  line-height: 1.5em;
}

.DetailModal.TaskDetailModal .modal-content-body .modal-content-body-form .date input {
  width: 70%;
}
.DetailModal.TaskDetailModal .modal-content-body .modal-content-body-form .completed label .switcher {
  margin-left: 15px;
}

.AchievementItem {
  background-color: var(--white-color);
  display: grid;
  grid-template-columns: 50% 1fr;
  column-gap: 0.8em;
  border: none;
  padding: 2em 0;
  align-items: center;
}
.AchievementItem:not(:last-of-type) {
  border-bottom: 2px solid var(--light-grey);
}
.AchievementItem .profile {
  grid-column: 1/2;
  grid-row: 1/2;
  align-self: start;
}
.AchievementItem .profile-title {
  line-height: 1.3em;
  overflow: hidden;
  overflow-wrap: break-word;
}
.AchievementItem .actions {
  grid-column: 2/3;
  grid-row: 1/2;
  line-height: 1.3em;
  display: flex;
  justify-content: flex-end;
  gap: 2em;
}
.AchievementItem .actions .add-note.link:hover, .AchievementItem .actions .add-note.link:focus {
  color: var(--darkesy-grey);
}
.AchievementItem .actions .status-link {
  text-align: end;
}
.AchievementItem .actions .status-link.link {
  color: var(--main-color);
}
.AchievementItem .actions .status-link.link:hover, .AchievementItem .actions .status-link.link:focus {
  color: var(--main-color-dark);
}
.AchievementItem .body {
  grid-column: 1/-1;
  grid-row: 2/3;
}
.AchievementItem.finished .profile {
  opacity: 50%;
}
.AchievementItem.finished .actions {
  opacity: 50%;
}
.AchievementItem.finished .actions .link {
  color: var(--darker-grey);
}
.AchievementItem.finished .actions .link:hover, .AchievementItem.finished .actions .link:focus {
  color: var(--darkest-grey);
}
.AchievementItem .steps-boxes {
  margin-top: 2em;
  grid-column: 1/-1;
  grid-row: 2/3;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5em;
  transition: all 0.2s;
}
.AchievementItem .steps-container {
  margin-top: 2em;
  columns: 2;
}
.AchievementItem .steps-container .StepItem {
  flex: 0 0 48%;
  gap: 1em;
  line-height: 1.3;
  break-inside: avoid;
}
.AchievementItem .steps-container .StepItem .order {
  font-weight: 500;
  padding-left: 0;
  flex-basis: 0;
}
.AchievementItem .notes-container {
  margin-top: 2em;
}

.NoteItem {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 3%;
  padding: 1.4em 0;
}
.NoteItem:not(:last-child) {
  border-bottom: 1px solid var(--medium-grey);
}
.NoteItem .date {
  flex-basis: 20%;
  line-height: 1.3em;
}
.NoteItem .note-content {
  flex-basis: 46%;
  overflow: hidden;
  overflow-wrap: break-word;
}
.NoteItem .note-content-title {
  line-height: 1.3em;
  margin-bottom: 0.7em;
  display: block;
}
.NoteItem .note-content-body {
  line-height: 1.3em;
}
.NoteItem.team_note {
  padding: 1em 1em;
  cursor: pointer;
}
.NoteItem.team_note:hover {
  background-color: var(--lightest-grey);
}
.NoteItem.team_note .date {
  flex-basis: 42%;
  text-align: end;
}
.NoteItem.team_note .note-content-container {
  width: 100%;
  order: -1;
}
.NoteItem.team_note .note-content {
  flex-basis: 55%;
  order: -1;
}
.NoteItem.team_note .note-content-title {
  margin-bottom: 0;
}
.NoteItem.team_note.grid-layout {
  display: grid;
  align-items: center;
  grid-template-columns: 7fr 2fr 20px;
}
.NoteItem.achievement_note {
  background-color: var(--lightest-grey);
  padding: 1.5em 1em;
  border-radius: 4px;
}
.NoteItem.achievement_note:not(:last-child) {
  margin-bottom: 1em;
  border-bottom: none;
}
.NoteItem.achievement_note .date {
  flex-basis: 20%;
}
.NoteItem.achievement_note .note-content {
  flex-basis: 80%;
}

.StepItem {
  display: flex;
  align-items: center;
}
.StepItem:not(:last-child) {
  margin-bottom: 1.5em;
}
.StepItem .checkbox-container {
  flex-basis: 10%;
  display: grid;
  grid-template-columns: min-content 1fr;
  place-items: center;
  margin-bottom: 0;
}
.StepItem .checkbox-container .CheckBoxFieldInput {
  grid-column: 1/2;
  grid-row: 1/2;
}
.StepItem .checkbox-container .checkbox {
  z-index: 10;
  display: flex;
  align-items: center;
}
.StepItem .checkbox-container .checkbox.complete_step .FieldComponent-checkbox-box, .StepItem .checkbox-container .checkbox.uncomplete_step .FieldComponent-checkbox-box {
  background-color: var(--main-color-lighter);
}
.StepItem .checkbox-container .checkbox .FieldComponent-checkbox-box {
  background-color: var(--light-grey);
  border-color: var(--light-grey);
}
.StepItem .checkbox-container .x-mark {
  grid-column: 1/2;
  grid-row: 1/2;
  padding-left: 0;
  flex-basis: 0;
  z-index: 20;
  cursor: pointer;
  color: var(--dark-grey);
}
.StepItem .checkbox-container:hover .checkbox .FieldComponent-checkbox-box {
  border-color: var(--main-color);
  box-shadow: 0 0 6px var(--main-color);
}
.StepItem .checkbox-container:hover .x-mark {
  color: var(--main-color);
}
.StepItem .order {
  padding-left: 1em;
  flex-basis: 8%;
  font-weight: 500;
}
.StepItem .order::after {
  content: ".";
}
.StepItem.collapsed {
  display: grid;
  grid-template-columns: min-content 1fr;
  margin-bottom: 0;
}
.StepItem.collapsed .checkbox-container {
  grid-column: 1/2;
  grid-row: 1/2;
}
.StepItem.collapsed .checkbox {
  z-index: 10;
}
.StepItem.collapsed .checkbox .FieldComponent-checkbox-box {
  background-color: var(--light-grey);
}
.StepItem.collapsed .order {
  grid-column: 1/2;
  grid-row: 1/2;
  justify-self: center;
  padding-left: 0;
  flex-basis: 0;
  z-index: 20;
  cursor: pointer;
}
.StepItem.collapsed .order::after {
  content: "";
}
.StepItem.collapsed .order.checked {
  opacity: 0;
}
.StepItem.collapsed .name {
  display: none;
}
.StepItem.collapsed:hover .checkbox .FieldComponent-checkbox-box {
  border-color: var(--main-color);
  box-shadow: 0 0 6px var(--main-color);
}
.StepItem.collapsed:hover .order {
  color: var(--main-color);
}

.SessionItem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.3em 0.5em;
}
.SessionItem:not(:last-child) {
  margin-bottom: 0;
  border-bottom: 1px solid var(--medium-grey);
}
.SessionItem-left-area {
  flex: 0 0 70%;
}
@media only screen and (max-width: 800px) {
  .SessionItem-left-area {
    flex: 0 0 65%;
  }
}
.SessionItem-left-area .details {
  display: flex;
  align-items: center;
  gap: 5%;
  line-height: 1.5;
}
.SessionItem-left-area .details .title {
  overflow: hidden;
  overflow-wrap: break-word;
  flex: 0 0 40%;
}
.SessionItem-left-area .details .date {
  flex: 0 0 60%;
}
.SessionItem-right-area {
  flex: 1 0 24%;
  display: flex;
  justify-content: flex-end;
  text-align: end;
  align-items: center;
}
.SessionItem-right-area .label {
  margin-bottom: 0;
}
.SessionItem-right-area .label .label-before-toggle {
  font-weight: 500;
}
.SessionItem-right-area .label .switcher {
  margin: 0 1em;
}

.DragSwitchItem {
  display: flex;
}
.DragSwitchItem.auto {
  pointer-events: auto;
}
.DragSwitchItem .switch {
  margin-left: 0;
}