.link {
    color: blue;
    font-size: 12px;
}

.plaintext {
    font-size: 12px;
}

.sl-icon { /* icons are messed up by Content-Security-Policy, so we overwrite it here */
    height: 16px;
}

.npm__react-simple-code-editor__textarea { /* fix editor cursor position being displayed incorrectly */
    padding-left: 28px !important;
    word-break: break-all !important;
    padding-right: 14px !important;
}

.sl-code-editor > * > pre { /* related to the cursor position fix */
    padding-right: 14px !important;
}

/* These html and body styles make the footer stay on the bottom if the body is not long enough (e.g. every section is collapsed)
   while also not anchoring the footer to the bottom of the screen, but to the bottom of the document */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

body {
    display: grid;
    grid-template-rows: 1fr auto;
    min-height: 100vh;
}

/* body needs to be wrapped in a div with this class to make the footer behaviour work */
.content-wrapper {
    flex: 1 0 auto;
}