@import 'variables/gutters';
@import 'mixins/list';

.deltagare-card {
  &__tab-contents {
    display: flex;
    gap: $digi--layout--gutter--l;
    margin: 0 $digi--layout--gutter--l;
  }

  &__tab-column {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
  }

  &__select-report {
    max-width: var(--digi--typography--text--max-width);
  }

  &__cta-wrapper {
    margin-top: $digi--layout--gutter--l;
    margin-bottom: $digi--layout--gutter--xl;
  }

  dd {
    margin: 0 0 1rem;
  }

  dt,
  &__subheading {
    font-size: var(--digi--typography--font-size--desktop);
    font-weight: var(--digi--typography--font-weight--semibold);
    margin: var(--digi--layout--gutter--s) 0 0;

    &--with-margin {
      font-size: var(--digi--typography--font-size--h3);
      margin-bottom: var(--digi--layout--gutter--s);
    }
  }

  &__experience-list {
    @include msfa__reset-list;
  }

  &__accordion {
    display: block;
    margin-top: var(--digi--layout--gutter);
  }

  &__accordion-trigger {
    font-weight: var(--digi--typography--font-weight--semibold);
  }

  &__popover {
    display: inline-block;
    margin-left: var(--digi--layout--gutter--s);
  }

  &__header,
  &__footer {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
  }

  &__footer {
    margin-top: $digi--layout--gutter--l;
  }
}
