.diagnoses.diagnoses-review {
  background-color: var(--color-bg-tertiary);

  .diagnoses-main {
    .title {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 77px;

      h1 {
        font-size: var(--font-size-sm);
        font-weight: var(--weight-bold);
        text-transform: uppercase;
        color: var(--color-base-black);
      }
    }

    .action-card-wrapper {
      margin-top: 16px;
    }

    .cards {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .card {
      position: relative;
      min-width: 960px;
      max-width: 960px;
      padding: 16px 12px 16px 20px;
      border: solid 1px var(--color-border-secondary);
      border-radius: var(--border-radius-md);
      background-color: var(--color-bg-primary);
      display: flex;
      flex-direction: row;

      &.m1021 {
        padding-left: 52px;
      }

      .m1023-position-label-wrapper {
        position: absolute;
        top: 32px;
        left: -55px;
      }

      .drag-handle-wrapper {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        padding: 18px 16px 0 6px;
      }

      .card-main {
        display: flex;
        flex-direction: column;
        flex: 3;
        gap: 12px;

        p {
          color: var(--color-base-black);
          font-size: var(--font-size-sm);
          font-weight: var(--weight-medium);
        }

        .card-footer {
          p {
            font-size: var(--font-size-xs);
            line-height: var(--line-height-xs);
          }
        }
      }

      .card-property {
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 0 8px;
        flex: 2;

        .card-property-label {
          font-size: var(--font-size-xxs);
          font-weight: var(--weight-medium);
          color: var(--color-text-quaternary);
        }

        .card-property-value {
          font-size: var(--font-size-sm);
          font-weight: var(--weight-light);
          color: var(--color-base-black);
        }
      }

      .card-stats {
        position: relative;
        border-left: solid 1px var(--color-border-tertiary);
        padding-left: 8px;
        min-height: 57px;
        display: flex;
        flex-direction: column;
        gap: 6px;
        align-items: flex-end;
        flex: 1;

        .card-stat {
          width: 100%;
          display: flex;
          flex-direction: row;
          align-items: baseline;
          justify-content: space-between;
          gap: 6px;

          .card-stat-label {
            font-size: var(--font-size-xxs);
            font-weight: var(--weight-medium);
            color: var(--color-text-quaternary);
          }

          .card-stat-value {
            font-size: var(--font-size-sm);
            font-weight: var(--weight-light);
            color: var(--color-base-black);
          }
        }
      }
    }

    .subtitle {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 49px;

      h2 {
        font-size: var(--font-size-xs);
        font-weight: var(--weight-regular);
        color: var(--color-text-primary);

        .bold {
          font-weight: var(--weight-bold);
        }
      }
    }
  }
}