/**
 * Host mobile touch pass — load after page CSS (base_host + View/Edit/List Spot).
 * Raises undersized controls to ~44px (2.75rem) without redesigning host chrome.
 */

@media (max-width: 767px) {
  /* —— My Listings —— */
  .listings-page-container .listings-type-toolbar .listings-type-filters {
    gap: 0.5rem;
  }

  .listings-page-container .listings-type-toolbar .listings-type-filter {
    min-height: 2.5rem;
    padding: 0.375rem 0.625rem;
    font-size: 0.75rem;
    gap: 0.25rem;
  }

  .listings-page-container .listings-type-toolbar .listings-type-filter__count {
    min-width: 1.125rem;
    height: 1.125rem;
    font-size: 0.625rem;
  }

  .listings-page-container .host-listings-payout-alert__btn {
    min-height: 2.75rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
  }

  .listings-page-container .listing-card-actions {
    gap: 0.5rem;
  }

  .listings-page-container .listing-card-action,
  .listings-page-container .listing-card-action--manage.listing-actions-trigger {
    min-height: 2.75rem;
    padding-left: 0.625rem;
    padding-right: 0.625rem;
    font-size: 0.75rem;
  }

  .listings-page-container .listing-actions-menu {
    gap: 0.375rem;
    padding: 0.375rem;
  }

  .listings-page-container .listing-actions-menu__item {
    min-height: 2.75rem;
    padding: 0.5rem 0.625rem;
  }

  .listings-page-container .listings-client-pagination__btn {
    min-height: 2.75rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.8125rem;
  }

  .listings-page-container .host-listings-header__actions .btn-brand,
  .listings-page-container #notification-settings-link {
    min-height: 2.75rem;
    min-width: 2.75rem;
  }

  .listings-page-container .host-listings-attention-link {
    min-height: 2.75rem;
  }

  .listings-page-container .host-listings-mobile-tools__link,
  .listings-page-container .host-listings-header__tool-link {
    min-height: 2.5rem;
  }

  .listings-page-container #host-tip-cards button {
    min-height: 2.75rem;
    padding: 0.5rem 0.75rem;
  }

  #host-orders-root .host-orders-mobile-tools__link,
  #host-orders-root .host-orders-header__tool-link {
    min-height: 2.5rem;
  }

  #host-orders-root .host-orders-mobile-tools__link {
    min-height: 2.75rem;
  }

  /* Host hub links: brand tint (match product primary, not legacy blue) */
  .listings-page-container .host-listings-mobile-tools__link,
  .listings-page-container .host-listings-header__tool-link,
  #host-orders-root .host-orders-mobile-tools__link,
  #host-orders-root .host-orders-header__tool-link {
    color: var(--color-brand-accent-fg, #0f766e);
  }

  .dark .listings-page-container .host-listings-mobile-tools__link,
  .dark .listings-page-container .host-listings-header__tool-link,
  .dark #host-orders-root .host-orders-mobile-tools__link,
  .dark #host-orders-root .host-orders-header__tool-link {
    color: var(--color-brand-accent-on-dark-surface, #5eead4);
  }

  /* —— View Spot —— */
  .view-spot-header-action,
  .view-spot-header-actions .btn-brand.view-spot-header-action,
  .view-spot-header-action--primary {
    min-height: 2.75rem !important;
    padding: 0.5rem 0.875rem !important;
    font-size: 0.875rem !important;
  }

  /* Keep small visual dots; expand the hit area with a pseudo */
  .view-spot-photo-dot {
    position: relative;
    touch-action: manipulation;
  }

  .view-spot-photo-dot::after {
    content: "";
    position: absolute;
    inset: -1.15rem;
  }

  .view-spot-photo-dots {
    gap: 0.5rem;
    padding: 0.35rem 0.5rem;
  }

  .view-spot-photo-hero__btn {
    min-height: 2.75rem;
  }

  /* —— Payout modal —— */
  #payoutSetupModal #closePayoutModal,
  #payoutSetupModal .close-modal-btn.p-2 {
    min-width: 2.75rem;
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
  }

  /* —— Edit Spot —— */
  .edit-spot-jump-nav {
    gap: 0.5rem;
    row-gap: 0.5rem;
  }

  .edit-spot-jump-nav__chip {
    min-height: 2.75rem;
    padding: 0.5rem 0.875rem;
  }

  .es-btn-primary-sm,
  .es-btn-ghost-sm {
    min-height: 2.75rem;
    padding: 0.5rem 0.85rem;
    font-size: 0.8125rem;
  }

  .edit-spot-cell-chip {
    min-height: 2.75rem;
  }

  /* —— List Spot / Edit Spot stay savings —— */
  .stay-savings-tier-trigger:not(.stay-savings-tier-trigger--on-toggle) {
    min-width: 2.75rem;
    min-height: 2.75rem;
    padding: 0.4rem 0.5rem;
  }

  .stay-savings-tier-trigger:not(.stay-savings-tier-trigger--on-toggle).is-active {
    min-height: 2.75rem;
  }

  .stay-savings-popover__clear,
  .stay-savings-popover button[type="button"]:not(.stay-savings-tier-trigger) {
    min-height: 2.75rem;
  }

  /* —— Prohibited / amenity chips —— */
  #listspot-wizard-form #prohibited-item-chips button[data-prohibited-cat],
  #listspot-wizard-form .step1-prohibited-chips button[data-prohibited-cat],
  .ls-mobile-optimized #listspot-wizard-form #prohibited-item-chips button[data-prohibited-cat],
  .ls-mobile-optimized #listspot-wizard-form .step1-prohibited-chips button[data-prohibited-cat],
  #edit-spot-item-categories-chips .es-amenity-chip,
  #listspot-wizard-form .amenity-button,
  #edit-spot-form .es-amenity-chip:not(.amenity-select-card) {
    min-height: 2.75rem !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.8125rem !important;
  }

  /* —— Host calendar / inbox / earnings quick tools (when present) —— */
  .host-portal-breadcrumb__root-link,
  .host-portal-breadcrumb__link,
  .host-portal-breadcrumb__edit-link {
    min-height: 2.75rem;
    display: inline-flex;
    align-items: center;
  }

  .host-vacation-banner button,
  .host-vacation-banner a.btn,
  .host-vacation-banner .btn-brand {
    min-height: 2.75rem;
  }

  .host-inbox-filters button,
  .host-inbox-filters .btn,
  #host-inbox-root button.host-inbox-chip,
  .host-inbox-thread-actions button {
    min-height: 2.75rem;
  }

  .host-orders-filters button,
  .host-orders-status-tabs button,
  #host-orders-root .host-orders-filter-chip {
    min-height: 2.5rem;
  }
}

