/**
 * Custom styling for the extended Heading block
 */

/* Base styles for heading block */
.wp-block-heading {
  position: relative;
}

/* Star decoration styling */
.wp-block-heading.has-stars {
  margin-top: 30px; /* Create space for the stars above */
  position: relative;
}

/* Add the stars image above the heading */
.wp-block-heading.has-stars::before {
  content: "";
  position: absolute;
  top: -40px; /* 6px gap plus approximate image height */
  left: 5px;
  width: 175px; /* Width of the stars image */
  height: 60px; /* Height of the stars image */
  background-image: url("../../../assets/images/three_waves.webp");
  background-repeat: no-repeat;
  background-size: contain;
}

/* Handle center alignment */
.wp-block-heading.has-text-align-center.has-stars::before {
  left: 50%;
  transform: translateX(-50%);
}

/* Handle right alignment */
.wp-block-heading.has-text-align-right.has-stars::before {
  left: auto;
  right: 0;
}

/* Decoration line styling */
.wp-block-heading.has-decoration-line {
  margin-bottom: 24px; /* Create space for the decoration line below */
  position: relative;
}

/* Add the decoration line below the heading */
.wp-block-heading.has-decoration-line::after {
  content: "";
  position: absolute;
  bottom: -10px; /* 6px gap from the text as specified */
  left: 0;
  width: 220px; /* Exact width as specified */
  height: 4px; /* Exact height as specified */
  background-color: #f80e0f; /* Exact color as specified */
}

/* Handle center alignment for decoration line */
.wp-block-heading.has-text-align-center.has-decoration-line::after {
  left: 50%;
  transform: translateX(-50%);
}

/* Handle right alignment for decoration line */
.wp-block-heading.has-text-align-right.has-decoration-line::after {
  left: auto;
  right: 0;
}