/* Loaded last on purpose: protects the mobile viewport fixes from legacy CSS. */
@media (max-width: 782px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  body {
    padding-bottom: calc(var(--i34-mobile-dock-height) + 16px) !important;
  }

  body.i34-keyboard-open {
    padding-bottom: 0 !important;
  }

  .i34-page-width {
    width: calc(100% - 24px) !important;
    max-width: calc(100% - 24px) !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .i34-home-filter-row,
  .i34-model-thumbs {
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
  }

  .woocommerce div.product .woocommerce-product-gallery {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  .i34-mobile-dock {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: var(--i34-mobile-dock-height) !important;
    min-height: var(--i34-mobile-dock-height);
    padding: 5px max(5px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(5px, env(safe-area-inset-left));
    transform: translateZ(0);
  }

  .i34-has-visual-viewport .i34-mobile-dock {
    top: calc(var(--i34-vv-top) + var(--i34-vv-height) - var(--i34-mobile-dock-height));
    bottom: auto;
  }

  .i34-dock-action {
    height: 66px;
    gap: 3px;
  }

  .i34-dock-action svg {
    width: 25px;
    height: 25px;
  }

  .i34-dock-action small {
    font-size: 10px;
  }

  body.i34-keyboard-open .i34-mobile-dock {
    display: none !important;
  }

  .i34-has-visual-viewport .i34-nav {
    top: var(--i34-vv-top);
    right: 0;
    bottom: auto;
    left: 0;
    height: var(--i34-vv-height);
  }

  .i34-nav-inner {
    bottom: calc(var(--i34-mobile-dock-height) + 8px) !important;
    max-height: calc(var(--i34-vv-height) - var(--i34-mobile-dock-height) - 24px);
  }

  .i34-whatsapp {
    bottom: calc(var(--i34-mobile-dock-height) + var(--i34-vv-bottom) + 10px) !important;
  }

  body.i34-keyboard-open .i34-whatsapp {
    bottom: calc(var(--i34-vv-bottom) + 10px) !important;
  }
}