@import "compass";
@import "mixins";

$font-color:#555;
$white-color:#FFF;
$primary-color:#BCCC2B;
$secondary-color: #333;
$third-color: #222;
$primary-bg-color:#f2f4f4;
$navigation-selected-border-color:#1a1a1a;
$btn-color: #f9a629;
$btn-hover-color: #f4831f;
$tooltip-color: #4f6573;
$error: #990000;
$primary-hover-color: #d8d8d8;

#upload-document{
	.control-group{
		select{
			width: 100%;
		}
	}
}

.aui{
	.feedback-form-block .span6{
		width: 48%;
		display: inline-block;
	}
	
	.feedback-form-block .span6:first-child{
		margin-right: 2%;
	}
	
	.feedback-form-block .span6 button{
		width: 100%;
	}
	
	#wrapper{
		#content{
			#tenant{
				margin-top: 25px;
				
				#fault-details{
					
					.back{
						float: left;
    					margin-top: 18px;
    					margin-right: 10px;
					}
					
					.heading{
						float: left;
					}
					
					#fault-notifications{
						background-color:#f2f4f4;
						text-align: center;
						padding: 10px;
						
						.note-text{
							padding:10px;
							margin-top:20px;
						}
						
						.button-holder .true{
							opacity: 1 !important;
						}
						
						.true .far{
							color:white;
							font-size: 18px;
						}
						
						p.no-data{
							background-color: none !important;
							margin: 0;
						}
						
					}
					
					#fault-data{
						.title{
							text-transform: capitalize;
							font-size: 15px;
							font-weight: bold;
						}
						
						.value{
							font-size: 16px;		
						}
						
						.span4{
							margin-bottom: 15px;
						}				
					}
				}
				
				div[class*='contextualActions']{
				    display: none;
				    background-color: rgba(102, 102, 102, 0.5);
				    text-align: right;
				    position: absolute;
				    z-index: 10;
				    color: #fff;
				    
				    button{
				    	margin:0 3px;
			    	}
			    	
			    	button.btn{
			    		width:auto;
			    		display:inline-block;
			    	}
				}
				
				.fa, .fas, .far{
					cursor:pointer;
					font-size: 24px;
				}
				
				.far{
					vertical-align: middle;
					padding-right: 15px;
					padding-left: 5px;
					color:black;
				}
				
				p.no-data{
					background-color: #eee !important;
					color: black !important;
					padding: 20px 15px !important;
					text-align: center !important;
				}
				
				form{
					padding:0px;
				}
				
				#reserve-amount{
					.control-group{
						input{
							width: 95% !important;
						}
					}
				}
				
				#propManager a{
					font-weight: bold;
				}
				
				.tooltip-icon:before{
					color: $tooltip-color;
					content: "\f149";
					cursor: pointer;
					font-family: "ionicons";
					font-size: 20px;
					font-weight: bold;
					padding: 0 10px;
				}
				
				.fa, .fas{
					font-size: 24px;
				}
				
				.column-content, .column-content-center {
					padding: 0px;
				}
				
				#upload{
					display:block;
					button{
						float: right;
					}
				}
				
				.full-width
				{
					width:100%;
				}
				
				a {
					color: $font-color;
				}
				
				a:hover {
					color: $font-color;
				}
				
				.aui-form-validator-message {
					background-color: $error;
					width: 83%;
				}
				
				.emailBodyLabel {
					font-weight: bold;
				}
				
				.not-logged-in{
					display: none;
				}
				
				.sub-sections{
					margin-bottom: 30px;
					padding: 0px;
				}
				
				.help-inline {
					display: block;
					padding-left: 0;
					font-size: 14px;
				}
				
				.success {
					color: green;
					font-size: 18px;
				}
				
				.failure {
					color: maroon;
					font-size: 18px;
				}
				
				#save {
					clear: both;
					float: left;
				}
				
				table.dataTable{
					thead{
						background-color: $navigation-selected-border-color;
						border: none;
						
						tr{
							th:first-child{
								padding-left: 25px;
							}
							th{
								color: $white-color;
								font-size: 14px;
								font-weight: normal;
								padding: 5px;
								text-transform: uppercase;
								padding: 8px 10px;
								text-align: left;
								
								.control-group{
									margin-bottom:0px;
								}
							}
							
							th.download-inline {
								text-align: center;
								width: 140px;
							}
							
							th.date-inline{
								min-width: 68px;
								width: 85px;
							}
							
							th.decimal-alignment{
								padding-right: 22px !important;
								text-align: right;
							}
						}
					}
					tbody{
						tr{
							background-color: $primary-bg-color;
							
							td:first-child{
								padding-left: 25px;
							}
							td{
								color: $navigation-selected-border-color;
								border-bottom: 1px solid $white-color;
								padding: 8px 10px;
								font-size: 14px;
								text-align: left;
								
								.control-group{
									margin-bottom:0px;
								}
								
								button.btn, input.btn[type="submit"], .btn-primary {
								    padding: 4px 15px;
								    display: inline-block !important;
								}
								
								form{
									margin: 0;
								}
							}
							
							td.download {
								text-align: center;
							}
							
							td.decimal-alignment{
								padding-right: 22px !important;
								text-align: right;
							}
						}
						tr:hover {
							background-color: $primary-hover-color;
						}
					}
				}
				
				table.dataTable.no-footer{
					border:0px;
				}
				
				table.dataTable thead .sorting_desc{
				    background-image: url(../images/sort_desc.png);
				}
				
				table.dataTable thead .sorting_asc{
				    background-image: url(../images/sort_asc.png);
				}
				
				.dataTables_wrapper .dt-buttons{
					float: right;
				}
				
				.dataTables_wrapper .dt-button{
					font-size: 14px;
					padding: 0;
					margin-left: 10px;
					line-height: 0;
					border: 0;
					background: none;
					margin-top: 4px;
				}
				
				.dataTables_wrapper .dataTables_paginate .paginate_button{
					background: none;
					border: 0;
					font-size: 14px;
					padding: 10px 5px;
					cursor: pointer;
				}

				.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
					color: $secondary-color !important;
				}
				
				.dataTables_wrapper .dataTables_paginate .paginate_button.current{
					background: none;
					border: 0;
					font-size: 14px;
					font-weight: bold;
				}
				
				.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate{
					font-size: 14px;
				}
				
				.dataTables_wrapper label{
					font-size: 14px;
				}
			
				.dataTables_length select{
					width: 60px;
				}
				
				button.btn, input.btn[type="submit"], .btn-primary {
					background: none repeat scroll 0 0 $btn-color;
				    border: medium none;
				    color: $white-color;
				    padding: 7px 18px;
				    text-transform: capitalize;
					font-size: 14px;
				    margin: 0;
				    border: medium none;
				    box-shadow: none;
				    text-shadow: none;
				}
				
				.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] {
				    background-color: $btn-hover-color;
					color: $white-color;
					text-decoration:none;
				    border-image: none;
				    cursor: pointer;
				    text-shadow: none;
				}
				
				.navigation-holder.holder {
					float: right;
					margin: 0px 0;
					text-align: right;
					margin-bottom: 10px;
					
					a {
						color: $secondary-color;
						cursor: pointer;
						font-size: 14px;
						margin: 0 5px;
					}
					
					a:hover {
						background-color: $third-color;
						color: $white-color;
					}
					
					a.jp-previous {
						margin-right: 15px;
					}
					
					a.jp-next {
						margin-left: 15px;
					}
					
					a.jp-current, a.jp-current:hover {
						color: #FF4242;
						font-weight: bold;
						background: none repeat scroll 0 0 transparent;
						cursor: default;
					}
					
					a.jp-disabled, a.jp-disabled:hover {
						color: #BBB;
						background: none repeat scroll 0 0 transparent;
						cursor: default;
						text-decoration: none;
					}
					
					span {
						margin: 0 5px;
					}
				}
				
				#sitemap{
					text-transform: capitalize;
				
					a{
						text-transform: uppercase;
						text-decoration: none;
						line-height: 30px;
					}
					
					a:hover{
						text-transform: uppercase;
						color: $font-color;
					}
					
					a.current{
						font-weight: bold;
					}
					
					#heading{
					    margin-bottom: 1px;
					    background-color: $primary-color;
					    position: relative;
						
						#heading-text{
							width: 80%;
							float: left;
							
							h1{
								font-size: 27px;
								margin: 0;
								padding: 10px 15px;
							    font-weight: normal;
							}
						}
					
						#gear{
							padding-top: 20px;
	    					margin: 0;
	    					cursor: pointer;
	    					color: $white-color;
						}
					
						#gear.selected {
						    color: $white-color;
						}
						
						#gear::hover {
						    color: $white-color;
						}
						
						#gear::before {
						    content: "\f43d";
						    font-family: "ionicons";
						    font-size: 28px;
						    margin-right: 7px;
						}
						
						#settings-menu.open{
							display: block;
						}
						
						#settings-tip{
							display: none;
							width: 1px;
							border-left: 10px solid transparent;
							border-right: 10px solid transparent;
							border-bottom: 10px solid $white-color;
							position: absolute;
							top: 46px;
							left: 215px;
							z-index: 1;
							box-shadow: 0 3px 80px rgba(0, 0, 0, 0.3);
						}
						
						#settings-tip.open{
							display: block;
						}
						
						#settings-menu {
						    width: 200px;
						    height: auto;
						    background: $white-color;
						    display: none;
						    position: absolute;
						    top: 55px;
						    left: 40px;
						    padding: 17px;
						    border: 1px solid rgba(0, 0, 0, 0.15);
						    border-radius: 3px;
						    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.3);
							
							a{
								color: #1d2129;
								clear: both;
								float: left;
								font-size: 14px;
							}
						}
					}
					
					#myNavbar{
						ul{
							margin-left: 0px;
							background-color: transparent;
							
							li{
								list-style: none;
								border-bottom:0px;
								line-height: 30px;
							    margin: 2px 0 0;
							    border-width: 0;
								
								a{
									text-decoration: none;
									font-size: 17px;
									padding-left:20px;
									padding: 12px 20px;
									display: block;
								}
								
								a:hover, a:focus{
									background-color: transparent !important;
									text-decoration: none;
									font-size: 17px;
								}
							}
							
							li:hover{
								background-color: $primary-color; 
							}
							
							li.current{
								border-left:5px solid $primary-color;
								
								a.current{
									font-weight: normal;
								}
							}
						}
					}
					
					select#selectoption{
						text-transform: uppercase;
					}
					
					select#selectoption:hover, select#selectoption:focus{
						
					}
				}
			
				#homePage{
					#tenancy-expired-access-information{
						color: black;
						background-color: #f5f2ec;
						padding: 10px 20px;
						margin-bottom: 10px !important;
						clear: both;
						float: left;
						border-radius: 4px;
					}
				}
				
				#tenanthome{
					#totalBalanced{
						font-size: 34px !important; 
					}
					
					.chart-block{
						position: relative;
						width: 48%;
						height: 300px;
						display: inline-block;
						margin-right: 3%;
						margin-bottom: 10px;
					}
					
					.chart-block-top{
						margin-right: 3%;
					}
					
					.container-fluid{
						.row-fluid{
							.span6{
								background-color: #eee;
								margin:0px;
								margin-right: 10px;
								margin-bottom: 10px;
							}
							
							.summary-block{
								.img{
									float:left;
									
									img{
										width: 50px;
										background-color: #1a1a1a;
										padding: 5px;
									}
								}
								
								.info{
									float:left;
									margin-left: 10px;
									margin-top: 10px;
									
									.amount{
										color: #333;
										font-size: 30px;										
									}
									
									.title{
									
									}
								}	
								
								.ctooltip{
									float:right;
									margin-top: 5px;
								}
							}
						}
					}
				}
				
				#personal-details{
					form{
						padding: 0 1px;
						
						.control-group {
							margin-bottom: 10px;
							
						    input, textarea, .uneditable-input{
								width: calc(100% - 14px);
								margin-bottom: 2px;
								font-size: 14px;
								max-width: 100% !important;
							}
							
							select{
								width: 93%;
								margin-bottom: 2px;
								font-size: 14px;
							}
						}
					}
				   
				   #registered-address,#correspondence-address{
				   		h3{
						    font-size: 18px;
						    padding-left: 20px;
						}
						
						.btn{
							margin-bottom: 15px;
						}
					}
					
					input.aui-form-validator-error, textarea.aui-form-validator-error, select.aui-form-validator-error{
						border-style: solid;
					}
					
					.personaldetail-single-sec {
						float: left;
						width: 100%;
						margin-top: 10px;
					}
				}
				
				#change-password{
					form{
						.control-group {
							margin-bottom: 10px;
							
							input, textarea, .uneditable-input{
								width: 45%;
								margin-bottom: 2px;
								font-size: 14px;
								max-width: 100% !important;
							}
						}
						
						input{
							opacity: 0.54;
						}
					}				
				}
				
				#tenency-detail{
					
				}
				
				#current-arrears{
					
				}
				
				#historic-rent{
					
				}
				
				#rent-schedule{
					
				}
				
				#maintaince-history{
					
				}
				
				#maintenance-form{
					.control-group {
						height: 40px;
						
						input, textarea, .uneditable-input{
							width: 45%;
							margin-bottom: 2px;
							font-size: 14px;
						}
						
						.control-label{
							display: none;
						}
					}
				}
				
				#notes{
					
				}
				
				#electric-certificate{
					
				}
				
				#epc{
					
				}
				
				#gas-certificate{
					
				}
				
				#inventory{
					
				}
				
				#reserve-payment{
					float:right;
					
				}
				
				#send-email{
					#branch-details{
						margin-bottom: 10px;
						
						p{
							margin-bottom: 0px !important;
						}	
					}
					.control-group {
						margin-bottom: 15px;
						
						textarea{
							width: calc(100% - 14px);
							margin-bottom: 2px;
						}
						
						.control-label{
							display: none;
						}
					}
					
					.send-email-submit{
						margin-bottom: 20px;
					}
					
					.tenant-sendemail-form-sec {
						clear: both;
						float: left;
						margin-bottom: 10px;
						width: 100%;
					}
				}
				
				#page-tabs{
					border: 0px;
					border-radius: 0px;
					background: transparent;
					
					& > ul{
						overflow: hidden;
						margin: 0;
						background: transparent;
					    border: 0px solid transparent;
    					padding: 0px;
    					margin-bottom: 20px;
    					border-radius: 0px;
						
						li{
							list-style: none;
							float: left;
							top: 0;
							margin: 5px .2em 0 0;
							border: none;
							background: $primary-bg-color;
							border-radius: 0;
							box-shadow:none;
							
							a{
								float: left;
								padding: 8px 16px;
								text-decoration: none;
								color: $font-color;
								font-size: 14px;	
								text-transform: uppercase;							
							}
						}
						
						li.ui-state-active{
							background: $primary-color;
							border: none;
							border-radius: 0;
							box-shadow:none;
							
							a{
								color: $white-color;
							}
						}
					}
				}
				
				.consent{
					.consent-group{
						h5{
							font-weight: bold;
						}
					}
					
					.consent-details{
						.consent-label{
							p{
								text-transform: capitalize;
								font-weight: normal;
								display: inline-block;
								font-size: 16px;
							}
						}
						
						.consent-info-description{
						
						}
						
						.consent-value{
							.control-group{
								margin-bottom: 10px;
							}
							
							h5{
								text-transform: capitalize;
								font-weight: normal;
							}
							
							select{
								width: 100%;
							}
						}
						
						.consent-info{
						
						}
						
						.consent-info:before{
							color: $tooltip-color;
							content: "\f149";
							cursor: pointer;
							font-family: "ionicons";
							font-size: 20px;
							font-weight: bold;
							padding: 0 10px;
						}
					}
				}
			}
		}	
	}
}