:root {
  /* --md-primary-fg-color: #0f172a; */
  /* --md-primary-fg-color--light: #1e293b; */
  /* --md-primary-fg-color--dark: #020617; */
  /* --md-accent-fg-color: #22c55e; */
  --md-primary-fg-color: #5F34D9;
  --md-default-bg-color: #171324;
  --md-default-fg-color: #FEFDFE;
  --md-default-fg-color--light: #FEFDFE;
  --md-typeset-color: #FEFDFE;
  --md-code-fg-color: #A69CC4;
  --md-code-bg-color: #242030;
  --md-footer-bg-color--dark: #171324;
  --md-typeset-table-color: #2D1D5A;

  --primary: #5F34D9;
  --secondary: #492C9B;
  --secondary-alpha: #492C9B1a;
  --accent: #784EED;
  
  --red: #FF3525;
  --green: #21E52E;
  --blue: #335FD7;
  --lightblue: #2B8BD4;
  --cyan: #1ECECE;
  --orange: #FF6625;
  
  --note: #335FD7; /* blue */
  --note-alpha: #335FD71a;
  --info: #1ECECE; /* cyan */
  --info-alpha: #1ECECE1a;
  --warn: #FF6625; /* orange */
  --warn-alpha: #FF66251a;
  --danger: #FF3525; /* red */
  --danger-alpha: #FF35251a;
}

.color-red {
  color: var(--red);
}

.color-green {
  color: var(--green);
}

.tabbed-set {
  border: 1px solid var(--secondary);
}

.tabbed-labels {
  background-color: var(--secondary-alpha);
}

.tabbed-content {
  padding: 1rem;
}

.tabbed-block > *:first-child {
  margin-top: 0;
  padding-top: 0;
}

.tabbed-block > *:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

.admonition.note {
  border-color: var(--note) !important;
}

.admonition.note .admonition-title {
  background-color: var(--note-alpha) !important;
}

.admonition.note .admonition-title::before {
  background-color: var(--note) !important;
}

.admonition.info {
  border-color: var(--info) !important;
}

.admonition.info .admonition-title {
  background-color: var(--info-alpha) !important;
}

.admonition.info .admonition-title::before {
  background-color: var(--info) !important;
}

.admonition.warning {
  border-color: var(--warn) !important;
}

.admonition.warning .admonition-title {
  background-color: var(--warn-alpha) !important;
}

.admonition.warning .admonition-title::before {
  background-color: var(--warn) !important;
}

.admonition.danger {
  border-color: var(--danger) !important;
}

.admonition.danger .admonition-title {
  background-color: var(--danger-alpha) !important;
}

.admonition.danger .admonition-title::before {
  background-color: var(--danger) !important;
}