/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/



/* Reserve thumbnail height before the image arrives so Isotope measures tiles correctly */
.shop.grid-container .product-image img { width: 100%; height: auto; aspect-ratio: 440 / 586; object-fit: cover; }

/* Logo <img>s carry width/height attributes to reserve space before load; the theme only
   sets height, so let width follow the aspect ratio instead of the width attribute */
#logo img, #logo-footer img { width: auto; }

/* Theme's 0.815rem × 1.5 makes this line 19.56px, leaving everything below the top bar on a
   fractional pixel; a whole-pixel line height keeps edges from flickering 1px on relayout */
#top-bar p { line-height: 20px; }

/* #header-wrap is absolutely positioned; the theme's clone reserves its space at 81px, but this
   header is 80px (border is on #header, not #header-wrap), so JS shrinks it by 1px ~1s after load */
@media (min-width: 992px) {
  .header-size-md .header-wrap-clone { height: 80px; }
}

/* Theme's #888 is only 3.4:1 on the page background; this clears the 4.5:1 AA minimum */
.product-price del { color: #6b6b6b; }

/* Give product links the 24px minimum touch target height */
.product-title h3 a, .product-title > a { display: inline-block; min-height: 24px; }