/* Coarse pointer / no-hover: always show photo manage overlay (hover-only fails on phones) */
@media (hover: none), (pointer: coarse) {
  .view-spot-photo-overlay {
    opacity: 1;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.45) 0%, transparent 40%);
    pointer-events: none;
  }

  .view-spot-photo-overlay__actions {
    pointer-events: auto;
  }
}

/* Map toolbar: beat denser wizard/edit overrides on phone (icon-only; keep labeled layout) */
@media (max-width: 640px) {
  #listspot-wizard-form #listspot-map-grid-toolbar .listspot-map-toolbar-main:not(.listspot-map-toolbar-main--with-labels) .listspot-map-tool-btn:has(.listspot-map-tool-icon),
  #listspot-wizard-form .listspot-grid-toolbar-offmap .listspot-map-tool-btn:has(.listspot-map-tool-icon),
  #edit-spot-form .edit-spot-map-grid-toolbar .listspot-map-toolbar-main:not(.listspot-map-toolbar-main--with-labels) .listspot-map-tool-btn:has(.listspot-map-tool-icon),
  #edit-spot-form .listspot-grid-toolbar-offmap .listspot-map-tool-btn:has(.listspot-map-tool-icon) {
    width: 2.75rem !important;
    height: 2.75rem !important;
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    max-width: 2.75rem !important;
    max-height: 2.75rem !important;
  }

  #listspot-wizard-form #listspot-map-grid-toolbar .listspot-map-toolbar-main--with-labels .listspot-map-tool-btn:has(.listspot-map-tool-icon),
  #edit-spot-form .edit-spot-map-grid-toolbar .listspot-map-toolbar-main--with-labels .listspot-map-tool-btn:has(.listspot-map-tool-icon) {
    min-height: 2.75rem !important;
    min-width: 3.125rem !important;
  }

  #listspot-wizard-form #listspot-map-grid-toolbar .listspot-map-tool-btn--segment,
  #listspot-wizard-form .listspot-grid-toolbar-offmap .listspot-map-tool-btn--segment,
  #edit-spot-form .edit-spot-map-grid-toolbar .listspot-map-tool-btn--segment,
  #edit-spot-form .listspot-grid-toolbar-offmap .listspot-map-tool-btn--segment {
    width: 2.75rem !important;
    height: 2.75rem !important;
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    font-size: 0.75rem !important;
  }

  #listspot-wizard-form #listspot-map-grid-toolbar .listspot-map-tool-btn:not(:has(.listspot-map-tool-icon)),
  #listspot-wizard-form .listspot-grid-toolbar-offmap .listspot-map-tool-btn:not(:has(.listspot-map-tool-icon)),
  #edit-spot-form .listspot-map-tool-btn:not(:has(.listspot-map-tool-icon)) {
    min-height: 2.75rem !important;
    padding: 0 0.625rem !important;
  }

  #listspot-map-grid-toolbar .listspot-map-toolbar-main--compact,
  #listspot-map-grid-toolbar .listspot-grid-toolbar-row,
  #edit-spot-form .listspot-map-toolbar-main--compact {
    gap: 0.5rem !important;
  }
}