section#api-documentation div.highlight pre {
    color: #b30000;
    display: block;           /* ensures it's treated as a block */
    margin-left: auto;        /* auto margins center block elements */
    margin-right: auto;
    width: fit-content;
}
body[data-theme="light"] section#api-documentation div.highlight,
body[data-theme="light"] section#api-documentation div.highlight pre {
  background-color: #f8f8f8;
}

body[data-theme="dark"] section#api-documentation div.highlight,
body[data-theme="dark"] section#api-documentation div.highlight pre {
  background-color: #202020;
}

/* AUTO → system prefers DARK (acts like dark unless user forced light) */
@media (prefers-color-scheme: dark) {
  body:not([data-theme="light"]) #api-documentation .highlight,
  body:not([data-theme="light"]) #api-documentation .highlight pre {
    background-color: #202020;
  }
}

/* AUTO → system prefers LIGHT (acts like light unless user forced dark) */
@media (prefers-color-scheme: light) {
  body:not([data-theme="dark"]) #api-documentation .highlight,
  body:not([data-theme="dark"]) #api-documentation .highlight pre {
    background-color: #f8f8f8;
  }
}
