/*
 * PlatinumTests Brand Theme Override
 *
 * Loaded after gravity-ui-bundle.css when Brand.ThemeName = "platinum-tests"
 *
 * Brand source: PlatinumEd2 site (maroon #990000 primary, gray secondary)
 *
 * Strategy: Override the Pearson Design System token layer variables.
 * All Gravity UI components reference these tokens via var() chains,
 * so overriding at the token level cascades to every component automatically.
 *
 * Token chain example:
 *   .gravity-btn-primary { background: var(--gravity-button-primary) }
 *     -> --gravity-button-primary: var(--color--interactive-primary-default)
 *       -> --color--interactive-primary-default: #047a9cff  <-- WE OVERRIDE THIS
 */

@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;600;700&display=swap');

:root {
  /* ================================
   * PEARSON TOKEN OVERRIDES
   * These are the root tokens that all components reference.
   * Overriding here cascades to buttons, links, borders, icons, etc.
   * ================================ */

  /* Header/Nav background (used by .gravity-header-navy) */
  --color--text-brand-01: #333333;

  /* Interactive Primary (buttons, active states) */
  --color--interactive-primary-default: #990000;
  --color--interactive-primary-hover: #b30000;
  --color--interactive-primary-active: #730000;
  --color--interactive-primary-icon: #ffffff;
  --color--interactive-primary-text: #ffffff;
  --color--interactive-primary-inverse-active: #99000026;
  --color--interactive-primary-inverse-hover: #33333326;

  /* Interactive Secondary */
  --color--interactive-secondary-default: #333333;
  --color--interactive-secondary-active: #99000059;
  --color--interactive-secondary-hover: #99000026;
  --color--interactive-secondary-icon: #333333;
  --color--interactive-secondary-text: #333333;

  /* Interactive Borders */
  --color--interactive-border-default: #990000;
  --color--interactive-border-hover: #b34d4d;
  --color--interactive-border-active: #730000;

  /* Links */
  --color--link-brand-default: #990000;
  --color--link-brand-hover: #730000;
  --color--link-brand-active: #4d0000;
  --color--link-brand-visited: #990000;

  /* ================================
   * GRAVITY BRAND VARIABLES
   * These are used by the semantic layer (variables.css)
   * ================================ */

  --gravity-brand-primary: #990000;
  --gravity-brand-secondary: #333333;
  --gravity-brand-accent: #EB7F00;

  --gravity-brand-primary-light: #b30000;
  --gravity-brand-primary-dark: #730000;
  --gravity-brand-secondary-light: #666666;
  --gravity-brand-secondary-dark: #1a1a1a;

  --gravity-brand-primary-rgb: 153, 0, 0;
  --gravity-brand-secondary-rgb: 51, 51, 51;
  --gravity-brand-accent-rgb: 235, 127, 0;

  /* Button shape — 4px radius instead of pill (1000px) */
  --gravity-button-radius: 4px;

  /* Semantic text/interaction */
  --gravity-text-link: var(--gravity-brand-primary);
  --gravity-text-link-hover: var(--gravity-brand-primary-light);
  --gravity-border-focus: var(--gravity-brand-primary);
  --gravity-icon-color-active: var(--gravity-brand-primary);
  --gravity-icon-color-hover: var(--gravity-brand-primary-light);
  --gravity-icon-color-focus: var(--gravity-brand-primary);
  --gravity-icon-color-pressed: var(--gravity-brand-primary-dark);

  /* ================================
   * TYPOGRAPHY
   * Override at all three levels of the font variable chain:
   *   --font--family-primary (Pearson token layer)
   *   --gravity-font-family (Gravity semantic layer, from variables.css)
   *   --gravity-font-family-primary (Gravity typography layer, from fonts.css — used by body/reset)
   * ================================ */

  --font--family-primary: "Source Sans 3", "Plus Jakarta Sans", Helvetica, Verdana, sans-serif;
  --gravity-font-family: var(--font--family-primary);
  --gravity-font-family-primary: var(--font--family-primary);
}

/* ================================
 * DARK MODE OVERRIDES
 * ================================ */

.theme-dark {
  --color--interactive-primary-default: #cc3333;
  --color--interactive-primary-hover: #e04040;
  --color--interactive-primary-active: #aa2222;

  --color--link-brand-default: #cc3333;
  --color--link-brand-hover: #e04040;
  --color--link-brand-active: #aa2222;
  --color--link-brand-visited: #cc3333;

  --color--interactive-border-default: #cc3333;
  --color--interactive-border-hover: #e04040;
  --color--interactive-border-active: #aa2222;

  --gravity-brand-primary: #cc3333;
  --gravity-brand-secondary: #999999;
  --gravity-brand-accent: #ffaa33;
  --gravity-brand-primary-light: #e04040;
  --gravity-brand-primary-dark: #aa2222;
  --gravity-brand-primary-rgb: 204, 51, 51;
}

/* ================================
 * ACCESSIBILITY
 * ================================ */

@media (prefers-contrast: high) {
  :root {
    --color--interactive-primary-default: #800000;
    --color--interactive-primary-hover: #990000;
    --color--link-brand-default: #800000;
    --color--link-brand-hover: #990000;
    --gravity-brand-primary: #800000;
    --gravity-brand-secondary: #1a1a1a;
  }
}

/* ================================
 * PRINT STYLES
 * ================================ */

@media print {
  .gravity-btn-primary,
  .gravity-btn-secondary {
    background: white !important;
    color: black !important;
    border: 1px solid black !important;
  }
}