/* ═══════════════════════════════════════════════
   Prism.js — GitHub Dark Theme for CloudAI
   Matches GitHub's code block styling
   ═══════════════════════════════════════════════ */

code[class*="language-"],
pre[class*="language-"] {
  color: #e6edf3;
  background: none;
  font-family: 'SFMono-Regular', 'Fira Code', 'JetBrains Mono', 'Cascadia Code', Consolas, 'Liberation Mono', Menlo, monospace;
  font-size: 13px;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.6;
  tab-size: 2;
  hyphens: none;
}

/* Code blocks */
pre[class*="language-"] {
  background: #0d1117;
  border: 1px solid #30363d;
  border-radius: 8px;
  padding: 16px;
  margin: 12px 0;
  overflow: auto;
  position: relative;
}

/* Inline code */
:not(pre) > code[class*="language-"],
:not(pre) > code {
  background: rgba(110,118,129,0.2);
  color: #e6edf3;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.88em;
  font-family: 'SFMono-Regular', Consolas, monospace;
}

/* ── Language label ──────────────────────────── */
pre[class*="language-"]::before {
  content: attr(data-language);
  position: absolute;
  top: 0;
  right: 0;
  padding: 2px 10px;
  font-size: 10px;
  color: #7d8590;
  background: #161b22;
  border-bottom-left-radius: 6px;
  border-top-right-radius: 7px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-family: -apple-system, sans-serif;
}

/* ── Token Colors (GitHub Dark exact) ────────── */

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: #8b949e;
  font-style: italic;
}

.token.punctuation {
  color: #e6edf3;
}

.token.namespace {
  opacity: 0.7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
  color: #79c0ff;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #a5d6ff;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
  color: #e6edf3;
}

.token.atrule,
.token.attr-value,
.token.keyword {
  color: #ff7b72;
}

.token.function,
.token.class-name {
  color: #d2a8ff;
}

.token.regex,
.token.important,
.token.variable {
  color: #ffa657;
}

.token.important,
.token.bold {
  font-weight: bold;
}

.token.italic {
  font-style: italic;
}

.token.entity {
  cursor: help;
}

/* ── Specific language overrides ─────────────── */

/* Python */
.language-python .token.keyword { color: #ff7b72; }
.language-python .token.builtin { color: #d2a8ff; }
.language-python .token.decorator { color: #d2a8ff; }
.language-python .token.string { color: #a5d6ff; }
.language-python .token.number { color: #79c0ff; }

/* JavaScript */
.language-javascript .token.keyword { color: #ff7b72; }
.language-javascript .token.function { color: #d2a8ff; }
.language-javascript .token.string { color: #a5d6ff; }
.language-javascript .token.template-string { color: #a5d6ff; }

/* Bash / Shell */
.language-bash .token.function { color: #d2a8ff; }
.language-bash .token.builtin { color: #79c0ff; }
.language-bash .token.variable { color: #ffa657; }

/* YAML */
.language-yaml .token.key { color: #7ee787; }
.language-yaml .token.string { color: #a5d6ff; }
.language-yaml .token.boolean { color: #79c0ff; }

/* Docker */
.language-docker .token.keyword { color: #ff7b72; }
.language-docker .token.instruction { color: #ff7b72; }

/* JSON */
.language-json .token.property { color: #7ee787; }
.language-json .token.string { color: #a5d6ff; }
.language-json .token.number { color: #79c0ff; }

/* HTML */
.language-html .token.tag { color: #7ee787; }
.language-html .token.attr-name { color: #79c0ff; }
.language-html .token.attr-value { color: #a5d6ff; }

/* CSS */
.language-css .token.property { color: #79c0ff; }
.language-css .token.selector { color: #7ee787; }
.language-css .token.function { color: #d2a8ff; }

/* SQL */
.language-sql .token.keyword { color: #ff7b72; }
.language-sql .token.function { color: #d2a8ff; }

/* ── Line highlight ──────────────────────────── */
.line-highlight {
  background: rgba(56,139,253,0.1);
  border-left: 3px solid #388bfd;
}

/* ── Scrollbar styling ───────────────────────── */
pre[class*="language-"]::-webkit-scrollbar {
  height: 6px;
}

pre[class*="language-"]::-webkit-scrollbar-track {
  background: transparent;
}

pre[class*="language-"]::-webkit-scrollbar-thumb {
  background: #30363d;
  border-radius: 3px;
}

pre[class*="language-"]::-webkit-scrollbar-thumb:hover {
  background: #484f58;
}

/* ── Copy button (GitHub style) ──────────────── */
pre .copy-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  background: #21262d;
  color: #c9d1d9;
  border: 1px solid #30363d;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.2s, background 0.2s;
  font-family: -apple-system, sans-serif;
  z-index: 2;
}

pre:hover .copy-btn {
  opacity: 1;
}

pre .copy-btn:hover {
  background: #30363d;
  border-color: #484f58;
}

pre .copy-btn:active {
  background: #388bfd;
  color: #fff;
  border-color: #388bfd;
}

/* ── Line numbers (optional) ─────────────────── */
.line-numbers .line-numbers-rows {
  border-right: 1px solid #21262d;
}

.line-numbers-rows > span:before {
  color: #484f58;
}
