@font-face {
    font-family: 'JetbrainsMono';
    src: url('/_fonts/JetBrainsMono-Regular.woff2') format('woff2'),
    url('/_fonts/JetBrainsMono-Regular.ttf') format('truetype');
}

.app-name-link {
    display: flex;
    align-items: center;
    justify-content: center;

    img {
        width: 80%;
        height: 80%;
    }
}

code[class*="language-"] {
    font-family: 'JetbrainsMono', monospace;
    font-size: 13px;
    line-height: 1.2;
}

pre button.docsify-copy-code-button {
    color: #fff;
}

div.edit-container {
    display: flex;
    align-items: center;
    justify-content: end;

    a.edit-link {
        display: inline-flex;
        align-items: center;
        gap: 0.5em;
        text-decoration: none;
        transition: color 0.2s;

        svg {
            fill: #fff;
            transition: fill 0.2s;
        }

        &:hover svg {
            fill: var(--link-color-hover);
        }
    }
}

.declaration-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-radius: 0.375rem;
    background-color: #262626;
    color: #BDBDBD;
    font-family: 'JetbrainsMono', monospace;
    font-size: 13px;
    line-height: 1.2;

    p {
        padding: 0;
        margin: 0;
    }

    .declaration-modifier, .param, .access-modifier {
        color: #6C95EB;
    }

    .method {
        color: #39CC9B;
    }

    .field, .property {
        color: #66C3CC;
    }

    .event {
        color: #ED94C0;
    }

    .delegate {
        color: #E1BFFF;
    }
}

.title {
    font-size: var(--font-size-xxxl);
    color: var(--heading-color);
    font-weight: var(--heading-font-weight);
}