
@import "variables.scss";
@import "functions.scss";
@import "fonts.scss";
@import "mixins.scss";

.fw {
	display: block;
	width: 100%;

	&[data-place="top-middle"] {
		text-align: center;
	}

	&[data-place="top-right"] {
		text-align: right;
	}

	&[data-place="top-left"] {
		text-align: left;
	}
}

// TODO: Reorder and organize elements
// TODO: Differentiate edition specific styles and generic ones
[data-type="hot-spot"] {
	display: none;
}

.bibl {
	.editor {
		font-style: italic;
	}

	.title {
		font-weight: bold;
	}
}

.del {
	text-decoration: none;
}

div.div {
	display: block;
	margin: 15px 0;
	background: inherit;
}

.emph {
	font-style: italic;
	font-weight: bolder;
}

.encodingError {
	font-variant: small-caps;
	background: url('../images/encodingError.png') repeat-x;

	&::before {
		content: "[ERROR]";
	}
}

.figure {
	display: block;
	text-align: center;
	margin: 10px 0px;

	.desc {
		font-size: 90%;
	}
}

.front {
	.titlePage {
		text-align: center;
		font-weight: bold;
		margin-bottom: 20px;
		font-size: 110%;
		display: block;
	}
}

.head {
	display: block;
	font-weight: bold;
	margin-bottom: 1.5rem;

	.ng-scope {
		font-weight: normal;
	}
}

.l {
	display: inline;
	background: inherit;

	>*:last-child:after {
		//content: " ";
	}

	&.inApparatus {
		display: inline-block;

		&::after {
			content: " // ";
		}
	}

	&-block {
		display: block;
	}

	&[data-rend='indent']:not(.l-hasLineN),
	&-hasLineN[data-rend='indent'] .lineContent {
		text-indent: 1.5rem;
	}

	.lineContent {
		display: inline-block;
	}

	&-hasLineN[data-rend='indent'] {
		text-indent: 0 !important;
	}

	&-indent:not(.l-hasLineN) {
		margin-left: 34px;
	}

	.lineN {
		text-align: right;
		color: grey;
		font-size: 0.8em;
		margin-right: 10px;
		height: 100%;
		width: 24px !important;
		display: inline-block;
	}
}

.lacuna,
.fragment {
	font-variant: small-caps;
	font-size: 60%;
	vertical-align: 10%;
	margin-left: 3px;
}

.lacunaStart,
.lacunaEnd {
	display: none;
}

.lb {
	.lineN {
		text-align: right;
		color: grey;
		font-size: 0.8em;
		margin-right: 10px;
		height: 100%;
		width: 24px !important;
		display: inline-block;
	}
}

