:root, html[data-theme="light"], html[data-theme="dark"] {
    --primary: #0f3d31;
    --secondary: #22c55e;
    --accent: #22c55e;
    --primary-fg: #fff;

    --body-fg: #333;
    --body-bg: #f4f6f5;
    --body-quiet-color: #666;
    --body-loud-color: #222;

    --header-color: #fff;
    --header-branding-color: #fff;
    --header-bg: #0f3d31;
    --header-link-color: #fff;

    --breadcrumbs-fg: #e8f5e9;
    --breadcrumbs-link-fg: #a5d6a7;
    --breadcrumbs-bg: #0f3d31;

    --link-fg: #16a34a;
    --link-hover-color: #22c55e;
    --link-selected-fg: #22c55e;

    --hairline-color: #e3e6e4;
    --border-color: #d9dcda;

    --selected-bg: #e8f5e9;
    --selected-row: #f1f8f1;

    --button-bg: #22c55e;
    --button-fg: #fff;
    --button-hover-bg: #1ca750;
    --default-button-bg: #0f3d31;
    --default-button-hover-bg: #0a2e24;
    --close-button-bg: #888;
    --close-button-hover-bg: #666;
    --delete-button-bg: #ba2121;
    --delete-button-hover-bg: #a41515;

    --object-tools-bg: #22c55e;
    --object-tools-hover-bg: #1ca750;

    --darkened-bg: #eef1ef;
    --dark-bg: #eef1ef;
}

body {
    background: var(--body-bg);
    color: var(--body-fg);
}

#header {
    background: var(--header-bg);
}

div.breadcrumbs {
    background: #0a2e24;
    color: #e8f5e9;
}

div.breadcrumbs a {
    color: #a5d6a7;
}

.module h2, .module caption, .inline-group h2 {
    background: var(--primary);
    color: #fff;
}

.button, input[type=submit], input[type=button], .submit-row input, a.button {
    background: var(--button-bg);
    color: #fff;
}

.button:hover, input[type=submit]:hover, input[type=button]:hover {
    background: var(--button-hover-bg);
}

.button.default, input[type=submit].default, .submit-row input.default {
    background: var(--default-button-bg);
}

.button.default:hover, input[type=submit].default:hover {
    background: var(--default-button-hover-bg);
}

a:link, a:visited {
    color: var(--link-fg);
}

a:focus, a:hover {
    color: var(--link-hover-color);
}

.selector-chosen h2 {
    background: var(--primary);
}

#branding h1#site-name a {
    color: #fff !important;
}

#content, .module {
    background: #fff;
}

table thead th {
    background: #eef1ef;
}
