.digit-view-card {
  .digit-view-card-header {
    @extend .typography.heading-l;
    font-family: theme(digitv2.fontFamily.sans);
    font-style: theme(digitv2.fontStyle.normal);
    font-weight: theme(digitv2.fontWeight.bold);
    line-height: theme(digitv2.lineHeight.lineheight1);

    @media (max-aspect-ratio: 9/16) {
      /* Media query for mobile */
      font-size: theme(digitv2.fontSize.heading-l.mobile);
    }

    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
      /* Media query for tablets */
      font-size: theme(digitv2.fontSize.heading-l.tablet);
    }

    @media (min-aspect-ratio: 3/4) {
      /* Media query for desktop */
      font-size: theme(digitv2.fontSize.heading-l.desktop);
    }

    padding-bottom: theme(digitv2.spacers.spacer2);
    color: theme(digitv2.lightTheme.text-primary);
    line-height: normal;

    @media (max-width: 30rem) {
      padding-bottom: theme(digitv2.spacers.spacer1);
    }
  }

  .digit-view-card-subheader {
    @extend .typography.heading-m;
    font-family: theme(digitv2.fontFamily.sans);
    font-style: theme(digitv2.fontStyle.normal);
    font-weight: theme(digitv2.fontWeight.bold);
    line-height: theme(digitv2.lineHeight.lineheight1);

    @media (max-aspect-ratio: 9/16) {
      /* Media query for mobile */
      font-size: theme(digitv2.fontSize.heading-m.mobile);
    }

    @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
      /* Media query for tablets */
      font-size: theme(digitv2.fontSize.heading-m.tablet);
    }

    @media (min-aspect-ratio: 3/4) {
      /* Media query for desktop */
      font-size: theme(digitv2.fontSize.heading-m.desktop);
    }

    color: theme(digitv2.lightTheme.primary-2);
    line-height: normal;
  }

  .view-card-field-pairs {
    display: flex;
    flex-direction: column;
    gap: theme(digitv2.spacers.spacer4);
    position: relative;

    &.two-column-layout {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: theme(digitv2.spacers.spacer4);

      &.with-divider{
        grid-column-gap:theme(digitv2.spacers.spacer8);
      }
    }

    .vertical-summarycard-divider {
      position: absolute;
      height: 100%;
      border: 0.063rem solid theme(digitv2.lightTheme.generic-divider);
      z-index: 1;
    }
  }
}

.seperate-card-sections {
  display: flex;
  flex-direction: column;

  @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
    gap: theme(digitv2.spacers.spacer5);
  }

  @media (min-aspect-ratio: 3/4) {
    gap: theme(digitv2.spacers.spacer6);
  }

  @media (max-aspect-ratio: 9/16) {
    gap: theme(digitv2.spacers.spacer4);
  }

}