.fragment {
	min-height: 10px;
	height: 10px;
	position: relative;
	display: block;
	padding: 8px 0px 39px 0px;
	min-width: 100%;
	width: 109.5%;
	left: -5%;
	margin: 0;

	&-start {
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,e5e5e5+100 */
		background: #bdbdbd;
		/* Old browsers */
		background: -moz-linear-gradient(top, $box-witness-background-color 0%, #bdbdbd 100%);
		/* FF3.6-15 */
		background: -webkit-linear-gradient(top, $box-witness-background-color 0%, #bdbdbd 100%);
		/* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, $box-witness-background-color 0%, #bdbdbd 100%);
		/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='$box-witness-background-color', endColorstr=' #bdbdbd', GradientType=0);
		/* IE6-9 */
		margin-bottom: 20px;
		@include set("box-shadow", "inset 0px -10px 9px -8px #000");

		&::after {
			background: linear-gradient(-45deg, $box-witness-background-color 8px, transparent 0), linear-gradient(45deg, $box-witness-background-color 8px, transparent 0);
			background-position: left-bottom;
			background-repeat: repeat-x;
			background-size: 16px 16px;
			content: " ";
			display: block;
			position: absolute;
			bottom: 0px;
			left: 0px;
			width: 100%;
			height: 16px;
		}
	}

	&-end {
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/ #bdbdbd+0,ffffff+100,ffffff+100 */
		background: #bdbdbd;
		/* Old browsers */
		background: -moz-linear-gradient(top, #bdbdbd 0%, $box-witness-background-color 100%);
		/* FF3.6-15 */
		background: -webkit-linear-gradient(top, #bdbdbd 0%, $box-witness-background-color 100%);
		/* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom, #bdbdbd 0%, $box-witness-background-color 100%);
		/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=' #bdbdbd', endColorstr='$box-witness-background-color', GradientType=0);
		/* IE6-9 */
		margin-top: 20px;
		@include set("box-shadow", "inset 0px 10px 9px -8px #000");

		&::before {
			top: 0px;
			background-position: left top;
			background: linear-gradient(-135deg, $box-witness-background-color 8px, transparent 0), linear-gradient(135deg, $box-witness-background-color 8px, transparent 0);
			background-position: left-top;
			background-repeat: repeat-x;
			background-size: 16px 16px;
			content: " ";
			display: block;
			position: absolute;
			top: 0px;
			left: 0px;
			width: 100%;
			height: 16px;
		}
	}
}

.lacuna {
	min-height: 10px;
	height: 10px;
	position: relative;
	display: block;
	padding: 8px 0px 39px 0px;
	min-width: 100%;
	width: 109.5%;
	left: -5%;
	margin: 20px 0;
	background: #bdbdbd;
	text-align: center;
	padding-top: 20px;

	&::after {
		background: linear-gradient(-45deg, $box-witness-background-color 8px, transparent 0), linear-gradient(45deg, $box-witness-background-color 8px, transparent 0);
		background-position: left-bottom;
		background-repeat: repeat-x;
		background-size: 16px 16px;
		content: " ";
		display: block;
		position: absolute;
		bottom: 0px;
		left: 0px;
		width: 100%;
		height: 16px;
	}

	&::before {
		top: 0px;
		background-position: left top;
		background: linear-gradient(-135deg, $box-witness-background-color 8px, transparent 0), linear-gradient(135deg, $box-witness-background-color 8px, transparent 0);
		background-position: left-top;
		background-repeat: repeat-x;
		background-size: 16px 16px;
		content: " ";
		display: block;
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 16px;
	}
}

.lacunaApp::before {
	top: 1px;
	position: relative;
}

.list {
	margin-top: 1.5%;
	margin-bottom: 1.5%;
	margin-left: 2%;
	display: block;

	.item {
		display: list-item;
		position: relative;
		left: 20px;
	}
}


.listChange {
	.change {
		display: list-item;
		margin-left: 1.5rem;
	}
}

.msDesc {
	::before {
		font-weight: bold;
	}

	.handDesc,
	.decoDesc {
		display: block;
		margin-bottom: 8px;
	}

	//TODO: spaziatura MSDesc

	.history,
	.handDesc,
	.decoDesc {
		&:before {
			content: "\a";
			display: inline-block;
			white-space: pre;
		}
	}

	.msIdentifier {
		display: block;
		margin-bottom: 8px;

		.settlement {
			display: block;
		}

		.repository {
			display: block;
		}

		.idno {
			display: block;
		}
	}

	.msContents {
		.msItem {

			.author,
			.title,
			.textLang,
			.colophon {
				display: block;
			}
		}
	}

	.physDesc {
		display: block;
		margin-top: 8px;
	}

	.history {
		display: block;
		margin-top: 8px;
	}

	.quote {
		font-style: italic;

		&::before {
			content: '«';
			font-weight: normal;
		}

		&::after {
			content: '»';
		}
	}
}

.omission {
	font-style: italic;

	&::before {
		content: "[om.]";
	}
}

.p {
	display: block;
	margin-bottom: 5px;
}

.pb {
	display: block;
	text-align: center;
	font-size: 80%;

	&::before {
		content: '\2014';
		margin-right: 5px;
	}

	&::after {
		content: ' \2014';
		margin-left: 5px;
	}
}

.speaker {
	font-variant: small-caps;
	font-weight: bold;
	font-size: 90%;

	&::after {
		content: ":";
	}
}

.stage {
	font-style: italic;
	font-size: 90%;
	display: block;
	text-align: center;
}

.witnesses-lem,
.variance-lem {
	font-weight: bold;
}

.witnesses-rdg,
.variance-rdg {
	font-style: italic;
}

//TEI generic rend
[data-rend="italic"],
.i {
	font-style: italic !important;
}

[data-rend="bold"] {
	font-weight: bold !important;
}

[data-rend="underline"] {
	text-decoration: underline !important;
}

[data-rendition="pencil"] {
	font-weight: lighter;
	color: #a9a9a9;
	text-shadow: 0px 0px 1px #bfbfbf;
}

/* TEI HEADER */
.address,
.addrline {
	display: block;
	font-size: 90%;
}

.encodingdesc {
	.editorialdecl {
		display: block;

		&:before,
		>*:before {
			font-variant: small-caps;
			color: #666;
			font-size: 90%;
		}

		.correction,
		.hyphenation,
		.interpretation,
		.normalization,
		.punctuation,
		.quotation,
		.segmentation,
		.stdVals {
			display: block;
		}
	}

	.projectDesc,
	.refsDecl {
		display: block;
		margin-top: 14px;
	}
}

.fileDesc {
	*:before {
		font-variant: small-caps;
		color: #666;
		font-size: 90%;
	}

	.author {
		display: block;

		&:before {
			content: "";
		}
	}

	.editor {
		display: block;
	}

	.notesStmt {
		display: block;

		.note {
			display: block;
			margin-top: 10px;
		}
	}

	.publicationStmt {
		display: block;

		>* {
			display: block;
		}

		&:before,
		>*:before {
			font-variant: small-caps;
			color: #666;
			font-size: 90%;
		}

		.publisher,
		.availability,
		.idno,
		.date {}
	}

	.respStmt,
	.seriesStmt {
		display: block;
	}

	.sourceDesc {
		display: block;

		.listwit,
		.listbibl {
			display: none;
		}
	}


	//TODO : gestione titoli
	.titleStmt {
		margin-bottom: 10px;
		margin-left: 25%;

		.title {
			display: inline;
			text-align: center;
			font-weight: bold;
			font-size: 1.2em;
			margin-bottom: 10px;
		}

		[data-type='sub'] {
			font-weight: bold;
			font-size: 1em;
		}

		[data-type='main'] {
			&:after {
				content: " -";
			}
		}
	}

	.editionStmt {
		.edition {}
	}
}

.funder,
.sponsor,
.principal {
	display: block;
	margin-top: 14px;

	&:before {
		display: block;
		border-bottom: 1px dotted #666;
		margin-bottom: 5px;
	}

	.orgname {
		display: block;
	}
}

.funder,
.sponsor,
.principal {
	&:before {}
}

.interpGrp {
	.interp {
		display: list-item;
		margin-left: 25px;
	}
}

.profiledesc {

	.langUsage,
	.particDesc,
	.textClass {}

	.langUsage {
		&:before {}

		.language {
			display: block;
		}
	}

	.particDesc {
		&:before {}

		.listPerson,
		.person {
			display: block;

			* {
				margin: 0;
				display: inline;
			}

			.head {
				display: block;
				font-variant: small-caps;
				margin: 10px 0 5px 0;
			}
		}

		.person,
		.personGrp {
			margin-bottom: 10px;
			display: block;

			.state {
				&:before {
					content: "- ";
				}
			}

			.sex {
				&:before {
					content: " (";
				}

				&:after {
					content: ")";
				}
			}
		}
	}

	.textClass {
		&:before {}
	}
}

.revisionDesc {
	.change {
		display: list-item;
		margin-bottom: 10px;
		margin-left: 25px;
	}
}

.respStmt {
	.resp {}

	.name,
	.persName {
		&:not(:last-child):after {
			content: ', ';
		}

		&:last-child:after {
			content: '. ';
		}
	}
}

.variantEncoding {
	display: block;
}

//Temp
.fileDesc .listWit,
.fileDesc .listPerson {
	display: none;
}

.gi,
.val {
	font-style: italic;
}

.em {
	font-weight: bolder;
	font-style: italic;
}


.gap {
	&[data-unit="chars"] {
		&[data-quantity='1'] {
			&:before {
				content: "[."
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='2'] {
			&:before {
				content: "[.."
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='3'] {
			&:before {
				content: "[..."
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='4'] {
			&:before {
				content: "[...."
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='5'] {
			&:before {
				content: "[....."
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='6'] {
			&:before {
				content: "[......"
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='7'] {
			&:before {
				content: "[......."
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='8'] {
			&:before {
				content: "[........"
			}

			&:after {
				content: "]"
			}
		}

		&[data-quantity='unknown'] {
			&:before {
				content: "[..."
			}

			&:after {
				content: "]"
			}
		}
	}
}
