/* custom color palette */
[data-md-color-scheme="ayu"] {
  /* Default color shades */
  --md-default-fg-color:             rgb(124, 124, 124);
  --md-default-fg-color--light:      hsl(0, 0%, 60%);
  --md-default-fg-color--lighter:    hsl(120, 100%, 50%);
  --md-default-fg-color--lightest:   hsl(0, 0%, 34%);
  --md-default-bg-color:             rgb(14, 14, 14);
  --md-default-bg-color--light:      hsl(0, 0%, 26%);
  --md-default-bg-color--lighter:    hsl(0, 0%, 21%);
  --md-default-bg-color--lightest:   hsla(0, 0%, 67%, 0.979);

  /* Code color shades */
  --md-code-fg-color:                rgb(29, 114, 43);
  --md-code-hl-color-darker:         hsla(20, 100%, 60%, 1);
  --md-code-bg-color:                rgb(31, 31, 31);

  /* Code highlighting color shades */
  --md-code-hl-color:                hsla(34, 100%, 66%, .15);
  --md-code-hl-number-color:         #ffee99;
  --md-code-hl-special-color:        #BD63C5;

  /*
  .nc = Name, class
  .ne = Name, exception
  .nf = Name, function
  .nn = Name, namespace
   */
  --md-code-hl-function-color:       #ffee99;

  /*
  .no = Name, constant
  .nb = Name, builtin
  .bp = Name, builtin pseudo
  */
  --md-code-hl-constant-color:       var(--md-code-fg-color);
  --md-code-hl-keyword-color:        #D8A0DF;
  --md-code-hl-string-color:         #b8cc52;
  --md-code-hl-name-color:           var(--md-code-hl-color-darker);
  --md-code-hl-name-color:           #36a3d9;
  --md-code-hl-operator-color:       var(--md-default-fg-color--light);
  --md-code-hl-punctuation-color:    var(--md-default-fg-color--light);
  --md-code-hl-comment-color:        hsl(211, 11%, 41%);
  --md-code-hl-generic-color:        #bd9b20;
  --md-code-hl-variable-color:       var(--md-code-hl-color-darker);
  --md-code-hl-type-color:           #FFD700;
  --md-typeset-ins-color:            #91b362;
  --md-typeset-del-color:            #d96c75;

  /* Typeset color shades */
  --md-typeset-color:                hsl(0, 0%, 52%);

  /* Typeset `a` color shades */
  --md-typeset-a-color:              hsl(216, 51%, 49%);

  /* Typeset `mark` color shades */
  --md-typeset-mark-color:           hsla(218, 50%, 37%, 0.3); /* hsla(#{hex2hsl($clr-blue-a200)}, 0.3); */

  /* Typeset `kbd` color shades */
  /* --md-typeset-kbd-color:            hsla(var(--md-hue), 15%, 94%, 0.12);  */
  /* --md-typeset-kbd-accent-color:     hsla(var(--md-hue), 15%, 94%, 0.2);   */
  /* --md-typeset-kbd-border-color:     hsla(var(--md-hue), 15%, 14%, 1);     */

  /* Typeset `table` color shades */
   --md-typeset-table-color:          #333333;

  /* Admonition color shades */
  /* --md-admonition-bg-color:          hsla(var(--md-hue), 0%, 100%, 0.025); */

  /* Footer color shades */
  /* --md-footer-bg-color:              hsla(var(--md-hue), 15%, 12%, 0.87);  */
  /* --md-footer-bg-color--dark:        hsla(var(--md-hue), 15%, 10%, 1);     */
}

/* content area width fixed max */
.md-grid {
  max-width: 2000px;
}
/* content area width stretch to fit */
/* .md-grid {                        */
/*   max-width: initial;             */
/* }                                 */

/* Hide images for light mode */
/* img[src$="#only-light"] {  */
/*   display: none;           */
/* }                          */
/* Show images for dark mode  */
/* img[src$="#only-dark"] {   */
/*   display: initial;        */
/* }                          */


/* .highlight .ge {      */
/*   font-style: italic; */
/* }                     */
/* .highlight .gs {      */
/*   font-style: bold;   */
/* }                     */

/*
.k  = Keyword,
.kd = Keyword, declaration
.kn = Keyword, namespace
.kp = Keyword, pseudo
.kr = Keyword, reserved
.kt = Keyword, type
*/
.highlight .kt  {
  color: var(--md-code-hl-type-color);
}