:root {
    /* font-size: 18px; */
    font-size: var(--step-0, 18px);

    --font-size: var(--step-0, 18px);
    --font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    --lumo-font-family: var(--font-family);

    /* --brand: rgb(1, 123, 197); */
    --brand: hsl(203, 99%, 39%);
    /* --brand: #017bc5; /* hsl(203, 99%, 39%) / rgb(1, 123, 197) */
    --on-brand: #fff;

    --lumo-primary-color: var(--brand, #017bc5);
    --lumo-primary-color-75pct: hsla(203, 99%, 39%, 0.75);
    --lumo-primary-color-50pct: hsla(203, 99%, 39%, 0.5);
    --lumo-primary-color-10pct: hsla(203, 99%, 39%, 0.1);
    --lumo-primary-color-5pct: hsla(203, 99%, 39%, 0.05);
    --lumo-primary-contrast-color: #fff;

    /* body */
    --lumo-base-color-gp: #f5f5f5;

    /* navbar */
    --app-navbar-bg: #017bc5;
    /* --app-navbar-height: 72px; */
    /* --app-navbar-bg: #193534; */
    /* --app-navbar-text: #fff; */
    --navbar-link: hsl(from #fff h s l / 0.8);
    --navbar-link-hover: hsl(from #fff h s l / 1);

    /* links */
    --link-radius: var(--lumo-border-radius-s);
    --link-icon-color: var(--lumo-contrast-60pct);
    /* --link-icon-color: var(--lumo-primary-color-75pct); */
    /* --link-badge-bg: var(--lumo-primary-color); */
}

:root[theme~="dark"],
:root [theme~="dark"] {
    --brand: hsl(203, 99%, 39%);

    --lumo-primary-color: var(--brand, #017bc5);
    --lumo-primary-color-75pct: hsla(203, 99%, 39%, 0.8);
    --lumo-primary-color-50pct: hsla(203, 99%, 39%, 0.5);
    --lumo-primary-color-10pct: hsla(203, 99%, 39%, 0.15);
    --lumo-primary-color-5pct: hsla(203, 99%, 39%, 0.075);

    --lumo-base-color-gp: var(--lumo-base-color);
    --app-navbar-bg: hsl(203, 99%, 19%);
    /* --link-icon-color: var(--lumo-primary-color-75pct); */
    --link-icon-color: hsl(from var(--brand) calc(h + 211) calc(s - 5) calc(l + 5) / 0.75);
    --link-badge-bg: hsl(from var(--brand) h calc(s - 25) calc(l - 2) / 1);


    --footer-address-img-filter: saturate(0) brightness(1.5);
}