ul,
ol {
    margin-inline-start: 2rem;
    margin-block: 0.5rem;
}

ol li::marker {
    font-style: italic;
}

li::marker {
    color: var(--col-capuccino);
}

blockquote {
    margin-inline-start: 1rem;
    margin-block: 1rem;

    padding-inline-start: 0.75rem;
    padding-inline-end: 2rem;

    padding-block: 0.5rem;
    padding-block-end: 0.7rem;

    font-style: italic;

    border-inline-start: 2px dotted var(--col-caramel);
    color: var(--col-cream);

    background-color: var(--col-choco);

    border-start-end-radius: 0.5rem;
    border-end-end-radius: 0.5rem;
}

blockquote:nth-child(even) {
    border-block: 2px solid var(--col-coffee);
    border-inline-end: 2px solid var(--col-coffee);
}

code {
    padding-block: 0.125rem;
    padding-inline: 0.25rem;

    margin-inline: 0.125rem;
    margin-block: 0;

    border-radius: 0.25rem;

    background-color: var(--col-ebony);
}

pre {
    background-color: var(--col-coffee);

    margin: 0.5rem;

    padding: 0.5rem;
    padding-inline-start: 2rem;

    border-radius: 0.5rem;
    border: 1px solid var(--col-coal);
    overflow-x: scroll;
}

pre code {
    background-color: transparent;

    padding-inline: 0;
    margin-inline: 0;
}

hr {
    margin-block: 1rem;
    border: 0;

    border-block-end: 1px solid var(--col-ash);
}

/*  TABLES  */

table,
td,
th {
    border: 1px solid var(--col-caramel);
    padding: 0.25rem;
    padding-inline: 0.5rem;
}

table {
    border-collapse: collapse;
    margin-block: 1rem;
    width: 100%;
}

thead {
    border-radius: 0.25rem;
    background: linear-gradient(to top,
            var(--col-choco) -75%,
            var(--col-toffee) 150%);
    border-block-end: 2px solid var(--col-capuccino);
}

/*  HEADING TAGS  */

h1,
h2 {
    font-style: italic;
    
    padding-block-end: 0.25rem;
    margin-block-end: 0.5rem;
    position: relative;
    z-index: 7;
}

h1::after,
h2::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 100%;
    width: calc(100% - 7rem);
    border-block-end: 1px dashed var(--col-ash);
    pointer-events: none;
    z-index: 6;
}

h1,
h2,
h3 {
    margin-block-start: 0.5rem;
}

/*  LINKS  */

a {
    color: var(--col-capuccino);
}

a:visited {
    color: var(--col-caramel);
}

a:hover {
    color: var(--col-cream);
}

/*  CHECKBOX  */

input[type="checkbox"] {
    margin-inline-start: 0.5rem;
    margin-inline-end: 0.4rem;

    transform: translateY(0.1em);
    pointer-events: none;
}

input[type="checkbox"][disabled] {
    cursor: default;
}

input[type="checkbox"]:checked+* {
    text-decoration: line-through;
    opacity: 0.65;
}

li:has(> input[type="checkbox"]) {
    list-style: none;
}

/*  IMAGES  */

p img {
    max-width: 100%;
    display: inline-block;

    margin-block: 0.5rem;

    border: 2px solid var(--col-coal);
    border-radius: 0.5rem;
}

p .noimg {
    content: "";
    font-size: small;
    font-style: italic;
    position: relative;

    vertical-align: top;
    padding-inline: 1rem;
    padding-block: 0.25rem;

    border: 2px dotted var(--col-toffee);
}

/*  MISC  */

.footnotes-list {
    font-size: small;
    font-style: italic;

    margin-inline-end: 2rem;
}