/* 
  Import Title Font: Montserrat
  Falls back to Roboto
*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600&display=swap');

/*
  Nexus Mods Theme
*/

:root {
  --md-admonition-icon--nexus: url('../Images/Nexus-Icon-40.avif');
  --md-admonition-icon--nexusheart: url('../Images/Nexus-Heart-40.avif');
  --md-admonition-icon--reloaded: url('../Images/Reloaded-Icon-40.avif');
  --md-admonition-icon--reloadedheart: url('../Images/Reloaded-Heart-40.avif');
}

/* Slate theme, i.e. dark mode */

[data-md-color-scheme="nexus-slate"] {
  /*
      Default Variables
  */

  /* For reuse later */
  --md-primary-fg-color-rgb: 217, 143, 64;

  /* Primary color shades */
  --md-primary-fg-color:        #D98F40;
  --md-primary-fg-color--light: #E0A362;
  --md-primary-fg-color--dark:  #C87B28;

  --md-primary-bg-color:        #FFFFFF;
  --md-primary-bg-color--light: #FFFFFFB2;

  /* Accent color shades */
  --md-accent-fg-color:               #C87B28;
  --md-accent-fg-color--transparent:  #C87B2810;

  --md-accent-bg-color:               #2A2C2B;
  --md-accent-bg-color--light:        #2A2C2B;

/*
   // Slate's hue in the range [0,360] - change this variable to alter the tone
   // of the theme, e.g. to make it more redish or greenish. This is a slate-
   // specific variable, but the same approach may be adapted to custom themes.
*/
  --md-hue: 31;
  --nexus-background-primary: #101010;
  --nexus-background-secondary: #181818;
  --nexus-background-tertiary: #222222;
  --nexus-background-content-primary: #1C1C1C;
  --nexus-background-content-secondary: #2B2D2F;

  --nexus-font-primary: #FFFFFF; /* #FFFFFF */
  --nexus-font-secondary: #AAAAAA; /* #AAAAAA */
  --nexus-font-tertiary: #5A5A5A; /* #5A5A5A */

  --nexus-font-primary-rgb: 255, 255, 255; /* #FFFFFF */
  --nexus-font-secondary-rgb: 170, 170, 170; /* #AAAAAA */
  --nexus-font-tertiary-rgb: 90, 90, 90; /* #5A5A5A */

  /* Default color shades */
  --md-default-fg-color:             var(--nexus-font-primary);
  --md-default-fg-color--light:      var(--nexus-font-secondary);
  --md-default-fg-color--lighter:    var(--nexus-font-tertiary);
  --md-default-fg-color--lightest:   rgba(var(--nexus-font-primary-rgb), 0.12);
  --md-default-bg-color:             var(--nexus-background-secondary);
  --md-default-bg-color--light:      var(--nexus-background-content-primary);
  --md-default-bg-color--lighter:    var(--nexus-background-tertiary);
  --md-default-bg-color--lightest:   var(--nexus-background-content-secondary);

  /* Code color shades */
  --md-code-fg-color:                hsla(var(--md-hue), 18%, 86%, 1);
  --md-code-bg-color:                var(--nexus-background-content-secondary);

  /* Code highlighting color shades */
  --md-code-hl-color:                #4287ff26;
  --md-code-hl-number-color:         hsla(219, 74%, 63%, 1);
  --md-code-hl-special-color:        hsla(340, 83%, 66%, 1);
  --md-code-hl-function-color:       hsla(219, 57%, 65%, 1);
  --md-code-hl-constant-color:       hsla(250, 62%, 70%, 1);
  --md-code-hl-keyword-color:        hsla(var(--md-hue), 66%, 64%, 1);
  --md-code-hl-string-color:         hsla(150, 58%, 44%, 1);
  --md-code-hl-name-color:           var(--md-code-fg-color);
  --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:        var(--md-default-fg-color--light);
  --md-code-hl-generic-color:        var(--md-default-fg-color--light);
  --md-code-hl-variable-color:       var(--md-default-fg-color--light);

  /* Typeset color shades */
  --md-typeset-color:                var(--md-default-fg-color);

  /* Typeset `a` color shades */
  --md-typeset-a-color:              var(--md-primary-fg-color);

  /* Typeset `mark` color shades */
  --md-typeset-mark-color:           #4287ff4d;

  /* 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:          hsla(var(--md-hue), 75%, 95%, 0.12);
  --md-typeset-table-color--light:   hsla(var(--md-hue), 75%, 95%, 0.035);

  /* Admonition color shades */
  --md-admonition-fg-color:          var(--md-default-fg-color);
  --md-admonition-bg-color:          var(--md-default-bg-color);

  /* Footer color shades */
  --md-footer-bg-color:              var(--nexus-background-primary);
  --md-footer-bg-color--dark:        var(--nexus-background-primary);

  /* Shadow depth 1 */
  --md-shadow-z1:
  0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.2),
  0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.1);

  /* Shadow depth 2 */
  --md-shadow-z2:
  0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.3),
  0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.25);

  /* Shadow depth 3 */
  --md-shadow-z3:
  0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.4),
  0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.35);

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

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

