@import 'variables.scss';
@import 'mixins/linear-gradient.scss';

//I use it in a lot of places so it makes sense to have it here
//The faster the better as it is not rendering but browser does calculation based on it
*, *:after, *:before{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	//avoid webkit's automatic text adjustment
	//ie. make text bigger when in landscape
	-webkit-text-size-adjust: none;

	background-color: $footerBackground;

	word-wrap: break-word;

	font-family: 'Open Sans', sans-serif;

	width: 100%;

	font-size: 16px;
	line-height: 26px;
	font-weight: 300;
}

body {
	background-color: $page-background-color;
	color: $page-text-color;
	margin: 0;

	width: 100%;
}

// Error Box
.wkErr {
	background-color: $error-bg-color;
	color: $error-color;
	text-align: left;
	padding-left: 10px;
}

// Button
.wkBtn {
	display: inline-block;
	font-size: medium;
	padding: 5px 10px;
	border: 1px solid $border-color;
	font-weight: 100;
	margin: 10px;
	color: #6A6A6A;
	@include linear-gradient(rgb(253,253,251), rgb(239,239,239));

	&.main {
		@include linear-gradient(rgb(38,148,225), rgb(17,105,178));
		color: white;
	}

	&.round {
		border-radius: 5px;
	}

	&[disabled] {
		background: grey;
	}
}

::-webkit-input-placeholder, :-moz-placeholder {
	color: $placeholder-color;
}

// List
.wkLst {
	list-style: none;
	margin: 0;
	padding: 0;

	li {
		border-bottom: 1px solid $border-color;

		& > a, & > span {
			display: block;
			width: 100%;
			padding: 12px 10px;
		}

		&:last-child {
			border-bottom: none;
		}
	}
}

.cld {
	background-position: right;
	background-origin: content-box;
	background-repeat: no-repeat;
	background-size: 10px;
	background-image:  url('/extensions/wikia/WikiaMobile/images/chevron-blue-right.png'); /* inline */

	a, span {
		padding-right: 15px;
	}
}

//counter displayed mainly in lists or on ArticleComments seaction
h2[data-count] {
	&:after {
		content: attr(data-count);

		position: relative;
		bottom: 3px;

		margin: 10px;
		padding: 1px 4px;

		color: #999;
		font-size: small;
		font-weight:100;

		background: #F2F2F2;

		border-radius: 3px;

		pointer-events: none;
	}
}

//classes with images to avoid loading them more than once
.clsIco{
	background-repeat: no-repeat;
	background-image: url('/extensions/wikia/WikiaMobile/images/close.png'); /* inline */
}

//chevrons
.chg:before, .link .thumbcaption:before {
	content:'';
	background-image: url('/extensions/wikia/WikiaMobile/images/chevron-grey-down.png'); /* inline */
	background-repeat: no-repeat;
}

.wikitable, .sortable, .article-table {
	border-collapse: collapse;
	border: 1px solid $border-color;
}

.wikitable:not(.infobox), .sortable, .article-table {
	td, tr, th, caption {
		border: 1px solid $border-color;
		padding: 5px;
		text-align: left;
		white-space:nowrap;
	}

	caption {
		border-bottom: none;
	}
}

sup.reference {
	font-size: 0.9rem;
	line-height: 0px;
	margin: 2px;
}

a {
	color: $link-color;
	text-decoration: none;

	&.new {
		color: $page-text-color;
		pointer-events: none;
	}
}

dd {
	margin: 0;
}

strong, b {
	font-weight: bold;
}

//Global place for hidden elements in WikiaMobile
.hidden, .mw-hidden-cats-hidden, .hiddenStructure {
	display: none !important;
}
