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

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

.Sheep-Teams-ResourceList {
  /* Print styles for teams */ }
  .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); }
  @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; }
