.gallery__search-results {
  margin-bottom: var(--space-md);
}

.gallery__search-results-text {
  color: var(--fg);
}

/* .gallery__filter kept as alias for legacy JS targeting */
.gallery__filter {
  display: contents;
}

@media (max-width: 768px) {
  .modal__image-thumb {
    flex-basis: 3.75rem;
    height: 3.75rem;
  }

  .modal__image-nav {
    width: 2.45rem;
    height: 2.45rem;
    margin-top: -1.225rem;
  }

  .modal__image-nav--prev {
    left: 0.6rem;
  }

  .modal__image-nav--next {
    right: 0.6rem;
  }

  .tutorial-tour__badge {
    width: 1.8rem;
    height: 1.8rem;
  }

  .tutorial-tour__card {
    width: calc(100vw - 1.25rem);
    padding: 0.9rem;
    gap: var(--space-sm);
  }

  .tutorial-tour__actions {
    justify-content: stretch;
  }

  .tutorial-tour__button {
    flex: 1 1 calc(50% - 0.3rem);
    min-width: 0;
  }
}

@media (max-width: 768px) {
  /* Gallery: center all copy on small screens */
  .gallery,
  .gallery__header,
  .gallery__search-results,
  .gallery__search-results-text,
  .gallery__item-content,
  .gallery__item-content--ad,
  .gallery__item-title,
  .gallery__item-title--ad,
  .gallery__item-price,
  .gallery__item-meta,
  .gallery__item-meta div,
  .gallery__item-tag,
  .gallery__item-description,
  .gallery__item-location,
  .gallery__item-date-wrap,
  .gallery__item-date,
  .gallery__item-expiry-meta {
    text-align: center;
  }

  .gallery__chip-strip {
    justify-content: center;
  }

  .gallery__item-meta,
  .gallery__item-meta div {
    align-items: center;
  }

  /* Fullscreen listing modal: image fills space above; detail strip pinned to bottom, no whole-modal scroll */
  #js-modal-fullscreen .modal__backdrop {
    align-items: stretch;
    justify-content: flex-start;
    min-height: 100svh;
    min-height: 100dvh;
    height: 100svh;
    height: 100dvh;
    box-sizing: border-box;
  }

  .gallery__controls {
    gap: var(--space-xs) var(--space-sm);
  }

  .gallery__search-form {
    flex: 0 0 auto;
    min-width: 6.5rem;
  }

  .gallery__chip-sep {
    margin: 0;
  }

  .gallery__title {
    line-height: 1.2;
  }

  .gallery__item-content {
    gap: var(--space-xs);
    padding-inline: var(--space-md);
    padding-block: var(--space-sm);
  }

  .gallery__item-header {
    gap: 0;
    text-align: center;
    align-items: center;
  }

  .gallery__item-price {
    align-self: center;
  }

  .gallery__item-title {
    align-self: stretch;
    min-width: 0;
    line-height: 1.3;
    overflow-wrap: anywhere;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }

  .gallery__item-meta {
    gap: var(--space-xs);
  }

  .gallery__item-meta div {
    gap: var(--space-xs);
  }

  .gallery__item-meta .gallery__item-tag {
    padding: 0.18rem 0.45rem;
  }

  .gallery__item-expiry-meta {
    color: var(--muted);
  }

  .gallery__comment-date {
    color: var(--muted);
  }

  .gallery__item-description {
    line-height: 1.45;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }

  .gallery__item-location {
    line-height: 1.4;
  }

  /* Listing modal: show the whole description (the text area scrolls). The 3-line clamp above only ever
     applied here, because grid cards hide the description, and it cut the text off with no way to read on. */
  .modal__text-wrap .gallery__item-description {
    display: block;
    overflow: visible;
    overflow-wrap: anywhere;
    flex-shrink: 0;
  }

  /* The close button is fixed in this same corner on small screens: keep the heart below it so it can be tapped. */
  .modal__heart-form {
    top: calc(var(--space-md) + 2rem + var(--space-sm));
  }

  .modal__content {
    gap: var(--space-rhythm-section);
    padding-inline: var(--modal-content-padding-mobile-inline);
    padding-block: var(--modal-content-padding-mobile-block);
    overflow-y: auto;
    overflow-x: hidden;
    align-items: start;
  }

  .modal__content.modal__content--two-column {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    align-self: stretch;
    width: 100%;
    min-width: 0;
    min-height: 0;
    max-height: 100svh;
    max-height: 100dvh;
    overflow: hidden;
    gap: 0;
    padding-block: 0;
    padding-inline: 0;
    align-items: stretch;
    align-content: stretch;
  }

  .modal__content--two-column .modal__left {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
  }

  .modal__content--two-column .modal__image-wrap {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    padding: 0;
    gap: 0;
  }

  .modal__content--two-column .modal__image-main {
    min-height: 0;
  }

  .modal__content--two-column .modal__image-thumbs {
    flex-shrink: 0;
  }

  .modal__content--two-column .modal__right {
    flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    max-height: min(46dvh, 50svh);
    min-height: 0;
    overflow: hidden;
    overflow-y: hidden;
    margin: 0;
    margin-top: auto;
    padding: var(--space-sm) var(--modal-content-padding-mobile-inline)
      calc(var(--space-sm) + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
    background: var(--bg-overlay);
    border-top: 1px solid var(--border-subtle);
    gap: var(--space-rhythm-group);
    align-items: center;
    text-align: center;
  }

  .modal__content--two-column .modal__text-wrap {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0.1rem;
    -webkit-overflow-scrolling: touch;
    text-align: center;
    align-items: center;
    width: 100%;
  }

  .modal__content--two-column .modal__chat-form-wrap {
    flex-shrink: 0;
    align-items: center;
    text-align: center;
    width: 100%;
  }

  .modal__content--two-column .modal__right .gallery__item-content {
    align-items: center;
    text-align: center;
  }

  .modal__content--two-column .modal__right .gallery__item-meta,
  .modal__content--two-column .modal__right .gallery__item-meta div {
    align-items: center;
  }

  .modal__content--two-column .modal__right .gallery__item-meta div:nth-child(2) {
    justify-content: center;
  }

  .modal__content--two-column .modal__right .gallery__item-date-wrap {
    justify-items: center;
    text-align: center;
  }

  .modal__content--two-column .modal__right .gallery__item-description,
  .modal__content--two-column .modal__right .gallery__item-location {
    text-align: center;
  }

  .modal__content--two-column .modal__right .modal__chat-form {
    align-items: center;
  }

  .modal__content--two-column .modal__right .modal__chat-submit {
    align-self: center;
  }

  .modal__content--two-column .modal__right .modal__guest-cta {
    justify-items: center;
    text-align: center;
  }

  .modal__content--two-column .modal__right .modal__guest-actions {
    justify-content: center;
    align-items: stretch;
  }

  .modal__content--two-column .modal__right .modal__help-links {
    justify-items: center;
    text-align: center;
  }

  .modal__content--two-column .modal__right .modal__chat-submit--link,
  .modal__content--two-column .modal__right .modal__bookmark-button--link {
    justify-content: center;
  }

  .modal__seller-row,
  .modal__text-wrap {
    line-height: 1.5;
  }

  .modal__seller-info-inner a {
    line-height: 1.45;
  }

  .modal__chat-form {
    gap: var(--space-sm);
  }

  .modal__guest-actions {
    flex-direction: column;
  }

  .modal__guest-actions > * {
    width: 100%;
  }


  .upload-form__file-name {
    line-height: 1.45;
  }

  .upload-form__helper-card {
    padding: var(--space-md) var(--space-lg);
  }
}

