/**
 * PropertyBin — mobile-native experience
 * Load after mobile-polish.css. Targets phones & small tablets.
 * Goals: native feel, fast paint, no horizontal scroll, safe areas, 44px taps.
 */

:root {
  --pb-mobile-nav-h: 56px;
  --pb-safe-bottom: env(safe-area-inset-bottom, 0px);
  --pb-safe-top: env(safe-area-inset-top, 0px);
  --pb-safe-left: env(safe-area-inset-left, 0px);
  --pb-safe-right: env(safe-area-inset-right, 0px);
  --pb-brand: #ff385c;
  --pb-ink: #111;
  --pb-muted: #6a6a6a;
  --pb-line: #ebebeb;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  overscroll-behavior-y: none;
  -webkit-tap-highlight-color: rgba(255, 56, 92, 0.12);
}

@media (max-width: 900px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
}

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

@media (max-width: 900px) {
  .pb-site-footer,
  .pb-faq,
  .pb-quotes,
  .pb-insights-grid,
  .pb-home-news,
  .pb-carousel-section {
    content-visibility: auto;
    contain-intrinsic-size: 1px 320px;
  }
}

.pb-mobile-tabbar {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10040;
  height: calc(var(--pb-mobile-nav-h) + var(--pb-safe-bottom));
  padding: 0 max(8px, var(--pb-safe-left)) var(--pb-safe-bottom) max(8px, var(--pb-safe-right));
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: saturate(1.2) blur(16px);
  -webkit-backdrop-filter: saturate(1.2) blur(16px);
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 -8px 28px rgba(15, 23, 42, 0.06);
}

.pb-mobile-tabbar-inner {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  height: var(--pb-mobile-nav-h);
  max-width: 560px;
  margin: 0 auto;
  align-items: stretch;
}

.pb-mobile-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-decoration: none;
  color: #717171;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.01em;
  min-height: 44px;
  border: 0;
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  padding: 6px 4px;
}

.pb-mobile-tab i {
  font-size: 18px;
  line-height: 1;
  display: block;
}

.pb-mobile-tab.is-active,
.pb-mobile-tab[aria-current="page"] {
  color: var(--pb-brand);
}

.pb-mobile-tab:active {
  transform: scale(0.96);
}

@media (max-width: 900px) {
  .pb-mobile-tabbar {
    display: block;
  }

  body {
    padding-bottom: calc(var(--pb-mobile-nav-h) + var(--pb-safe-bottom) + 8px) !important;
  }

  .pb-site-footer {
    padding-bottom: 12px;
  }

  .top-nav .nav-center {
    display: none !important;
  }

  .top-nav-inner {
    min-height: 56px;
    padding: 8px max(12px, var(--pb-safe-left)) 8px max(12px, var(--pb-safe-right));
    flex-wrap: nowrap;
  }

  .logo-wrapper .logo-img {
    height: 36px;
  }

  .logo-title {
    font-size: 18px;
  }

  .top-nav {
    padding-top: var(--pb-safe-top);
  }
}

@media (max-width: 640px) {
  .pb-header-search-panel {
    left: 12px !important;
    right: 12px !important;
    top: calc(56px + var(--pb-safe-top) + 8px) !important;
    border-radius: 16px !important;
    max-height: min(75dvh, calc(100dvh - 56px - var(--pb-safe-top) - var(--pb-mobile-nav-h) - var(--pb-safe-bottom) - 16px));
    padding-bottom: 16px;
  }

  .pb-acct-menu.dropdown-menu,
  .account-dropdown-menu.pb-acct-menu {
    max-height: min(65dvh, calc(100dvh - 56px - var(--pb-safe-top) - var(--pb-mobile-nav-h) - var(--pb-safe-bottom) - 24px));
  }
}

@media (max-width: 900px) {
  .pb-gallery {
    touch-action: pan-y pinch-zoom;
    user-select: none;
    -webkit-user-select: none;
  }

  .pb-header-search-panel,
  .pb-acct-menu.dropdown-menu,
  .account-dropdown-menu.pb-acct-menu,
  .pb-ss-modal,
  .pb-modal,
  .pb-sheet {
    touch-action: pan-y;
    transition: transform 0.2s ease, opacity 0.2s ease;
  }

  .pb-gesture-dismiss {
    opacity: 0 !important;
    transform: translateY(24px) !important;
    pointer-events: none;
  }

  .pb-toc,
  .pb-hs-chips,
  .pb-intent-chips,
  .ap-category-tabs {
    touch-action: pan-x;
    -webkit-overflow-scrolling: touch;
  }
}

@media (max-width: 900px) {
  .property-tabs a,
  .pb-search-chip,
  .pb-hs-chip,
  .pb-intent-chips button,
  .pb-intent-chips a,
  .pb-view-toggle button,
  .pb-feed-toolbar .chip-btn,
  .pb-home-card-actions button,
  .pb-cta-primary,
  .pb-cta-ghost,
  .pb-search-go,
  .button-primary,
  .button-secondary {
    min-height: 44px;
  }

  .pb-search-chip,
  .pb-hs-chip {
    padding: 10px 14px;
    font-size: 13px;
  }
}

