/* DreamPOS touch ergonomics
 * Enlarges physical hit areas on coarse-pointer devices without changing the
 * compact mouse/desktop layout.
 */
@media (hover: none) and (pointer: coarse) {
  /* Remove the browser's double-tap delay and make every tap feel immediate. */
  button,
  [role="button"],
  .nav-item,
  .menu-category-item,
  .menu-item-card,
  .order-type-tab,
  .table-card,
  .order-card,
  .settings-tab,
  .s-tab {
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(212, 132, 92, .24);
  }

  /* Comfortable minimum target: larger than the old 44px baseline. */
  button:not(.menu-item-card),
  [role="button"],
  select,
  input:not([type="checkbox"]):not([type="radio"]),
  .nav-item,
  .order-type-tab,
  .settings-tab,
  .s-tab,
  .filter-btn,
  .disc-btn,
  .tip-btn {
    min-height: 50px !important;
  }

  /* Keep toggles natural; the label around them supplies the larger target. */
  input[type="checkbox"],
  input[type="radio"] {
    min-height: 22px !important;
    min-width: 22px !important;
  }

  .nav-item,
  .menu-category-item {
    min-height: 52px !important;
    padding-top: 13px !important;
    padding-bottom: 13px !important;
  }

  /* Dish tiles are the most-used POS control: give the whole card a generous hitbox. */
  .menu-item-card {
    min-height: 104px !important;
    padding: 15px !important;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
  }

  .menu-item-name {
    font-size: 15px !important;
    line-height: 1.3 !important;
  }

  .menu-item-price {
    font-size: 18px !important;
  }

  /* Quantity, close and compact toolbar controls were the easiest to miss. */
  .ka-ci-btn,
  .menu-close-btn,
  .dp-icon-btn,
  .receipts-drawer-btn,
  [class*="qty-btn"],
  [class*="quantity-btn"] {
    min-width: 48px !important;
    width: auto;
    min-height: 48px !important;
  }

  /* Immediate physical feedback confirms that the intended control was hit. */
  button:active,
  [role="button"]:active,
  .nav-item:active,
  .menu-category-item:active,
  .menu-item-card:active,
  .table-card:active,
  .order-card:active {
    transform: scale(.975) !important;
    filter: brightness(1.12);
    transition: transform 45ms linear, filter 45ms linear !important;
  }
}