@use "../../core/settings" as *;
@use "../../core/tools" as *;

////
/// Label component
///
/// @group components/label
////

@include nhsuk-exports("nhsuk/components/label") {
  .nhsuk-label {
    display: block;
    margin-bottom: nhsuk-spacing(1);

    @include nhsuk-font($size: 19);
  }

  // Modifiers that make labels look more like their equivalent headings
  .nhsuk-label--xl,
  .nhsuk-label--l,
  .nhsuk-label--m {
    margin-bottom: nhsuk-spacing(3);
    @include nhsuk-font-weight-bold;
  }

  .nhsuk-label--xl {
    @include nhsuk-font-size($size: 48);
  }

  .nhsuk-label--l {
    @include nhsuk-font-size($size: 36);
  }

  .nhsuk-label--m {
    @include nhsuk-font-size($size: 26);
  }

  .nhsuk-label--s {
    @include nhsuk-font-weight-bold;
  }

  p,
  .nhsuk-body-m,
  .nhsuk-body-s,
  .nhsuk-body,
  ol,
  ul,
  .nhsuk-list {
    &:has(+ .nhsuk-form-group > .nhsuk-label:first-child),
    &:has(+ .nhsuk-form-group > .nhsuk-label-wrapper:first-child .nhsuk-label) {
      margin-bottom: nhsuk-spacing(3) + nhsuk-spacing(1);

      @media #{nhsuk-from-breakpoint(tablet)} {
        margin-bottom: nhsuk-spacing(4) + nhsuk-spacing(2);
      }
    }
  }

  .nhsuk-body-l {
    &:has(+ .nhsuk-form-group > .nhsuk-label:first-child),
    &:has(+ .nhsuk-form-group > .nhsuk-label-wrapper:first-child .nhsuk-label) {
      margin-bottom: nhsuk-spacing(4);

      @media #{nhsuk-from-breakpoint(tablet)} {
        margin-bottom: nhsuk-spacing(5);
      }
    }

    &:has(+ .nhsuk-form-group > .nhsuk-label--m:first-child),
    &:has(+ .nhsuk-form-group > .nhsuk-label--l:first-child),
    &:has(+ .nhsuk-form-group > .nhsuk-label-wrapper:first-child .nhsuk-label--m),
    &:has(+ .nhsuk-form-group > .nhsuk-label-wrapper:first-child .nhsuk-label--l) {
      margin-bottom: nhsuk-spacing(4) + nhsuk-spacing(1);

      @media #{nhsuk-from-breakpoint(tablet)} {
        margin-bottom: nhsuk-spacing(5) + nhsuk-spacing(2);
      }
    }
  }

  // When the label is nested inside a heading, override the heading so that it
  // does not have a margin. Effectively we want to be able to treat the heading
  // as if it is not there.
  //
  // This breaks BEM conventions because it exists as a parent of the 'block',
  // so we can't really consider an element.
  .nhsuk-label-wrapper {
    margin: 0;
  }
}