.wp-block-remote-data-blocks-github-file-as-html-automatticremote-data-blocks {

    pre,
    code {
        background-color: #fff;
        border-style: solid;
        border-color: #E2E8F0;
        overflow-x: auto;
        font-size: 85%;
    }

    code {
        padding: 2px;
        border-radius: 4px;
        border-width: 1px;
    }

    pre {
        padding: 0.5rem;
        border-radius: 0.5rem;
        border-width: 2px;
    }

    /*
    * When a markdown file is fetched from GitHub API (https://docs.github.com/en/rest/repos/contents?apiVersion=2022-11-28#get-repository-content),
    * it returns HTML with syntax highlighting classes, but not the styles.
    * Below styles provide the necessary syntax highlighting for code blocks in the converted HTML.
    * Adapted from: https://github.com/sindresorhus/github-markdown-css/blob/main/github-markdown-light.css
    */
    
    .markdown-body .pl-c {
        color: #59636e;
    }
    
    .markdown-body .pl-c1,
    .markdown-body .pl-s .pl-v {
        color: #0550ae;
    }
    
    .markdown-body .pl-e,
    .markdown-body .pl-en {
        color: #6639ba;
    }
    
    .markdown-body .pl-smi,
    .markdown-body .pl-s .pl-s1 {
        color: #1f2328;
    }
    
    .markdown-body .pl-ent {
        color: #0550ae;
    }
    
    .markdown-body .pl-k {
        color: #cf222e;
    }
    
    .markdown-body .pl-s,
    .markdown-body .pl-pds,
    .markdown-body .pl-s .pl-pse .pl-s1,
    .markdown-body .pl-sr,
    .markdown-body .pl-sr .pl-cce,
    .markdown-body .pl-sr .pl-sre,
    .markdown-body .pl-sr .pl-sra {
        color: #0a3069;
    }
    
    .markdown-body .pl-v,
    .markdown-body .pl-smw {
        color: #953800;
    }
    
    .markdown-body .pl-bu {
        color: #82071e;
    }
    
    .markdown-body .pl-ii {
        color: #f6f8fa;
        background-color: #82071e;
    }
    
    .markdown-body .pl-c2 {
        color: #f6f8fa;
        background-color: #cf222e;
    }
    
    .markdown-body .pl-sr .pl-cce {
        font-weight: bold;
        color: #116329;
    }
    
    .markdown-body .pl-ml {
        color: #3b2300;
    }
    
    .markdown-body .pl-mh,
    .markdown-body .pl-mh .pl-en,
    .markdown-body .pl-ms {
        font-weight: bold;
        color: #0550ae;
    }
    
    .markdown-body .pl-mi {
        font-style: italic;
        color: #1f2328;
    }
    
    .markdown-body .pl-mb {
        font-weight: bold;
        color: #1f2328;
    }
    
    .markdown-body .pl-md {
        color: #82071e;
        background-color: #ffebe9;
    }
    
    .markdown-body .pl-mi1 {
        color: #116329;
        background-color: #dafbe1;
    }
    
    .markdown-body .pl-mc {
        color: #953800;
        background-color: #ffd8b5;
    }
    
    .markdown-body .pl-mi2 {
        color: #d1d9e0;
        background-color: #0550ae;
    }
    
    .markdown-body .pl-mdr {
        font-weight: bold;
        color: #8250df;
    }
    
    .markdown-body .pl-ba {
        color: #59636e;
    }
    
    .markdown-body .pl-sg {
        color: #818b98;
    }
    
    .markdown-body .pl-corl {
        text-decoration: underline;
        color: #0a3069;
    }
}
