/* AccsMedia Responsive Fix v1.0.3 — mobile + tablet layout repairs (front-end)
   v1.0.2: stylesheet served under a NEW filename (responsive-102.css) so no cache can
   serve the old file; catalogue-row selectors strengthened (body prefix + .type-product).
   Row markup facts: li.product has only two children — .astra-shop-thumbnail-wrap and
   .astra-shop-summary-wrap — so both wrappers and the thumbnail link get
   display:contents and the inner elements become grid items. */

/* ---------- Shared row treatment for phones + tablets ---------- */
@media (max-width: 1024px) {
  body .am-catalogue ul.products li.product.type-product,
  body.tax-product_cat ul.products li.product.type-product,
  body.post-type-archive-product ul.products li.product.type-product {
    display: grid !important;
    grid-template-columns: 46px 1fr auto;
    grid-template-areas: "img title price" "img stock btn";
    column-gap: 10px;
    row-gap: 2px;
    align-items: center;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    height: auto !important;
  }
  /* Flatten the wrappers so the real elements become grid items */
  body .am-catalogue li.product .astra-shop-thumbnail-wrap,
  body.tax-product_cat li.product .astra-shop-thumbnail-wrap,
  body.post-type-archive-product li.product .astra-shop-thumbnail-wrap,
  body .am-catalogue li.product .astra-shop-summary-wrap,
  body.tax-product_cat li.product .astra-shop-summary-wrap,
  body.post-type-archive-product li.product .astra-shop-summary-wrap,
  body .am-catalogue li.product a.woocommerce-LoopProduct-link,
  body.tax-product_cat li.product a.woocommerce-LoopProduct-link,
  body.post-type-archive-product li.product a.woocommerce-LoopProduct-link {
    display: contents !important;
  }
  body .am-catalogue li.product img.attachment-woocommerce_thumbnail,
  body.tax-product_cat li.product img.attachment-woocommerce_thumbnail,
  body.post-type-archive-product li.product img.attachment-woocommerce_thumbnail {
    grid-area: img;
    width: 46px !important;
    height: 46px !important;
    object-fit: contain;
    margin: 0 !important;
    align-self: center;
  }
  body .am-catalogue li.product .am-stock,
  body.tax-product_cat li.product .am-stock,
  body.post-type-archive-product li.product .am-stock {
    grid-area: stock;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    font-size: 0.8rem !important;
    text-align: left !important;
    margin: 0 !important;
    width: auto !important;
  }
  body .am-catalogue li.product a.ast-loop-product__link,
  body.tax-product_cat li.product a.ast-loop-product__link,
  body.post-type-archive-product li.product a.ast-loop-product__link {
    grid-area: title;
    text-align: left !important;
    margin: 0 !important;
  }
  body .am-catalogue li.product .woocommerce-loop-product__title,
  body.tax-product_cat li.product .woocommerce-loop-product__title,
  body.post-type-archive-product li.product .woocommerce-loop-product__title {
    font-size: 0.92rem !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    text-align: left !important;
  }
  body .am-catalogue li.product .price,
  body.tax-product_cat li.product .price,
  body.post-type-archive-product li.product .price {
    grid-area: price;
    font-size: 1rem !important;
    font-weight: 700;
    text-align: right !important;
    margin: 0 !important;
    width: auto !important;
  }
  body .am-catalogue li.product a.button,
  body.tax-product_cat li.product a.button,
  body.post-type-archive-product li.product a.button {
    grid-area: btn;
    justify-self: end;
    padding: 8px 14px !important;
    font-size: 0.88rem !important;
    white-space: nowrap;
    margin: 0 !important;
    width: auto !important;
  }
  /* Duplicates that must not take grid cells in the row layout */
  body .am-catalogue li.product .ast-on-card-button,
  body.tax-product_cat li.product .ast-on-card-button,
  body.post-type-archive-product li.product .ast-on-card-button,
  body .am-catalogue li.product .ast-woo-product-category,
  body.tax-product_cat li.product .ast-woo-product-category,
  body.post-type-archive-product li.product .ast-woo-product-category {
    display: none !important;
  }
}

/* ---------- Phones ---------- */
@media (max-width: 767px) {
  body .am-catalogue ul.products li.product.type-product,
  body.tax-product_cat ul.products li.product.type-product,
  body.post-type-archive-product ul.products li.product.type-product {
    margin: 0 0 10px !important;
    padding: 10px 12px !important;
  }
  .am-catbar { padding: 10px 12px !important; font-size: 1rem !important; }
  .am-viewmore { padding: 12px !important; font-size: 0.95rem !important; }
  .am-catalogue { padding: 0 10px !important; }

  /* Homepage blocks */
  .am-steps { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  .am-hero { padding: 28px 16px !important; }
  .am-hero h1 { font-size: 1.5rem !important; line-height: 1.25 !important; }
  .am-cat-icons { gap: 8px !important; justify-content: center !important; }
  .am-search-row { display: flex !important; gap: 8px !important; }
  .am-search-row input { flex: 1 1 auto !important; min-width: 0 !important; }
  .am-search-row button { flex: 0 0 auto !important; }

  /* Checkout (classic): full-width rows, comfortable padding */
  body.woocommerce-checkout #customer_details,
  body.woocommerce-checkout #order_review { width: 100% !important; float: none !important; }
  body.woocommerce-checkout #order_review { padding: 14px !important; margin-top: 14px; }
  body.woocommerce-checkout .woocommerce form .form-row-first,
  body.woocommerce-checkout .woocommerce form .form-row-last { width: 100% !important; float: none !important; }
  body.woocommerce-checkout #place_order { padding: 15px !important; }

  /* Related / upsell product grids: two per row */
  .related ul.products, .upsells ul.products { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
  .related ul.products li.product, .upsells ul.products li.product { flex: 1 1 44% !important; width: auto !important; margin: 0 !important; float: none !important; }

  /* Single product */
  body.single-product div.product .product_title { font-size: 1.5rem !important; }
  body.single-product form.cart { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
  body.single-product form.cart .single_add_to_cart_button { flex: 1 1 auto !important; }

  /* My account: navigation stacks above content */
  .woocommerce-account .woocommerce-MyAccount-navigation { width: 100% !important; float: none !important; margin-bottom: 14px !important; }
  .woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; float: none !important; }
}

/* ---------- Footer menu: real selectors (#astra-footer-menu) ---------- */
@media (max-width: 1024px) {
  #astra-footer-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 4px 18px !important;
  }
  #astra-footer-menu li { margin: 0 !important; }
  #astra-footer-menu .menu-link { color: #DE7A1C !important; font-weight: 600; font-size: 0.95rem; }
}

/* ---------- Tablets only: steps 2x2 ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
  .am-steps { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
}

/* Stack the classic checkout a bit earlier than the theme does */
@media (max-width: 900px) {
  body.woocommerce-checkout #customer_details,
  body.woocommerce-checkout #order_review { width: 100% !important; float: none !important; }
  body.woocommerce-checkout #order_review { margin-top: 16px; }
}
