:root {
  --bg0_h: #1d2021;
  --bg:   #282828;
  --bg0_s: #32302f;
  --bg1:  #3c3836;
  --bg2:  #504945;
  --bg3:  #665c54;
  --bg4:  #7c6f64;

  --fg:  #fbf1c7;
  --fg1: #ebdbb2;
  --fg2: #d5c4a1;
  --fg3: #bdae93;
  --fg4: #a89984;

  --red:    #fb4934;
  --green:  #b8bb26;
  --yellow: #fabd2f;
  --blue:   #83a598;
  --purple: #d3869b;
  --aqua:   #8ec07c;
  --gray:   #928374;
  --orange: #fe8019;

  --red-dim:    #cc2412;
  --green-dim:  #98971a;
  --yellow-dim: #d79921;
  --blue-dim:   #458588;
  --purple-dim: #b16286;
  --aqua-dim:   #689d6a;
  --gray-dim:   #a89984;
  --orange-dim: #d65d0e;
}

[data-md-color-scheme="gruvbox"] {
  --md-primary-fg-color:               var(--bg0_h);
  --md-primary-fg-color--light:        var(--bg0_h);
  --md-primary-fg-color--dark:         var(--bg0_h);

  --md-primary-bg-color:               var(--yellow);
  --md-primary-bg-color--light:        var(--yellow-dim);

  --md-accent-fg-color:                var(--green);
  --md-accent-fg-color--transparent:   var(--bg1);

  --md-accent-bg-color:                var(--green);
  --md-accent-bg-color--light:         var(--green);

  --md-default-fg-color:               var(--fg);
  --md-default-fg-color--light:        var(--fg1);
  --md-default-fg-color--lighter:      var(--fg2);
  --md-default-fg-color--lightest:     var(--bg2);

  --md-default-bg-color:               var(--bg);
  --md-default-bg-color--light:        var(--bg1);
  --md-default-bg-color--lighter:      var(--bg2);
  --md-default-bg-color--lightest:     var(--bg3);

  /* markdown h1, h2, etc */
  --md-typeset-color:                  var(--md-default-fg-color);
  /* links */
  --md-typeset-a-color:                var(--yellow);
  --md-typeset-del-color:              hsla(6, 90%, 60%, 0.15);
  --md-typeset-ins-color:              hsla(150, 90%, 44%, 0.15);

  --md-typeset-kbd-color:              hsla(0, 0%, 98%, 1);
  --md-typeset-kbd-accent-color:       hsla(0, 100%, 100%, 1);
  --md-typeset-kbd-border-color:       hsla(0, 0%, 72%, 1);

  --md-typeset-mark-color:             var(--aqua-dim);

  --md-typeset-table-color:            hsla(0, 0%, 0%, 0.12);
  --md-typeset-table-color--light:     hsla(0, 0%, 0%, 0.035);

  --md-admonition-fg-color:            var(--md-default-fg-color);
  --md-admonition-bg-color:            var(--md-default-bg-color);

  --md-warning-fg-color:              hsla(0, 0%, 0%, 0.87);
  --md-warning-bg-color:              hsla(60, 100%, 80%, 1);


  /**/
  --md-footer-fg-color:                var(--fg);
  /* footer text */
  --md-footer-fg-color--light:         var(--yellow-dim);
  /* footer accent text */
  --md-footer-fg-color--lighter:       var(--fg);
  
  --md-footer-bg-color:                var(--bg);
  --md-footer-bg-color--dark:          var(--bg0_h);


  --md-code-fg-color:                  var(--fg);
  --md-code-bg-color:                  var(--bg0_h);
  --md-code-hl-color:                  var(--green);

  --md-code-hl-color:                  var(--yellow);
  --md-code-hl-color--light:           var(--yellow-dim);
  --md-code-hl-number-color:           var(--orange);
  --md-code-hl-special-color:          var(--yellow);
  --md-code-hl-function-color:         var(--green);
  --md-code-hl-constant-color:         var(--red);
  --md-code-hl-keyword-color:          var(--yellow);
  --md-code-hl-string-color:           var(--green);
  --md-code-hl-name-color:             var(--fg);
  --md-code-hl-operator-color:         var(--purple);
  --md-code-hl-punctuation-color:      var(--md-default-fg-color--light);
  --md-code-hl-comment-color:          var(--fg4);
  --md-code-hl-generic-color:          var(--md-default-fg-color--light);
  --md-code-hl-variable-color:         var(--md-default-fg-color--light);
}

.md-typeset h1 {
    color: var(--yellow);
}

.md-typeset h2 {
    color: var(--green);
}

.md-typeset h3 {
    color: var(--purple);
}

.md-typeset h4 {
    color: var(--orange);
}