/**
 * Heading Block Styles
 *
 * This file contains styles for WordPress block editor heading elements (H1-H6).
 * It provides typography styling, text alignment options, font size variations,
 * background colors, text colors, and custom styles like underline. Includes
 * responsive adjustments for mobile devices.
 *
 * @package VGA
 * @since 1.0.0
 */

/* Heading Wrapper */
.wp-block-heading {
  line-height: 1.2;
  color: #1a4a5e;
  font-weight: 600;
}

/* Headings */
.wp-block-heading:first-child {
  margin-top: 0;
}
.wp-block-heading h1 {
  font-size: var(--wp--preset--font-size--huge);
  line-height: 1.1;
  font-weight: 700;
  margin-bottom: 1.5rem;
}
h2.wp-block-heading {
  font-size: calc(var(--wp--preset--font-size--normal) * 1.4);
  line-height: 1.2;
  font-weight: 600;
  margin-bottom: 1.25rem;
  margin-top: 3.5rem;
}
h3.wp-block-heading,
.wp-block-heading h3 {
  font-size: calc(var(--wp--preset--font-size--normal) * 1.2);
  line-height: 1.3;
  font-weight: 600;
  margin-bottom: 1rem;
  margin-top: 2.5rem;
}
h4.wp-block-heading  {
  /* font-size: var(--wp--preset--font-size--normal);
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 0.75rem; */
  margin-top: 2rem;
}
.wp-block-heading h5 {
  font-size: var(--wp--preset--font-size--normal);
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.wp-block-heading h6 {
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

/* Text Alignment */
.wp-block-heading.has-text-align-left {
  text-align: left;
}
.wp-block-heading.has-text-align-center {
  text-align: center;
}
.wp-block-heading.has-text-align-right {
  text-align: right;
}

/* Font Size */
.wp-block-heading.has-small-font-size {
  font-size: var(--wp--preset--font-size--small);
}
.wp-block-heading.has-normal-font-size {
  font-size: var(--wp--preset--font-size--normal);
}
.wp-block-heading.has-large-font-size {
  font-size: var(--wp--preset--font-size--large);
}
.wp-block-heading.has-larger-font-size {
  font-size: var(--wp--preset--font-size--larger);
}
.wp-block-heading.has-huge-font-size {
  font-size: var(--wp--preset--font-size--huge);
}

/* Background */
.wp-block-heading.has-background {
  padding: 0.5rem 1rem;
  border-radius: 4px;
  display: inline-block;
}
.wp-block-heading.has-primary-background-color {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--background);
}
.wp-block-heading.has-secondary-background-color {
  background-color: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--background);
}

/* Color */
.wp-block-heading.has-primary-color {
  color: var(--wp--preset--color--primary);
}
.wp-block-heading.has-secondary-color {
  color: var(--wp--preset--color--secondary);
}

/* Underline */
.wp-block-heading.is-style-underline {
  border-bottom: 2px solid var(--wp--preset--color--primary);
  padding-bottom: 0.5rem;
}

/* Mobile */
@media (max-width: 1080px) {
  /* Heading Wrapper */
  .wp-block-heading {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
  }

  /* Headings */
  .wp-block-heading h1 {
    font-size: calc(var(--wp--preset--font-size--larger) * 1.2);
    margin-bottom: 1rem;
  }
  .wp-block-heading h2 {
    font-size: var(--wp--preset--font-size--large);
    margin-bottom: 0.75rem;
  }

  /* Background */
  .wp-block-heading.has-background {
    padding: 0.25rem 0.75rem;
  }
}