/*
Wiremaze skin settings

Adapted from System/PatternSkin/theme_foswiki_noframe.css
Also includes CSS from PatternSkinCssCookbookSidebarToggle so mobile devices can display sidebar

Overrides global settings in layout.css, style.css and colors.css
*/

/***** ADAPTATION OF theme_foswiki_noframe.css *****/
/*** Direct copies ***/
/* outer 'frame' */
#patternScreen {
	padding:0;
}
#patternPage {
	border:none;
}

/*** Changes ***/

/* #patternTopBarContents { and #foswikiLogo { both dropped */

/* Lessen height of topbar */

/* 2.1.6 migration - remove following 3 styles (creating excess whitespace *below* actual header contents)
#patternClearHeaderCenter,
#patternClearHeaderLeft,
#patternClearHeaderRight,  */
#patternTopBar,
#patternTopBarContentsOuter,
#patternTopBarContents {
	height:45px; 
}


/* Remove horizontal divider - showing up in wrong place */
#patternTopBar {
	border:none;
}

/* Lower whitespace on top of content */
#patternSideBarContents, #patternMainContents {
	padding-top:1em; /* From 1em */
}

/* Lower whitespace on left of sidebar, content */
#patternMainContents, #patternBottomBarContents, #patternSideBarContents, #patternTopBarContents {
	padding-left:1em;  /* From 2em */
}

/* Drop '-' from personal nav items */
.patternLeftBarPersonal li {
	background-image:none;
	padding-left:0px;
}

.patternMetaMenu {
	white-space: nowrap;
}

/* Remove pointless divider / whitespace between personal nav and next item */
#patternSideBar #patternSideBarContents .patternLeftBarPersonal {
	border-style: none;
	padding-bottom: 0px;
}

/* Do cool gradient (in Safari and Chrome only) */
.wiremazeCenterHeader {
	-webkit-mask-image: -webkit-gradient(linear, left top, right top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}

/* Indent "log out" text so it doesn't overlap lock */
.patternLogOut a, .patternLogIn a {
        padding-left: 15px;
}

/***** DIRECT COPY OF pub/PatternSkinCssCookbookSidebarToggle/SidebarToggle.css *****/
/* Copied over because AFAICT USERSTYLEURL can only have a single URL */
/* Sidebar Toggle */

button.sidebartoggle-button {
	/* here comes some default formating */
}

/* if button is in sidebar and display is wide enough hide it. */
#patternSideBar button.sidebartoggle-button {
	display: none;
}

/* for nice smooth effects: */
#patternSideBar {
	display:block;
}
#patternOuter {
	transition: margin-left ease-in-out 0.5s;
}

/* only active if normally hidden: */
@media(max-width:870px) {
	body.showsidebar #patternOuter {
		margin-left: 16em;
		transition: margin-left ease-in-out 0.5s;
	}

	/* show button */
	#patternSideBar button.sidebartoggle-button {
		display: block;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 2em;
		height: 2em;
		border-radius: 0.5em;
		border: solid 2px rgba(0,0,0, 0.4);
		background-color: rgba(0,0,0, 0.2);
	}
}