@charset "utf-8";

:root {
    --brand-color: #818181;
    --brand-color-light: color-mix(in oklab, var(--brand-color), white 40%);
    --brand-color-very-light: color-mix(in oklab, var(--brand-color), white 80%);
    --brand-color-dimmed: color-mix(in oklab, var(--brand-color), black 11%);
    --brand-color-dark: color-mix(in oklab, var(--brand-color), black 25%);

    --site-title-color: var(--brand-color-dark);

    --heading-color: #111111;
    --text-color: var(--brand-color-dark);
    --background-color: #fdfdfd;
    --code-background-color: #EEEEFFFF;

    --link-base-color: #1e69d8;
    --link-visited-color: color-mix(in oklab, var(--link-base-color), black 15%);
    --link-hover-color: var(--text-color);

    --border-color-01: var(--brand-color-light);
    --border-color-02: color-mix(in oklab, var(--brand-color), white 35%);
    --border-color-03: var(--brand-color-dark);

    --table-text-color: color-mix(in oklab, var(--heading-color), white 18%);
    --table-zebra-color: color-mix(in oklab, var(--brand-color), white 46%);
    --table-header-bg-color: color-mix(in oklab, var(--brand-color), white 43%);
    --table-header-border: color-mix(in oklab, var(--brand-color), white 37%);
    --table-border-color: var(--border-color-01);
}