/* =============================================================
   Sitemap  —  /assets/css/sitemap.css

   Append to main.css, or link after it in /sitemap/index.shtml:
       <link rel="stylesheet" href="/assets/css/sitemap.css" />

   Matched to main.css:
       accent          #990909   (site link colour)
       headings        #373737
       body text       #474747
       muted text      #a0a0a0 / #878787
       rules           #d9d9d9 / #eee
       panel fill      #f6f6f6
       display face    'Crimson Text', serif
       UI face         'Open Sans', sans-serif
       mobile break    736px

   Everything is scoped under .sm or prefixed .sm- so nothing here
   can affect another page. A few rules exist only to undo main.css
   defaults that would otherwise fight the layout, chiefly
   #content ul { margin-left: 2em; list-style-type: circle }.
   ============================================================= */

/* ---------- Page intro ---------- */

	.sm .sm-intro {
		max-width: 40em;
		margin-bottom: 1.5em;
	}

/* ---------- Filter toolbar ---------- */

	.sm .sm-toolbar {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		-webkit-align-items: baseline;
		-ms-align-items: baseline;
		align-items: baseline;
		margin-bottom: 1em;
	}

	.sm .sm-toolbar-label {
		font-family: 'Open Sans', sans-serif;
		font-size: 0.8em;
		letter-spacing: 0.15em;
		text-transform: uppercase;
		color: #a0a0a0;
		margin-right: 1.25em;
		white-space: nowrap;
	}

	/* Inherits the #content input[type="search"] treatment already in
	   main.css — rounded, 1px #cccccc, blue focus ring. Only sizing here. */
	.sm .sm-filter {
		-webkit-flex: 1 1 18em;
		-ms-flex: 1 1 18em;
		flex: 1 1 18em;
		min-width: 0;
		margin-right: 1.25em;
	}

	.sm .sm-count {
		font-family: 'Open Sans', sans-serif;
		font-size: 0.8em;
		color: #a0a0a0;
		white-space: nowrap;
	}

/* ---------- Section jump links ---------- */

	.sm .sm-jump {
		font-family: 'Open Sans', sans-serif;
		font-size: 0.85em;
		padding-bottom: 1.25em;
		margin-bottom: 0.5em;
		border-bottom: solid 1px #d9d9d9;
	}

		.sm .sm-jump a {
			display: inline-block;
			margin: 0 1.5em 0.35em 0;
		}

/* ---------- "New here?" panel (rides on .toc from main.css) ---------- */

	.sm .sm-start {
		width: auto;
		max-width: 40em;
		background-color: #f6f6f6;
		border-left: solid 3px #990909;
		margin: 2em 0 1em 0;
	}

		.sm .sm-start ol {
			margin-bottom: 0;
		}

		.sm .sm-start ol li {
			padding: 0.2em 0;
		}

		.sm .sm-start[hidden] {
			display: none;
		}

/* ---------- Groups ---------- */

	.sm .sm-group {
		display: block;
		padding-top: 2em;
		margin-bottom: 0;
		border-top: solid 1px #d9d9d9;
	}

		.sm .sm-group[hidden] {
			display: none;
		}

		.sm .sm-group > h3 {
			font-size: 1.5em;
			font-weight: bold;
			color: #373737;
			margin: 0 0 0.25em 0;
		}

		.sm .sm-group > .sm-blurb {
			max-width: 42em;
			margin-bottom: 1.75em;
			color: #6f6f6f;
		}

/* ---------- Clusters ---------- */

	.sm .sm-cluster {
		margin-bottom: 2em;
	}

		.sm .sm-cluster[hidden] {
			display: none;
		}

		.sm .sm-cluster > h4 {
			font-family: 'Open Sans', sans-serif;
			font-size: 0.8em;
			font-weight: 400;
			letter-spacing: 0.18em;
			text-transform: uppercase;
			color: #990909;
			padding-bottom: 0.5em;
			margin: 0 0 0.75em 0;
			border-bottom: solid 1px #eee;
		}

/* ---------- Page list ---------- */

	.sm ul.sm-pages {
		/* undoes #content ul { margin-left: 2em; list-style-type: circle } */
		margin-left: 0;
		margin-bottom: 0;
		padding-left: 0;
		list-style: none;
		list-style-type: none;
	}

		.sm ul.sm-pages > li {
			display: grid;
			grid-template-columns: minmax(10em, 17em) 1fr;
			grid-column-gap: 1.5em;
			-webkit-column-gap: 1.5em;
			column-gap: 1.5em;
			-webkit-align-items: baseline;
			-ms-align-items: baseline;
			align-items: baseline;
			padding: 0.35em 0;
			border-bottom: solid 1px #f4f4f4;
		}

			.sm ul.sm-pages > li:last-child {
				border-bottom: 0;
			}

			.sm ul.sm-pages > li[hidden] {
				display: none;
			}

		.sm .sm-desc {
			/* display:block is the fallback where grid is unsupported —
			   the description drops to its own line instead of running
			   into the link. Under grid it is simply the second cell. */
			display: block;
			font-size: 0.9em;
			line-height: 1.5em;
			color: #878787;
		}

/* ---------- Empty state ---------- */

	.sm .sm-empty {
		padding: 2em 0;
		font-style: italic;
		color: #878787;
	}

		.sm .sm-empty[hidden] {
			display: none;
		}

/* ---------- Mobile ---------- */

	@media screen and (max-width: 736px) {

		.sm .sm-toolbar-label {
			display: block;
			width: 100%;
			margin: 0 0 0.5em 0;
		}

		.sm .sm-filter {
			-webkit-flex: 1 1 100%;
			-ms-flex: 1 1 100%;
			flex: 1 1 100%;
			margin: 0 0 0.5em 0;
		}

		.sm ul.sm-pages > li {
			display: block;
			padding: 0.5em 0;
		}

		.sm .sm-jump a {
			margin-right: 1.1em;
		}

		.sm .sm-start {
			padding: 1em;
		}

	}

/* ---------- Print ---------- */

	@media print {

		.sm .sm-toolbar,
		.sm .sm-jump {
			display: none;
		}

		.sm .sm-group,
		.sm .sm-cluster {
			page-break-inside: avoid;
		}

	}