styles.css

:root {
  --symbol-base-padding: 0px;
  --symbol-indent-padding: 12px;
}

.qsp-filter-active {
  color: var(--text-accent);
}

/* suggestion file path icon */
.qsp-path-indicator {
  margin-right: 4px;
  vertical-align: middle;
}

/* symbol suggestion, symbol type icon */
.qsp-symbol-indicator {
  width: 2em;
  text-align: center;
  float: left;
  font-weight: 800;
}

.qsp-symbol-indicator.callout {
  background-color:inherit;
  padding: inherit;
}

/* warning/error text */
.qsp-warning {
  color: var(--text-error);
}

.qsp-tag {
  background-color: var(--background-modifier-hover);
  border-radius: var(--radius-s);
  font-size: 9px;
  font-weight: var(--font-semibold);
  letter-spacing: 0.05em;
  line-height: var(--line-height-normal);
  margin-left: var(--size-2-3);
  padding: 0 var(--size-4-1);
  text-transform: uppercase;
  align-self: center;
}

/* settings panel, indent setting to create visual hierarchy */
.qsp-setting-item-indent {
  border: 0px;
  padding-left: 36px;
}

/* Jan 2026-fix: Add visual divider when a SettingGroup is followed by a single
  Setting (Switcher++ settings only)
*/
.qsp-settings-container .setting-group + .setting-item {
  margin-top: var(--size-4-6);
}

/* symbol suggestion should align to the left */
.suggestion-item.qsp-suggestion-symbol {
  justify-content: left;
}

/* highlight recently used file suggestions */
.suggestion-item.qsp-recent-file .qsp-title {
  text-decoration: underline dotted var(--text-muted);
}

/* highlight currently open editor suggestions */
.suggestion-item.qsp-open-editor .qsp-title {
  text-decoration: underline var(--text-accent);
}

/* highlight the open editor flair icon */
.suggestion-item.qsp-open-editor .suggestion-aux.qsp-aux .qsp-editor-indicator,
.suggestion-item.qsp-open-editor .suggestion-aux.qsp-aux .qsp-editor-indicator svg {
  color: var(--text-accent);
}

/* symbol suggestion display the icon first (on the left side) */
.qsp-suggestion-symbol > .qsp-aux {
  order: -1;
}

/* symbol suggestion indentation when in outline mode */
.qsp-symbol-l0 {
  padding-left: var(--symbol-base-padding);
}

.qsp-symbol-l1 {
  padding-left: calc(var(--symbol-base-padding) + var(--symbol-indent-padding));
}

.qsp-symbol-l2 {
  padding-left: calc(var(--symbol-base-padding) + (2 * var(--symbol-indent-padding)));
}

.qsp-symbol-l3 {
  padding-left: calc(var(--symbol-base-padding) + (3 * var(--symbol-indent-padding)));
}

.qsp-symbol-l4 {
  padding-left: calc(var(--symbol-base-padding) + (4 * var(--symbol-indent-padding)));
}

.qsp-symbol-l5 {
  padding-left: calc(var(--symbol-base-padding) + (5 * var(--symbol-indent-padding)));
}

.qsp-symbol-l6 {
  padding-left: calc(var(--symbol-base-padding) + (6 * var(--symbol-indent-padding)));
}

/* Wrapper container for rendered markdown content using MarkdownRenderer.render() */
.qsp-rendered-container {
  /* Reset white-space from suggestion-item's pre-wrap to prevent newlines in
   rendered HTML (e.g. inside <ol>/<li>) from creating extra line boxes. */
  white-space: normal;
}

/* Override styles for child elements of rendered markdown content */
.qsp-rendered-container > * {
  /* Remove start margin/padding so elements don't take up a bunch of extra
    horizontal space */
  margin-block-start: 0px;
  margin-inline-start: 0px;
  padding-block-start: 0px;
  padding-inline-start: 0px;
  /* Disable elements from reacting to mouse events, so things like links & tags don't
     react to mouseover hover, etc.. */
  pointer-events: none;
}

/* Reset vertical margins on all block elements that Obsidian's .markdown-rendered
   CSS adds spacing to (via --p-spacing). */
