.skpg-variations{margin-top:18px}
.skpg-variations .skpg-title-first{display:block!important;margin:0 0 12px 0!important;padding:0!important}
.skpg-variations .skpg-title-first-label,
.skpg-variations .skpg-title-first > span:first-child{display:block!important;margin:0 0 4px 0!important;padding:0!important;font-size:14px!important;line-height:1.25!important;font-weight:600!important;color:#5a5a5a!important}
.skpg-variations .skpg-title-first-value,
.skpg-variations .skpg-title-first > span:last-child{display:block!important;margin:0!important;padding:0!important;font-size:15px!important;line-height:1.35!important;font-weight:500!important;color:#343434!important}
.skpg-variations .skpg-title-second{display:block!important;margin:0 0 10px 0!important;padding:0!important;font-size:14px!important;line-height:1.25!important;font-weight:600!important;color:#5a5a5a!important}

.skpg-variations .variation-colors{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:flex-start!important;
  gap:14px 16px!important;
  margin:0 0 20px 0!important;
  padding:0!important;
}
.skpg-variations .variation-color{
  position:relative!important;
  display:block!important;
  flex:0 0 40px!important;
  width:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  height:40px!important;
  min-height:40px!important;
  max-height:40px!important;
  aspect-ratio:1 / 1!important;
  box-sizing:border-box!important;
  border-radius:50%!important;
  border:2px solid #ececec!important;
  margin:0!important;
  overflow:visible!important;
  cursor:pointer!important;
  background-position:center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  box-shadow:0 1px 4px rgba(0,0,0,.06)!important;
  transition:border-color .18s ease, box-shadow .18s ease, transform .18s ease!important;
}
.skpg-variations .variation-color::after{content:none!important}
.skpg-variations .variation-color:hover{transform:translateY(-1px)!important}
.skpg-variations .variation-color.selected{
  border-color:#2f2f2f!important;
  box-shadow:0 0 0 3px #ff5966!important;
}
.skpg-variations .skpg-second-options{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:12px!important;
  margin:0 0 16px 0!important;
  padding:0!important;
}
.skpg-variations .variation-volume{
  margin:0!important;
  min-height:44px!important;
  padding:10px 18px!important;
  border-radius:10px!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:500!important;
  box-shadow:none!important;
}
.skpg-hide-first .skpg-first-options,
.skpg-hide-first .skpg-title-first{display:none!important}


/* Override old theme rule: body.single-product .variation-color { margin: 0 12px 0 0 !important; } */
body.single-product .skpg-variations .variation-color {
  margin: 0 !important;
}


/* Title layout like reference: label on first line, value on second line */
.skpg-variations .skpg-title-first{display:block!important;margin:0 0 12px 0!important;padding:0!important;line-height:1!important}
.skpg-variations .skpg-title-first > span{display:block!important}
.skpg-variations .skpg-title-first > span:first-child{margin:0 0 4px 0!important;padding:0!important;font-size:14px!important;line-height:1.25!important;font-weight:600!important;color:#5a5a5a!important}
.skpg-variations .skpg-title-first > span:last-child{margin:0!important;padding:0!important;font-size:15px!important;line-height:1.35!important;font-weight:500!important;color:#343434!important}