pre.mermaid {
  box-sizing: border-box;
  margin: 1.5em 0;
  padding: 1.25em;
  border: 1px solid var(--table-border-color);
  border-radius: 8px;
  background: transparent;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  overflow-x: auto;
}

pre.mermaid[data-mermaid-status="rendered"] {
  text-align: center;
  line-height: normal;
  white-space: normal;
}

pre.mermaid svg {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

@media (max-width: 600px) {
  pre.mermaid {
    padding: 0.75em 0.4em;
  }
  pre.mermaid svg {
    min-width: var(--diagram-width);
  }
}

@media print {
  pre.mermaid {
    background: white;
    border-color: #c3cedb;
    break-inside: avoid;
  }
}
