/* Global customization */
.red-heart {
  color: red;
  }

  /*
  .gdoc-hint.note {
    //border-left-color: #f48120;
    background-color: #f48120;
    color: #ffffff;
  }

  .gdoc-hint__title i.fa {
    color: #000000;
  }
*/

:root {
    --code-max-height: 60rem;
  }
  
  /* Light mode theming */
  :root,
  :root[color-theme="light"] {
    --header-background: #ffffff;
    --header-font-color: #404041;
  
    --body-background: #ffffff;
    --body-font-color: #404041;
  
    --mark-color: #f48120;
  
    --button-background: #f48120;
    --button-border-color: #faad3f;
  
    --link-color: #f48120;
    --link-color-visited: #f48120;
  
    --code-background: #404041;
    --code-accent-color: #ffffff;
    --code-accent-color-lite: #ffffff;
    --code-font-color: #f48120;

    --code-copy-background: #404041;
    --code-copy-font-color: #ffffff;
    --code-copy-border-color: #f48120;
    --code-copy-success-color: #f48120;
  
    --accent-color: #ffffff;
    --accent-color-lite: #ffffff;
  
    --control-icons: #f48120;
  
    --footer-background: #ffffff;
    --footer-font-color: #404041;
    --footer-link-color: #f48120;
    --footer-link-color-visited: #f48120;
  }
  @media (prefers-color-scheme: light) {
    :root {
      --header-background: #ffffff;
      --header-font-color: #404041;
      
      --body-background: #ffffff;
      --body-font-color: #404041;
      
      --mark-color: #f48120;
  
      --button-background: #f48120;
      --button-border-color: #faad3f;
  
      --link-color: #f48120;
      --link-color-visited: #f48120;
  
      --code-background: #404041;
      --code-accent-color: #ffffff;
      --code-accent-color-lite: #ffffff;
      --code-font-color: #f48120;
  
      --code-copy-background: #404041;
      --code-copy-font-color: #ffffff;
      --code-copy-border-color: #f48120;
      --code-copy-success-color: #f48120;
  
      --accent-color: #ffffff;
      --accent-color-lite: #ffffff;
  
      --control-icons: #f48120;
  
      --footer-background: #ffffff;
      --footer-font-color: #404041;
      --footer-link-color: #f48120;
      --footer-link-color-visited: #f48120;
    }
  }
  
  /* Dark mode theming */
  :root[color-theme="dark"] {
    --header-background: #000000;
    --header-font-color: #eeeeee;
  
    --body-background: #000000;
    --body-font-color: #eeeeee;
  
    --mark-color: #ffab00;
  
    --button-background: #f48120;
    --button-border-color: #faad3f;
  
    --link-color: #f48120;
    --link-color-visited: #f48120;
  
    --code-background: #404041;
    --code-accent-color: #f48120;
    --code-accent-color-lite: #f48120;
    --code-font-color: #eeeeee;
  
    --code-copy-background: #404041;
    --code-copy-font-color: #f48120;
    --code-copy-border-color: #f48120;
    --code-copy-success-color: #f48120;
  
    --accent-color: #404041;
    --accent-color-lite: #000000;
  
    --control-icons: #f48120;
  
    --footer-background: #000000;
    --footer-font-color: #eeeeee;
    --footer-link-color: #f48120;
    --footer-link-color-visited: #f48120;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --header-background: #000000;
      --header-font-color: #eeeeee;
  
      --body-background: #000000;
      --body-font-color: #eeeeee;
  
      --mark-color: #ffab00;
  
      --button-background: #f48120;
      --button-border-color: #faad3f;
  
      --link-color: #f48120;
      --link-color-visited: #f48120;
  
      --code-background: #404041;
      --code-accent-color: #f48120;
      --code-accent-color-lite: #f48120;
      --code-font-color: #eeeeee;
  
      --code-copy-background: #404041;
      --code-copy-font-color: #f48120;
      --code-copy-border-color: #f48120;
      --code-copy-success-color: #f48120;
  
      --accent-color: #404041;
      --accent-color-lite: #000000;
  
      --control-icons: #f48120;
  
      --footer-background: #000000;
      --footer-font-color: #eeeeee;
      --footer-link-color: #f48120;
      --footer-link-color-visited: #f48120;
    }
  }