/* Dippingg v32 — unified public product-card language.
   Loaded LAST on every public page with product listings.
   No changes to pricing data, navigation, tracking or admin operation cards. */
:root {
  --dpg-card-ink: #171a18;
  --dpg-card-muted: #69716b;
  --dpg-card-line: #e9ede9;
  --dpg-card-image-bg: #fff;
  --dpg-card-green: #137b50;
  --dpg-card-red: #a45a4b;
}

/* Shared tracked cards: home deal rail, home category rail, /categories,
   /category/:slug and /brand/:slug use one component. */
.tracked-product-card {
  display: flex;
  min-width: 0;
  align-self: stretch;
}
.tracked-product-card .tracked-product-card__link,
.category-product-card .category-product-card__link {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--dpg-card-line);
  border-radius: 19px;
  background: #fff;
  box-shadow: none;
  color: var(--dpg-card-ink);
  text-decoration: none;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.tracked-product-card .tracked-product-card__link:focus-visible {
  outline: 3px solid #77b699;
  outline-offset: -3px;
}
.tracked-product-card .tracked-product-card__visual,
.category-product-card .category-product-card__visual {
  position: relative;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: auto;
  height: auto;
  min-width: 0;
  aspect-ratio: 1.12 / 1;
  margin: 12px 12px 0;
  padding: 0;
  overflow: hidden;
  border-radius: 12px;
  background: var(--dpg-card-image-bg);
}
.tracked-product-card .tracked-product-card__image,
.category-product-card .category-product-card__image {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  max-width: none;
  min-width: 0;
  min-height: 0;
  aspect-ratio: auto;
  padding: 18px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-sizing: border-box;
}
.tracked-product-card .tracked-product-card__image img,
.category-product-card .category-product-card__image img {
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  object-fit: contain;
  mix-blend-mode: multiply;
  filter: saturate(.92);
  transition: opacity .2s ease;
}
.tracked-product-card .tracked-product-card__image.is-loading {
  background: var(--dpg-card-image-bg);
}
.tracked-product-card .tracked-product-card__score {
  top: 21px;
  left: 21px;
  min-width: 46px;
  min-height: 43px;
  gap: 3px;
  padding: 7px 9px;
  border: 1px solid #e7eae6;
  border-radius: 9px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 1px 3px rgba(0,0,0,.025);
}
.tracked-product-card .tracked-product-card__score-label { font-size: 8px; }
.tracked-product-card .tracked-product-card__score-value { font-size: 16px; }
.tracked-product-card .tracked-product-card__body,
.home-section .tracked-product-card .tracked-product-card__body,
.category-product-card .category-product-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  padding: 22px 20px 20px;
  text-align: left;
}
.tracked-product-card .tracked-product-card__title,
.home-section .tracked-product-card .tracked-product-card__title,
.category-product-card .category-product-card__title {
  display: -webkit-box;
  flex: 0 0 auto;
  align-self: auto;
  width: 100%;
  max-width: 100%;
  min-height: 48px;
  margin: 0 0 23px;
  overflow: hidden;
  color: #262b27;
  font-size: 15.5px;
  font-weight: 650;
  line-height: 1.55;
  letter-spacing: -.045em;
  text-align: left;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.tracked-product-card .tracked-product-card__price-wrap,
.home-section .tracked-product-card .tracked-product-card__price-wrap,
.category-product-card .category-product-card__price-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 4px;
  min-width: 0;
  margin: auto 0 0;
  padding: 0;
}
.tracked-product-card .tracked-product-card__previous,
.home-section .tracked-product-card .tracked-product-card__previous,
.category-product-card .category-product-card__previous {
  order: 0;
  display: block;
  margin: 0;
  color: #a3aaa5;
  font-size: 12.5px;
  font-weight: 450;
  line-height: 1.3;
  text-decoration: line-through;
  white-space: nowrap;
}
.tracked-product-card .tracked-product-card__current,
.home-section .tracked-product-card .tracked-product-card__current,
.category-product-card .category-product-card__current {
  order: 1;
  display: block;
  max-width: 100%;
  min-width: 0;
  color: #141715;
  font-size: clamp(24px, 2.2vw, 32px);
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -.06em;
  white-space: nowrap;
}
.tracked-product-card .tracked-product-card__change-summary,
.category-product-card .category-product-card__change-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  align-self: stretch;
  gap: 7px;
  min-width: 0;
  margin: 7px 0 0;
  padding: 0;
  border: 0;
  font-size: 13px;
  font-weight: 620;
  line-height: 1.5;
  white-space: normal;
}
.tracked-product-card .tracked-product-card__change-summary.is-down,
.category-product-card .category-product-card__change-summary.is-down {
  color: var(--dpg-card-muted);
}
.tracked-product-card .tracked-product-card__change-summary.is-up,
.category-product-card .category-product-card__change-summary.is-up { color: var(--dpg-card-muted); }
.tracked-product-card .dpg-card__change-rate { font-size: 15px; font-weight: 780; line-height: 1.3; color: var(--dpg-card-green); white-space: nowrap; }
.tracked-product-card .is-up .dpg-card__change-rate { color: var(--dpg-card-red); }
.tracked-product-card .dpg-card__change-divider { width: 1px; height: 12px; background: #dfe4de; }
.tracked-product-card .dpg-card__change-amount { color: #626b64; font-weight: 550; }
.tracked-product-card .tracked-product-card__timing,
.category-product-card .category-product-card__timing {
  display: flex;
  align-items: center;
  align-self: stretch;
  flex: 0 0 auto;
  gap: 7px;
  width: 100%;
  min-height: 39px;
  margin: 17px 0 0;
  padding: 14px 0 0;
  border: 0;
  border-top: 1px solid #eef1ed;
  border-radius: 0;
  background: none;
  color: #596b60;
  text-align: left;
}
.tracked-product-card .tracked-product-card__timing::before {
  /* The ring is a real CSS circle; the inner symbol is a centered SVG path.
     Font metrics can no longer offset the check/minus within the ring. */
  content: '';
  display: block;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  box-sizing: border-box;
  border: 1.4px solid currentColor;
  border-radius: 50%;
  color: #238358;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M4.1%208%20L6.65%2010.35%20L11.9%205.7%22%20fill%3D%22none%22%20stroke%3D%22%23238358%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 100% 100%;
}
/* Only excellent purchase timing uses a solid green check. Good remains outlined. */
.tracked-product-card .tracked-product-card__timing.is-down[data-purchase-timing-status="excellent"]::before {
  color: #fff;
  border-color: #168454;
  background-color: #168454;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M4.1%208%20L6.65%2010.35%20L11.9%205.7%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E');
}
.tracked-product-card .tracked-product-card__timing.is-up::before {
  color: #a45a4b;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M8%204.1%20V8.9%20M8%2011.35%20V11.55%22%20fill%3D%22none%22%20stroke%3D%22%23a45a4b%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E');
}
.tracked-product-card .tracked-product-card__timing.is-collecting::before {
  color: #808d85;
}
/* Normal price range: symmetric minus inside the same circle. */
.tracked-product-card .tracked-product-card__timing[data-purchase-timing-status="normal"]::before {
  color: #808d85;
  background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M4.65%208%20H11.35%22%20fill%3D%22none%22%20stroke%3D%22%23808d85%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E');
}

.tracked-product-card .tracked-product-card__timing-text,
.category-product-card .category-product-card__timing-text,
.tracked-product-card .tracked-product-card__timing.is-down .tracked-product-card__timing-text,
.tracked-product-card .tracked-product-card__timing.is-up .tracked-product-card__timing-text,
.tracked-product-card .tracked-product-card__timing.is-collecting .tracked-product-card__timing-text {
  display: block;
  min-width: 0;
  color: inherit;
  font-size: 12px;
  font-weight: 550;
  line-height: 1.4;
  letter-spacing: -.025em;
}
.tracked-product-card .tracked-product-card__timing.is-up { color: #97665b; }
.tracked-product-card .tracked-product-card__timing.is-down { color: #52685a; }
.tracked-product-card .tracked-product-card__timing.is-collecting { color: #68756e; }
.tracked-product-card .tracked-product-card__timing.is-empty { visibility: hidden; }

/* Uniform grid for categories and brand landing; home product rails remain scrollable. */
.category-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(235px, 100%), 1fr));
  gap: 20px;
  align-items: stretch;
  border-top: 0;
}
.category-product-grid > .home-price-drop-card,
.category-product-grid > .category-product-card { width: 100%; }
.category-product-grid .category-product-card { height: 100%; }
.category-loading-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(235px,100%), 1fr));
  gap: 20px;
  border: 0;
}
.category-loading-card {
  display: block;
  width: 100%;
  min-height: 335px;
  padding: 12px;
  border: 1px solid var(--dpg-card-line);
  border-radius: 19px;
}
.category-loading-card__image { width: 100%; height: auto; aspect-ratio: 1.12/1; border-radius: 12px; }
.category-loading-card__line { margin-top: 17px; }

