@import "../variables";
//@import "../base/base-reset";
@import "../markup-mixins";
//@import "../960";
@import "variables";

/* WDOCS nav tree */

#wdocs-tree.menu {
	border: solid 1px $wdocs-border-color;
	border-top: none;
	background-color: $wdocs-bg-color;
	color: $wdocs-color;
	padding: 0;
	a {
		color: $wdocs-color;
	}
	>ul>li {
		cursor: pointer;
		padding: 5px 0 3px 5px;
		border-top: solid 1px $wdocs-border-color;
		>a {
			color: $wdocs-link-color;
		}
		&.expandable>*+a {
			display: inline-block;
			width: 85%;
		}
	}
	.arrow {
		font-family: "Lucida Console", "Courier New", "serif";
		color: $wdocs-link-color;

		border-style: solid;
		border-color: transparent;
		border-width: 6px;
		display: -moz-inline-box;
		display: inline-block;
		/* Use font-size to control the size of the arrow. */
		font-size: 10px;
		height: 0;
		line-height: 0;
		position: relative;
		vertical-align: middle;
		width: 0;
		left: -10px;
	}

	li>a {
		padding-left: 12px;
	}
	li.arrowed>a {
		padding-left: 0;
		background-color: transparent;
	}
	li.arrowed:not(.expandable) {
		>.arrow {
			left: -4px;
			border-width: 3px;
			border-color: $wdocs-tree-arrow-light;
			top: 0;
		}
		>a {
			padding-left: 6px;
		}
	}
	>ul>li.arrowed:not(.expandable)>.arrow {
			border-color: $wdocs-tree-arrow;
	}
	li.expandable>.arrow {
		left: -4px;
		border-color: transparent;
		border-left-color: $wdocs-tree-arrow;
		top: 0;
		&:hover {
			border-color: transparent;
			border-left-color: $wdocs-link-color;
		}
	}
	li.expanded>.arrow {
		left: -6px;
		border-color: transparent;
		border-top-color: $wdocs-tree-arrow;
		top: 2px;
		&:hover {
			border-color: transparent;
			border-top-color: $wdocs-link-color;
		}
	}

	>ul>li>ul>* {
		font-size: smaller;
		background-color: $wdocs-bg-color;
		padding-left: 10px;
	}
	ul {
		list-style-type: none;
		padding: 0;
	}
	ul li {
		padding-left: 10px;
		a:hover {
			color: $wdocs-link-h-color;
		}
	}

	li.active {
		font-weight: bold;
		//border-left: dotted 1px $wdocs-link-h-color;
		border-right: solid 2px $wdocs-link-h-color;
		background-color: $wdocs-link-active-bg-color;
	}
	li.active li {
		font-weight: normal;
	}

	li.expandable:not(.expanded) li {
		display: none;
	}
	li.expandable.expanded>a {
		font-weight: bold;
	}
}

.wikipage {
	font: 16px/24px "Open Sans", Arial, Helvetica, sans-serif;
	line-height: 1.8;
	a.wiki_link {
		&.wiki_notfound {
			color: red;
		}
	}
	table {
		border: solid 1px #666;
		margin-bottom: 5px;
	}
	td {
		border: solid 1px #999;
		padding: 2px 4px 2px 4px;
	}
	h1 {
		&.wikititle {
			font-weight: bold !important;
		}
		color: $wdocs-h1-color;
		font-weight: bold;
		margin-top: 25px;
		border-bottom: solid 2px $wdocs-h1-color;
	}
	h2 {
		color: $wdocs-h2-color;
		line-height: 3.5rem;
		font-weight: bold;
		margin-top: 2rem;
		margin-bottom: 1rem;
		border-bottom: solid 3px $wdocs-h2-color;
	}
	h3 {
		color: $wdocs-h3-color;
		line-height: 3.2rem;
		margin-top: 10px;
		border-bottom: solid 1px $wdocs-h3-color;
	}
	h4 {
		margin-top: 1.5rem;
		margin-bottom: .5rem;
	}
	pre {
		@include border-radius(4px);
		display: block;
		font-family: monospace;
		white-space: pre-wrap;

		border: solid 1px #ccc;
		background-color: #FFFFD8;
		line-height: 1.3;
		padding: 10px;
		margin: 2px 0 2px 0;
		overflow: auto;

	}
	dt {
		font-weight: bold;
	}
	dd {
		font-style: italic;
	}
}

#content {
	.wdocs-nav {
		padding: 5px;
		margin-top: 0.75em;
		border-top: solid 1px #999;
		background-color: $wdocs-nav-bg-color;
		ul {
			margin: 0 0 0.5em 0;
			li {
				margin: 0.3em;
			}
		}
		a {
			color: $wdocs-nav-color;
		}
		.wdocs-nav-section {
			font-weight: bold;
		}
		.wdocs-uuid {
			color: $wdocs-fade;
			font-size: xx-small;
			text-align: right;
		}
	}
	.wdocs-cache-info {
		color: $wdocs-fade;
		font-size: xx-small;
		text-align: right;
	}

	.wiki-toc {
		@extend %clearfix;
		clear: both;
		margin: 10px;
		padding: 1.5em;
	}
	.bookcards {
		padding: 0;
		margin: 0;
		ul{
			@extend %listreset;
			li{
				display: inline-block;
				//@include grid(4);
				height: 140px;
				margin: 0 10px 5px 0px;
				a{
					border: solid 1px #ddd;
					margin: 10px;
					padding: 7px;
					background: #e9eced;
					display: block;
					text-align: left;
					@include border-radius(7px);
					&:hover{
						background: #e3e7e8;
					}
				}
				img {
					float: left;
					opacity: 0.4;
				}
				h2{
					font: #{$base-h2-size}/#{$base-h2-lineheight} $museo_slab500;
					padding: 0;
					margin-top: 5px;
					margin-bottom: 10px;
				}
				p{
					font-size: smaller;
					line-height: 1.2em;
					margin: 0;
					padding: 0 0 0 10px ;
					font-style: italic;
					color: #666;
					height: 60px;
					overflow: auto;
				}
			}
		}
	}
}
#wdocs_edit textarea {
	width: 98%;
}

#wdocs-versions.menu {
	padding: 0px;
	margin: 5px 0 0 0;
	background-color: white;
	border: solid 1px #999;
	ul {
		padding: 0 0 0 20px;
		margin: 0px;
		list-style-type: none;
		li>ul {
			padding: 10px;
			background-color: white;
			border: solid 1px #999;
			display: none;
			font-size:smaller;
		}
		li:hover>ul {
			position: absolute;
			display: block;
			z-index: 99;
		}
	}
}
