/* Some Clang pages use red/green comparison tables for bad and corrected code.
   Keep the surfaces theme-aware so Pygments colors stay readable. */
body {
  --clang-code-comparison-bad-background: #fff1f1;
  --clang-code-comparison-bad-border: #d73a49;
  --clang-code-comparison-good-background: #eef9ee;
  --clang-code-comparison-good-border: #2da44e;
}

body[data-theme="dark"] {
  --clang-code-comparison-bad-background: rgba(248, 81, 73, 0.16);
  --clang-code-comparison-bad-border: #f85149;
  --clang-code-comparison-good-background: rgba(63, 185, 80, 0.16);
  --clang-code-comparison-good-border: #3fb950;
}

.content table.colored-code-table td,
.content table.colored-code-table th {
  text-align: left;
}

.content table.colored-code-table td:first-child,
.content table.colored-code-table th:first-child {
  background-color: var(--clang-code-comparison-bad-background);
}

.content table.colored-code-table td:nth-child(2),
.content table.colored-code-table th:nth-child(2) {
  background-color: var(--clang-code-comparison-good-background);
}

.content table.colored-code-table td .highlight,
.content table.colored-code-table td pre {
  background-color: transparent;
  border: none;
}

.content div.bad-code,
.content div.good-code {
  padding: 5px;
  text-align: left;
}

.content div.bad-code {
  background-color: var(--clang-code-comparison-bad-background);
  border-left: 4px solid var(--clang-code-comparison-bad-border);
}

.content div.good-code {
  background-color: var(--clang-code-comparison-good-background);
  border-left: 4px solid var(--clang-code-comparison-good-border);
}

.content div.bad-code .highlight,
.content div.bad-code pre,
.content div.good-code .highlight,
.content div.good-code pre {
  background-color: transparent;
  border: none;
}