/* The console and the docs give the brand colours a job. Violet marks what you can do and where you are:
 * the main action, links, checked controls and the current page. Lime marks what happens now, and the one
 * highlighted label of a page. The website and the admin keep their own accents. */
:root,
.light,
[data-theme="light"] {
  --accent: #702cf6;
  --accent-foreground: #f0eef3;
  --link: #702cf6;
}
.dark,
[data-theme="dark"] {
  --accent: #702cf6;
  --accent-foreground: #f0eef3;
  --link: #9a68fa;
}

/* The current page in the sidebar: a violet bar on its left edge and a violet tint. */
.ds-nav-link[aria-current="page"],
.ds-nav-link[aria-current="location"] {
  background: var(--accent-soft);
  color: var(--accent-soft-foreground);
  box-shadow: inset 2px 0 0 var(--accent);
}
.ds-nav-link:hover:not([aria-current]) svg {
  color: var(--mn-violet-text);
}

/* Avatars are violet squares with the initial in paper, like the front face of munito. */
.avatar {
  border-radius: 0;
}
.avatar .avatar__fallback {
  border-radius: 0;
  background: var(--mn-violet);
  color: var(--mn-paper);
  font-weight: 500;
}

/* Status dots are pixels, as everything else is. */
.ds-pill-dot {
  border-radius: 0;
}

/* A copied snippet flashes lime while the check shows. */
.ds-code-copy[aria-label="Copied"] {
  border-color: var(--mn-lime);
  background: var(--mn-lime);
  color: var(--mn-on-lime);
}

/* Links inside text are violet, and underline when the pointer is on them. */
.ds-page-description a,
.legal-doc section a,
.ds-empty a,
.alert a {
  color: var(--link);
}
.ds-page-description a:hover,
.legal-doc section a:hover,
.ds-empty a:hover,
.alert a:hover {
  text-decoration: underline;
}