/* Product pages: maps the --product-* palette that meet.css or platform.css defines onto
   Material's variables (see the layering note in colors.css). :root:root outranks
   colors.css's :root, and the !importants outrank Material's own unlayered declarations. */

:root:root {
  --md-primary-fg-color: var(--product-primary-color) !important;
  --md-primary-fg-color--light: var(--product-primary-color-light) !important;
  --md-primary-fg-color--dark: var(--product-primary-color) !important;
  --md-primary-bg-color: rgb(255, 255, 255) !important;
  --md-primary-bg-color--dark: var(--product-primary-color) !important;
  --md-accent-fg-color: rgba(var(--product-primary-color-rgb), 0.8) !important;
  --md-accent-fg-color--transparent: var(--ov-grey-muted) !important;
  --md-accent-bg-color: rgb(255, 255, 255) !important;
  --md-accent-bg-color--light: rgb(255, 255, 255) !important;

  --gradient: conic-gradient(
    from 60deg at 50% 50%,
    var(--md-primary-fg-color--light) 0%,
    var(--md-primary-fg-color--light) 13%,
    var(--md-primary-fg-color--light) 61%,
    var(--md-primary-fg-color--light) 99%
  ) !important;

  --plyr-color-main: var(--product-primary-color-light);
}

[data-md-color-scheme="slate"] {
  --md-default-bg-color: hsla(var(--md-hue), 15%, 14%, 1);
}

[data-md-color-scheme="default"] {
  --product-body-color-dark: #f5f5f5;
}
