// ==========================================================================
// Text Block Component
// Reusable component: title + richtext + optional action
// ==========================================================================

.c-text-block {
  &__overline {
    font-size: $font-size-infotext;
    margin-bottom: 0.75rem;
  }
  &__title-link {
    color: inherit;
    font-weight: inherit;
    text-decoration: none;

    &:hover,
    &:focus-visible {
      color: $primary;
      text-decoration: underline;
    }
  }

  // Title
  &__title {
    // font-size: $block-title-font-size-sm;
    // line-height: 1.2;
    margin-bottom: $spacer * 1;
    margin-top: 0;
    // @include media-breakpoint-up(lg) {
    //   font-size: $block-title-font-size-md;
    // }

    // @include media-breakpoint-up(xl) {
    //   font-size: $block-title-font-size-lg;
    // }
  }
  h1.c-text-block__title {
    font-size: $h2-font-size;
  }

  // Rich text content
  &__text {
    line-height: $line-height-text;
    // margin-bottom: $spacer * 2;

    p:last-child {
      margin-bottom: 0;
    }
  }

  // Action wrapper (button/link)
  &__action {
    // Spacing handled by parent or modifier
    margin-top: 2.5rem;
    @include media-breakpoint-between(lg, xl) {
      margin-top: 2rem;
    }
  }

  ol {
    li {
      font-size: $font-size-lg;
      a {
        color: $secondary-purpurrot;
      }
    }
  }

  // ---------------------------------------------------------------------------
  // Theme: Light (default)
  // ---------------------------------------------------------------------------

  &--light {
    .c-text-block__title {
      color: $primary;
    }

    .c-text-block__text {
      color: $gray-700;
    }
  }

  // ---------------------------------------------------------------------------
  // Theme: Dark (for dark backgrounds)
  // ---------------------------------------------------------------------------

  &--dark {
    .c-text-block__title {
      color: #fff;
    }

    .c-text-block__text {
      color: rgba(#fff, 0.8);
    }
  }

  // ---------------------------------------------------------------------------
  // Size: Large (for hero/slideshow)
  // ---------------------------------------------------------------------------

  &--lg {
    .c-text-block__title {
      @include media-breakpoint-up(xl) {
        font-size: $block-title-font-size-xl;
      }
    }
  }
}