/* Related products in product detail: preserve price-drop labels and ranking. */
.category-price-drop-card {
  display: flex;
  flex-direction: column;
  flex-basis: 270px;
  border-color: var(--dpg-card-line);
  border-radius: 19px;
  overflow: hidden;
  box-shadow: none;
}
.category-price-drop-card__rank { top: 20px; left: 20px; border-radius: 8px; }
.category-price-drop-card__image-link {
  aspect-ratio: 1.12/1;
  margin: 12px 12px 0;
  border: 0;
  border-radius: 12px;
  background: var(--dpg-card-image-bg);
}
.category-price-drop-card__image-link img { padding: 18px; mix-blend-mode: multiply; }
.category-price-drop-card__body { display: flex; flex-direction: column; flex: 1; padding: 22px 20px 20px; }
.category-price-drop-card__name { font-size: 15px; font-weight: 650; color: #252a26; }
.category-price-drop-card__price-row { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-top: auto; padding-top: 20px; }
.category-price-drop-card__price { font-size: 26px; font-weight: 800; color: var(--dpg-card-ink); }
.category-price-drop-card__rate { font-weight: 750; color: var(--dpg-card-green); }
.category-price-drop-card__change { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--dpg-card-line); }
.category-price-drop-card__trend { margin-top: 14px; color: #596b60; font-size: 12px; }

/* Top-ten ranking cards remain compact by design, but use the same surfaces and hierarchy. */
.home-top10-card__link {
  border: 1px solid var(--dpg-card-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.home-top10-card__image { border-radius: 11px; background: var(--dpg-card-image-bg); }
.home-top10-card__title { color: #292e29; font-weight: 650; }
.home-top10-card__price { color: var(--dpg-card-ink); font-weight: 790; }
.home-top10-card__amount,.home-top10-card__rate { color: var(--dpg-card-green); }
.home-top10-card__previous-price { color: #a3aaa5; }

/* Global search suggestions remain compact, but follow the same border, image and text system. */
.global-product-search__result { border-color: var(--dpg-card-line); border-radius: 12px; }
.global-product-search__thumb { border-radius: 10px; background: var(--dpg-card-image-bg); }
.global-product-search__result-info { color: var(--dpg-card-ink); }

/* My Dippingg cards are action-based rows, not purchase landing cards. */
.user-tracking-watch,
.user-tracking-result { border-color: var(--dpg-card-line); border-radius: 16px; background: #fff; box-shadow: none; }
.user-tracking-watch__image,
.user-tracking-result__image { border-radius: 11px; background: var(--dpg-card-image-bg); }
.user-tracking-watch__name,.user-tracking-result__name { color: #292e29; font-weight: 650; }
.user-tracking-watch__price,.user-tracking-result__price { color: var(--dpg-card-ink); font-weight: 780; }
.user-tracking-watch__previous-price { color: #a3aaa5; }
.user-tracking-watch__state-pill.is-drop { color: var(--dpg-card-green); }

@media (max-width: 930px) {
  .category-product-grid,.category-loading-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
}
@media (max-width: 700px) {
  .category-product-grid,.category-loading-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; border: 0; }
  .category-product-grid > .category-product-card { width: 100%; }
  .category-product-card .category-product-card__link {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    height: 100%;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--dpg-card-line);
    border-radius: 13px;
    box-shadow: none;
  }
  .tracked-product-card .tracked-product-card__visual,
  .category-product-card .category-product-card__visual {
    width: auto;
    height: auto;
    aspect-ratio: 1/1;
    margin: 7px 7px 0;
    padding: 0;
    border-radius: 9px;
    background: var(--dpg-card-image-bg);
  }
  .tracked-product-card .tracked-product-card__image,
  .category-product-card .category-product-card__image {
    width: 100%;
    height: 100%;
    aspect-ratio: auto;
    padding: 8px;
  }
  .tracked-product-card .tracked-product-card__score,
  .category-product-card .tracked-product-card__score {
    top: 14px;
    left: 14px;
    min-width: 41px;
    min-height: 38px;
    padding: 5px 7px;
    border-radius: 8px;
  }
  .tracked-product-card .tracked-product-card__score-label { font-size: 7px; }
  .tracked-product-card .tracked-product-card__score-value { font-size: 14px; }
  .tracked-product-card .tracked-product-card__body,
  .home-section .tracked-product-card .tracked-product-card__body,
  .category-product-card .category-product-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
    min-width: 0;
    padding: 14px 12px 16px;
  }
  .tracked-product-card .tracked-product-card__title,
  .home-section .tracked-product-card .tracked-product-card__title,
  .category-product-card .category-product-card__title {
    min-height: 42px;
    margin: 0 0 17px;
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.55;
  }
  .tracked-product-card .tracked-product-card__price-wrap,
  .home-section .tracked-product-card .tracked-product-card__price-wrap,
  .category-product-card .category-product-card__price-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
    min-width: 0;
    margin: auto 0 0;
  }
  .tracked-product-card .tracked-product-card__previous,
  .home-section .tracked-product-card .tracked-product-card__previous,
  .category-product-card .category-product-card__previous { order: 0; font-size: 11px; }
  .tracked-product-card .tracked-product-card__current,
  .home-section .tracked-product-card .tracked-product-card__current,
  .category-product-card .category-product-card__current { order: 1; font-size: clamp(19px,5.2vw,27px); font-weight: 800; }
  .tracked-product-card .tracked-product-card__change-summary,
  .category-product-card .category-product-card__change-summary {
    display: flex;
    align-items: center;
    align-self: stretch;
    flex-wrap: wrap;
    gap: 4px;
    margin: 7px 0 0;
    padding: 0;
    border: 0;
    font-size: 11px;
    line-height: 1.4;
  }
  .tracked-product-card .dpg-card__change-rate { font-size: 13px; }
  .tracked-product-card .dpg-card__change-divider { height: 11px; }
  .tracked-product-card .tracked-product-card__timing,
  .category-product-card .category-product-card__timing {
    display: flex;
    align-self: stretch;
    align-items: flex-start;
    width: 100%;
    min-height: 34px;
    margin: 13px 0 0;
    padding: 12px 0 0;
    border: 0;
    border-top: 1px solid #eef1ed;
    border-radius: 0;
    background: none;
    text-align: left;
  }
  .tracked-product-card .tracked-product-card__timing::before { width: 13px; height: 13px; flex-basis: 13px; }
  .tracked-product-card .tracked-product-card__timing-text,
  .category-product-card .category-product-card__timing-text { font-size: 10px; line-height: 1.4; font-weight: 550; }
  .category-loading-card { display: block; min-height: 225px; padding: 7px; border-radius: 13px; }
  .category-loading-card__image { width: 100%; height: auto; aspect-ratio: 1/1; border-radius: 9px; }
  .category-loading-card__line { margin-top: 12px; }
  /* Home sections still deliberately use horizontal rails on small screens. */
  .home-hot-deals-grid,.home-product-rail { grid-auto-columns: min(270px, 76vw); }
  .home-category-tab-panel .home-category-product-card { width: auto; }
}
@media (max-width: 380px) {
  .category-product-grid,.category-loading-grid { grid-template-columns: 1fr; gap: 12px; }
  .category-product-card .category-product-card__title { font-size: 15px; }
  .category-product-card .category-product-card__current { font-size: 29px; }
  .category-product-card .category-product-card__change-summary { font-size: 12px; }
  .category-product-card .category-product-card__timing-text { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .tracked-product-card .tracked-product-card__link,
  .category-product-card .category-product-card__link,
  .home-top10-card__link { transition: none; }
  
}

/* Cross-page specificity fixes: legacy category layout aligned the entire price
   column to the right, and legacy mobile styles painted a green timing banner. */
.tracked-product-card .tracked-product-card__body,
.home-section .tracked-product-card .tracked-product-card__body,
.category-product-card .category-product-card__body { align-items: stretch; }
.category-product-card .category-product-card__timing,
.category-product-card .category-product-card__timing.is-down,
.category-product-card .category-product-card__timing.is-up,
.category-product-card .category-product-card__timing.is-stable,
.category-product-card .category-product-card__timing.is-collecting {
  display: flex;
  background: transparent;
  border-top: 1px solid #eef1ed;
  border-radius: 0;
  padding: 14px 0 0;
}
.category-product-card .category-product-card__timing.is-down .category-product-card__timing-text,
.category-product-card .category-product-card__timing.is-up .category-product-card__timing-text,
.category-product-card .category-product-card__timing.is-stable .category-product-card__timing-text,
.category-product-card .category-product-card__timing.is-collecting .category-product-card__timing-text {
  color: inherit;
  font-size: 12px;
  font-weight: 550;
}
@media (max-width: 700px) {
  .category-product-card .category-product-card__timing,
  .category-product-card .category-product-card__timing.is-down,
  .category-product-card .category-product-card__timing.is-up,
  .category-product-card .category-product-card__timing.is-stable,
  .category-product-card .category-product-card__timing.is-collecting {
    display: flex;
    margin: 13px 0 0;
    padding: 12px 0 0;
    border-top: 1px solid #eef1ed;
    background: transparent;
  }
  .category-product-card .category-product-card__timing.is-down .category-product-card__timing-text,
  .category-product-card .category-product-card__timing.is-up .category-product-card__timing-text,
  .category-product-card .category-product-card__timing.is-stable .category-product-card__timing-text,
  .category-product-card .category-product-card__timing.is-collecting .category-product-card__timing-text {
    font-size: 10px;
  }
}

/* v34: All public product-card media surfaces are clean white, including fallback
   images and small result/ranking tiles. Loading shimmer is unaffected. */
.home-category-product-card .product-card__image,
.home-hot-deal-card .product-card__image,
.home-price-drop-card__visual,
.tracked-product-card .tracked-product-card__visual,
.category-product-card .category-product-card__visual,
.tracked-product-card .tracked-product-card__image,
.category-product-card .category-product-card__image,
.category-price-drop-card__image-link,
.home-top10-card__image,
.global-product-search__thumb,
.user-tracking-watch__image,
.user-tracking-result__image {
  background-color: #fff;
}