[data-md-color-scheme="nexus-slate"] .md-header {
  background-color: var(--nexus-background-primary);
}

[data-md-color-scheme="reloaded-slate"] {
  /*
      Default Variables
  */

  /* For reuse later */
  --md-primary-fg-color-rgb: 182, 99, 99;

  /* Primary color shades */
  --md-primary-fg-color:        #793939;
  --md-primary-fg-color--light: #B66363;
  --md-primary-fg-color--lightest: #d6a8a8;
  --md-primary-fg-color--dark:  #572929;

  --md-primary-bg-color:        #FFFFFF;
  --md-primary-bg-color--light: #FFFFFFB2;

  /* Accent color shades */
  --md-accent-fg-color:               #793939;
  --md-accent-fg-color--transparent:  #79393960;

  --md-accent-bg-color:               #181818;
  --md-accent-bg-color--light:        #181818;

  /*
     // Slate's hue in the range [0,360] - change this variable to alter the tone
     // of the theme, e.g. to make it more redish or greenish. This is a slate-
     // specific variable, but the same approach may be adapted to custom themes.
  */
  --md-hue: 0;
  --nexus-background-primary: #101010;
  --nexus-background-secondary: #181818;
  --nexus-background-tertiary: #222222;
  --nexus-background-content-primary: #1C1C1C;
  --nexus-background-content-secondary: #2B2D2F;

  --nexus-font-primary: #FFFFFF; /* #FFFFFF */
  --nexus-font-secondary: #AAAAAA; /* #AAAAAA */
  --nexus-font-tertiary: #5A5A5A; /* #5A5A5A */

  --nexus-font-primary-rgb: 255, 255, 255; /* #FFFFFF */
  --nexus-font-secondary-rgb: 170, 170, 170; /* #AAAAAA */
  --nexus-font-tertiary-rgb: 90, 90, 90; /* #5A5A5A */

  /* Default color shades */
  --md-default-fg-color:             var(--nexus-font-primary);
  --md-default-fg-color--light:      var(--nexus-font-secondary);
  --md-default-fg-color--lighter:    var(--nexus-font-tertiary);
  --md-default-fg-color--lightest:   rgba(var(--nexus-font-primary-rgb), 0.04);
  --md-default-bg-color:             var(--nexus-background-secondary);
  --md-default-bg-color--light:      var(--nexus-background-content-primary);
  --md-default-bg-color--lighter:    var(--nexus-background-tertiary);
  --md-default-bg-color--lightest:   var(--nexus-background-content-secondary);

  /* Code color shades */
  --md-code-fg-color:                hsla(var(--md-hue), 18%, 86%, 1);
  --md-code-bg-color:                var(--nexus-background-content-secondary);

  /* Code highlighting color shades */
  --md-code-hl-color:                #4287ff26;
  --md-code-hl-number-color:         hsla(219, 74%, 63%, 1);
  --md-code-hl-special-color:        hsla(340, 83%, 66%, 1);
  --md-code-hl-function-color:       hsla(219, 57%, 65%, 1);
  --md-code-hl-constant-color:       hsla(250, 62%, 70%, 1);
  --md-code-hl-keyword-color:        hsla(var(--md-hue), 66%, 64%, 1);
  --md-code-hl-string-color:         hsla(150, 58%, 44%, 1);
  --md-code-hl-name-color:           var(--md-code-fg-color);
  --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:        var(--md-default-fg-color--light);
  --md-code-hl-generic-color:        var(--md-default-fg-color--light);
  --md-code-hl-variable-color:       var(--md-default-fg-color--light);

  /* Typeset color shades */
  --md-typeset-color:                var(--md-default-fg-color);

  /* Typeset `a` color shades */
  --md-typeset-a-color:              var(--md-primary-fg-color--lightest);

  /* Typeset `mark` color shades */
  --md-typeset-mark-color:           #4287ff4d;

  /* 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:          hsla(var(--md-hue), 75%, 95%, 0.12);
  --md-typeset-table-color--light:   hsla(var(--md-hue), 75%, 95%, 0.035);

  /* Admonition color shades */
  --md-admonition-fg-color:          var(--md-default-fg-color);
  --md-admonition-bg-color:          var(--md-default-bg-color);

  /* Footer color shades */
  --md-footer-bg-color:              var(--nexus-background-primary);
  --md-footer-bg-color--dark:        var(--nexus-background-primary);

  /* Shadow depth 1 */
  --md-shadow-z1:
          0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.2),
          0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.1);

  /* Shadow depth 2 */
  --md-shadow-z2:
          0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.3),
          0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.25);

  /* Shadow depth 3 */
  --md-shadow-z3:
          0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.4),
          0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.35);

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

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

