.aspro_photoags__item {
  display: none;
}
.aspro_photoags__item__tag {
  width: 20px;
  height: 20px;
  cursor: pointer;
  position: absolute;
  transform: translate(-10px, -10px);
  left: 50%;
  top: 50%;
  touch-action: none;
  background-color: rgba(34, 34, 40, 0.48);
  border-radius: 50%;
}
.aspro_photoags__item__tag.animate {
  animation: aspro_photoags__item__tag_loadings 1s linear infinite alternate;
}
.aspro_photoags__item__tag:before {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  transition: border-width 0.2s ease-in, width 0.3s, height 0.3s;
  background-color: transparent;
  width: 12px;
  height: 12px;
  box-sizing: border-box;
  border: 3px solid #fff;
}
.aspro_photoags__item__tag:is(:hover, .aspro_photoags__item__tag--selected):before {
  width: 12px;
  height: 12px;
  border-width: 6px;
}
.aspro_photoags__item__tag--product:before {
  width: 6px;
  height: 6px;
  background-color: #fff;
}
.aspro_photoags__item__tag--hidden {
  visibility: hidden;
}

/* popover tag product */
.xpopover:has(.item_tag) {
  --xpopover-pt: 0;
  --xpopover-pb: 0;
  --xpopover-width: 184px;
}
.xpopover .xpopover-content:has(.item_tag) {
  --xpopover-content-pi: 0;
  --xpopover-content-pb: 0;
}
.xpopover:has(.item_tag) > .scrollbar {
  max-height: calc(min(100vh, 400px) - var(--xpopover-pt) - var(--xpopover-pb));
}
@media (max-width: 380px) or ((max-width: 760px) and (min-resolution: 2dppx)) {
  .xpopover:has(.item_tag) > .scrollbar {
    max-height: calc(100vh - var(--xpopover-pt) - var(--xpopover-pb));
  }
}

@keyframes aspro_photoags__item__tag_loadings {
  from {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}