.diagnoses {
  .diagnoses-sidebar-m1021 {
    width: 512px;
    min-width: 512px;
    padding: var(--spacing-3xl) var(--spacing-5xl) var(--spacing-3xl) var(--spacing-6xl);

    .diagnoses-primary-tabs {
      display: flex;
      border-bottom: 1px solid var(--color-border-primary);
      gap: var(--spacing-lg);

      .tab-item {
        max-width: 200px;
        color: var(--color-text-primary);
        line-height: var(--line-height-text-sm);
        font-size: var(--font-size-sm);
        font-weight: var(--weight-semi-bold);
        flex: 1;
        height: 38px;
        display: flex;
        align-items: center;
        justify-content: center;

        &.active {
          font-weight: var(--weight-bold);
          border-bottom: 3px solid var(--color-fg-tertiary);
        }
      }
    }

    .cards {
      margin-top: var(--spacing-3xl);
      display: flex;
      flex-direction: column;
    }

    .card {
      padding: var(--spacing-xl) var(--spacing-3xl);
      background-color: var(--color-bg-primary);
      border-radius: var(--border-radius-md);
      border: 1px solid var(--color-border-secondary);

      .card-title {
        color: var(--color-text-primary);
        font-size: var(--font-size-lg);
        font-weight: var(--weight-semi-bold);
        line-height: var(--line-height-text-lg);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
      }

      .card-info {
        color: var(--color-text-quaternary);
        font-size: var(--font-size-xs);
        font-weight: var(--weight-light);
        line-height: var(--line-height-text-xs);
        margin-top: var(--spacing-xs);
      }

      .card-main {
        margin-top: var(--spacing-xl);
        border-top: 1px solid var(--color-border-secondary);
        padding-top: var(--spacing-xl);
        font-size: var(--font-size-md);
        line-height: var(--line-height-text-md);
        font-weight: var(--weight-light);

        strong {
          font-weight: var(--weight-medium);
        }
      }

      .card-secondary {
        margin-top: var(--spacing-xl);
        border-top: 1px solid var(--color-border-secondary);
        padding-top: var(--spacing-xl);

        .card-secondary-title {
          color: var(--color-text-primary);
          font-size: var(--font-size-sm);
          font-weight: var(--weight-semi-bold);
          line-height: var(--line-height-text-sm);
        }

        .card-secondary-info {
          color: var(--color-text-secondary);
          font-size: var(--font-size-sm);
          font-weight: var(--weight-regular);
          line-height: var(--line-height-text-sm);
          margin-top: var(--spacing-md);

          strong {
            font-weight: var(--weight-medium);
          }
        }
      }
    }
  }
}