/* Storefront UI tokens. Enable the Christmas palette on the document root
   with <html lang="en" data-pm-theme="christmas"> during the campaign. */
:root {
  --pm-berry: #781B3A;
  --pm-ribbon-pink: #BE5575;
  --pm-blush: #F7E7EA;
  --pm-paper: #FFF8F4;
  --pm-ink: #2D2228;
  --pm-muted: #625359;
  --pm-line: #DACBC6;

  --pm-evergreen: #294034;
  --pm-parchment: #F6ECD7;
  --pm-kraft: #D4A972;
  --pm-rouge: #AC3B31;

  --pm-surface: var(--pm-paper);
  --pm-card: #FFFFFF;
  --pm-text: var(--pm-ink);
  --pm-heading: var(--pm-berry);
  --pm-primary: var(--pm-berry);
  --pm-primary-hover: #5B142C;
  --pm-on-primary: var(--pm-paper);
  --pm-focus-light: var(--pm-berry);
  --pm-focus-dark: var(--pm-parchment);
  --pm-hero-surface: var(--pm-blush);
  --pm-hero-text: var(--pm-berry);
  --pm-hero-art: var(--pm-berry);
  --pm-on-hero-art: var(--pm-paper);
  --pm-parcel-backdrop: var(--pm-blush);

  --pm-font-display: system-ui, -apple-system, "Segoe UI", sans-serif;
  --pm-font-caption: Oswald, "Arial Narrow", Arial, sans-serif;
  --pm-font-body: system-ui, -apple-system, "Segoe UI", sans-serif;
  --pm-weight-display: 750;
  --pm-radius-button: 7px;
  --pm-radius-card: 14px;
}

:root[data-pm-theme="christmas"] {
  --pm-hero-surface: var(--pm-parchment);
  --pm-hero-text: var(--pm-evergreen);
  --pm-hero-art: var(--pm-evergreen);
  --pm-on-hero-art: var(--pm-parchment);
  --pm-parcel-backdrop: var(--pm-kraft);
}