/**
 * Custom theme knobs for reveal.js.
 *
 * Not compiled. This is a plain CSS file that overrides the custom properties
 * a theme sets, so values can be changed and reloaded without a build step.
 *
 * Usage — load it AFTER the theme stylesheet. Both target :root with the same
 * specificity, so source order is what makes this win:
 *
 *   <link rel="stylesheet" href="dist/reveal.css">
 *   <link rel="stylesheet" href="dist/theme/black.css">
 *   <link rel="stylesheet" href="css/theme/custom.css">
 *
 * Values below are black's, so dropping this in changes nothing until edited.
 *
 * Fonts: black.css embeds Source Sans Pro. Naming a different family here does
 * not load it — add an @font-face or a webfont <link> yourself.
 */

:root {
	/* ---- Background ----------------------------------------------------- */

	/* The one that actually paints the deck. */
	--r-background-color: #221f20;

	/* Only visible as a gradient or image — a flat color here is overridden
	   by --r-background-color above. e.g. linear-gradient(#191919, #000) */
	--r-background: #2b2b2b;

	/* ---- Body text ------------------------------------------------------ */

	--r-main-font: 'Source Sans Pro', Helvetica, sans-serif;

	/* Sized in the deck's own 960x700 coordinate space, not screen pixels —
	   reveal scales everything to fit. Treat it as the root of the type scale. */
	--r-main-font-size: 42px;

	--r-main-color: #dedad6;

	/* Vertical rhythm: space between paragraphs, images, blockquotes, pre. */
	--r-block-margin: 20px;

	/* ---- Headings ------------------------------------------------------- */

	--r-heading-font: 'Source Sans Pro', Helvetica, sans-serif;
	--r-heading-color: #dedad6;
	--r-heading-font-weight: 600;
	--r-heading-line-height: 1.2;
	--r-heading-letter-spacing: normal;
	--r-heading-margin: 0 0 20px 0;

	/* Inherited from the base template, not from black — headings are
	   UPPERCASE unless this is set to `none`. */
	--r-heading-text-transform: uppercase;

	--r-heading-text-shadow: none;
	--r-heading1-text-shadow: none;

	/* Relative to --r-main-font-size. */
	--r-heading1-size: 2.5em;
	--r-heading2-size: 1.6em;
	--r-heading3-size: 1.3em;
	--r-heading4-size: 1em;

	/* ---- Links ---------------------------------------------------------- */

	--r-link-color: #0D89C0;
	--r-link-color-hover: #18adef;

	/* Used only by the .roll hover effect. Nothing derives this — if
	   --r-link-color changes, darken it here by hand. */
	--r-link-color-dark: #096289;

	/* ---- Text selection ------------------------------------------------- */

	--r-selection-color: #dedad6;
	--r-selection-background-color: #168E7F;

	/* ---- Code ----------------------------------------------------------- */

	/* Applies to `code`, `pre` and .code-wrapper. Syntax colors come from the
	   highlight plugin's own stylesheet, not from here. */
	--r-code-font: monospace;
}

/**
 * Controls, progress bar and other UI overlaid on the slides.
 *
 * These are RGB triples, not colors — they get fed to rgba(), so `#fff` breaks
 * them. Use `255, 255, 255`.
 *
 * Left commented because reveal sets them per-slide from the background's
 * luminance, via a class selector that outranks :root. Uncommenting forces one
 * pair deck-wide, which is what you want for a uniform look and wrong if slides
 * alternate between light and dark backgrounds.
 */

/*
.reveal-viewport,
.reveal-viewport.has-dark-background,
.reveal-viewport.has-light-background {
	--r-overlay-element-bg-color: 240, 240, 240;
	--r-overlay-element-fg-color: 0, 0, 0;
}
*/

/**
 * Text color on slides carrying a light background image or color.
 *
 * Not a custom property in the base template — black hard-codes #222 through a
 * mixin. Uncomment to change it.
 */

/*
.reveal section.has-light-background,
.reveal section.has-light-background h1,
.reveal section.has-light-background h2,
.reveal section.has-light-background h3,
.reveal section.has-light-background h4,
.reveal section.has-light-background h5,
.reveal section.has-light-background h6 {
	color: #222;
}
*/
