/**
 * Cover Block Custom Styles
 * Override WordPress default cover block styling
 */

/**
 * Mobile Responsive Stacking for Cover Block
 * 
 * This media query ensures that flex containers with the 'stack-md' style
 * will stack vertically (column direction) on medium-sized screens and below
 * (tablets and mobile devices with max-width of 1024px).
 * 
 * Used for cover blocks that need to adapt their layout for better mobile
 * readability and user experience.
 */
@media (max-width: 1024px) {
  .is-style-stack-md[class*="is-layout-flex"][class*="is-style-stack-md"] {
    flex-direction: column !important;
    gap: var(--wp--preset--spacing--50) !important;
  }

  /* Reset for child elements that only have is-layout-flex */
  .is-style-stack-md .is-layout-flex:not(.is-style-stack-md) {
    flex-direction: initial !important;
    gap: var(--wp--preset--spacing--20) !important;
  }
}

/* Custom cover block styling - override WordPress defaults */
.wp-block-cover,
.wp-block-cover-image {
  align-items: center;
  background-position: 50%;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  /* Custom min-height - ændre denne værdi */
  min-height: 60vh; /* I stedet for 430px */
  overflow: hidden;
  overflow: clip;
  padding: var(--wp--preset--spacing--40, 1em);
  position: relative;
}

/* Custom inner container styling */
.wp-block-cover .wp-block-cover__inner-container,
.wp-block-cover-image .wp-block-cover__inner-container {
  color: inherit;
  position: relative;
  width: 100%;
  /* Custom spacing */
  padding: var(--wp--preset--spacing--50, 2rem);
}

/* Responsive cover height */
@media (max-width: 768px) {
  .wp-block-cover,
  .wp-block-cover-image {
    min-height: 60vh; /* Mindre på mobil */
    padding: var(--wp--preset--spacing--30, 0.5em);
  }

  .wp-block-cover .wp-block-cover__inner-container,
  .wp-block-cover-image .wp-block-cover__inner-container {
    padding: var(--wp--preset--spacing--40, 1.5rem);
  }
}

/* Custom positioning for better content alignment */
.wp-block-cover.is-position-center-center,
.wp-block-cover-image.is-position-center-center {
  align-items: center;
  justify-content: center;
}

.wp-block-cover.is-position-bottom-center,
.wp-block-cover-image.is-position-bottom-center {
  align-items: flex-end;
  justify-content: center;
  padding-bottom: var(--wp--preset--spacing--60, 3rem);
}

/* Better text styling in cover blocks */
.wp-block-cover h1,
.wp-block-cover h2,
.wp-block-cover h3,
.wp-block-cover h4,
.wp-block-cover h5,
.wp-block-cover h6 {
  margin-bottom: var(--wp--preset--spacing--30, 1rem);
}

.wp-block-cover p {
  margin-bottom: var(--wp--preset--spacing--20, 0.5rem);
}

/* Custom background dim levels */
.wp-block-cover.has-background-dim:before,
.wp-block-cover-image.has-background-dim:before {
  background-color: rgba(0, 0, 0, 0.5); /* Default dim */
}

.wp-block-cover.has-background-dim-30:before,
.wp-block-cover-image.has-background-dim-30:before {
  background-color: rgba(0, 0, 0, 0.3); /* Lighter dim */
}

.wp-block-cover.has-background-dim-70:before,
.wp-block-cover-image.has-background-dim-70:before {
  background-color: rgba(0, 0, 0, 0.7); /* Darker dim */
}