/* Jahaniyan: consistent full-width ad cards on mobile only. */
@media screen and (max-width: 767px) {
  /* Remove horizontal gutters that leave blank strips beside cards on home, city and category archives. */
  body.home main, body.home #primary,
  body.archive main, body.archive #primary,
  body.tax-product_cat main, body.tax-product_cat #primary,
  body.woocommerce main, body.woocommerce-page main {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.home .woocommerce ul.products,
  body.home .woocommerce-page ul.products,
  body.archive .woocommerce ul.products,
  body.archive .woocommerce-page ul.products,
  body.tax-product_cat .woocommerce ul.products,
  body.tax-product_cat .woocommerce-page ul.products,
  body.woocommerce ul.products,
  body.woocommerce-page ul.products {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  .woocommerce ul.products li.product.jh-card,
  .woocommerce-page ul.products li.product.jh-card,
  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    box-sizing: border-box !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 12px !important;
    padding: 0 0 12px !important;
    left: auto !important;
    right: auto !important;
  }

  .woocommerce ul.products li.product.jh-card .wrapper,
  .woocommerce-page ul.products li.product.jh-card .wrapper,
  .woocommerce ul.products li.product .wrapper,
  .woocommerce-page ul.products li.product .wrapper {
    box-sizing: border-box !important;
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  .woocommerce ul.products li.product.jh-card .image,
  .woocommerce-page ul.products li.product.jh-card .image,
  .woocommerce ul.products li.product .image,
  .woocommerce-page ul.products li.product .image {
    flex: 0 0 36% !important;
    width: 36% !important;
    min-width: 0 !important;
    max-width: 36% !important;
    box-sizing: border-box !important;
  }

  .woocommerce ul.products li.product.jh-card .image img,
  .woocommerce-page ul.products li.product.jh-card .image img,
  .woocommerce ul.products li.product .image img,
  .woocommerce-page ul.products li.product .image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
  }

  .woocommerce ul.products li.product.jh-card .jh-card__text,
  .woocommerce-page ul.products li.product.jh-card .jh-card__text,
  .woocommerce ul.products li.product .jh-card__text,
  .woocommerce-page ul.products li.product .jh-card__text {
    flex: 1 1 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere;
  }

  /* Keep inner Bootstrap columns from creating side gutters around the listing. */
  body.home .row:has(> .woocommerce),
  body.archive .row:has(> .woocommerce),
  body.tax-product_cat .row:has(> .woocommerce) {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* v7: make category and city archive cards match the home mobile listing width. */
@media screen and (max-width: 767px) {
  body.tax-product_cat .content > .block > .container,
  body.tax-city_categories .content > .block > .container,
  body.tax-product_tag .content > .block > .container,
  body.archive .content > .block > .container,
  body.woocommerce-page .content > .block > .container.jh-with-side {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box !important;
  }
  body.tax-product_cat .jh-with-side > *,
  body.tax-city_categories .jh-with-side > *,
  body.tax-product_tag .jh-with-side > *,
  body.archive .jh-with-side > * {
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
  body.tax-product_cat .jh-with-side .section-title,
  body.tax-city_categories .jh-with-side .section-title,
  body.tax-product_tag .jh-with-side .section-title,
  body.archive .jh-with-side .section-title,
  body.woocommerce-page .jh-with-side .section-title {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  body.tax-product_cat ul.products,
  body.tax-city_categories ul.products,
  body.tax-product_tag ul.products,
  body.archive ul.products,
  body.woocommerce-page ul.products {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  body.tax-product_cat ul.products > li.product,
  body.tax-city_categories ul.products > li.product,
  body.tax-product_tag ul.products > li.product,
  body.archive ul.products > li.product,
  body.woocommerce-page ul.products > li.product {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 10px !important;
    box-sizing: border-box !important;
  }
  body.tax-product_cat ul.products > li.product > .wrapper,
  body.tax-city_categories ul.products > li.product > .wrapper,
  body.tax-product_tag ul.products > li.product > .wrapper,
  body.archive ul.products > li.product > .wrapper,
  body.woocommerce-page ul.products > li.product > .wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* Single ad mobile order: description, map, private note, comments. */
@media screen and (max-width: 767px) {
  body.single-product .charsoogh-content .mapbox,
  body.single-product .charsoogh-content .jh-note,
  body.single-product .charsoogh-content > section.box:has(#collapseComments) {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 12px 0 !important;
    box-sizing: border-box !important;
  }
  body.single-product .charsoogh-content .mapbox #map {
    display: block !important;
    width: 100% !important;
    height: 280px !important;
    min-height: 240px !important;
    visibility: visible !important;
  }
  body.single-product .charsoogh-content .jh-note textarea {
    min-height: 64px !important;
    height: 64px !important;
    max-height: 90px !important;
    padding: 8px 10px !important;
    box-sizing: border-box !important;
  }
}


/* Mobile single-ad order/map visibility: description -> map -> note -> comments. */
@media screen and (max-width: 767px) {
  body.single-product .jh-desc,
  body.single-product .mapbox,
  body.single-product .jh-note,
  body.single-product .jh-single-comments {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  body.single-product .mapbox #map,
  body.single-product #map {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 280px !important;
    min-height: 280px !important;
    visibility: visible !important;
  }
}
