.full-height{
	height:100%;
}


.page-sidebar{
	
	padding: 1rem;
	height:100%;
	
	background:$white;
	z-index:-1;
	@include has-shadow();
	
	//a.button{padding: 0.75em 1rem;}
	
	.sidebar-menu{
		width:300px;
	}
	
	ul{
		margin-left:-1.5rem;
		margin-bottom:1.5rem;
		li{
			a{display:block;color:$black;padding:0.625rem 1.5rem;@include animate();}
			
			.category-icon{width:2rem;display:inline-block;color:rgba($black,0.25);}
			.link__inactive{color:$medium-gray;}
			
		}
			
		li{
			@include animate();
			@include border-radius(0 1.25rem 1.25rem 0);
			
			&.current,
			&.current:hover{
				background: rgba($primary-color,0.10);
				a{color:$primary-color;}
				.category-icon{color:$primary-color;}
			}
			&:hover{
				background: rgba($dark-gray,0.15);
				a{color:$black;}
			}
			
			&.current__child{
				padding-left:1rem;
				//background: rgba($primary-color,0.10);
			}
		
		}
	}
	
	
	@include breakpoint(medium){
		width:18rem;
	}
	
	@include breakpoint(small only){
		width:auto;
	}
	
}

	
.page-content{
	
	//padding: 1rem;
	
	//.content-block{
		
	background:$white;
	margin:1rem 0;
	padding:1.5rem;
	
	@include has-shadow();
	@include border-radius(0.125rem);
	
	
	//@include breakpoint(small only)
	//{
	//	margin:0;
	//	padding:0.75rem;
	//}
		
		//}
	
	@include breakpoint(small only)
	{
		padding:1.25rem 1rem 1rem 1rem;
	}
	
}

.page-content__dashboard{
	margin-top:1rem;
	padding:1rem 1.5rem 1.5rem 1.5rem;
	position:relative;
	
	.icon{
		float:right;font-size:1rem;color:$white;position:relative;margin-top:0.75rem;margin-right:0.5rem;
		i::before{z-index:10;position:relative;color:$white;}
		i::after{content:"";position:absolute;top: -0.3rem;right: -0.55rem;display:block;width:2rem;height:2rem;background:$primary-color;border-radius:50%;z-index:0;}
	}
	
	h2{color:$primary-color;}
	.table{min-height:200px;}
}

.cell__line-left{
	position:relative;
	&::before{
		content:"";
		position:absolute;
		top:0;
		bottom:0;
		left:0;
		border-left:solid 1px $light-gray;
	}
}

.cell__line-top{
	position:relative;
	padding-top:$global-margin;
	margin-top:$global-margin;
	&::before{
		content:"";
		position:absolute;
		top:0;
		right:$global-margin;
		left:$global-margin;
		border-top:solid 1px $light-gray;
	}
}

.cell__padding-left{padding-left:$global-padding;}


.layer{
	
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	width:40%;
	z-index:100;
	transform:translateX(0);
	
	//background:rgba($black,0.25);
//	overflow:hidden;
	//width:50%;
	
	@include animate(0s);			
	
	&.collapsed_hor{
		transform:translateX(100%);
		//display:none;
		
		.layer-align-right{
			transform:translateX(100%);
		}
	}
	
	.cell-block-y{
		overflow:hidden;
	}
	
	.layer-align-right{
		position:relative;
		float:right;
		right:0 !important;
		left:auto !important;
		width:100%;
		height:100%;
		background:$white;
		transform:translateX(0);
		overflow: scroll;
		
		@include has-shadow();
		@include animate(0.25s);
		
	}
	
	
	
	
	.layer-background{
		position:relative;
		padding:2.5rem 3rem 3rem 3rem;
		background:$white;
				
		@include breakpoint(small only)
		{
			padding:3rem 0.5rem 1.5rem 0.5rem;
		}
	}
	
	.layer-close-layer{
		position:absolute;
		top:0.5rem;right:1rem;
		color:$medium-gray;
		font-size:1.75rem;
	}
	
	/*.layer-drag-size{
		width:1.5rem;
		height:2rem;
		text-align:center;
		position:fixed;
		color:$light-gray;
		top:50%;
		margin-top:-0.75rem;
		font-size:1.5rem;
		&:hover{color:$primary-color;}
	}*/
	.ui-resizable-handle{
		position: absolute;
		font-size: 0;
		z-index: 99999;
		display: block;
	}
	.ui-resizable-w{
		cursor: w-resize;
		width: 1rem;
		left: 0;
		top: 0;
		height: 100%;
		&::before{
			content: "\f7a5";
			position:fixed;
			width:1.5rem;
			height:2rem;
			text-align:center;
			position:fixed;
			color:$light-gray;
			top:50%;
			margin-top:-0.75rem;
			font-size:1.5rem;
			font-family: "Font Awesome 5 Pro";
		}
		&:hover::before{color:$primary-color;}
	}
	
	.collapsed_hor{
	
	}
	
	div[data-actions]{
		border-top:solid 1px $light-gray;
		padding-top:1.5rem;
	}
	
	.service-data-field{
		strong.header{color:$primary-color;margin-top:0.75rem;display:block;}
		.field-label{font-weight:400;}
	}
	
	
}

.layer__form
{
	.grid-x .small-12{width: calc(100% - 2rem);}
	.grid-x .medium-6{width: calc(50% - 2rem);}
	.grid-x .medium-4{width: calc(33.3333% - 2rem);}
	.grid-x .medium-3{width: calc(50% - 2rem);}

	.form .option-row__checkbox{display:block;}
	
	.form div[data-cone-row]{
		margin-left: -1rem;
		margin-right: -1rem;
		
		.medium-4{width: calc(35% - 2rem);}
		.medium-3{width: calc(30% - 2rem);}
		.medium-3 + .medium-4{width: calc(40% - 2rem);}
	}
	.form .interval-data .grid-x{
		margin-left: -1rem;
		margin-right: -1rem;
		
		.interval-row:last-child{margin-bottom:0.75rem;}
	}
	
	.form div[data-form-field="maintenance_servicetype"],
	.form div[data-form-field="maintenance_enginehours"]{width: calc(100% - 2rem);}
	
}

.layer__order{
	width:50%;
	
	h5{margin:0;}
	ul,p{font-size:0.9375rem;}
	
	.total-space-bottom{}
	.total-line-bottom{}
}

.geomil-figure
{
	border:solid 1px $light-gray;
	background-color:rgba($light-gray,0.25);
	//cursor:none;
	overflow:hidden;
	img{
		cursor:none;
		width:100%;
	//	@include animate();
	}
	
	.cursor{
		position:absolute;
		width:7rem;
		height:7rem;
		border:solid 1px $black;
		border-radius:3.5rem;
		z-index:10000;
		background-color:$black;
		margin-top:-1.5rem;
		&::after{
			content:"Scroll to zoom figure";
			position:absolute;
			bottom:-1.5rem;
			left:0;right:0;
			font-size:0.625rem;
			font-weight:bold;
			text-align:center;
		}
		
		img{max-width:none;width:auto;}
	
	}
	
	.img__zoomed{
		cursor:grab;
	}
	.img__zoomed + .cursor{
		display:none !important;
	}
	
	/*
	&.geomil-figure__zoomed{
		.cursor{
			width:1rem;
			height:1rem;
			background-color:$black !important;
			background-image:none !important;
			transform: translate(1.5rem,1.5rem);
			&::after{display:none !important;opacity:0;}
		}
	}*/
}