/**
 * Theme Button Styles
 * 
 * This file contains all custom styles related to buttons using the UAGB 
 * button component, especially the `.standard` style variations.
 * 
 * If additional button styles or variations become too large, create a 
 * separate sub-file and name it accordingly (e.g., theme_buttons-outline.css).
 */

.uagb-buttons-repeater {
  font-size: 20px;
  font-family: var(--headlinefont);
  color: var(--color-1) !important;
  border: none !important;
  font-weight: 500;
  letter-spacing: 0.02;
  padding: 0.59em 0.9em;
}

.uagb-buttons-repeater {
  position: relative;
}

.uagb-buttons-repeater:hover::after {
  height: 100%;
}

/**After element as mask so it can change color (bg is color)*/
.uagb-buttons-repeater::after {
  content: "";
  display: block;
  background-color: #fff;
  width: 1.429em;
  height: 1.429em;
  -webkit-mask: url("/wp-content/themes/astra-impuls-child/img/pfeil-links-button.svg") no-repeat center / contain;
  mask: url("/wp-content/themes/astra-impuls-child/img/pfeil-links-button.svg") no-repeat center / contain;
  transition: background-color 0.3s ease;
  font-size: var(--btn-font-size);
}

.uagb-buttons-repeater {
  z-index: 9;
  position: relative;
}

.uagb-button__link {
  z-index: 9;
}

.wp-block-uagb-buttons .uagb-buttons__wrap {
  flex-wrap: wrap;
}