/**
 * Remaps next-core.css onto the shared brand tokens.
 *
 * next-core.css is a 16k-line vendor stylesheet, so its `--brand--color--*`
 * variables are overridden here rather than edited in place. Must load AFTER
 * next-core.css. Colour values belong in css/brand.css, not here.
 *
 * Applies to checkout, upsell and receipt; the landing page is aliased in
 * css/landing/tokens.css instead.
 */
:root,
body {
  --_text---font-family--primary: Poppins, sans-serif;
  --_text---font-family--heading: Poppins, sans-serif;
}

:root {
  /* Core surfaces and text */
  --brand--color--background: var(--ova9-surface);
  --brand--color--surface: var(--ova9-surface-alt);
  --brand--color--foreground: var(--ova9-text);
  --brand--color--border: var(--ova9-border);

  /* Accent */
  --brand--color--primary: var(--ova9-primary);
  --brand--color--primary-dark: var(--ova9-cta);
  --brand--color--primary-light: var(--ova9-primary-tint);
  --brand--color--primary-foreground: var(--ova9-primary-foreground);

  /* Buy button */
  --brand--color--cta-primary: var(--ova9-cta);

  /* Text ramp */
  --brand--color--text-secondary: var(--ova9-text-muted);
  --brand--color--text-muted: var(--ova9-text-muted);
  --brand--color--text-inverse: var(--ova9-text-inverse);

  /* Star ratings */
  --brand--color--rating-star: var(--ova9-star);

  /* Bundle badge pills: "Most Popular" uses primary, "Best Value" uses secondary */
  --brand--color--pill-primary: var(--ova9-badge-popular);
  --brand--color--pill-primary-surface: var(--ova9-badge-popular-surface);
  --brand--color--pill-secondary: var(--ova9-badge-value);
  --brand--color--pill-secondary-surface: var(--ova9-badge-value-surface);

  /* Semantic */
  --system-colors--success: var(--ova9-success);
}

.icon-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.checkout-header {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.checkout-header .checkout-header__inner,
.checkout-header .checkout-header__inner--center {
  padding-top: 0;
  padding-bottom: 0;
}

.checkout-header .brand-logo,
.upsell-header-bar .brand-logo {
  width: 64px;
  height: auto;
}

.hero_review-box .review_component,
.hero_review-box .review_component.cc-sm {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.02px;
  line-height: 1;
  text-transform: none;
}

@media screen and (max-width: 991px) {
  .checkout-header {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .checkout-header__inner,
  .checkout-header__inner--center {
    padding-top: 0;
    padding-bottom: 0;
  }
}

@media screen and (max-width: 767px) {
  .checkout-header {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
  }

  .checkout-header__inner--center {
    padding-bottom: 0;
  }

  .checkout-header .brand-logo {
    width: 48px;
  }

  .checkout-media__wrapper {
    width: 100%;
    min-width: 0;
  }
}

.cart-item [data-ova9-compare-line] {
  display: block;
}

/* Shop checkout: selected payment method is a light gray, not the brand pink. */
.checkout--shop .payment-method.next-selected {
  background-color: #f6f6f7;
}

.checkout--shop .payment-method:not(.next-selected) {
  background-color: #fff;
}