/* blocks.css
 *
 * Enthält gezielte Anpassungen und Erweiterungen für WordPress Core-Blöcke oder
 * benutzerdefinierte Gutenberg-Blöcke (z. B. `.wp-block-button`, `.wp-block-cover`, etc.).
 *
 * Aktuell leer – kann zur Optimierung oder Erweiterung der Block-Darstellung genutzt werden.
 */

.home h1 {
  max-width: 20ch;
}


/* Rocket Carousel Editor-Styles */
.wp-block-rocket-carousel .block-editor-inner-blocks>.block-editor-block-list__layout {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Beitrags-Tags */
:root :where(.wp-block-post-terms),
.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag-list h4 {
  font-style: normal;
  font-weight: 500;
  font-size: var(--wp--preset--font-size--sm);
  border-radius: 48px;
  background-color: var(--theme-color-primary-light);
  padding: var(--wp--preset--spacing--10) var(--wp--preset--spacing--20);
  margin: 0;
}

.tag-list h4 a:hover {
  text-decoration: underline;
}

.wp-block-post-terms .wp-block-post-terms__separator {
  display: none;
}

:root :where(.wp-block-post-terms) a {
  pointer-events: none;
  cursor: default;
  text-decoration: none;
  color: inherit;
}

@media (max-width: 767px) {

  :root :where(.wp-block-post-terms),
  .tag-list {
    justify-content: center;
    width: 100%;
  }

  :root :where(.wp-block-post-terms) a,
  .tag-list h4 {
    font-size: var(--wp--preset--font-size--xs) !important;
    padding: 5px 8px !important;
  }
}

/* Button-Stils - OVERRIDEN */

.wp-block-buttons>.wp-block-button {
  display: flex;
}

:root :where(.wp-element-button, .wp-block-button__link) {
  position: relative;
  overflow: hidden;
  z-index: 1;
  box-shadow: 0 0 0 2px transparent;
  transition: all 0.4s ease;
}

:root :where(.wp-element-button, .wp-block-button__link)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 100%;
  background-color: var(--color-primary);
  transition: width 0.4s ease;
  z-index: -1;
}

:root :where(.wp-element-button, .wp-block-button__link):hover::before {
  width: 100%;
}

:root :where(.wp-element-button, .wp-block-button__link):hover {
  color: var(--button-color-hover);
}

/* Outline-Button-Stil */
.wp-block-button.is-style-outline>.wp-block-button__link:hover,
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-text-color):hover {
  background: var(--button-background-color-hover);
  color: var(--button-color-hover);
  border-color: var(--color-primary);
}

.wp-block-button.is-style-outline>.wp-block-button__link::before,
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-text-color)::before {
  display: none;
}


/* White-Button-Stil */
.wp-block-button.is-style-white>.wp-block-button__link::before,
.wp-block-button.is-style-white>.wp-block-button__link:not(.has-text-color)::before {
  background-color: var(--color-secondary) !important;
}

/* White-Secondary-Button-Stil */
.wp-block-button.is-style-white-secondary>.wp-block-button__link::before,
.wp-block-button.is-style-white-secondary>.wp-block-button__link:not(.has-text-color)::before {
  background-color: var(--color-secondary) !important;
}


/* Gruppe mit versetztem Button */
.is-style-single-no-spacing-offset-bottom .wp-block-button {
  display: flex;
  transform: translateY(-50%);
}


.aspect-square figure img {
  width: 26px;
  max-height: 26px;
  height: auto;
  object-fit: contain !important;
}

.aspect-square figure {
  line-height: 1;
}

/* Figure Image Block Anpassungen */
.wp-block-image.min-w-full img {
  width: 100%;
  height: auto;
}

.heart-icon {
  img {
    width: clamp(32px, 5.2vw, 45px) !important;
    margin-bottom: -4px;
  }
}