/* Official Incognito palette, applied through Starlight's public design tokens. */
:root {
  --incognito-ink: #071526;
  --incognito-navy: #10253d;
  --incognito-primary: #155eef;
  --incognito-bright: #2f7cff;
  --incognito-light: #eaf2ff;
  --incognito-soft: #eef4ff;
  --incognito-pink: #ef3b8f;
  --incognito-orange: #f57a32;
  --incognito-violet: #5746d8;

  --sl-color-accent-low: #10253d;
  --sl-color-accent: #155eef;
  --sl-color-accent-high: #eaf2ff;
  --sl-color-text-accent: #2f7cff;
  --sl-color-bg-accent: #eaf2ff;
}

:root[data-theme='light'] {
  --sl-color-text: #10253d;
  --sl-color-text-accent: #155eef;
  --sl-color-accent-low: #eef4ff;
  --sl-color-accent: #155eef;
  --sl-color-accent-high: #10253d;
  --sl-color-bg-accent: #155eef;
}

.status-empty,
.status-missing {
  border-inline-start: 0.25rem solid var(--incognito-violet);
  border-radius: 0.25rem;
  padding: 0.875rem 1rem;
}

.status-empty {
  background: var(--incognito-soft);
  color: var(--incognito-navy);
}

.status-missing {
  background: color-mix(in srgb, var(--incognito-orange) 13%, transparent);
  border-inline-start-color: var(--incognito-orange);
}

:root:not([data-theme='light']) .status-empty {
  background: color-mix(in srgb, var(--incognito-violet) 22%, transparent);
  color: var(--sl-color-gray-1);
}