/**
 * Mobile / tablet layout for Scrapbook Shop widgets.
 * Elementor breakpoints: mobile ≤767px, tablet ≤1024px.
 *
 * On mobile, Elementor containers often keep a desktop min-height. Combined with
 * stretched grid children this clips or paints product cards over the next widget.
 * These rules size the grid to its content and let following elements flow below it.
 */

/* Match Elementor's widget wrapper so layout CSS wins over stretch/min-height. */
.elementor-widget-scrapbook_products_grid,
.scrapbook-products-grid-widget {
  width: 100%;
  max-width: 100%;
  height: auto;
  min-height: 0;
  overflow: visible;
}

.elementor-widget-scrapbook_products_grid > .elementor-widget-container,
.scrapbook-products-grid-widget > .elementor-widget-container {
  height: auto;
  min-height: 0;
  overflow: visible;
}

@media (max-width: 767px) {
  /*
   * Elementor prints inline min-height / height on sections and containers.
   * :has() targets only ancestors of this widget so other page sections stay intact.
   */
  .e-con:has(.scrapbook-products-archive),
  .e-con-inner:has(.scrapbook-products-archive),
  .elementor-container:has(.scrapbook-products-archive),
  .elementor-column:has(.scrapbook-products-archive),
  .elementor-widget-wrap:has(.scrapbook-products-archive),
  .elementor-section:has(.scrapbook-products-archive) {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible;
  }

  .elementor-widget-scrapbook_products_grid,
  .scrapbook-products-grid-widget {
    flex: 0 0 auto !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    align-self: stretch;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .elementor-widget-scrapbook_products_grid > .elementor-widget-container,
  .scrapbook-products-grid-widget > .elementor-widget-container {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .scrapbook-products-archive {
    display: flex;
    flex-direction: column;
    height: auto !important;
    min-height: 0;
    overflow: visible;
    margin-bottom: 24px;
  }

  .scrapbook-products-grid {
    display: grid !important;
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
    height: auto !important;
    min-height: 0 !important;
    align-content: start;
    align-items: start;
  }

  .scrapbook-grid-item {
    height: auto !important;
    min-height: 0;
    width: 100%;
  }

  .scrapbook-product-card,
  .scrapbook-product-card .product-card-inner,
  .scrapbook-product-card-inner {
    height: auto !important;
    min-height: 0 !important;
    max-height: none;
  }

  .scrapbook-pagination {
    margin-top: 28px;
    margin-bottom: 8px;
  }

  .product-image-wrapper {
    margin-bottom: 16px;
  }

  .polaroid-frame {
    max-width: 100%;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-widget-scrapbook_products_grid,
  .scrapbook-products-grid-widget,
  .elementor-widget-scrapbook_products_grid > .elementor-widget-container {
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  .scrapbook-products-grid {
    height: auto;
    align-content: start;
  }

  .scrapbook-product-card {
    height: auto;
    min-height: 0;
  }
}