// <copyright>
// This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
// No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
// (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
// </copyright>


//Base.scss
//Base styles for entire application.
//Note that colors and font definitions go in 
//_scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss


.clear {
    display: block;
    clear: both;
    height: 0px;
    overflow: hidden;
}
.bold {
    font-weight: bold;
}
:focus {
	outline: none;
	border: none;
	-webkit-box-shadow: 0px 0px 1px 1px $color-focus-outline;

}
.layout-table {
    display: table;
}
.layout-row {
    display: table-row;
}
.layout-cell {
    display: table-cell; 
}
.layout-table .flexor div:first-child {
    float: left;
}
.layout-table .flexor div:last-child {
    float: right;
}

// Begin: Basic skinning for form fields 
// Reset all 
input.nj-skinned, 
textarea.nj-skinned, 
button.nj-skinned,
select.nj-skinned,
select.nj-skinned option,
button.nj-skinned {
	-webkit-appearance: none;
	outline: none;
}

// Base styles
input[type="text"].nj-skinned,
input[type="password"].nj-skinned,
input[type="search"].nj-skinned,
textarea.nj-skinned,
select.nj-skinned,
select.nj-skinned option {
	border: 1px solid $color-input-border;
	color: $color-input;
	background-color: $color-input-bg;
	font-size: 12px;
	font-family: 'Droid Sans', sans-serif;
}

// Disabled styles
input.nj-skinned:disabled,
textarea.nj-skinned:disabled,
select.nj-skinned:disabled,
button.nj-skinned:disabled {
	opacity: 0.4;
}

// Text inputs and select boxes 
input[type="text"].nj-skinned,
input[type="password"].nj-skinned,
input[type="search"].nj-skinned,
select.nj-skinned,
select.nj-skinned option {
	height: 13px;
}
//
input[type="text"].nj-skinned:focus,
input[type="password"].nj-skinned:focus,
input[type="search"].nj-skinned:focus,
textarea.nj-skinned:focus,
select.nj-skinned:focus,
select.nj-skinned option:focus {
	-webkit-box-shadow: 0px 0px 3px $color-focus-outline;
}


select.nj-skinned {
    background-image: url("../images/dropdown-bg.png");
    background-repeat: no-repeat;
    background-position: right center;
	font-size: 12px;
	height: 16px;
	padding-right: 20px;
}

input[type="search"].nj-skinned {
	height: 17px ;
	-webkit-box-shadow: none;
}
input[type="search"].nj-skinned::-webkit-search-cancel-button {
	-webkit-appearance: none;
	font-size: 10px;
	height: 10px;
	width: 10px;
}
input[type="search"].nj-skinned::-webkit-search-cancel-button:after {
	content:"\2716";
}

// Buttons 
button.nj-skinned {
	font-size: 9px;
    cursor: pointer;
}

// Radio buttons 
input[type="radio"].nj-skinned {
	background-color: $color-menu-bg;
	background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
	color: $color-radio;
	border: 2px solid $color-radio-border;
	width: 12px;
	height: 12px;
	overflow: hidden;
	border-radius: 10px;
	font-size: 16px;
	line-height: 7px;
	text-indent: -7px;
	cursor: pointer;
    -webkit-box-shadow: 0px 0px 2px $color-radio-shadow;
    -moz-box-shadow: 0px 0px 2px $color-radio-shadow;
    box-shadow: 0px 0px 2px $color-radio-shadow;
}
input[type="radio"].nj-skinned:checked {
	background: -webkit-radial-gradient(center, 
										circle cover, 
										$color-radio 0%, 
										$color-radio 15%, 
										$color-radio 30%, 
										$color-transparent 31%), 
										-webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
	border: 2px solid $color-radio-border;
}
input[type="radio"].nj-skinned:hover {
	border: 2px solid $color-radio-border;
}
input[type="radio"].nj-skinned:active {
	background-image: -webkit-linear-gradient(top, $color-radio-gradient-bottom 0%, $color-radio-gradient-top 100%);
}
input[type="radio"].nj-skinned:disabled {
	background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
	border: 2px solid $color-radio-border;
	cursor: default;
}
// Checkboxes 
input[type="checkbox"].nj-skinned {
	background-color: $color-menu-bg;
	background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
	color: $color-radio;
	border: 1px solid $color-radio-border;
	width: 10px;
	height: 10px;
	font-size: 12px;
	overflow: visible;
	cursor: pointer;
    -webkit-box-shadow: 0px 0px 2px $color-radio-shadow;
    -moz-box-shadow: 0px 0px 2px $color-radio-shadow;
    box-shadow: 0px 0px 2px $color-radio-shadow;
    line-height: 9px;
}

input[type="checkbox"].nj-skinned:checked {

}
input[type="checkbox"].nj-skinned:checked:after {
	content:"\2714";
}
input[type="checkbox"].nj-skinned:active {
	background-image: -webkit-linear-gradient(top, $color-radio-gradient-bottom 0%, $color-radio-gradient-top 100%);
}
input[type="checkbox"].nj-skinned:disabled {
	background-image: -webkit-linear-gradient(top, $color-radio-gradient-top 0%, $color-radio-gradient-bottom 100%);
	cursor: default;
}
// End: Basic skinning for form fields 

// Begin:  Basic skinning for visual dividers 
.nj-divider {
	background-color: $color-divider-second;
	border-width: 0px;
	overflow: hidden;
}
.nj-divider.divider-horizontal {
	border-top: 1px solid $color-divider-first;
	border-bottom: 1px solid $color-divider-third;
	height: 1px;
}
.nj-divider.divider-vertical {
	border-left: 1px solid $color-divider-first;
	border-right: 1px solid $color-divider-third;
	width: 1px;
}
// End: Basic skinning for visual dividers