/* PRAASIA Public Original-based V25 — compact full-width refinement.
   Only existing catalog CSS changed; original renderers, queries, links and paging preserved.
   Based strictly on the uploaded text_card.zip (do not substitute V33/V34).
   ONE shared source for every homepage card grid.
   Works with oldpra.php, newpra.php, watpra.php, recommendpra.php,
   otherpra.php, index_certificate.php and ranked/recent shops from
   catalog_index.php. HTML, SQL and product links are unchanged.
   All rules are scoped to public/index.php only. */

body.pra-fw-home .pra-fw-catalog-legacy {
  --pra-card-gap:8px;
  --pra-card-max:164px;
  --pra-card-panel:#302019;
  --pra-card-border:rgba(210,160,87,.33);
  --pra-card-scroll-thumb:#b88a45;
}
/* Section fills the current public home page width. Preserve the existing
   legacy table renderers and their JS class names; change presentation only. */
body.pra-fw-home .pra-fw-catalog-legacy .pra19-section-row,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section {
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important; min-width:0!important; max-width:100%!important;
  margin:10px 0!important; float:none!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra19-section-row > td {
  display:block!important; box-sizing:border-box!important;
  width:100%!important; max-width:100%!important; min-width:0!important; padding:0!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra19-panel,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section > table.pra20-section-table {
  box-sizing:border-box!important; width:100%!important; max-width:100%!important;
  min-width:0!important; margin:0!important;
  border-spacing:0!important; background:transparent!important;
  border:0!important; border-bottom:1px solid rgba(210,157,79,.30)!important;
  border-radius:0!important; overflow:visible!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra19-panel > tbody,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-panel > tbody > tr,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-panel > tbody > tr > td,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section-table > tbody > tr,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section-table > tbody > tr > td,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section-table > tbody > tr > td > table,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section-table > tbody > tr > td > table > tbody > tr > td {
  box-sizing:border-box!important; min-width:0!important;
  width:100%!important; max-width:100%!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-section-table > tbody > tr > td > table {
  table-layout:fixed; border-spacing:0!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra19-heading {
  box-sizing:border-box!important; height:auto!important; min-height:38px!important;
  padding:7px 12px!important; text-align:left!important;
  background:linear-gradient(100deg,#523016,#322011)!important;
  border-top:0!important; border-bottom:1px solid rgba(220,164,77,.45)!important;
  font:700 15px/1.4 Tahoma,Arial,sans-serif!important;
  color:#ffe0a0!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra19-heading * {
  color:#ffe0a0!important; text-align:left!important; font-weight:700!important;
}
/* All eight requested groups share this compact grid.
   Unlike the original 1406px cap, the grid fills available page width. */
body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid {
  box-sizing:border-box!important; display:grid!important;
  grid-template-columns:repeat(10,minmax(0,1fr))!important;
  gap:var(--pra-card-gap)!important;
  justify-content:stretch!important; align-items:stretch!important;
  width:100%!important; max-width:none!important; min-width:0!important;
  padding:8px 2px!important; margin:0!important;
  float:none!important; background:transparent!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid > table.pra20-card,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid > table.pra19-card {
  display:table!important; position:relative; box-sizing:border-box!important;
  float:none!important; clear:none!important;
  width:100%!important; min-width:0!important; max-width:100%!important;
  margin:0!important; height:100%!important; table-layout:fixed!important;
  border-spacing:0!important; background:var(--pra-card-panel)!important;
  border:1px solid var(--pra-card-border)!important; border-radius:6px!important;
  overflow:hidden; align-self:stretch!important; box-shadow:none!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card td,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card span,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card span {
  box-sizing:border-box!important; min-width:0; max-width:100%; overflow-wrap:anywhere;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card table:not(.pra20-card),
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card table:not(.pra19-card) {
  max-width:100%!important; min-width:0!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card div[style*="width:145px"],
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card div[style*="width:165px"],
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card div[style*="width:145px"],
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card div[style*="width:165px"],
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card div[style*="width:105px"] {
  box-sizing:border-box!important; max-width:100%!important;
  width:100%!important; min-width:0!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td[bgcolor="#666666"],
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td[bgcolor="#333333"],
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card td[bgcolor="#666666"],
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card td[bgcolor="#333333"] {
  background:#33251b!important;
}
/* Product photos only. Never scale the colored status dot or page-view eye. */
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img.pra20-product-photo,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card a[href*="shop_index.php"] > img,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card a[href*="shop_product.php"] > img {
  box-sizing:border-box!important; display:block!important;
  width:100%!important; max-width:100%!important; height:auto!important;
  aspect-ratio:1/1; object-fit:contain; background:#0e0a07;
}
/* V23: automatic square product-cover framing.
   Product photo ONLY: do not crop shop logos, product status dots, eye/rank icons.
   "cover" fills the entire square without stretching the amulet; a subtle 3% zoom
   trims surplus edge space. Original uploaded files are never modified. */
body.pra-fw-home .pra-fw-catalog-legacy {
  --pra-card-cover-zoom:1.03;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card a[href*="shop_product.php"]:has(> img.pra20-product-photo),
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card a[href*="detail_product.php"]:has(> img.pra20-product-photo),
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card a[href*="shop_product.php"]:has(> img),
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card a[href*="detail_product.php"]:has(> img) {
  display:block!important; width:100%!important; max-width:100%!important;
  overflow:hidden!important; line-height:0!important; background:#0e0a07;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card a[href*="shop_product.php"] > img.pra20-product-photo,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card a[href*="detail_product.php"] > img.pra20-product-photo,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card a[href*="shop_product.php"] > img,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-card a[href*="detail_product.php"] > img {
  box-sizing:border-box!important; display:block!important;
  width:100%!important; max-width:100%!important; height:auto!important;
  aspect-ratio:1/1!important; object-fit:cover!important;
  object-position:50% 50%!important;
  transform:scale(var(--pra-card-cover-zoom)); transform-origin:center center;
  margin:0!important; padding:0!important;
}

body.pra-fw-home .pra-fw-catalog-legacy img.pra20-score-indicator,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img[src*="light-green"],
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img[src*="flash-green"],
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img[src*="flash-yellow"],
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img[src*="flash-red"] {
  box-sizing:content-box!important; display:inline-block!important;
  width:15px!important; min-width:15px!important; max-width:15px!important;
  height:12px!important; max-height:12px!important;
  object-fit:contain!important; vertical-align:middle!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img.pra20-view-icon,
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img[src*="view-icon"] {
  display:inline-block!important; width:15px!important; max-width:15px!important;
  min-width:15px!important; height:9px!important; max-height:9px!important;
  object-fit:contain!important; vertical-align:baseline!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img.pra20-rank-icon {
  display:inline-block!important; width:19px!important; max-width:19px!important;
  height:15px!important; max-height:15px!important; object-fit:contain!important;
}
/* Scrollable item names/details restored! The old inner div already has
   overflow-y:scroll inline, but V20 globally hid its overflow. The new class
   is added by the existing AJAX-aware card enhancer and is keyboard-focusable. */
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra20-card-description {
  box-sizing:border-box!important; width:100%!important; max-width:100%!important;
  min-width:0!important; height:76px!important; max-height:76px!important;
  overflow:hidden!important; font-size:11px!important; line-height:1.38!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra20-card-description > .pra22-card-scroll {
  box-sizing:border-box!important; display:block!important;
  width:100%!important; height:100%!important; max-width:100%!important;
  min-width:0!important; padding:3px 2px 3px 5px!important;
  overflow-y:auto!important; overflow-x:hidden!important;
  overscroll-behavior-y:contain; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:var(--pra-card-scroll-thumb) #2c1b10;
  white-space:normal!important; overflow-wrap:anywhere;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll::-webkit-scrollbar {width:5px;}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll::-webkit-scrollbar-thumb {background:#b58a4e;border-radius:7px;}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll::-webkit-scrollbar-track {background:#2c1b10;}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll:focus-visible {outline:2px solid #e9c47d;outline-offset:-2px;}
/* The compact footer is displayed on mobiles only; larger screens retain the original footer. */
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-compact-footer {display:none!important;}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll table {
  width:100%!important; max-width:100%!important; min-width:0!important;
  table-layout:fixed!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll td {
  overflow-wrap:anywhere; white-space:normal!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pravote_container {
  width:240px!important; max-width:min(240px,90vw)!important; z-index:15; pointer-events:none;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pravote_container table {
  box-sizing:border-box; width:100%!important; max-width:100%!important;
}
body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid > style,
body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid > script {display:none!important;}
body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid > :not(table.pra20-card),
body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid > :not(table.pra19-card):not(style):not(script) {
  grid-column:1/-1; min-width:0;
}
/* V13: exactly 20 product cards per page on all devices.
   Wide PCs (>=1100px): 10 x 2; intermediate 850-1099px: 5 x 4;
   phones/tablets <=849px: 4 x 5. No 12/15-column expansion on huge monitors.
   The six PHP renderers share the 20-item SQL/page offset. */
@media(min-width:850px) and (max-width:1099px){
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid,
  body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid {
    grid-template-columns:repeat(5,minmax(0,1fr))!important; --pra-card-gap:8px;
  }
}
@media(max-width:849px){
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid,
  body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid {
    grid-template-columns:repeat(4,minmax(0,1fr))!important; --pra-card-gap:6px; padding:8px!important;
  }
}
@media(max-width:600px){
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid,
  body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid {
    grid-template-columns:repeat(4,minmax(0,1fr))!important; --pra-card-gap:5px; padding:6px!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra19-heading {font-size:13px!important;padding:9px 10px!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra20-card-description {
    height:46px!important; max-height:46px!important; font-size:9px!important;
    line-height:1.26!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td {font-size:10px!important; padding-left:1px!important; padding-right:1px!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img.pra20-score-indicator {
    width:12px!important;min-width:12px!important;max-width:12px!important;height:10px!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll {padding:2px 1px!important;}
  /* V24: compact 4-column mobile cards, consistent with the shop_index latest grid.
     Keep the full product name/details scrollable without making every card tall. */
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll {
    padding:1px 2px!important;
    font-size:9px!important; line-height:1.26!important;
    scrollbar-width:thin;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll td,
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll a,
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra22-card-scroll span {
    font-size:9px!important; line-height:1.26!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td[height="25"],
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td[height="60"] {
    height:auto!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-footer-cell {
    padding:3px 3px 4px!important;
    height:23px!important;
    vertical-align:middle!important;
    overflow:hidden!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-footer-cell > table {
    display:none!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-compact-footer {
    display:flex!important; align-items:center; justify-content:space-between;
    width:100%; min-width:0; max-width:100%; gap:3px;
    color:#f8e6c9; font-size:9px; line-height:1.2;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-compact-state {
    display:block; flex:1 1 auto; min-width:0;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap!important;
    overflow-wrap:normal!important; word-break:normal!important;
  }
  /* Match readable, semantic card status colors in the Shops latest-product grid. */
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-state-show {color:#89c9ff!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-state-rent {color:#82e3a1!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-state-preorder {color:#f7db87!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-state-booked {color:#f4c78c!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-state-sold {color:#ff9992!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-compact-views {
    display:inline-flex; align-items:center; justify-content:flex-end;
    flex:0 0 auto; gap:2px; min-width:0; white-space:nowrap!important;
    overflow-wrap:normal!important; word-break:normal!important;
    color:#f8e6c9; font:700 9px/1.15 Tahoma,Arial,sans-serif;
    font-variant-numeric:tabular-nums;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-compact-views img {
    display:block!important; flex:none; width:11px!important;
    min-width:11px!important; max-width:11px!important;
    height:8px!important; max-height:8px!important;
    object-fit:contain!important;
  }
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card .pra24-compact-count {
    display:inline-block!important; flex:none; white-space:nowrap!important;
    word-break:normal!important; overflow-wrap:normal!important;
    letter-spacing:-.12px;
  }
  /* JS enhancement is progressive; prevent number-by-number wrapping even before it mounts. */
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card img[src*="view-icon"] + span {
    white-space:nowrap!important; overflow-wrap:normal!important; word-break:normal!important;
    font-size:9px!important;
  }
}
@media(max-width:350px){
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-cards-grid,
  body.pra-fw-home .pra-fw-catalog-legacy .pra19-cards-grid {--pra-card-gap:4px;padding:5px!important;}
  body.pra-fw-home .pra-fw-catalog-legacy .pra20-card td {font-size:9px!important;}
}