/* Responsive Spacer — front + editor */

/* TABLET (≤1024px) — apply ONLY if --tablet-height is set */
@media (max-width:1024px) {
  .wp-block-spacer.has-responsive-spacer[style*="--tablet-height"] {
    height: var(--tablet-height);
    min-height: var(--tablet-height);
  }
  .wp-block-spacer.has-responsive-spacer-important[style*="--tablet-height"] {
    height: var(--tablet-height) !important;
    min-height: var(--tablet-height) !important;
  }
}

/* MOBILE (≤781px) — first, use --mobile-height if present */
@media (max-width:781px) {
  .wp-block-spacer.has-responsive-spacer[style*="--mobile-height"] {
    height: var(--mobile-height);
    min-height: var(--mobile-height);
  }
  .wp-block-spacer.has-responsive-spacer-important[style*="--mobile-height"] {
    height: var(--mobile-height) !important;
    min-height: var(--mobile-height) !important;
  }

  /* If there's NO mobile height, but there IS a tablet height, keep the tablet value on phones */
  .wp-block-spacer.has-responsive-spacer[style*="--tablet-height"]:not([style*="--mobile-height"]) {
    height: var(--tablet-height);
    min-height: var(--tablet-height);
  }
  .wp-block-spacer.has-responsive-spacer-important[style*="--tablet-height"]:not([style*="--mobile-height"]) {
    height: var(--tablet-height) !important;
    min-height: var(--tablet-height) !important;
  }
}