body.theme-scifi {

  /* ---------------------------------------- */
  /*  Backgrounds                              */
  /* ---------------------------------------- */

  --background-url: url("../ui/backgrounds/setup-scifi.webp");
  --main-logo: url("../icons/logo-scifi-blank.png");

  /* ---------------------------------------- */
  /*  Colors                                  */
  /* ---------------------------------------- */

  --color-warm-1: #3a9bee;
  --color-warm-2: #303260;
  --color-warm-3: #202137;

  --color-cool-3: #202137;
  --color-cool-4: #15151e;
  --color-cool-5: #0b090a;

  --color-cool-5-25: rgb(11 9 10 / 25%);
  --color-cool-5-50: rgb(11 9 10 / 50%);
  --color-cool-5-75: rgb(11 9 10 / 75%);
  --color-cool-5-90: rgb(11 9 10 / 90%);

  --color-light-1: #f3f7f7;
  --color-light-2: #dee9ed;
  --color-light-3: #c2daea;
  --color-light-4: #899fad;
  --color-light-5: #79849b;
  --color-light-6: #6c7288;

  --color-scrollbar: #303260;
  --color-scrollbar-border: #3a9bee;

  /* ---------------------------------------- */
  /*  Typography                              */
  /* ---------------------------------------- */

  --font-h1: "Bruno Ace SC", serif;
  --font-h2: "Bruno Ace", serif;
  --font-h3: "Bruno Ace", serif;
  --font-h4: "Bruno Ace", serif;
  --font-h5: "Bruno Ace", serif;
  --font-h6: "Bruno Ace", serif;
  --font-h1-size: var(--font-size-64);
  --font-h3-size: var(--font-size-20);
  --font-h4-size: var(--font-size-20);
  --font-h6-size: var(--font-size-18);

  /* ---------------------------------------- */
  /*  Applications                            */
  /* ---------------------------------------- */

  .app,
  .application {
    --color-border: #303260;
  }

  /* ---------------------------------------- */
  /*  Forms and Form Elements                 */
  /* ---------------------------------------- */

  input, select {
    --input-background-color: #202137;
    --input-focus-outline-color: #3a9bee;
  }

  // Checkboxes Specifically
  input[type="checkbox"] {
    --checkbox-checked-color: #3a9bee;
    --checkbox-background-color: #202137;
  }

  button.bright {
    --button-hover-background-color: #42a5fc;
  }
}

/* ---------------------------------------- */
/*  Setup Specifically                      */
/* ---------------------------------------- */

body.auth.theme-scifi {
  --header-font-size: var(--font-size-64);
  .app,
  .application {
    --color-border: #3a9bee;
  }
}