.code-window {
  background-color: #1c1c1c;
  color: #f1f1f1;
  padding: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.language {
  font-size: 18px;
  font-weight: bold;
}

.copy-btn {
  background-color: #4CAF50;
  color: #f1f1f1;
  border: none;
  border-radius: 5px;
  padding: 5px 10px;
  font-size: 14px;
  cursor: pointer;
}

pre {
  background-color: #2d2d2d;
  padding: 10px;
  border-radius: 5px;
  overflow: auto;
}

code[class*="language-"] {
  color: #f1f1f1;
  text-shadow: none;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: #7C7C7C;
}

.token.punctuation {
  color: #f1f1f1;
}

.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
  color: #ff79c6;
}

.token.boolean,
.token.number {
  color: #bd93f9;
}

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

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

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

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

.token.regex,
.token.important {
  color: #ffb86c;
}