@use './markdown.scss' as *;
@use './code.scss' as *;

:root {
  --mc-font-size: 14px;
  --mc-aide-text: #71757f;
  --mc-text-weak: #878ea8;
  --mc-text: #252b3a;
  --mc-line: #526ecc;
  --mc-dividing-line: #212124;
  --mc-link: #526ecc;
  --mc-link-active: #526ecc;
  --mc-bg: #fff;
  --mc-global-bg: #f6f6f8;
  --mc-base-bg: #ffffff;
}

.mc-markdown-render {
  font-size: var(--mc-font-size, 14px);
  overflow-x: auto;
  &.mc-markdown-render-dark {
    color: #ced1db;
  }
  &.mc-markdown-render-light {
    color: #252b3a;
  }
}

:deep(.mc-think-block) {
  color: var(--mc-aide-text);
  border-left: 1px solid var(--mc-line);
  padding-left: 8px;
  margin-bottom: 1rem;
}

:deep(.mc-typewriter-color) {
  background-image: -webkit-linear-gradient(left, #191919, #5588f0, #e171ee, #f2c55c);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

:deep(.mc-typewriter-gradient) {
  background: linear-gradient(to right, var(--mc-text), var(--mc-base-bg));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

:deep(.mc-typewriter-cursor) {
  font-weight: 900;
  animation: typewriter 800ms linear 0s infinite;
}

@keyframes typewriter {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}