.veratys-cart-goal {
  --veratys-cart-goal-accent: #218838;
  --veratys-cart-goal-background: #f2f8f3;
  --veratys-cart-goal-border: #cfe5d3;
  --veratys-cart-goal-text: #183c22;
  align-items: center;
  background: var(--veratys-cart-goal-background);
  border: 1px solid var(--veratys-cart-goal-border);
  border-radius: 0.5rem;
  color: var(--veratys-cart-goal-text);
  display: flex;
  gap: 0.75rem;
  margin-block: 1rem;
  padding: 0.875rem 1rem;
}

.veratys-cart-goal[hidden] {
  display: none;
}

.veratys-cart-goal--neutral {
  --veratys-cart-goal-accent: #495057;
  --veratys-cart-goal-background: #f8f9fa;
  --veratys-cart-goal-border: #dee2e6;
  --veratys-cart-goal-text: #212529;
}

.veratys-cart-goal--contrast {
  --veratys-cart-goal-accent: #ffdd00;
  --veratys-cart-goal-background: #111;
  --veratys-cart-goal-border: #fff;
  --veratys-cart-goal-text: #fff;
}

.veratys-cart-goal--reached {
  --veratys-cart-goal-accent: #157347;
}

.veratys-cart-goal__logo {
  flex: 0 0 auto;
  height: 3rem;
  object-fit: contain;
  width: 3rem;
}

.veratys-cart-goal__content {
  flex: 1 1 auto;
  min-width: 0;
}

.veratys-cart-goal__message {
  color: inherit;
  font-size: 0.9375rem;
  font-weight: 600;
  margin: 0 0 0.5rem;
}

.veratys-cart-goal__progress {
  appearance: none;
  background: #d9dee2;
  border: 0;
  border-radius: 999px;
  display: block;
  height: 0.625rem;
  overflow: hidden;
  width: 100%;
}

.veratys-cart-goal__progress::-webkit-progress-bar {
  background: #d9dee2;
  border-radius: 999px;
}

.veratys-cart-goal__progress::-webkit-progress-value {
  background: var(--veratys-cart-goal-accent);
  border-radius: 999px;
  transition: width 180ms ease;
}

.veratys-cart-goal__progress::-moz-progress-bar {
  background: var(--veratys-cart-goal-accent);
  border-radius: 999px;
  transition: width 180ms ease;
}

@media (max-width: 575.98px) {
  .veratys-cart-goal {
    align-items: flex-start;
    padding: 0.75rem;
  }

  .veratys-cart-goal__logo {
    height: 2.5rem;
    width: 2.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .veratys-cart-goal__progress::-webkit-progress-value,
  .veratys-cart-goal__progress::-moz-progress-bar {
    transition: none;
  }
}
