/*global style adjustments, override specifically */
////
/// @group layout/pageframe
////

/// Global style adjustments that don't belong to a specific component.
@mixin os-pageframe {
	
	/* Notification popup style; unfortunately */ 
	/* this will happen globally, because notifications are outside of other elements */ 
	.v-Notification {
		.v-Notification-caption {
			font-size: $v-font-size * 2;
			}
		.v-Notification-description{
			font-size: $v-font-size * 1.2;
			display: block;
			text-align: center;
			margin-left: 0px;
		    margin: 0 auto;
			}
		}
	
	
	/* external welcome page iframe container */
	.v-verticallayout-os-welcome {
		padding: 0px !important;
		}
	iframe {
		border-width: 0px;
		}
	
	
	/* checkbox-global */
	:root & .v-checkbox {
	@include os-checkbox();
	padding-top: inherit;
	> input ~ label:before, > input~ label:after {
		margin-top: inherit;
		}
	> input ~ label:before {
		margin-top: inherit;
		}		
	}

	/* borders for views: */ 
	@if $os-bordered==true {
		.v-verticallayout-part {
		    border: $v-border;
/* 		    padding: 10px; */
		}
	}


/* 	several padding adjustments */
/* 	.l-yview-provider>.l-control > * > .l-control { */
/* 		padding: 10px; */
/* 		} */
	

	.v-slot-os-work-area {
/* 		padding: 20px; */
		}
	
	h1 {
		@include os-typeface-h1;
	}
	
	
	/* popup with full content */
	.popupContent {
		@include os-popup-perspective;
		}
/* 	&.v-overlay-container>.v-window { */
/* 		height: auto !important; */
/* 		width: auto !important; */
/* 		} */

	// panel default style without borders
	.v-panel {
		border-width: 0px;
		}
	
	// colors/styles
	.v-button, .v-nativebutton {
		@include os-button;
		}
	
	.os-data-component >.v-button {
 	   	@include os-button-data; 
		}
		
	.v-textfield {
		@include os-textfield;
		}
	.v-textarea {
		@include os-textfield;
		}
	.v-filterselect {
		@include os-textfield;
		}
		
	.os-view-header-h2, .v-label-h2 {
		@include os-typeface-view-h2;
		//font-weight: 800;
	    }
	  
	.os-org-container {
		background: transparent !important;
		}  	
	/*// border of site-encapsulating container
	.v-ui > .v-panel {
	    border-width: 0px;	
		}
	*/		
		
	.os-data-area {
/* 		padding: $os-layout-margin; */
	}
	
	/* WORKAROUNDS */
	.os-multi-area .os-data-area {  //Landkarten Scrollbalken
		overflow: inherit !important;
		}
		
	input.gwt-FileUpload {
		z-index:-1 !important;
		}		
	.v-customcomponent .v-button {
		@include os-button-no-margin;
		}


	.os-mparttoolbararea, .os-embedded-toolbar {
		width: 100%;		
		min-height: $os-button-height;
		border-bottom: $v-border;
		color: valo-font-color($os-sub-header-bg);
		background: $v-app-background-color;
		
		.v-button {
			@include os-button-toolbar;
			@include box-shadow(none); /*valo-defined mixin*/
			}
		span.v-button-caption {
			vertical-align: middle;		
			}
		}
	

	/* SPLITPANEL */ 
	.v-splitpanel-vertical {
		@include valo-splitpanel-style (
			$primary-stylename: v-splitpanel, 
			$splitter-size: $os-splitter-size, 
			$splitter-active-size: $os-splitter-size,
			$splitter-handle-visible: true, 
			$orientation: vertical );
		
		> div {
			height: $os-splitter-size;
			> .v-splitpanel-vsplitter {
				div:before {
					border: transparent;
					background-color: $os-splitter-shade;
					@if $os-bordered == false {
						background-image: none;
						}	
					}
				div:after {
					border-color: get_contrast($os-fn-medium, $os-splitter-shade, $os-fn-desaturate);
					}
				}
			}
		}
	.v-splitpanel-horizontal {
		@include valo-splitpanel-style (
			$primary-stylename: v-splitpanel, 
			$splitter-size: $os-splitter-size, 
			$splitter-active-size: $os-splitter-size,
			$splitter-handle-visible: true, 
			$orientation: horizontal );	
		> div {
			width: $os-splitter-size;
			> .v-splitpanel-hsplitter {
				div:before {
					border: transparent;
					background-color: $os-splitter-shade;
					@if $os-bordered == false {
						background-image: none;
						}	
					}
				div:after {
					border-color: get_contrast($os-fn-medium, $os-splitter-shade, $os-fn-desaturate);
					}
				}
			}			
		}
	
	/* PROGRESS */
	.os-important .v-progressbar-indicator {
 	   	background: $v-error-indicator-color none;
		}
	.v-loading-indicator {
		opacity: 0.5;
		}
	
	
	/* SPINNER */
	.v-app-loading:before {
      	left: auto;
      	width: 100%;
      	height: 32px;
      	padding: 0px;
      	margin-top: 0px;
      	margin-left: 0px;
		background: transparent $os-loading-animation no-repeat 50%;
    	border-radius: $v-border-radius;
		}
	
	 
	}