:root {
  --app-text-selection-strength-light: 10%;
  --app-text-selection-strength-dark: 42%;
  --app-text-selection-strength: var(--app-text-selection-strength-light);
}

@media (prefers-color-scheme: dark) {
  :root {
    --app-text-selection-strength: var(--app-text-selection-strength-dark);
  }
}

:root:is(
  [data-workspace-theme="light"],
  [data-support-theme="light"],
  [data-forum-theme="light"],
  [data-kb-theme="light"]
) {
  --app-text-selection-strength: var(--app-text-selection-strength-light);
}

:root:is(
  [data-workspace-theme="dark"],
  [data-support-theme="dark"],
  [data-forum-theme="dark"],
  [data-kb-theme="dark"]
) {
  --app-text-selection-strength: var(--app-text-selection-strength-dark);
}

::selection {
  background-color: color-mix(
    in srgb,
    var(--app-text-selection-accent) var(--app-text-selection-strength),
    transparent
  );
}

::-moz-selection {
  background-color: color-mix(
    in srgb,
    var(--app-text-selection-accent) var(--app-text-selection-strength),
    transparent
  );
}