/** Shopify CDN: Minification failed

Line 154:36 Expected ":"
Line 158:32 Expected "{" but found end of file

**/
/* OEM Accessories (Dawn-friendly)
   - Landing family tiles
   - Family grid uses Dawn product-grid/card markup
   - FIX: force accessory images to render (not hidden) + size 158x158
*/

/* --------------------------
   Base
--------------------------- */
.acc { padding: 28px 0; }
.acc__header { margin-bottom: 18px; }
.acc__title { margin: 0 0 6px; }
.acc__sub { margin: 0; opacity: .75; }

/* --------------------------
   Landing (family tiles)
--------------------------- */
.acc__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
@media (min-width: 750px) {
  .acc__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }
}

.acc__tile {
  display: block;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
}
.acc__tileImgWrap {
  aspect-ratio: 4/3;
  background: rgba(0,0,0,.03);
}
.acc__tileImg {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.acc__tileBody { padding: 12px; }
.acc__tileTitle { font-weight: 600; line-height: 1.2; }
.acc__tileMeta { margin-top: 6px; font-size: .9em; opacity: .75; }

/* --------------------------
   Filters
--------------------------- */
.acc__filters {
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
@media (min-width: 750px) {
  .acc__filters { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* If you still use the older label/span/select markup anywhere */
.acc__field span {
  display: block;
  font-size: .85em;
  opacity: .75;
  margin-bottom: 4px;
}
.acc__field select {
  width: 100%;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.18);
}

.acc__results { margin-top: 16px; }
.acc__count { margin: 8px 0 12px; opacity: .75; }

/* --------------------------
   Family grid (Dawn card)
   IMPORTANT FIXES:
   1) Keep Dawn ratio sizing intact
   2) Center media contents
   3) Override Dawn's absolute-positioned img behavior for our custom img
--------------------------- */

/* Keep Dawn ratio box alive (square media area) */
#acc-cards .card__inner.ratio { --ratio-percent: 100%; }

/* Ensure media containers have size */
#acc-cards .card__media,
#acc-cards .media {
  width: 100%;
  height: 100%;
}

/* Center the image safely */
#acc-cards .media {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* CRITICAL: Dawn often sets .media img to position:absolute; we must undo that */
#acc-cards .acc__cardImg {
  position: static !important;  /* <-- makes it visible in layout */
  width: 158px !important;
  height: 158px !important;
  max-width: 158px !important;
  max-height: 158px !important;
  object-fit: contain;
  display: block;
}

/* Optional: if your theme applies opacity/visibility on hover variants */
#acc-cards .acc__cardImg {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Slightly tighter spacing under image */
#acc-cards .card__information { padding-top: 0.6rem; }

/* --------------------------
   Badges
--------------------------- */
.acc__cardBadges {
  margin-top: 8px;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.acc__badge {
  font-size: .78em;
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.15);
  opacity: .9;
}
.acc__badge--last { font-weight: 600; }

/* Make the media box less tall on desktop so there's less "empty space" */
@media (min-width: 990px) {
  #acc-cards .card__inner.ratio { 
    ratio-percent: 72%; 
    align-items: flex-end; IMPORTANT
  }
}

#acc-cards div.card__inner.ratio