[data-md-color-scheme="reloaded-slate"] .md-typeset a:hover {
  color: var(--md-primary-fg-color--light);
}

[data-md-color-scheme="reloaded-slate"] .md-nav--primary .md-nav__item--active>.md-nav__link:hover {
  color: var(--md-primary-fg-color--light);
}

[data-md-color-scheme="reloaded-slate"] .md-nav__link:hover {
  color: var(--md-primary-fg-color--light);
}


[data-md-color-scheme="reloaded3-slate"] {
  /*
      Default Variables
  */

  /* For reuse later */
  --md-primary-fg-color-rgb: 63, 153, 217;

  /* Primary color shades */
  --md-primary-fg-color:        #fa7774;
  --md-primary-fg-color--light: #fc918b;
  --md-primary-fg-color--dark:  #e96060;
  --md-primary-fg-color--darker:  #d74f52;
  --md-primary-fg-color--darkest:  #c53e44;

  --md-primary-bg-color:        #FFFFFF;
  --md-primary-bg-color--light: #FFFFFFB2;

  /* Accent color shades */
  --md-accent-fg-color:               #e96060;
  --md-accent-fg-color--transparent:  #e9606030;

  --md-accent-bg-color:               #2A2C2B;
  --md-accent-bg-color--light:        #2A2C2B;

  /*
     // Slate's hue in the range [0,360] - change this variable to alter the tone
     // of the theme, e.g. to make it more redish or greenish. This is a slate-
     // specific variable, but the same approach may be adapted to custom themes.
  */
  --md-hue: 1;
  --nexus-background-primary: #101010;
  --nexus-background-secondary: #181818;
  --nexus-background-tertiary: #222222;
  --nexus-background-content-primary: #1C1C1C;
  --nexus-background-content-secondary: #2B2D2F;

  --nexus-font-primary: #FFFFFF; /* #FFFFFF */
  --nexus-font-secondary: #AAAAAA; /* #AAAAAA */
  --nexus-font-tertiary: #5A5A5A; /* #5A5A5A */

  --nexus-font-primary-rgb: 255, 255, 255; /* #FFFFFF */
  --nexus-font-secondary-rgb: 170, 170, 170; /* #AAAAAA */
  --nexus-font-tertiary-rgb: 90, 90, 90; /* #5A5A5A */

  /* Default color shades */
  --md-default-fg-color:             var(--nexus-font-primary);
  --md-default-fg-color--light:      var(--nexus-font-secondary);
  --md-default-fg-color--lighter:    var(--nexus-font-tertiary);
  --md-default-fg-color--lightest:   rgba(var(--nexus-font-primary-rgb), 0.12);
  --md-default-bg-color:             var(--nexus-background-secondary);
  --md-default-bg-color--light:      var(--nexus-background-content-primary);
  --md-default-bg-color--lighter:    var(--nexus-background-tertiary);
  --md-default-bg-color--lightest:   var(--nexus-background-content-secondary);

  /* Code color shades */
  --md-code-fg-color:                hsla(var(--md-hue), 18%, 86%, 1);
  --md-code-bg-color:                var(--nexus-background-content-secondary);

  /* Code highlighting color shades */
  --md-code-hl-color:                #4287ff26;
  --md-code-hl-number-color:         hsla(219, 74%, 63%, 1);
  --md-code-hl-special-color:        hsla(340, 83%, 66%, 1);
  --md-code-hl-function-color:       hsla(219, 57%, 65%, 1);
  --md-code-hl-constant-color:       hsla(250, 62%, 70%, 1);
  --md-code-hl-keyword-color:        hsla(var(--md-hue), 66%, 64%, 1);
  --md-code-hl-string-color:         hsla(150, 58%, 44%, 1);
  --md-code-hl-name-color:           var(--md-code-fg-color);
  --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:        var(--md-default-fg-color--light);
  --md-code-hl-generic-color:        var(--md-default-fg-color--light);
  --md-code-hl-variable-color:       var(--md-default-fg-color--light);

  /* Typeset color shades */
  --md-typeset-color:                var(--md-default-fg-color);

  /* Typeset `a` color shades */
  --md-typeset-a-color:              var(--md-primary-fg-color);

  /* Typeset `mark` color shades */
  --md-typeset-mark-color:           #4287ff4d;

  /* 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:          hsla(var(--md-hue), 75%, 95%, 0.12);
  --md-typeset-table-color--light:   hsla(var(--md-hue), 75%, 95%, 0.035);

  /* Admonition color shades */
  --md-admonition-fg-color:          var(--md-default-fg-color);
  --md-admonition-bg-color:          var(--md-default-bg-color);

  /* Footer color shades */
  --md-footer-bg-color:              var(--nexus-background-primary);
  --md-footer-bg-color--dark:        var(--nexus-background-primary);

  /* Shadow depth 1 */
  --md-shadow-z1:
          0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.2),
          0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.1);

  /* Shadow depth 2 */
  --md-shadow-z2:
          0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.3),
          0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.25);

  /* Shadow depth 3 */
  --md-shadow-z3:
          0 #{px2rem(4px)} #{px2rem(10px)} hsla(0, 0%, 0%, 0.4),
          0 0              #{px2rem(1px)}  hsla(0, 0%, 0%, 0.35);

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

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

