@import url("gruvbox-material.css");

:root {
    --background: var(--bg0);
    --foreground: var(--fg0);
    --accent: var(--green);
    --faint_foreground: var(--grey0);
    --code_background: var(--bg_dim);
    --highlight_background: var(--bg3);
}

::selection, ::-moz-selection {
    background: var(--highlight_background);
}

a {
    color: var(--accent);
    /* actually i don't like how transitions look */
    /* transition: 0.3s; */
}

a:hover {
    color: var(--background) !important;
    background-color: var(--accent) !important;
    text-decoration-line: none;
}

.code-toolbar {
    border: 1px solid var(--bg3);
}

code {
    background: var(--code_background);
}

.post-meta {
    color: var(--faint_foreground);
}

.footnotes {
    color: var(--faint_foreground);
}

/* note: grey0 is actually fg0 with 0.5 opacity over bg0, so the below footer css has no effect. however, i've decided
 * to write it this way because i prefer to not use opacity to create colours when possible, instead setting
 * full-opacity explicit/unmodified colours. opacity is still used to create the dimmer hr in the footer.
 * I would set the hr full opacity but there isn't really a "dim green" I can use. */

.footer {
    opacity: 1 !important;
    color: var(--faint_foreground);
}

.footer hr {
    opacity: 0.5;
}