@use "@naomi-2025/ui-core/site-config";
@use "@naomi-2025/ui-core/heading-styles";
@use "@naomi-2025/ui-core/heading-font-sizes";
@use "s360-scss-toolkit";

.advanced-header-field {
  // &:has(.advanced-header-field__subtitle) {
  //   font-size: heading-font-sizes.h2-font-size();
  //   margin-bottom: var(--heading--margin-bottom);

  //   .advanced-header-field__heading {
  //     margin-bottom: 0;
  //   }
  // }

  .advanced-header-field__subtitle {
    margin-top: 1em;
    font-size: s360-scss-toolkit.font-size-ms(0);
  }

  // **************************************************
  // SYLES

  &.advanced-header-field--style-centered {
    text-align: center;
  }

  // **************************************************
  // HEADING TAGS

  &.advanced-header-field--heading-tag-h2 {
    // margin-bottom: calc(#{ heading-font-sizes.h2-font-size() } * 0.5);
  }

  &.advanced-header-field--heading-tag-h3 {
    // margin-bottom: calc(#{ heading-font-sizes.h3-font-size() } * 0.5);
  }

  &.advanced-header-field--heading-tag-h4 {
    // margin-bottom: calc(#{ heading-font-sizes.h4-font-size() } * 0.5);
  }

  // **************************************************
  // SIZES

  &.advanced-header-field--size-h2 {
    // margin-bottom: calc(#{ heading-font-sizes.h2-font-size() } * 0.5);

    .advanced-header-field__heading {
      @extend %heading-style-h2;
    }
  }

  &.advanced-header-field--size-h3 {
    // margin-bottom: calc(#{ heading-font-sizes.h3-font-size() } * 0.5);

    .advanced-header-field__heading {
      @extend %heading-style-h3;
    }
  }

  &.advanced-header-field--size-h4 {
    // margin-bottom: calc(#{ heading-font-sizes.h4-font-size() } * 0.5);

    .advanced-header-field__heading {
      @extend %heading-style-h4;
    }
  }
}
