/* Product page photo gallery: a main image plus clickable thumbnails.
   Markup: .pdp-gallery[data-pdp-gallery] > .pdp-main-image > img[data-gallery-main]
           + .pdp-gallery-thumbs > button.pdp-gallery-thumb[data-src][data-alt] > img
   Wired by /js/pdp-gallery.js. */
.pdp-gallery-thumbs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.pdp-gallery-thumb {
  height: 66px;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
}
.pdp-gallery-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 6px; }
.pdp-gallery-thumb:hover { transform: translateY(-2px); border-color: rgba(0, 201, 167, 0.45); }
.pdp-gallery-thumb:focus-visible { outline: 2px solid #00c9a7; outline-offset: 2px; }
.pdp-gallery-thumb.is-active { border-color: #00c9a7; background: rgba(0, 201, 167, 0.1); }
/* Diagrams and charts are drawn on light or dark plates; don't shadow them like a cut-out product. */
.pdp-main-image img.is-flat { filter: none; border-radius: 12px; }

/* Full-width figure in the page body (spectrum charts, wiring diagrams). */
.pdp-figure { margin: 8px 0 36px; }
.pdp-figure h2 { margin-bottom: 14px; }
.pdp-figure-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; }
.pdp-figure img { width: 100%; height: auto; display: block; border-radius: 12px; }
.pdp-figure figcaption { margin-top: 8px; font-size: 13px; color: rgba(255, 255, 255, 0.55); }
.pdp-figure.is-light img { background: #fff; padding: 12px; }

@media (prefers-reduced-motion: reduce) {
  .pdp-gallery-thumb, .pdp-gallery-thumb:hover { transition: none; transform: none; }
}
