/* ===== Markup-rendered elements =====
 *
 * Plain element selectors scoped under markup so they don't
 * bleed into other sidebar elements. markup.js generates plain
 * <ul>, <li>, <p> tags without class attributes.
 */

.markup {
    padding: 2px 10px 4px;
    font-size: 11px;
    color: var(--text3);
    line-height: 1.6;
}

    .markup ul {
        margin: 0 0 4px;
        padding-left: 4px;
        list-style: none;
    }

    .markup li {
        position: relative;
        padding-left: 10px;
        margin-bottom: 3px;
        line-height: 1.6;
    }

        .markup li::before {
            content: '•';
            position: absolute;
            left: 0;
            color: var(--text3);
        }

    /* Nested list */
    .markup ul ul {
        margin-top: 2px;
        margin-bottom: 0;
        padding-left: 10px;
    }

        .markup ul ul li::before {
            content: '◦';
        }

    .markup p {
        margin: 0 0 4px;
    }

    .markup strong {
        color: var(--text2);
    }