:root {
    --ck-content-font-family: inherit !important;
    --ck-content-font-size: inherit !important;
    --ck-content-font-color: inherit !important;
    --ck-content-line-height: inherit !important;
}

.ck-content code,
.ck-content pre {
    color: var(--text-primary);
    background-color: var(--background-secondary);
    border: 1px solid var(--background-active);
    border-radius: 6px;
    white-space: pre;
}

.ck-content code {
    padding: 2px 5px;
}

.ck-content pre code {
    border: 0;
}

.ck-content pre {
    overflow: auto;
    position: relative;
    min-width: unset !important;
}

.ck-content pre .copy-button {
    position: absolute;
    top: 0.5em;
    right: 0.5em;
}

#content h1,
#content h2,
#content h3,
#content h4,
#content h5,
#content h6 {
    color: var(--text-heading);
    border-bottom: 1px solid var(--background-highlight);
    padding-bottom: 5px;
}

#content img {
    max-width: 100%;
    height: auto;
}

a.reference-link > span > .tn-icon {
    margin-inline-end: 3px;
}

body:not(.math-loaded) .math-tex {
    visibility: hidden;
}

body.type-webView {
    #main {
        max-width: unset;
        padding: 0;
        height: 100%;
    }

    #content {
        display: flex;
        flex-direction: column;
        height: 100%;

        h1 {
            display: none;
        }

        iframe.webview {
            width: 100%;
            flex-grow: 1;
            border: 0;
        }
    }
}

/* table styles */
.ck-content table {
    border-collapse: collapse;
    width: 100%;
}

.ck-content table td,
.ck-content table th {
    min-width: 120px;
    border: 1px solid var(--background-highlight);
    padding: 8px;
}

.ck-content table th {
    background-color: var(--background-secondary);
    font-weight: bold;
}
