/*
 * V78 — Mobile Shop Readability
 * Shop-page-only typography enhancement requested by client.
 * Does not change the two-column grid, AJAX/filter logic, sticky flow or desktop UI.
 */
@media (max-width: 767px) {
  html.shop-v38-document body.shop-page {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  /* Top category chips / quick filters */
  html.shop-v38-document body.shop-page .shop-filter-topline .chip,
  html.shop-v38-document body.shop-page .chip-row .chip {
    font-size: 11.5px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
  }

  html.shop-v38-document body.shop-page .shop-clear-all,
  html.shop-v38-document body.shop-page .clear-filter-link,
  html.shop-v38-document body.shop-page .active-filter-chip {
    font-size: 10.5px !important;
    font-weight: 850 !important;
  }

  /* Compact toolbar */
  html.shop-v38-document body.shop-page .toolbar-product-count strong {
    font-size: 18px !important;
    line-height: 1 !important;
  }

  html.shop-v38-document body.shop-page .toolbar-product-count span {
    font-size: 8px !important;
    font-weight: 800 !important;
    letter-spacing: .04em !important;
  }

  html.shop-v38-document body.shop-page .shop-control > span:first-child,
  html.shop-v38-document body.shop-page .shop-control > legend {
    font-size: 8px !important;
    font-weight: 850 !important;
    line-height: 1.1 !important;
  }

  html.shop-v38-document body.shop-page .shop-main-filter input[type="search"],
  html.shop-v38-document body.shop-page .shop-main-filter input[type="number"],
  html.shop-v38-document body.shop-page .shop-main-filter select,
  html.shop-v38-document body.shop-page .shop-filter-submit {
    font-size: 10.5px !important;
    font-weight: 700 !important;
  }

  html.shop-v38-document body.shop-page .shop-search-field i {
    font-size: 14px !important;
  }

  /* Product card typography — retain two-column layout */
  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-badge {
    min-height: 22px !important;
    padding: 0 7px !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    letter-spacing: .025em !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-body {
    padding: 9px 9px 10px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-kicker {
    margin-bottom: 5px !important;
    font-size: 9.5px !important;
    line-height: 1.25 !important;
    font-weight: 900 !important;
    letter-spacing: .035em !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe h3 {
    min-height: 2.55em !important;
    margin-bottom: 6px !important;
    font-size: 14px !important;
    line-height: 1.28 !important;
    font-weight: 850 !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe h3 a {
    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-short-description {
    min-height: 4.1em !important;
    margin-bottom: 7px !important;
    font-size: 11px !important;
    line-height: 1.38 !important;
    font-weight: 800 !important;
    -webkit-line-clamp: 3 !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-rating-row {
    min-height: 16px !important;
    margin-bottom: 5px !important;
    font-size: 9px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-rating-star {
    font-size: 11px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .price-row {
    min-height: 30px !important;
    gap: 4px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .price-row b,
  html.shop-v38-document body.shop-page .product-card--shop-luxe .sale-current-price {
    font-size: 16.5px !important;
    line-height: 1.1 !important;
    font-weight: 950 !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .actual-price {
    font-size: 10px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .discount-percent {
    padding: 2px 5px !important;
    font-size: 8px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .price-row small {
    display: block !important;
    font-size: 8.5px !important;
    line-height: 1.15 !important;
    font-weight: 750 !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-actions-row {
    grid-template-columns: minmax(0,1fr) 61px !important;
    gap: 5px !important;
    margin-top: 7px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-cta,
  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-whatsapp {
    height: 36px !important;
    min-height: 36px !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-whatsapp {
    width: 61px !important;
    min-width: 61px !important;
  }

  /* Pagination and fixed mobile quick nav */
  html.shop-v38-document body.shop-page .pagination-luxe a,
  html.shop-v38-document body.shop-page .pagination-luxe span {
    font-size: 11px !important;
    font-weight: 850 !important;
  }

  body.shop-page .mobile-bottom-nav a {
    font-size: 12px !important;
  }

  body.shop-page .mobile-bottom-nav a b {
    font-size: 18px !important;
  }
}

/* Very narrow phones: keep the typography readable without breaking two columns. */
@media (max-width: 399px) {
  html.shop-v38-document body.shop-page .product-card--shop-luxe h3 {
    font-size: 13.25px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-short-description {
    font-size: 10.5px !important;
  }

  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-cta,
  html.shop-v38-document body.shop-page .product-card--shop-luxe .product-whatsapp {
    font-size: 8.5px !important;
  }
}