@media (max-width: 900px) {
  .pb-search-sticky {
    top: 0;
    padding: 8px 0 10px;
  }

  .pb-search-sticky-inner,
  .pb-search-toolbar,
  .pb-search-body {
    padding-left: max(12px, var(--pb-safe-left));
    padding-right: max(12px, var(--pb-safe-right));
  }

  .pb-search-bar {
    border-radius: 16px;
    padding: 12px;
    gap: 10px;
  }

  .pb-search-bar input,
  .pb-search-bar select {
    height: 44px;
    border-radius: 12px;
  }

  .pb-search-bar .pb-search-go {
    height: 48px;
    width: 100%;
    border-radius: 14px;
    font-size: 16px;
  }

  .pb-search-filters-side {
    position: static;
    border-radius: 16px;
    margin-bottom: 8px;
  }

  .pb-search-body.is-list {
    grid-template-columns: 1fr;
  }

  .pb-search-body.is-list #pbSearchFiltersSide {
    display: none;
  }

  .pb-prop-card img {
    height: 200px;
  }

  .pb-search-body.is-map {
    min-height: calc(100dvh - 140px - var(--pb-mobile-nav-h));
  }

  .pb-search-map-canvas {
    height: calc(100dvh - 140px - var(--pb-mobile-nav-h));
    min-height: 280px;
  }

  .pb-search-map-list {
    max-height: 40vh;
  }
}

@media (max-width: 720px) {
  .pb-intent-chips,
  #common-home .container,
  #common-home .pb-wide {
    padding-left: max(12px, var(--pb-safe-left));
    padding-right: max(12px, var(--pb-safe-right));
  }

  .pb-home-search {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px;
  }

  .pb-home-search select,
  .pb-home-search input {
    min-height: 44px;
  }

  .pb-compare-bar {
    bottom: calc(var(--pb-mobile-nav-h) + var(--pb-safe-bottom) + 12px);
    left: 12px;
    right: 12px;
    transform: none;
    width: auto;
    max-width: none;
  }

  .pb-back-top {
    bottom: calc(var(--pb-mobile-nav-h) + var(--pb-safe-bottom) + 12px);
    right: 12px;
  }

  .pb-map-legend {
    left: 10px;
    right: 10px;
    bottom: 10px;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .pb-listing {
    padding: 8px max(12px, var(--pb-safe-left)) calc(72px + var(--pb-safe-bottom)) max(12px, var(--pb-safe-right));
  }

  .pb-gallery {
    border-radius: 14px;
    aspect-ratio: 4 / 3;
  }

  .pb-toc {
    top: 0;
    margin-left: -4px;
    margin-right: -4px;
    padding-left: 4px;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .pb-toc::-webkit-scrollbar {
    display: none;
  }

  .pb-toc a {
    flex: 0 0 auto;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
  }

  .pb-sidebar {
    position: static;
  }

  .pb-side-card {
    position: static;
    box-shadow: none;
  }

  .pb-section {
    padding: 16px;
    border-radius: 14px;
    scroll-margin-top: 56px;
  }

  .pb-detail-mobile-cta {
    display: flex;
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(var(--pb-mobile-nav-h) + var(--pb-safe-bottom));
    z-index: 10030;
    gap: 8px;
    padding: 10px max(12px, var(--pb-safe-left)) 10px max(12px, var(--pb-safe-right));
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--pb-line);
  }

  .pb-detail-mobile-cta .pb-cta-primary,
  .pb-detail-mobile-cta .pb-cta-ghost {
    margin: 0;
    flex: 1;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media (min-width: 641px) {
  .pb-detail-mobile-cta {
    display: none !important;
  }
}

@media (max-width: 900px) {
  .pb-account-shell,
  .portal-layout,
  .pb-tool-main,
  .pb-tools-main {
    padding-left: max(12px, var(--pb-safe-left));
    padding-right: max(12px, var(--pb-safe-right));
  }
}

@media (max-width: 560px) {
  .button-primary,
  .button-secondary,
  .pb-ss-actions button,
  .pb-modal-actions button {
    min-height: 48px;
    font-size: 16px;
  }

  .pb-ss-modal,
  .pb-modal {
    max-width: 100%;
    border-radius: 16px 16px 0 0;
    margin-top: auto;
  }

  .pb-ss-backdrop.is-open,
  .pb-modal-backdrop.is-open {
    align-items: flex-end;
    padding: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pb-mobile-tab,
  .pb-prop-card,
  .pb-related-card,
  .pb-header-search-panel,
  .pb-acct-menu.dropdown-menu,
  .pb-gesture-dismiss {
    transition: none !important;
  }

  .pb-carousel-skel .sk {
    animation: none !important;
  }
}

@media (display-mode: standalone) {
  .top-nav {
    padding-top: max(8px, var(--pb-safe-top));
  }
}

/* #3569 search slim: phones keep location/segment/status/type + Search */
@media (max-width: 560px) {
  .pb-search-bar > div:nth-child(n + 5) {
    display: none !important;
  }
  .pb-search-chips .pb-search-chip:nth-child(n + 5):not(.pb-chip-save) {
    display: none !important;
  }
  .pb-tabs-inline,
  .pb-ranked-badge,
  .pb-heat-toggle {
    display: none !important;
  }
}