[data-md-color-scheme="reloaded3-slate"] .md-header {
  background-color: var(--md-primary-fg-color--darker);
}

@media screen and (max-width: 76.1875em) {
  /* Title in Drawer */
  [data-md-color-scheme="reloaded3-slate"] .md-nav--primary .md-nav__title[for=__drawer] {
    background-color: var(--md-primary-fg-color--darker);
    color: var(--md-primary-bg-color);
    font-weight: 700;
  }
}

[data-md-color-scheme="reloaded3-slate"] .md-nav__source {
  background-color: var(--md-primary-fg-color--darkest);
  color: var(--md-primary-bg-color);
}

.md-nav__title {
  color: var(--md-default-fg-color);
}

.md-nav__link {
  color: var(--md-default-fg-color--light);
}

/* Custom 'nexus' admonition */
.md-typeset .admonition.nexus,
.md-typeset details.nexus {
  border-color: var(--md-primary-fg-color);
}
.md-typeset .nexus > .admonition-title,
.md-typeset .nexus > summary {
  background-color: rgba(var(--md-primary-fg-color-rgb), 0.1);
}
.md-typeset .nexus > .admonition-title::before,
.md-typeset .nexus > summary::before {
  background-color: unset;
  -webkit-mask-image: unset;
  background-image: var(--md-admonition-icon--nexus);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Custom 'nexus heart' admonition */
.md-typeset .admonition.nexusheart,
.md-typeset details.nexusheart {
  border-color: var(--md-primary-fg-color);
}
.md-typeset .nexusheart > .admonition-title,
.md-typeset .nexusheart > summary {
  background-color: rgba(var(--md-primary-fg-color-rgb), 0.1);
}
.md-typeset .nexusheart > .admonition-title::before,
.md-typeset .nexusheart > summary::before {
  background-color: unset;
  -webkit-mask-image: unset;
  background-image: var(--md-admonition-icon--nexusheart);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Custom 'reloaded' admonition */

.md-typeset .admonition.reloaded,
.md-typeset details.reloaded {
  border-color: var(--md-primary-fg-color);
}
.md-typeset .reloaded > .admonition-title,
.md-typeset .reloaded > summary {
  background-color: rgba(var(--md-primary-fg-color-rgb), 0.1);
}
.md-typeset .reloaded > .admonition-title::before,
.md-typeset .reloaded > summary::before {
  background-color: unset;
  -webkit-mask-image: unset;
  background-image: var(--md-admonition-icon--reloaded);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Custom 'nexus heart' admonition */
.md-typeset .admonition.reloadedheart,
.md-typeset details.reloadedheart {
  border-color: var(--md-primary-fg-color);
}
.md-typeset .reloadedheart > .admonition-title,
.md-typeset .reloadedheart > summary {
  background-color: rgba(var(--md-primary-fg-color-rgb), 0.1);
}
.md-typeset .reloadedheart > .admonition-title::before,
.md-typeset .reloadedheart > summary::before {
  background-color: unset;
  -webkit-mask-image: unset;
  background-image: var(--md-admonition-icon--reloadedheart);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Headers */
[data-md-color-scheme="nexus-slate"] .md-typeset h1 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="nexus-slate"] .md-typeset h2 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="nexus-slate"] .md-typeset h3 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="nexus-slate"] .md-typeset h4 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="nexus-slate"] .md-typeset h5 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="reloaded-slate"] .md-typeset h1 {
  color: var(--md-default-fg-color);
}

[data-md-color-scheme="reloaded3-slate"] .md-typeset h1 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="reloaded3-slate"] .md-typeset h2 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="reloaded3-slate"] .md-typeset h3 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="reloaded3-slate"] .md-typeset h4 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}

[data-md-color-scheme="reloaded3-slate"] .md-typeset h5 {
  color: var(--md-default-fg-color);
  font-family: "Montserrat",Roboto;
  font-weight: 600;
}