/* Grid */
.ods-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
}

/* Reset any theme borders/backgrounds on the card and link */
.ods-item { border: none !important; background: transparent !important; }
.dimension-link { border: none !important; background: transparent !important; display:block; width:100%; color: inherit; text-decoration:none; outline: none; }
.dimension-link:hover, .dimension-link:focus, .dimension-link:active { color: inherit !important; text-decoration: none !important; }

/* Keep images clean from external styles */
.dimension-thumbnail img { border: none !important; outline: none !important; box-shadow: none !important; display:block; width:100%; height:auto; }

/* Thumbnail box with our controlled border */
.dimension-thumbnail {
  width: 95%;
  max-width: 150px;
  margin: 0 auto 8px;
  overflow: hidden;
  transition: transform 0.25s ease-in-out;
  will-change: transform;
  border: 2px solid transparent; /* baseline */
  box-sizing: border-box;
}

/* Hover (scale only) */
.dimension-link:hover .dimension-thumbnail,
.dimension-link:focus-visible .dimension-thumbnail { transform: scale(1.05); }

/* Selected border (2px black) */
.ods-selected .dimension-thumbnail { border-color: #000 !important; }

/* Labels & price */
.dimension-label { display:block; font-size:0.95rem; line-height:1.3; margin:4px 0 2px; font-weight:700; }
.dimension-price { display:block; font-size:0.9rem; line-height:1.2; font-weight:700; margin-top:6px; margin-bottom:0; }

/* Separators and title */
.ods-sep { border:0; border-top:1px solid #ddd; margin:6px 0 8px; }
.ods-title { font-size:0.95rem; font-weight:700; margin:2px 0 8px; line-height:1.2; }

/* PitchPrint slot (hidden for now) */
.ods-pp-slot{ display:none; }

/* Reduced motion */
@media (prefers-reduced-motion: reduce) { .dimension-thumbnail { transition: none; } }

/* Visually hide native dimension select wrapper (will be added by JS) */
.ods-dimension-hidden {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

/* v1.2.9 UI tweak: center texts and reduce gap */
.dimension-label,
.dimension-price{
  display:block;
  text-align:center;
}