/* VQEN PEDE FÁCIL — MOBILE FIXES (F1) — aplicado globalmente */

html, body {
  overflow-x: hidden;
  max-width: 100vw;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}
* { box-sizing: border-box; }

button, a.btn, .btn, input[type="submit"], input[type="button"],
.nav-link, .menu-item, [role="button"] {
  touch-action: manipulation;
}

@media (max-width: 768px) {
  /* font-size: 16px previne zoom iOS ao focar.
     min-height: 38px é suficiente pra touch sem inputs gigantes. */
  input[type="text"], input[type="email"], input[type="tel"],
  input[type="password"], input[type="number"], input[type="search"],
  input[type="url"], input[type="date"], input:not([type]),
  textarea, select {
    font-size: 16px !important;
    min-height: 38px;
  }
  /* Touch targets de ação maiores que inputs */
  button, a.btn, .btn, input[type="submit"], input[type="button"] {
    min-height: 44px;
  }
  .nav-link, .menu-item { min-height: 44px; display: flex; align-items: center; }
}

@media (hover: none) and (pointer: coarse) {
  .btn:active, button:active, a:active, .nav-link:active {
    opacity: 0.7;
    transform: scale(0.98);
    transition: all 0.1s ease;
  }
}

@supports (padding: max(0px)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
  .footer-fixed, .bottom-bar, .checkout-bottom, .floating-cart, .carrinho-btn {
    padding-bottom: max(env(safe-area-inset-bottom), 12px);
  }
}

@media (max-width: 768px) {
  .modal-content, .modal > div, [role="dialog"] > div {
    max-height: 92vh !important;
    overflow-y: auto !important;
    margin: 12px;
    -webkit-overflow-scrolling: touch;
  }
}

body.modal-open { overflow: hidden; position: fixed; width: 100%; }

img { max-width: 100%; height: auto; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

button:focus-visible, a:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
  outline: 3px solid #7c3aed;
  outline-offset: 2px;
}

@media (max-width: 768px) {
  table:not(.no-mobile-stack) {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}