:root {
	/* normal body text */
	--body-background-rgb: 236, 231, 242;
	--body-background: rgb(var(--body-background-rgb));
	--body-text-rgb: 34, 34, 34;
	--body-text: rgb(var(--body-text-rgb));
	--body-shadow-rgb: 255, 255, 255;
	--bold-mid-text: #333;
	--bold-body-text: #444;
	--link-text: #346;
	--link-text-hover: var(--link-text);
	--header-text: #555;

    /*
     * Header image
     * Not technically a color, but mode-dependant.
     */
    --header-image: url('../images/header_light.png');

	/*
	 * ui elements
	 */

	--main-background: #fff;
	--main-bg-to: #f1f3f5;
	--secondary-background: #f7f7f7;
	--dropdown-bg-to: #e2e9f3;

	--tooltip-background: #ddd;
	--tooltip-hover-background: #888;
	--tooltip-hover-text: #eee;

	--main-border: #b8b8b8;
	--secondary-border: #666;
	--tertiary-border: #ddd;

	--selection-bg: #99d4ff;
	--title-bar-text: #fff;
	--separator: #fff;
	--new-post-background: linear-gradient(#f97b00,#884d00);

	/* breadcrumb nav */
	--bc-bg-from: #7e5ba6;
	--bc-bg-to: #68478d;
	--bc-text: #fff;
	--bc-border: var(--secondary-border);
	--bc-separator: var(--bc-text);

	/* misc boxes */
	--roundframe-background: #f8f8f8;
	--roundframe-border: var(--tertiary-border);

	/* top bars */
	--nav-bg-from: #eef;
	--nav-bg-mid: #fafaff;
	--nav-bg-to: var(--main-background);

	/* "badges" in menus; e.g. `Messages (5)` */
	--badge-background: #6d90ad;
	--badge-text: #fff;
	--menu-badge-background: rgba(0, 0, 0, 0.2);

	/* drop-down menus */
	--dropmenu-bold-text: #333;
	--dropmenu-text-hover: #fff;
	--dropmenu-background-hover: #597b9f;
	--dropmenu-border-hover: #4a6b8c;

	--menu-notify-border: #ddd;
	--menu-notify-background-hover: #eee;

	--menubar-background: #eee;

	/* input colors */
	--input-background: var(--main-background);
	--input-text: var(--body-text);
	--input-border: #bbb;
	--input-disabled-background: #eee;
	--input-disabled-text: #999;
	--input-disabled-border: #b6b6b6;
	--input-border-hover: #82a2bc;
	--input-border-focus: #7fb0d8;
	--input-valid: #f5fff0;
	--input-invalid: #fff0f0;

	/* highlighted (not selected!) text */
	--highlight-color: #ff7200;

	/* pagination */
	--current-page-text: #b46100;

	/* post borders */
	--post-ew-border: #7f7f7f;

	/* buttons */
	--btn-background: #ececec;
	--btn-text: var(--body-text);
	--btn-shadow-rgb: 221, 221, 221;
	--btn-shadow-alt: #ddd;
	--btn-ns-border: #ddd;
	--btn-left-border: #bbb;
	--btn-right-border: #aaa;
	--btn-hover-border: #6af;

	--btn-active-background: #557ea0;
	--btn-active-text: #fff;
	--btn-active-border: #558080;

	--btn-active-hover-text: #ffc187;
	--btn-active-hover-bg-to: #557ea0;
	--btn-active-hover-bg-from: #406482;

	/* callouts */
	--callout-error-bg: #ffeeee;
	--callout-notice-bg: #fff6ca;
	--callout-info-bg: #ccffcc;

	--table-even: #f0f4f7;
	--table-odd: #fdfdfd;
	--table-hover: #e2eef8;
	--table-locked: #e7eaef;
	--table-important: #cfdce8;
	--table-important-locked: #e8d8cf;
	--table-highlight: #ffffe0;

	/* TODO: progress bars */

	/*
	 * editor
	 *   For the most part, we try to follow the general UI colors. There
	 *   are a few special elements though.
	 */
	--editor-btngrp-background: #ddd;
	--editor-btn-fill: #111;
	--editor-btn-disabled-fill: #888;
	--editor-btn-invert: 0.0;

	/*
	 * bbcode
	 */
	/* post quote */
	--quote-ns-border: #d6dfe2;
	--quote-ew-border: #aaa;
	--quote-cite-separator: rgba(0, 0, 0, 0.1);
	--quote-background: #e0e6f6;
	--quote-alt-background: #ebf4f8;
	/* this one applies to both quote and code blocks */
	--quote-header-text: #666;
	/* code block */
	--code-background: #f3f3f3;
	--code-top-border: #bbb;
	--code-bottom-border: #aaa;
	--code-ew-border: #dfdfdf;
	/* bbcode link */
	--bbcode-link: #a8b6cf;

	/* warning levels */
	--warn-moderate-text: #ffa500;
	--warn-watch-text: green; /* ??? */
	--moderation-link-background: #f59e00; /* ??? */

	/* user colors */
	--user-birthday-text: #920ac4;
	--user-event-text: #078907;
	--user-holiday-text: #025dff;


	/* ajax notification bar */
	--notify-bar-background: var(--main-background);
	--notify-bar-color: #f96f00;
}
