/**
 * Checkout Consent component styles
 * (components/checkout-consent/checkout-consent.js).
 *
 * Legal / Privacy / Cookies + Purchase Consent sprint. A compact,
 * calm card -- matches this project's pricing-card visual language
 * (pages/home-page/home-page.css's `.sr-home-plan`) without literally
 * reusing that class, since this is a distinct, reusable component of
 * its own. Uses the canonical design tokens throughout.
 */

.sr-checkout-consent {
  max-width: 32rem;
  margin: var(--space-xl) auto;
  padding: var(--space-xl);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-large);
  font-family: var(--font-family-body);
  color: var(--color-text-primary);
}

.sr-checkout-consent__heading {
  font-family: var(--font-family-display);
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--color-text-primary);
  margin: 0 0 var(--space-xs);
}

.sr-checkout-consent__supporting {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--color-text-secondary);
  margin: 0 0 var(--space-l);
}

.sr-checkout-consent__price {
  font-family: var(--font-family-display);
  font-size: 2.25rem;
  color: var(--color-primary);
  line-height: 1;
}

.sr-checkout-consent__price sup {
  font-size: 1.125rem;
  margin-right: var(--space-xs);
  top: -0.9em;
}

.sr-checkout-consent__price-note {
  color: var(--color-muted);
  font-size: 0.875rem;
  margin: var(--space-xs) 0 var(--space-l);
}

.sr-checkout-consent__block {
  padding: var(--space-l) 0;
  border-top: 1px solid var(--color-border);
}

.sr-checkout-consent__checkbox-row {
  display: flex;
  align-items: flex-start;
  gap: var(--space-s);
  cursor: pointer;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--color-text-secondary);
}

.sr-checkout-consent__checkbox {
  flex-shrink: 0;
  margin-top: 0.2em;
  width: 18px;
  height: 18px;
  accent-color: var(--color-primary);
  cursor: pointer;
}

.sr-checkout-consent__links {
  margin-top: var(--space-m);
  font-size: 0.8125rem;
}

.sr-checkout-consent__links a {
  color: var(--color-muted);
  text-decoration: underline;
}

.sr-checkout-consent__links a:hover,
.sr-checkout-consent__links a:focus-visible {
  color: var(--color-primary);
}

.sr-checkout-consent__premium-clarification {
  margin: var(--space-m) 0 0;
  color: var(--color-muted);
  font-size: 0.8125rem;
  line-height: 1.5;
}

.sr-checkout-consent__actions {
  display: flex;
  align-items: center;
  gap: var(--space-m);
  margin-top: var(--space-l);
}

.sr-checkout-consent__continue {
  padding: var(--space-m) var(--space-xl);
  border-radius: 999px;
  border: none;
  background: var(--color-primary);
  color: #fff;
  font-weight: 600;
  cursor: pointer;
}

.sr-checkout-consent__continue:hover:not(:disabled) {
  background: var(--color-primary-hover);
}

.sr-checkout-consent__continue:disabled {
  background: var(--color-border);
  color: var(--color-muted);
  cursor: not-allowed;
}

.sr-checkout-consent__cancel {
  padding: var(--space-m) var(--space-l);
  border-radius: 999px;
  border: none;
  background: none;
  color: var(--color-muted);
  cursor: pointer;
}

.sr-checkout-consent__cancel:hover,
.sr-checkout-consent__cancel:focus-visible {
  color: var(--color-text-primary);
  text-decoration: underline;
}