/* Color selector (kept separate from the Webflow export) */

.model-colors {
  flex-direction: column;
  grid-row-gap: 10px;
}

.color-swatches {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 3px;
}

.color-option {
  position: relative;
  display: block;
  margin: 0;
  padding: 4px;
  border-radius: 50%;
  cursor: pointer;
}

.color-option .color {
  display: block;
  cursor: pointer;
}

/* Visually hidden but still focusable for keyboard and screen readers */
.color-input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
}

.color-input:checked + .color {
  box-shadow: inset 0 2px 5px #0000001a, 0 0 0 3px #fff, 0 0 0 5px #0071e3;
}

.color-input:focus-visible + .color {
  outline: 2px solid #0071e3;
  outline-offset: 6px;
}

.color-name {
  min-height: 1.4em;
  text-align: center;
  font-size: 11px;
}