.avpwc {
  margin-top: 0.75em;
}

.avpwc__options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  margin-bottom: 0.6em;
}

.avpwc__pill {
  border: 1px solid currentColor;
  background: transparent;
  padding: 0.4em 0.7em;
  border-radius: 999px;
  cursor: pointer;
  line-height: 1.2;
}

.avpwc__pill.is-selected {
  background: var(--avpwc-pill-selected-bg, rgba(0, 0, 0, 0.08));
}

.avpwc__pill:focus-visible,
.avpwc__atc:focus-visible,
.avpwc__select:focus-visible,
.avpwc__qty-input:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.avpwc__options--dropdown .avpwc__select {
  width: 100%;
  max-width: 100%;
}

.avpwc__qty {
  margin-bottom: 0.6em;
}

.avpwc__qty-input {
  width: 5em;
}

.avpwc__atc.is-loading {
  opacity: 0.75;
  pointer-events: none;
}

.avpwc__msg {
  margin-top: 0.5em;
  font-size: 0.92em;
}

.avpwc__msg.is-error {
  color: var(--avpwc-error-color, #b32d2e);
}

.avpwc__msg.is-success {
  color: var(--avpwc-success-color, #1f7a1f);
}

@media (max-width: 640px) {
  .avpwc__pill {
    min-height: 40px;
    padding-inline: 0.9em;
  }

  .avpwc__atc {
    width: 100%;
  }
}