.gallery__item-chat {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--space-sm);
  background: var(--fg-inverse);
}

.gallery__item-chat-form {
  margin: 0;
}

.gallery__item-chat-btn {
  display: block;
  width: 100%;
  padding: var(--space-sm) var(--space-md);
  background: var(--fg);
  color: var(--fg-inverse);
  border: none;
  border-radius: var(--radius);
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

/* Listing captions share the photo edge for faster scanning. */
.gallery__grid .gallery__item-content, .gallery__grid .gallery__item-title, .gallery__grid .gallery__item-price { text-align: left; }
.gallery__grid .gallery__item-price { align-self: flex-start; }

/* One scrolling surface keeps photos, pickup and actions reachable on phones. */
@media (max-width: 768px) {
  .modal__content.modal__content--two-column { display: block; overflow-y: auto; overscroll-behavior: contain; }
  .modal__content--two-column .modal__left { height: min(44dvh, 24rem); min-height: 16rem; }
  .modal__content--two-column .modal__right { max-height: none; overflow: visible; align-items: stretch; text-align: left; padding: var(--space-lg); padding-bottom: calc(var(--space-lg) + env(safe-area-inset-bottom, 0px)); }
  .modal__content--two-column .modal__text-wrap { flex: none; overflow: visible; text-align: left; align-items: stretch; }
  .modal__content--two-column .modal__right .gallery__item-content,
  .modal__content--two-column .modal__right .gallery__item-meta,
  .modal__content--two-column .modal__right .gallery__item-meta div { align-items: flex-start; text-align: left; }
  .modal__content--two-column .modal__right .gallery__item-description,
  .modal__content--two-column .modal__right .gallery__item-location,
  .modal__content--two-column .modal__right .gallery__item-date-wrap { text-align: left; justify-items: start; }
  .modal__content--two-column .modal__chat-form-wrap,
  .modal__content--two-column .modal__right .modal__chat-form { align-items: stretch; text-align: left; }
  .modal__content--two-column .modal__right .modal__help-links { justify-items: start; text-align: left; }
}