////
/// @group layout/dialog
////
@mixin os-dialog {
	
	/* table and grid headers inside form/dialog */
   	.v-caption-on-top >.v-caption >.v-captiontext {
		font-size: $v-font-size * $v-scaling-factor--large;
		}
	
	.v-caption-on-top >.v-caption-l-control >.v-captiontext {
		font-size: $v-font-size;
		}	 
	
	
	/* extreme checkbox workaround */
	.v-formlayout-row {
		:root & .v-checkbox {
			@include os-checkbox();
			padding-top: inherit;
			> input ~ label:before, > input~ label:after {
				margin-top: inherit;
				}
			> input ~ label:before {
				margin-top: inherit;
				}		
			}
		.v-gridlayout {
			}
		}
	
	.v-gridlayout-slot .v-checkbox-os-box {
		@include os-checkbox();
		
		padding-top: floor($v-unit-size * 1.2);
		> input ~ label:before, > input~ label:after {
			margin-top: floor($v-unit-size * 1.2);
			}
		> input ~ label:before {
			margin-top: floor($v-unit-size * 1.2);
			}	
		} 

	/* Multiselect */
	select.v-select-select {
		color: inherit !important;
		border: $v-border
		}
	select.v-select-select option:checked {
 	   	box-shadow: 0 0 10px 100px $v-focus-color inset;
 	   	color: valo-font-color($v-focus-color) !important;	//? no effect
		}
		 
	.l-controlbase {
		overflow: auto;
		
		.v-grid-os-box {	
			//width: 800px !important; //needs fixed size as of now
			}
		}
		
	.v-panel-os-has-focus {
		@include os-panel-focus;
		}		
	
	.l-control { 
		//table and grid inside dialog
		.v-table {
			border-bottom: $v-border;
			}
		.v-table-header-wrap {
			border-top: none;
			height: $v-unit-size;
			}
			
		// grid inside dialog
		.v-grid-os-box {
			.v-grid-tablewrapper {
				border-top: 0px;
				}
			}
		.v-gridlayout-slot {
			.v-grid-os-box {
				.v-grid-tablewrapper {
					border-top: $v-border;
					}	
				}
			}			
		}
	
	.l-control, .toptrimbar, .os-selection-area {
		.v-panel {
			border-width: 1px;
			} 
		
		.v-caption {
			font-size: $v-font-size;
			}
			
		.v-caption-on-top >.v-caption, 
		.v-gridlayout-slot >.v-caption {
	    	padding-bottom: round($v-unit-size*0.05);
	    	padding-top: round($v-unit-size*0.5);
	    	}
	    
	    .v-caption-os-has-focus {
	    	@include os-caption-focus;
	    	}
	    	   
		.v-formlayout-row .v-customcomponent .v-label {
			
			
			}
	    	
		.v-formlayout-captioncell, 
		.v-formlayout-errorcell {
			border-bottom: $v-border;
			vertical-align: bottom;
			}
		.v-formlayout-captioncell, 
		.v-formlayout-errorcell,
		.v-formlayout-contentcell {
			padding-top: 0px !important; /* overrides $v-layout-spacing-vertical */
			}
		
		.v-formlayout-contentcell >.v-customcomponent {
			width: 100%;
			border-bottom: $v-border;
			.v-filterselect-input, .v-filterselect [class*="input"] {
				border-bottom-width: 0px;
				}			
			}
				
		.v-textfield {
			width: $v-default-field-width;
			@include os-textfield;
			}
			
		.v-filterselect-input, .v-filterselect [class*="input"] {
			@include os-textfield;
			border-bottom: $v-border;
			@include box-shadow(none);
			}
			
		.v-filterselect.v-widget.os-combobox-with-icon .v-icon, .v-filterselect-os-box .v-icon {
			/* language selection icon position (header) */
			z-index: 999;
			}	 	
		
		.v-textfield-readonly, .v-disabled {
			@include os-textfield-readonly;
			}
		
		.l-beansearchfield {
    		@include os-button-l-beansearch;
    		> .v-slot > .v-filterselect { 
				//width: $v-default-field-width - $v-unit-size;
				}
    		}
    		 
		.v-datefield-error {
			.v-datefield-textfield {
				@include os-error-textfield;
				&.v-textfield-focus {
					color: valo-font-color($os-focus-color);
					}
				}
			.v-datefield-button {
				@include os-button-error;
				}
			}
		.v-textfield-error {
			@include os-error-textfield;
			}
    	
    	.v-button {
    		height: $v-unit-size;
    		}
    		
    	.v-upload-immediate .v-button {
    		@include os-button-formlayout;
			}

		    	
    	.v-gridlayout-slot > .v-label > img {
    		@if $os-img-size-override == true {
        		height: $v-unit-size * 3;
        		}
    		}
    	
    	
		/* panel margins */
		[class*="margin-bottom"] > tbody > [class*="lastrow"] > td {
			padding-bottom: 0px;
			}
		[class*="margin-top"] > tbody > [class*="firstrow"] > td {
		    padding-top: 0px; 
			}
		}
		
	.v-filterselect-os-single-selection {
		color: valo-font-color($os-sub-header-bg);
		margin: floor($v-unit-size/3);
		width: $os-button-width;
		}    
	    
	.os-multi-selection select.v-select-select {
		color: inherit !important;
		border: $v-border;
		margin: floor($v-unit-size/3);
		width: $os-button-width;
		option:checked{
	 	   	box-shadow: 0 0 10px 100px $v-focus-color inset;
			}	
		}		
	}