/**
 * Do not edit directly, this file was auto-generated.
 * See <PARAGON_ROOT>/tokens/README.md for more details.
 */

:root {
  --pgn-size-btn-focus-width: 2px;
  --pgn-size-input-btn-focus-width: 1px;
  --pgn-spacing-input-btn-padding-y: 0.5625rem;
  --pgn-color-white: #FFFFFFFF; /** White color. */
  --pgn-color-black: #000000FF; /** Black color. */
  --pgn-rg-size-course-card-image-horizontal-width-max: 360px;
  --pgn-rg-size-footer-logo-height: 58px; /** The height of the logo in the footer. */
  --pgn-rg-size-header-logo-desktop-height: 65px; /** The height of the logo in the header. */
  --pgn-rg-size-header-logo-mobile-height: 65px; /** The height of the logo in the header for mobile devices. */
  --pgn-rg-size-container: 1230px; /** The width of the container. */
  --pgn-rg-color-course-card-hover: #525252FF;
  --pgn-rg-color-footer-links-social: #9C81EAFF; /** The color of social links in the footer. */
  --pgn-rg-color-footer-links-nav: #9C81EAFF; /** The color of navigation links in the footer. */
  --pgn-rg-color-footer-links-nav-hover: #E1D8F9FF; /** The color of navigation links hover in the footer. */
  --pgn-rg-color-header-hover-links-nav: #333333FF; /** The hover state color for navigation links in the header. */
  --pgn-rg-color-header-border-top-color: #CCCCCCFF; /** The color for border top in the header. */
  --pgn-rg-color-header-border-color: #E7E7E7FF; /** The color for border in the header. */
  --pgn-rg-color-registration-side-left-bg: #F2F5F8FF; /** The background color of left side of the registration page. */
  --pgn-rg-color-registration-honor-code: #222222FF; /** The text color of the mandatory legal consent text on the registration page. */
  --pgn-rg-color-primary: #5033A0FF; /** The primary color. */
  --pgn-rg-color-body-bg: #FFFFFFFF; /** Body background color. */
  --pgn-rg-color-danger: #CB0000FF; /** Danger text color. */
  --pgn-rg-color-success: #009154FF; /** Success text color. */
  --pgn-rg-color-warning: #E7AA0DFF; /** Warning text color. */
  --pgn-rg-spacing-header-vertical-padding: 28px; /** The vertical padding of the header. */
  --pgn-rg-spacing-promo-title-margin: 0; /** Bottom margin from H1 title on banner */
  --pgn-rg-typography-font-family-sans-serif: Inter, 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; /** Sans-serif font family. */
  --pgn-rg-home-section-bg-dark: #F5F5F5FF; /** The section dark background color on the homepage. */
  --pgn-rg-home-section-color: #3F3F3FFF; /** The section color on the homepage. */
  --pgn-rg-login-message-background-color: #FFE792FF; /** The background color of the login message. */
  --pgn-rg-login-message-text-color: #9F7C00FF; /** The text color of the login message. */
  --pgn-rg-login-message-text-hover: #6C5400FF; /** The text color hover of the login message. */
  --pgn-rg-button-border-radius: 30px;
  --pgn-rg-button-sso-border-color: #E2E8F0FF; /** The border color code for authn sso links buttons. */
  --pgn-rg-button-sso-hover-background-color: #F0F4F5FF; /** The background color code on hover for authn sso links buttons. */
  --pgn-rg-button-sso-hover-border-color: #092E43FF; /** The border color code on hover for authn sso links buttons. */
  --pgn-rgg-main-text-color: #BCBCBCFF; /** The RGG main text color. */
  --pgn-rgg-secondary-text-color: #333333FF; /** The RGG secondary text color. */
  --pgn-rgg-avatar-position-color: #FFFFFFFF; /** RGG avatar position color. */
  --pgn-rgg-avatar-position-accent-color: #BACBD5FF; /** RGG avatar position accent color. */
  --pgn-rgg-avatar-border-color: #707070FF; /** RGG avatar position border color. */
  --pgn-rgg-avatar-image-bg-gray-color: #CDE4FCFF; /** From RGG chart avatar image background gray color */
  --pgn-rgg-avatar-letter-bg-gray-color: #303030FF; /** From RGG chart avatar letter background gray color */
  --pgn-rgg-btn-logo-dropdown-base-color: #313131FF; /** RGG button logo dropdown base color. */
  --pgn-rgg-quaternary-color: #00ABD9FF; /** From RGG chart quaternary color */
  --pgn-rgg-neutral-gray-color: #BCBCBCFF; /** From RGG chart neutral gray color */
  --pgn-rgg-muted-gray-color: #AAAAAAFF; /** From RGG chart muted gray color */
  --pgn-rgg-medium-gray-color: #6C6D6EFF; /** From RGG chart medium gray color */
  --pgn-rgg-success-green-color: #419E4DFF; /** From RGG chart success green color */
  --pgn-rgg-sky-blue-color: #4599C3FF; /** From RGG chart sky blue color */
  --pgn-rgg-warning-yellow-color: #FFCD00FF; /** From RGG chart warning yellow color */
  --pgn-rgg-orange-accent-color: #E87722FF; /** From RGG chart orange accent color */
  --pgn-rgg-aqua-blue-color: #00B5E2FF; /** From RGG chart aqua blue color */
  --pgn-rgg-purple-accent-color: #6244BBFF; /** From RGG chart purple accent color */
  --pgn-rgg-dark-gray-color: #888B8DFF; /** From RGG chart dark gray color */
  --pgn-rgg-error-red-color: #FF0000FF; /** From RGG chart error red color */
  --pgn-rgg-light-color: #FAFAFAFF; /** From RGG chart light color */
  --pgn-rgg-light-gray-color: #DFE0E8FF; /** From RGG chart light gray color */
  --pgn-rgg-olive-green-color: #556B2FFF; /** From RGG chart olive green color */
  --pgn-rgg-gold-color: #F8B805FF; /** From RGG chart gold color */
  --pgn-rgg-silver-color: #AFBAC7FF; /** From RGG chart silver color */
  --pgn-rgg-bronze-color: #E6814DFF; /** From RGG chart bronze color */
  --pgn-rgg-dashboard-page-corner-border-radius: 1.25rem; /** RGG dashboard page corner border radius. */
  --pgn-rgg-dropdown-item-padding-x: 1.875rem; /** Horizontal padding for RGG dropdown item */
  --pgn-rgg-dropdown-item-padding-y: 0.563rem; /** Vertical padding for RGG dropdown item */
  --pgn-rgg-empty-message-color: #707070FF; /** RGG empty message color. */
  --pgn-rgg-points-vault-img-size: 15.625rem; /** RGG points vault image size. */
  --pgn-rgg-statuses-progress-bg-color: #DFE0E8FF; /** RGG progress status background color. */
  --pgn-rgg-statuses-progress-track-bg-color: #556B2FFF; /** RGG progress status track background color. */
  --pgn-rgg-space-20: 1.25rem; /** Spacing size 20 for RGG progress-badge */
  --pgn-rgg-space-30: 1.875rem; /** Spacing size 30 for RGG progress-badge */
  --pgn-spacing-form-input-padding-y-base: var(--pgn-spacing-input-btn-padding-y);
  --pgn-color-link-base: var(--pgn-rg-color-primary);
  --pgn-color-link-inline-base: var(--pgn-rg-color-primary);
  --pgn-color-teal: var(--pgn-rg-color-primary); /** Teal color. */
  --pgn-color-primary-base: var(--pgn-rg-color-primary); /** Basic primary color. */
  --pgn-color-brand-base: var(--pgn-rg-color-primary); /** Basic brand color. */
  --pgn-color-dark-base: var(--pgn-rg-color-primary); /** Basic dark color. */
  --pgn-rg-size-course-card-image-horizontal-width-min: var(--pgn-rg-size-course-card-image-horizontal-width-max);
  --pgn-rg-color-footer-bg: var(--pgn-color-black); /** The background color of the footer. */
  --pgn-rg-color-footer-support-text-and-logo: var(--pgn-color-white); /** The color of support text and logo in the footer. */
  --pgn-rg-color-header-bg: var(--pgn-color-white); /** The background color of the header. */
  --pgn-rg-color-header-links-nav: var(--pgn-color-black); /** The color of navigation links in the header. */
  --pgn-rg-color-header-btn-bg-primary: var(--pgn-rg-color-primary); /** Primary button background in header (sign in) */
  --pgn-rg-color-header-btn-hover-text: var(--pgn-color-white); /** Button hover text in header */
  --pgn-rg-color-promo-title: var(--pgn-color-white); /** H1 title color on banner */
  --pgn-rg-color-promo-description: var(--pgn-color-white); /** Description color on banner */
  --pgn-rg-typography-font-family-base: var(--pgn-rg-typography-font-family-sans-serif); /** Basic font family. */
  --pgn-rgg-primary-color: var(--pgn-rg-color-primary); /** From RGG chart primary color */
  --pgn-rgg-primary-font-family-base: var(--pgn-rg-typography-font-family-sans-serif); /** RGG Basic font family. */
  --pgn-rgg-accent-color: var(--pgn-rg-color-primary); /** The primary RGG color. */
  --pgn-rgg-accent-transparent-bg-color: #5033A08C; /** The RGG primary transparent background color. */
  --pgn-color-link-hover: #332166FF;
  --pgn-color-link-inline-decoration: #5033A0FF;
  --pgn-color-link-inline-hover-base: #332166FF;
  --pgn-color-link-inline-hover-decoration: #332166FF;
  --pgn-color-primary-100: #F5F3F9FF; /** Primary color of level 100. */
  --pgn-color-primary-200: #D3CCE7FF; /** Primary color of level 200. */
  --pgn-color-primary-300: #A899D0FF; /** Primary color of level 300. */
  --pgn-color-primary-400: #7C66B8FF; /** Primary color of level 400. */
  --pgn-color-primary-500: var(--pgn-color-primary-base); /** Primary color of level 500. */
  --pgn-color-primary-600: #482E90FF; /** Primary color of level 600. */
  --pgn-color-primary-700: #402980FF; /** Primary color of level 700. */
  --pgn-color-primary-800: #3C2678FF; /** Primary color of level 800. */
  --pgn-color-primary-900: #382470FF; /** Primary color of level 900. */
  --pgn-color-brand-100: #F5F3F9FF; /** Brand color of level 100. */
  --pgn-color-brand-200: #D3CCE7FF; /** Brand color of level 200. */
  --pgn-color-brand-300: #A899D0FF; /** Brand color of level 300. */
  --pgn-color-brand-400: #7C66B8FF; /** Brand color of level 400. */
  --pgn-color-brand-500: var(--pgn-color-brand-base); /** Brand color of level 500. */
  --pgn-color-brand-600: #482E90FF; /** Brand color of level 600. */
  --pgn-color-brand-700: #402980FF; /** Brand color of level 700. */
  --pgn-color-brand-800: #3C2678FF; /** Brand color of level 800. */
  --pgn-color-brand-900: #382470FF; /** Brand color of level 900. */
  --pgn-color-dark-100: #F5F3F9FF; /** Dark color of level 100. */
  --pgn-color-dark-200: #D3CCE7FF; /** Dark color of level 200. */
  --pgn-color-dark-300: #A899D0FF; /** Dark color of level 300. */
  --pgn-color-dark-400: #7C66B8FF; /** Dark color of level 400. */
  --pgn-color-dark-500: var(--pgn-color-dark-base); /** Dark color of level 500. */
  --pgn-color-dark-600: #482E90FF; /** Dark color of level 600. */
  --pgn-color-dark-700: #402980FF; /** Info color of level 700. */
  --pgn-color-dark-800: #3C2678FF; /** Dark color of level 800. */
  --pgn-color-dark-900: #382470FF; /** Dark color of level 900. */
  --pgn-color-action-default-primary-base: #3D2779FF;
  --pgn-color-action-default-brand-base: #3D2779FF;
  --pgn-color-action-default-dark-base: #3D2779FF;
  --pgn-rg-color-header-btn-hover-bg-primary: #402980FF; /** Primary button background hover in header (sign in) */
  --pgn-rg-color-header-btn-hover-bg-outlined-primary: #F5F3F9FF; /** Outline primary button background in header (register) */
  --pgn-rg-typography-promo-title-desktop: 400 2em/1.4em var(--pgn-rg-typography-font-family-base); /** Promo banner H1 title font size on desktop */
  --pgn-color-action-default-primary-100: #D9D1E8FF;
  --pgn-color-action-default-primary-200: #B5A9D7FF;
  --pgn-color-action-default-primary-300: #8A76C0FF;
  --pgn-color-action-default-primary-400: #624AA1FF;
  --pgn-color-action-default-primary-500: #3D2779FF;
  --pgn-color-action-default-primary-600: #352269FF;
  --pgn-color-action-default-primary-700: #2D1D59FF;
  --pgn-color-action-default-primary-800: #291A51FF;
  --pgn-color-action-default-primary-900: #251849FF;
  --pgn-color-action-default-brand-100: #D9D1E8FF;
  --pgn-color-action-default-brand-200: #B5A9D7FF;
  --pgn-color-action-default-brand-300: #8A76C0FF;
  --pgn-color-action-default-brand-400: #624AA1FF;
  --pgn-color-action-default-brand-500: #3D2779FF;
  --pgn-color-action-default-brand-600: #352269FF;
  --pgn-color-action-default-brand-700: #2D1D59FF;
  --pgn-color-action-default-brand-800: #291A51FF;
  --pgn-color-action-default-brand-900: #251849FF;
  --pgn-color-action-default-dark-100: #D9D1E8FF;
  --pgn-color-action-default-dark-200: #B5A9D7FF;
  --pgn-color-action-default-dark-300: #8A76C0FF;
  --pgn-color-action-default-dark-400: #624AA1FF;
  --pgn-color-action-default-dark-500: #3D2779FF;
  --pgn-color-action-default-dark-600: #352269FF;
  --pgn-color-action-default-dark-700: #2D1D59FF;
  --pgn-color-action-default-dark-800: #291A51FF;
  --pgn-color-action-default-dark-900: #251849FF;
  --pgn-rg-typography-promo-title-mobile: var(--pgn-rg-typography-promo-title-desktop); /** Promo banner H1 title font size on mobile */
}