/* ═══════════════════════════════════════════════════════════════════
   Listings catalog — native mobile composition (≤767px)
   Loads LAST. Overrides catalog-listings.css three-column cards.
   ═══════════════════════════════════════════════════════════════════ */

@media (max-width: 767px) {

  /* ── UX: hide desktop chrome ───────────────────────────────────── */
  .cb-page--catalog-shell .cb-site-footer {
    display: none !important;
  }

  .cb-listing-page .cb-listing-breadcrumbs,
  .cb-listing-page .cb-listing-head,
  .cb-listing-page .cb-catalog-stat-grid,
  .cb-listing-page .cb-smart-search-decode,
  .cb-listing-page .cb-smart-search-panel,
  .cb-listing-page .cb-listing-results-head--desktop,
  .cb-listing-page .cb-listings-filter-panel ~ .cb-sidebar-personal,
  .cb-listing-page .cb-catalog-map-sidebar-ad {
    display: none !important;
  }

  /* When results exist — hide duplicate category discovery */
  .cb-listing-page:has(.cb-listing-card) .cb-listing-popular,
  .cb-listing-page:has(.cb-listing-card) .cb-catalog-category-grid {
    display: none !important;
  }

  .cb-listing-page {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--cb-m-gap-sm, 16px) !important;
    padding: 0 !important;
    min-width: 0 !important;
  }

  .cb-page--catalog-shell .cb-main.cb-main--catalog {
    padding: 0 var(--cb-m-pad-sm, 16px) var(--cb-m-gap, 20px) !important;
    background: var(--cb-m-bg, #f2f2f7) !important;
  }

  /* ── Search — single card, content first ───────────────────────── */
  .cb-listings-catalog-toolbar {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }

  .cb-listings-search-bar {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: var(--cb-m-pad-sm, 16px) !important;
    background: var(--cb-m-surface, #fff) !important;
    border-radius: var(--cb-m-radius, 20px) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
    margin: 0 !important;
  }

  .cb-listings-search-bar__segment {
    min-height: var(--cb-m-touch, 44px) !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    font-size: 17px !important;
    padding: 0 14px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .cb-listings-search-bar__segment--query {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    background: var(--cb-m-bg, #f2f2f7) !important;
    border: none !important;
  }

  .cb-listings-search-bar__segment--query input {
    border: none !important;
    background: transparent !important;
    min-height: var(--cb-m-touch, 44px) !important;
    font-size: 17px !important;
    padding: 0 !important;
    flex: 1 !important;
  }

  .cb-listings-search-bar__segment--city {
    justify-content: flex-start !important;
    gap: 10px !important;
    background: var(--cb-m-bg, #f2f2f7) !important;
    border: none !important;
    color: var(--cb-m-text, #0a0a0a) !important;
  }

  .cb-listings-search-bar__submit {
    min-height: var(--cb-m-touch, 44px) !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    width: 100% !important;
    margin: 0 !important;
  }

  /* Category chips → vertical actions */
  .cb-listings-chips {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    overflow: visible !important;
    flex-wrap: nowrap !important;
  }

  .cb-listings-chip {
    min-height: var(--cb-m-touch, 44px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    background: var(--cb-m-surface, #fff) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
    border: none !important;
  }

  .cb-listings-chip.is-active {
    background: var(--cb-m-accent-soft, rgba(0, 122, 255, 0.1)) !important;
    color: var(--cb-m-accent, #007aff) !important;
  }

  /* Hide individual category chips on mobile — keep only "all categories" */
  .cb-listings-chips .cb-listings-chip:not(.cb-listings-chip--all):not(.cb-listings-chip--more) {
    display: none !important;
  }

  /* Deal tabs — vertical stack */
  .cb-listings-deal-tabs {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  .cb-listings-deal-tabs a {
    min-height: var(--cb-m-touch, 44px) !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 16px !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    background: var(--cb-m-surface, #fff) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
  }

  .cb-listings-deal-tabs a.is-active {
    background: var(--cb-m-accent, #007aff) !important;
    color: #fff !important;
  }

  /* Category grid — single column cards */
  .cb-listing-popular,
  .cb-listing-category-matrix {
    margin: 0 !important;
  }

  .cb-catalog-section-head h2 {
    font-size: var(--cb-m-h2, 24px) !important;
    font-weight: 700 !important;
  }

  .cb-catalog-category-grid,
  .cb-catalog-category-grid--rich {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--cb-m-gap-sm, 16px) !important;
    grid-template-columns: none !important;
  }

  .cb-catalog-category-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 14px !important;
    min-height: 72px !important;
    padding: var(--cb-m-pad-sm, 16px) !important;
    border-radius: var(--cb-m-radius, 20px) !important;
    background: var(--cb-m-surface, #fff) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
    border: none !important;
  }

  .cb-listing-category-matrix {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--cb-m-gap-sm, 16px) !important;
  }

  .cb-listing-subcat-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    min-height: 64px !important;
    padding: var(--cb-m-pad-sm, 16px) !important;
    border-radius: var(--cb-m-radius, 20px) !important;
    background: var(--cb-m-surface, #fff) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
  }

  .cb-listing-subcat-card__art {
    display: none !important;
  }

  /* ── Mobile catalog bar — in document flow, not sticky overlap ── */
  .cb-m-catalog-bar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    position: relative !important;
    top: auto !important;
    z-index: 1 !important;
    margin: 0 0 12px !important;
    padding: 14px var(--cb-m-pad-sm, 16px) !important;
    background: var(--cb-m-surface, #fff) !important;
    border-radius: var(--cb-m-radius, 20px) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
  }

  .cb-m-catalog-bar__count {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    min-width: 0 !important;
  }

  .cb-m-catalog-bar__count strong {
    font-size: 20px !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
  }

  .cb-m-catalog-bar__count span {
    font-size: 13px !important;
    color: var(--cb-m-muted, rgba(60, 60, 67, 0.6)) !important;
  }

  .cb-m-catalog-bar__sort {
    flex-shrink: 0 !important;
    margin: 0 !important;
  }

  .cb-m-catalog-bar__sort-label {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    align-items: flex-end !important;
    margin: 0 !important;
  }

  .cb-m-catalog-bar__sort-label .cb-m-caption {
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: var(--cb-m-muted, rgba(60, 60, 67, 0.6)) !important;
  }

  .cb-m-catalog-bar__select {
    min-height: 40px !important;
    min-width: 140px !important;
    max-width: 160px !important;
    padding: 0 32px 0 12px !important;
    border-radius: 10px !important;
    border: 0.5px solid var(--cb-m-line, rgba(60, 60, 67, 0.12)) !important;
    background: var(--cb-m-bg, #f2f2f7) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23666' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
  }

  /* ── Results area ──────────────────────────────────────────────── */
  .cb-listings-catalog-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0 !important;
  }

  .cb-listings-catalog-results {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  .cb-listing-items {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--cb-m-gap-sm, 16px) !important;
    padding: 0 !important;
  }

  /* ── LISTING CARDS — native vertical card (photo → price → title → CTA) ── */
  .cb-page--catalog-shell .cb-listing-page .cb-listing-items .cb-listing-card,
  .cb-page .cb-main .cb-listing-page .cb-listing-items .cb-listing-card,
  .cb-listing-page .cb-listing-items .cb-listing-card {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    grid-template-areas: none !important;
    gap: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: var(--cb-m-radius, 20px) !important;
    background: var(--cb-m-surface, #fff) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
    overflow: hidden !important;
    min-height: 0 !important;
    align-items: stretch !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items .cb-listing-card__photo,
  .cb-page .cb-main .cb-listing-page .cb-listing-items .cb-listing-card__photo,
  .cb-listing-page .cb-listing-items .cb-listing-card__photo {
    display: block !important;
    order: 1 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 4 / 3 !important;
    flex: none !important;
    border-radius: 0 !important;
    grid-area: unset !important;
    position: relative !important;
    overflow: hidden !important;
    background: #eef2f6 !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items .cb-listing-card__photo img,
  .cb-page .cb-main .cb-listing-page .cb-listing-items .cb-listing-card__photo img,
  .cb-listing-page .cb-listing-items .cb-listing-card__photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  /* Side column participates in card flex order */
  .cb-listing-page .cb-listing-items .cb-listing-card__side {
    display: contents !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__side-head {
    order: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 14px var(--cb-m-pad-sm, 16px) 0 !important;
    min-height: 0 !important;
    text-align: left !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__side-price {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    flex: 1 !important;
    min-width: 0 !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__side strong {
    font-size: 22px !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
    color: var(--cb-m-text, #0a0a0a) !important;
    line-height: 1.1 !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__date {
    font-size: 13px !important;
    color: var(--cb-m-muted, rgba(60, 60, 67, 0.6)) !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__fav {
    flex-shrink: 0 !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__fav .cb-favorite-btn {
    width: 44px !important;
    height: 44px !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items .cb-listing-card__body,
  .cb-page .cb-main .cb-listing-page .cb-listing-items .cb-listing-card__body,
  .cb-listing-page .cb-listing-items .cb-listing-card__body {
    order: 3 !important;
    grid-area: unset !important;
    padding: 10px var(--cb-m-pad-sm, 16px) 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    min-width: 0 !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__price-tile,
  .cb-listing-page .cb-listing-items .cb-listing-card__body .cb-price-drop--card,
  .cb-listing-page .cb-listing-items .cb-listing-card__desc,
  .cb-listing-page .cb-listing-items .cb-listing-card__specs,
  .cb-listing-page .cb-listing-items .cb-listing-card__tile-footer,
  .cb-listing-page .cb-listing-items .cb-listing-card__body .cb-view-stats,
  .cb-listing-page .cb-listing-items .cb-listing-card__body .cb-view-stats-compact {
    display: none !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__body h2 {
    margin: 0 !important;
    order: 1 !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__body h2 a {
    color: var(--cb-m-text, #0a0a0a) !important;
    text-decoration: none !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__meta {
    order: 2 !important;
    font-size: 14px !important;
    color: var(--cb-m-muted, rgba(60, 60, 67, 0.6)) !important;
    margin: 0 !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__badges {
    order: 3 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    font-size: 12px !important;
    color: var(--cb-m-muted, rgba(60, 60, 67, 0.6)) !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__actions {
    order: 4 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 8px !important;
    padding: 12px var(--cb-m-pad-sm, 16px) var(--cb-m-pad-sm, 16px) !important;
    box-sizing: border-box !important;
  }

  .cb-listing-page .cb-listing-items .cb-listing-card__actions .cb-btn {
    min-height: var(--cb-m-touch, 44px) !important;
    width: 100% !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    justify-content: center !important;
    margin: 0 !important;
  }

  /* Grid/tile view on mobile → same native list cards */
  .cb-listing-page .cb-listing-items.is-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
    gap: var(--cb-m-gap-sm, 16px) !important;
  }

  .cb-listing-page .cb-listing-items.is-grid .cb-listing-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Hide desktop view toggle on mobile — list only */
  .cb-listing-page .cb-listing-view-switch,
  .cb-listing-page .cb-listing-sort {
    display: none !important;
  }

  /* Smart search decode — collapse noise */
  .cb-listing-page .cb-smart-search-bar,
  .cb-listing-page .cb-search-decode-bar {
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    margin-bottom: 8px !important;
  }

  /* ── Filter sidebar → bottom sheet ─────────────────────────────── */
  .cb-listings-catalog-sidebar {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 90dvh !important;
    transform: translateY(105%) !important;
    transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
    border-radius: var(--cb-m-radius, 20px) var(--cb-m-radius, 20px) 0 0 !important;
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.12) !important;
    z-index: 1600 !important;
    padding: 12px var(--cb-m-pad-sm, 16px) calc(var(--cb-m-pad, 20px) + env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
    background: var(--cb-m-surface, #fff) !important;
  }

  .cb-listings-catalog-layout.is-filters-open .cb-listings-catalog-sidebar {
    transform: translateY(0) !important;
  }

  .cb-listings-filter-panel__head h2 {
    font-size: var(--cb-m-h2, 24px) !important;
    font-weight: 700 !important;
  }

  .cb-listings-filter-panel .cb-field,
  .cb-listings-filter-panel label {
    font-size: 15px !important;
  }

  .cb-listings-filter-panel input,
  .cb-listings-filter-panel select,
  .cb-listings-filter-panel textarea {
    min-height: var(--cb-m-touch, 44px) !important;
    font-size: 17px !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
  }

  .cb-listings-filter-panel .cb-btn {
    min-height: var(--cb-m-touch, 44px) !important;
    width: 100% !important;
    font-size: 17px !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
  }

  .cb-listing-filter-close {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    width: var(--cb-m-touch, 44px) !important;
    height: var(--cb-m-touch, 44px) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 24px !important;
    border: none !important;
    background: var(--cb-m-bg, #f2f2f7) !important;
    border-radius: 50% !important;
  }

  /* ── Pagination ────────────────────────────────────────────────── */
  .cb-listing-pagination {
    padding: var(--cb-m-gap-sm, 16px) 0 !important;
  }

  .cb-listing-pagination .pagination {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    justify-content: center !important;
  }

  .cb-listing-pagination .page-link,
  .cb-listing-pagination a,
  .cb-listing-pagination span {
    min-height: var(--cb-m-touch, 44px) !important;
    min-width: var(--cb-m-touch, 44px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    font-size: 16px !important;
  }

  /* ── Empty state ───────────────────────────────────────────────── */
  .cb-listing-empty {
    border-radius: var(--cb-m-radius, 20px) !important;
    padding: var(--cb-m-pad, 20px) !important;
    background: var(--cb-m-surface, #fff) !important;
    box-shadow: var(--cb-m-shadow, 0 2px 16px rgba(0, 0, 0, 0.06)) !important;
  }

  .cb-listing-empty h2 {
    font-size: var(--cb-m-h2, 24px) !important;
  }

  .cb-listing-empty .cb-btn {
    min-height: var(--cb-m-touch, 44px) !important;
    width: 100% !important;
  }

  /* Category picker → bottom sheet */
  .cb-listings-category-modal {
    place-items: end stretch !important;
    padding: 0 !important;
  }

  .cb-listings-category-modal__dialog {
    width: 100% !important;
    max-height: 92dvh !important;
    border-radius: var(--cb-m-radius, 20px) var(--cb-m-radius, 20px) 0 0 !important;
    padding: 16px var(--cb-m-pad-sm, 16px) calc(20px + env(safe-area-inset-bottom, 0px)) !important;
    margin: 0 !important;
  }

  .cb-listings-category-modal__close {
    width: var(--cb-m-touch, 44px) !important;
    height: var(--cb-m-touch, 44px) !important;
    background: var(--cb-m-bg, #f2f2f7) !important;
  }

  .cb-listings-category-modal__search input {
    min-height: var(--cb-m-touch, 44px) !important;
    font-size: 17px !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
  }

  .cb-listings-category-modal__catalog {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--cb-m-gap-sm, 16px) !important;
  }

  .cb-listings-category-modal__card {
    min-height: var(--cb-m-touch, 44px) !important;
    border-radius: var(--cb-m-radius-sm, 14px) !important;
    padding: 12px 14px !important;
  }

  /* Kill tile/grid desktop layout — highest specificity */
  .cb-page--catalog-shell .cb-listing-page .cb-listing-items.is-grid,
  .cb-page .cb-main.cb-main--catalog .cb-listing-page .cb-listing-items.is-grid {
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__side,
  .cb-page .cb-main.cb-main--catalog .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__side {
    display: contents !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__side-head,
  .cb-page .cb-main.cb-main--catalog .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__side-head {
    position: static !important;
    display: flex !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__actions,
  .cb-page .cb-main.cb-main--catalog .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__actions {
    position: static !important;
    display: flex !important;
    width: 100% !important;
  }

  .cb-page--catalog-shell .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__body,
  .cb-page .cb-main.cb-main--catalog .cb-listing-page .cb-listing-items.is-grid .cb-listing-card__body {
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
  }

} /* end mobile listings catalog */

/* Desktop: hide mobile-only bar */
@media (min-width: 768px) {
  .cb-m-header,
  .cb-m-tabbar,
  .cb-m-sheet-backdrop,
  .cb-m-catalog-bar {
    display: none !important;
  }
}
