/* Pretty JSON viewer (json-formatter tree).
   Global (non-scoped) on purpose: prettyJsonInterop.render replaces the host
   element's className and json-formatter appends un-scoped child nodes, so
   Blazor scoped CSS cannot reliably target them. */
.pretty-json-viewer__host,
.pretty-json-host {
    overflow: auto;
    border: 1px solid var(--mud-palette-lines-default);
    border-radius: var(--mud-default-borderradius);
    background: var(--mud-palette-surface);
    padding: 0.5rem 0.75rem;
}

.pretty-json-host--tree .json-formatter-row {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.8125rem;
}

.pretty-json-fallback {
    margin: 0;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.8125rem;
    white-space: pre-wrap;
    word-break: break-word;
    color: var(--mud-palette-text-primary);
}

.pretty-json-host--dark {
    background: var(--mud-palette-background);
}

.pretty-json-host--dark.json-formatter-dark .json-formatter-string,
.pretty-json-host--dark.json-formatter-dark .json-formatter-stringifiable {
    color: #ce9178;
}
