/*
 * TeeVerse Mobile Fixes v1.1.0
 * Stronger mobile overflow protection for Kadence/Gutenberg/WooCommerce/WPForms.
 */

@media (max-width: 1024px) {
  html, body, #wrapper, #inner-wrap, #primary, #main, .site, .site-content,
  .content-area, .entry-content, .wp-site-blocks {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  *, *::before, *::after {
    box-sizing: border-box;
  }

  img, svg, video, iframe, canvas {
    max-width: 100% !important;
    height: auto;
  }

  .wp-block-group,
  .wp-block-group__inner-container,
  .wp-block-columns,
  .wp-block-column,
  .wp-block-cover,
  .wp-block-cover__inner-container,
  .wp-block-media-text,
  .wp-block-media-text__content,
  .wp-block-buttons,
  .woocommerce,
  .woocommerce-page,
  .wpforms-container {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  p, li, a, span, td, th, label, input, textarea, select, button,
  .wp-block-heading {
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
  }
}

@media (max-width: 767px) {
  .entry-content {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Kill fixed widths set in Gutenberg/Kadence blocks on mobile */
  .entry-content > *,
  .entry-content .wp-block-group,
  .entry-content .wp-block-cover,
  .entry-content .wp-block-column,
  .entry-content .wp-block-buttons,
  .entry-content .wp-block-button,
  .entry-content p,
  .entry-content h1,
  .entry-content h2,
  .entry-content h3 {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .entry-content [style*="width"],
  .entry-content [style*="min-width"],
  .entry-content [style*="max-width"] {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .entry-content h1,
  .entry-content .wp-block-heading:is(h1),
  .wp-block-cover h1,
  .wp-block-group h1 {
    font-size: clamp(2rem, 9vw, 2.75rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.025em !important;
    white-space: normal !important;
  }

  .entry-content h2,
  .entry-content .wp-block-heading:is(h2),
  .wp-block-cover h2,
  .wp-block-group h2 {
    font-size: clamp(1.55rem, 7vw, 2.2rem) !important;
    line-height: 1.1 !important;
    white-space: normal !important;
  }

  .entry-content h3,
  .entry-content .wp-block-heading:is(h3) {
    font-size: clamp(1.25rem, 5.5vw, 1.75rem) !important;
    line-height: 1.15 !important;
  }

  .entry-content p {
    width: auto !important;
    white-space: normal !important;
  }

  /* Mobile buttons */
  .wp-block-buttons,
  .entry-content .wp-block-buttons {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 10px !important;
  }

  .wp-block-button,
  .entry-content .wp-block-button {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  .wp-block-button__link,
  .entry-content .wp-block-button__link {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    text-align: center !important;
  }

  /* Columns */
  .wp-block-columns:not(.is-not-stacked-on-mobile) {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    gap: 1.25rem !important;
  }

  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* WooCommerce */
  .woocommerce ul.products,
  .woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 20px !important;
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product,
  .woocommerce div.product div.images,
  .woocommerce div.product div.summary,
  .woocommerce-page div.product div.images,
  .woocommerce-page div.product div.summary,
  .woocommerce-checkout #customer_details,
  .woocommerce-checkout #order_review,
  .woocommerce-checkout #order_review_heading {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .woocommerce select,
  .woocommerce input.input-text,
  .woocommerce textarea,
  .woocommerce-page select,
  .woocommerce-page input.input-text,
  .woocommerce-page textarea {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* WPForms */
  .wpforms-container,
  .wpforms-container-full,
  .wpforms-form,
  .wpforms-field-container,
  .wpforms-field,
  .wpforms-container .wpforms-field-row,
  .wpforms-container .wpforms-field-row-block {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .wpforms-container .wpforms-field-row {
    display: block !important;
  }

  .wpforms-container input,
  .wpforms-container select,
  .wpforms-container textarea {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* TeeVerse catalogue */
  [class*="design-catalog"],
  [class*="teeverse-design"],
  [class*="catalogue"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 480px) {
  .entry-content {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .entry-content h1,
  .entry-content .wp-block-heading:is(h1),
  .wp-block-cover h1,
  .wp-block-group h1 {
    font-size: clamp(1.85rem, 9.5vw, 2.45rem) !important;
  }
}
