.documentreader {
    --font-size: var(--root-font-size); /* Reset, use REM */
    --line-height: var(--root-line-height);
    --color-background: var(--root-color-background--grey-dark);
}

.documentreader:active,
.documentreader:hover,
.documentreader:focus {
    --color-background: var(--root-color-background--grey);
}

.documentreader__icon {
    --color: var(--root-color--black);
    --height: 1.25em;
}

.documentreader {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.documentreader__icon {

}

.documentreader {
    font-size: var(--font-size, 1rem); /* Reset, use REM */
    line-height: var(--line-height, 1.6);
    width: calc(var(--line-height) * 1em);
    height: calc(var(--line-height) * 1em);
    background-color: var(--color-background, lightgrey);
}

.documentreader__icon {
    fill: var(--color, black);
    height: var(--height, 1.25em);
}