/* =========================
   Buttons (Core)
========================= */

.button,
.wp-element-button,
button,
input[type="submit"] {
  -webkit-appearance: none;
  appearance: none;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;

  padding: .65rem 1rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;

  border-radius: 999px;
  border: 1px solid var(--vcom-primary);
  background: var(--vcom-primary);
  color: var(--vcom-text-inverted);

  transition:
    background .2s ease,
    border-color .2s ease,
    transform .05s ease;
}

/* Hover / active */
.button:hover,
.wp-element-button:hover,
button:hover,
input[type="submit"]:hover {
  background: var(--vcom-primary-hover);
  border-color: var(--vcom-primary-hover);
  text-decoration: none;
}

.button:active {
  transform: translateY(1px);
}

.button:disabled,
.button[disabled] {
  opacity: .6;
  cursor: not-allowed;
}

/* =========================
   Variants
========================= */

.button--secondary,
.button.alt {
  background: var(--vcom-bg);
  color: var(--vcom-primary);
  border-color: var(--vcom-primary);
}

.button--secondary:hover,
.button.alt:hover {
  background: var(--vcom-primary-soft);
}

.button--danger {
  background: var(--vcom-danger);
  border-color: var(--vcom-danger);
  color: var(--vcom-text-inverted);
}

.button--light {
  background: var(--vcom-bg);
  color: var(--vcom-text);
  border-color: var(--vcom-border);
}

/* =========================
   Sizes
========================= */

.button--sm {
  padding: .5rem .8rem;
  font-size: .9rem;
}

.button--lg {
  padding: .8rem 1.2rem;
  font-size: 1rem;
}

/* =========================
   Icon buttons
========================= */

.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 40px;
  height: 40px;

  border-radius: 999px;
  border: 1px solid var(--vcom-border);
  background: var(--vcom-bg);
}

/* =========================
   Product card buttons
========================= */

.vcom-product-card__actions .button {
  width: 100%;
  justify-content: center;
}

.vcom-product-card__actions .button {
  padding: .7rem 1rem;
  border-radius: 10px;
  font-weight: 600;
}

.vcom-product-card__actions .add_to_cart_button,
.vcom-product-card__actions .product_type_variable,
.vcom-product-card__actions .product_type_grouped,
.vcom-product-card__actions .product_type_external {
  display: inline-flex;
}

/* ==========================================
   ADD TO CART – ADDED STATE
========================================== */

.add_to_cart_button.is-added,
.single_add_to_cart_button.is-added {
  background: var(--vcom-success, #1f9d55) !important;
  color: #fff !important;
  pointer-events: none;
  transition: all .25s ease;
}

.add_to_cart_button.is-added {
  box-shadow: 0 0 0 3px rgba(31,157,85,.2);
}