.ccs-code-snippet {
  margin: 2rem 0;
  border-radius: 14px;
  overflow: hidden;
  background: #020617;
  border: 1px solid #1e293b;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.28);
}

.ccs-code-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 42px;
  padding: 0 1rem;
  background: #0f172a;
  border-bottom: 1px solid #1e293b;
}

.ccs-code-title {
  margin: 0;
  color: #cbd5e1;
  font-size: 0.875rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.ccs-code-snippet pre[class*="language-"] {
  margin: 0;
  padding: 1rem;
  overflow-x: auto;
  white-space: pre;
  tab-size: 2;
  border-radius: 0;
}

.ccs-code-snippet code[class*="language-"] {
  white-space: pre;
  font-size: 0.92rem;
  line-height: 1.75;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.ccs-code-snippet .line-highlight {
  margin-top: 1rem;
  background: linear-gradient(to right, rgba(250, 204, 21, 0.22), rgba(250, 204, 21, 0.06));
}

.ccs-code-snippet div.code-toolbar > .toolbar {
  top: -2.45rem;
  right: 0.75rem;
  opacity: 1;
}

.ccs-code-snippet div.code-toolbar > .toolbar > .toolbar-item > button,
.ccs-code-snippet div.code-toolbar > .toolbar > .toolbar-item > a,
.ccs-code-snippet div.code-toolbar > .toolbar > .toolbar-item > span {
  color: #e2e8f0;
  background: #1e293b;
  border: 1px solid #334155;
  border-radius: 8px;
  padding: 0.25rem 0.55rem;
  font-size: 0.75rem;
  box-shadow: none;
}

.ccs-code-snippet .line-numbers .line-numbers-rows {
  border-right-color: #334155;
}

.ccs-code-snippet .line-numbers-rows > span:before {
  color: #64748b;
}