/* ============================================================================
   OD round-2 design wave — Surface 2: Store category-tile legibility + uniform sizing
   Loaded by mu-plugin od-store-tiles-fixes.php, AFTER od-style + od-round1.
   Scope: the WooCommerce shop archive (/store/) category tiles ONLY.

   v1-0-4 (2026-09-04) ADDS card-size standardization on top of the -1-0-3
   legibility fix (principal request): every /store/ category card is the same
   size — same image box, same title/count type, same overall height. The prior
   grid was ragged (measured live, 1440w: card heights 179-283px because the
   image kept its natural aspect via height:auto, so a square TFT shot towered
   over a short OLED-module shot in the same row). Now the image sits in a fixed
   180px box with object-fit:contain (whole product shown, never cropped — these
   are heterogeneous product photos incl. a tall skinny OLED module and a wide
   LCD; cover would butcher them), the title reserves a uniform 2-line block, and
   every card lands at a single height. Card WIDTH was already uniform (CSS grid).

   -1-0-3 legibility fix (retained): Woodmart cat-design-default rendered the
   label as h3.wd-entities-title #333 position:absolute OVER the product photo
   (transparent bg, text-shadow:none) and the count .wd-cat-count at #767676
   opacity:0 until hover. The reset rules below pull the caption off the image
   into a solid white strip below it (dark title >=600, product count always
   visible) inside a bordered hover-lift card. The theme absolutely-positions
   BOTH .wd-cat-content AND .wd-entities-title and zeroes the caption padding at
   higher specificity, so the resets use !important to pull every caption element
   back into normal flow. Chrome-CSS only; no content/product edits.
   ============================================================================ */

/* --- card frame around each tile --- */
body.woodmart-archive-shop .products .product-category .wd-cat-inner {
  position: relative;
  padding: 0 !important;               /* was 30px 10px 0 */
  border: 1px solid #e2e7ee;
  border-radius: 12px;
  overflow: hidden;                    /* clips image top corners to the radius */
  background: #fff;
  box-shadow: 0 1px 2px rgba(21, 33, 27, .05);
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
body.woodmart-archive-shop .products .product-category .wd-cat-inner:hover {
  border-color: #1a7d2e;
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -16px rgba(21, 33, 27, .30);
}

/* --- product photo: FIXED-height box, product contained (never cropped) --- */
/* v1-0-4: uniform image box so every card's photo area is the same size. The
   box is a fixed 180px tall; object-fit:contain centers the whole product on
   white with no cropping and no distortion, regardless of the source aspect. */
body.woodmart-archive-shop .products .product-category .wd-cat-thumb {
  margin: 0 !important;
  height: 180px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: #fff;
  padding: 12px !important;
  box-sizing: border-box;
  overflow: hidden;
}
body.woodmart-archive-shop .products .product-category .wd-cat-thumb img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;      /* was height:auto — the source of ragged heights */
}

/* --- caption strip: static (was absolute over the image), opaque, padded --- */
body.woodmart-archive-shop .products .product-category .wd-cat-content {
  position: static !important;         /* was absolute, inset over the lower third */
  top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
  transform: none !important;
  height: auto !important;
  min-height: 0 !important;
  opacity: 1 !important;
  overflow: visible !important;
  background: #fff;
  padding: 12px 15px 14px !important;
  text-align: left;
  border-top: 1px solid #eef2f7;
}

/* --- category name: static, dark on white, >=600, no text-shadow --- */
/* v1-0-4: reserve a uniform 2-line block (min-height) and clamp to 2 lines so a
   1-line name ("E-Paper") and a 2-line name ("Demo Board & Display Accessories")
   occupy the same vertical space -> equal card heights across the row. */
body.woodmart-archive-shop .products .product-category .wd-cat-content .wd-entities-title {
  position: static !important;
  top: auto !important; right: auto !important; bottom: auto !important; left: auto !important;
  transform: none !important;
  width: auto !important;
  color: #15211b !important;
  font-weight: 600 !important;
  font-size: 16px;
  line-height: 1.3;
  margin: 0 0 3px !important;
  text-shadow: none !important;
  letter-spacing: -.005em;
  min-height: 42px;                    /* two lines at 16px/1.3 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* --- product count: static, ALWAYS visible, muted-ink on white, no pushing margin --- */
body.woodmart-archive-shop .products .product-category .wd-cat-count {
  position: static !important;
  opacity: 1 !important;               /* theme sets opacity:0 until hover */
  margin: 0 !important;
  color: #5f6f66 !important;
  font-size: 12.5px;
  font-weight: 500;
  text-shadow: none !important;
}
body.woodmart-archive-shop .products .product-category .wd-cat-count a {
  color: #5f6f66 !important;
}
body.woodmart-archive-shop .products .product-category .wd-cat-count a:hover {
  color: #1a7d2e !important;
}

/* --- keep the full-tile click target spanning the whole card --- */
body.woodmart-archive-shop .products .product-category .wd-fill.category-link {
  z-index: 2;
}
