Basic theme for fly machines API

flytheme.css

/* basic theme */
.light-mode {
  --theme-color-1: rgb(35 23 74);
  --theme-color-2: rgb(76, 78, 103);
  --theme-color-3: rgb(103, 107, 137);
  --theme-color-accent: #845EEE;

  --theme-background-1: #fff;
  --theme-background-2: rgb(249, 249, 251);
  --theme-background-3: rgb(241 242 249);
  --theme-background-accent: #845EEE1f;

  --theme-border-color: rgba(0, 0, 0, 0.1);
  --theme-code-languages-background-supersede: var(--theme-background-3);
  --theme-code-language-color-supersede: var(--theme-color-1)
 }
.dark-mode {
  --theme-color-1: rgba(255, 255, 255, 0.9);
  --theme-color-2: rgba(255, 255, 255, 0.62);
  --theme-color-3: #A199CB;
  --theme-color-accent: #845EEE;

  --theme-background-1: rgb(9 10 20);
  --theme-background-2: #140f2a;
  --theme-background-3: #201a3d;
  --theme-background-accent: #845EEE1f;

  --theme-border-color: rgba(255, 255, 255, 0.1);
  --theme-code-languages-background-supersede: linear-gradient(to bottom right, rgb(255 255 255 / .075), rgb(255 255 255 / .075), rgb(255 255 255 / .2));
}
/* Document Sidebar */
.light-mode .t-doc__sidebar,
.dark-mode .t-doc__sidebar {
  --sidebar-background-1: var(--theme-background-1);
  --sidebar-item-hover-color: currentColor;
  --sidebar-item-hover-background: var(--theme-background-2);
  --sidebar-item-active-background: var(--theme-background-accent);
  --sidebar-border-color: var(--theme-border-color);
  --sidebar-color-1: var(--theme-color-1);
  --sidebar-color-2: var(--theme-color-2);
  --sidebar-color-active: var(--theme-color-accent);
  --sidebar-search-background: transparent;
  --sidebar-search-border-color: var(--theme-border-color);
  --sidebar-search--color: var(--theme-color-3);
}
.light-mode .t-doc__sidebar {
  --sidebar-search-background: rgb(241 242 249);
  --sidebar-search-border-color: rgb(241 242 249);
}
/* advanced */
.light-mode {
  --theme-button-1: rgb(49 53 56);
  --theme-button-1-color: #fff;
  --theme-button-1-hover: rgb(28 31 33);

  --theme-color-green: #069061;
  --theme-color-red: #ef0006;
  --theme-color-yellow: #edbe20;
  --theme-color-blue: #0082d0;
  --theme-color-orange: #fb892c;
  --theme-color-purple: #5203d1;

  --theme-scrollbar-color: rgba(0, 0, 0, 0.18);
  --theme-scrollbar-color-active: rgba(0, 0, 0, 0.36);
}
.dark-mode {
  --theme-button-1: #f6f6f6;
  --theme-button-1-color: #000;
  --theme-button-1-hover: #e7e7e7;

  --theme-color-green: #00b648;
  --theme-color-red: #dc1b19;
  --theme-color-yellow: #ffc90d;
  --theme-color-blue: #4eb3ec;
  --theme-color-orange: #ff8d4d;
  --theme-color-purple: #b191f9;

  --theme-scrollbar-color: rgba(255, 255, 255, 0.24);
  --theme-scrollbar-color-active: rgba(255, 255, 255, 0.48);
}
/* Theme additions */
.section-flare {
  background-size: cover;
  width: 100%;
  height: 100%;
  max-height: 500px;
  opacity: .25;
}
.light-mode .section-flare {
  display: none;
}
.section-flare-item:nth-of-type(1) {
  width: 29%;
  aspect-ratio: 1;
  background: rgba(110, 80, 165);
  border-radius: 50%;
  bottom: -30%;
  position: absolute;
  left: 20%;
  filter: blur(100px)
}
.section-flare-item:nth-of-type(2) {
  width: 54%;
  height: 39%;
  transform: rotate(30deg);
  background: rgba(59, 98, 191);
  border-radius: 40%;
  top: 30%;
  position: absolute;
  left: 10%;
  filter: blur(100px)
}
.section-flare-item:nth-of-type(3) {
  width: 29%;
  aspect-ratio: 1;
  background: rgba(110, 80, 165);
  border-radius: 50%;
  bottom: 30%;
  position: absolute;
  right: 10%;
  filter: blur(100px)
}
.section-flare-item:nth-of-type(4) {
  width: 54%;
  height: 39%;
  transform: rotate(30deg);
  background: rgba(59, 98, 191);
  border-radius: 40%;
  bottom: -30%;
  position: absolute;
  right: -30%;
  filter: blur(100px)
}
.section .download-cta a,
.section .markdown a {
  color: var(--theme-color-3) !important;
}
.light-mode .section .download-cta a,
.light-mode .section .markdown a {
  color: var(--theme-color-3) !important;
  text-decoration: underline !important;
}
.download-cta a:hover,
.section .markdown a:hover {
  color: var(--theme-color-accent) !important
}
.dark-mode .scalar-card {
    --theme-background-1: var(--theme-background-2);
}
.scalar-card .show-api-client-button:before,
.dark-mode .scalar-card .code-languages-background {
  background: transparent;
  box-shadow: 0 0 0 1px rgb(255 255 255 / .25);
}
.dark-mode .scalar-card .code-languages-background:hover,
.scalar-card .show-api-client-button:hover:before {
  box-shadow: inset 0 0 6px rgba(221, 214, 254, .2), 0 0 0 1px rgb(255 255 255 / .25);
  background: transparent;
}
.scalar-card .show-api-client-button {
  background: transparent;
}
.scalar-card .show-api-client-button:before {
  background: linear-gradient(to bottom right, rgb(255 255 255 / .075), rgb(255 255 255 / .075), rgb(255 255 255 / .2))
}
.scalar-card .code-languages-icon {
  padding: 11px;
}