.qsp-rendered-container ol,
.qsp-rendered-container ul,
.qsp-rendered-container p,
.qsp-rendered-container pre,
.qsp-rendered-container table,
.qsp-rendered-container blockquote,
.qsp-rendered-container h1,
.qsp-rendered-container h2,
.qsp-rendered-container h3,
.qsp-rendered-container h4,
.qsp-rendered-container h5,
.qsp-rendered-container h6 {
  margin-block-start: 0;
  margin-block-end: 0;
}

/* Ordered lists should keep inline-start padding so the list number is visible.
   Obsidian defaults to 40px. */
.qsp-rendered-container ol {
  padding-inline-start: 40px;
}

/* command suggestion item */
.qsp-suggestion-command {}

/* editor suggestion item */
.qsp-suggestion-editor {}

/* heading suggestion item */
.qsp-suggestion-headings {}

/* related item suggestion */
.qsp-suggestion-related {}

/* symbol suggestion item */
.qsp-suggestion-symbol {}

/* workspace suggestion item */
.qsp-suggestion-workspace {}

/* file suggestion when not in standard mode */
.qsp-suggestion-file {}

/* alias suggestion when not in standard mode */
.qsp-suggestion-alias {}

/* suggestion primary content container */
.qsp-content {}

/* suggestion title element */
.qsp-title {}

/* suggestion secondary information element (like file path information) */
.qsp-note {}

/* suggestion flair/icon container */
.qsp-aux {}

/* Faint styling for optional flair icons, excluding symbol indicators */
.suggestion-aux.qsp-aux > *:not(.qsp-symbol-indicator),
.suggestion-aux.qsp-aux > *:not(.qsp-symbol-indicator) svg {
  color: var(--text-faint);
}

/* Breadcrumb row container - uses flexbox for vertical alignment between icon and text.
   Applies to all breadcrumb types (path, heading, tags). */
.qsp-path,
.qsp-heading-breadcrumbs,
.qsp-tags-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 4px;
}

/* Add spacing between multiple breadcrumb rows (path, heading, tags) */
.qsp-path + .qsp-heading-breadcrumbs,
.qsp-path + .qsp-tags-breadcrumbs,
.qsp-heading-breadcrumbs + .qsp-tags-breadcrumbs {
  margin-top: 2px;
}

/* breadcrumb icon indicator (folder, heading, tags, etc.) */
.qsp-breadcrumb-indicator {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  color: var(--text-faint);
}

/* Ensure icon SVG inherits size properly */
.qsp-breadcrumb-indicator svg {
  width: 1em;
  height: 1em;
}

/* breadcrumb content element */
.qsp-breadcrumb {
  color: var(--text-muted);
}

/* heading breadcrumbs element */
.qsp-heading-breadcrumbs {}

/* tags breadcrumb element */
.qsp-tags-breadcrumbs {}

/* truncated content indicator - displays ellipsis after content */
.qsp-truncated::after {
  content: '…';
}

/* headings suggestion, heading level (H1, H2, etc..) icon */
.qsp-headings-indicator {}

/* flair icon for suggestions that represent a recent file */
.qsp-recent-indicator {}

/* flair icon for suggestion that represent a file currently opened in an editor */
.qsp-editor-indicator {}

/* flair icon for suggestions that represent a related file */
.qsp-related-indicator {}

/* flair icon for suggestions that represent an alias */
.qsp-alias-indicator {}

/* flair indicator for the file extension of file based suggestions */
.qsp-file-ext-indicator {}

/* Quick Open indicator container element */
.qsp-quick-open-aux {
  display: flex;
  align-items: center;
  align-self: center;
  flex-shrink: 0;
}

/* Quick Open hotkey indicator element */
.qsp-quick-open-hotkey {}

/* headings level */
.qsp-headings-l1 {}
.qsp-headings-l2 {}
.qsp-headings-l3 {}
.qsp-headings-l4 {}
.qsp-headings-l5 {}
.qsp-headings-l6 {}

/* Usually the "plus" button button in the NavBar on mobile platforms */
.qsp-mobile-launcher-button {}

/* Prompt instructions element in custom modes */
.qsp-prompt-instructions {}

/* Prompt instructions element for facets in custom modes */
.qsp-prompt-instructions-facets {}

/* Prompt instructions element for mode triggers */
.qsp-prompt-instructions-modes {}