//
// Gadget
// --------------------------------------------------
.uiDashboardPortlet{
	.gadgetControl {
		cursor: move;
		.pull-right .actionIcon{
			height: 18px;
			margin: -2px -3px -3px 0;
			position: relative;
			.uiIconEditMini{
				font-size: @sizeIconDefault;
			}
			.uiIconMaximize{
				top: 1px;
			}
			.uiIconClose{
				top: -1px;
			}
		}
	}
	
}
.UIGadgetThemes {
	.title{
		.actionIcon{
			padding: 4px;
			margin-top: -2px;
			.uiIconSetting{
				top: 0!important;
			}
		}
	} 
}

.UIDashboardContainer .GadgetContainer{
	padding: 20px;
	.ContainerControlBarL .AddIcon {
		float: right;
		> a {
		  display: inline-block;
		  .ie7-inline-block();
		  padding: 4px 12px;
		  margin-bottom: 0; // For input.btn
		  font-size: @baseFontSize;
		  font-weight: bold;
		  line-height: @baseLineHeight;
		  *line-height: @baseLineHeight;
		  text-align: center;
		  vertical-align: middle;
		  cursor: pointer;
		  .buttonBackground(@primaryLightColor, @primaryColor);
		  border: 1px solid @primaryDarkColor;
		  *border: 0; // Remove the border to prevent IE7's black border on input:focus
		  .border-radius(@baseBorderRadius);
		  .ie7-restore-left-whitespace(); // Give IE7 some love
		  .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)");
          text-shadow: none;
		  // Hover state
		  &:hover {
		    color: @primaryDarkColor;
		    text-decoration: none;
		   .buttonBackground(@primaryLightColor, @primaryColor);
		    background-position: 0 -15px;
            text-shadow: none;
		    // transition is only when going to hover, otherwise the background
		    // behind the gradient (there for IE<=9 fallback) gets mismatched
		    .transition(background-position .1s linear);
		  }

		  // Focus state for keyboard and accessibility
		  &:focus {
		    .tab-focus();
		  }

		}

	}


	.ContainerControlBarL {
		height: 40px;
	}
	.UIColumn {
		padding: 4px;
	}

	.UIGadgetContent {
		min-height: 200px;
    	overflow: auto;
	    iframe {
	    	padding: 10px 2% 4px;
	    	width: 96%;
	    }
	}
	.actionIcon, .actionIconSmall {
		line-height: 20px;
	}

}
.gadgetTitle{
	a.uiIconClose  {
        top:0px;
	}
}
.UIGadgetPortlet .gadgets-gadget {
	.box-shadow(0 2px 4px -1px rgba(35, 44, 48, 0.18));
	margin-bottom: 12px;
	.border-radius(3px);
}
.gadgets-gadget-user-prefs-dialog {
	> form {
		border: 1px solid @borderColor;
		border-bottom: none;
	    .border-radius(@baseBorderRadius @baseBorderRadius 0px 0px);
	    margin: 10px 2% 0px 2%;
		> div {
			padding: 10px 10px 5px;
			> span {
				display: block;
				margin-bottom: 5px;
			}
			+ div {
				padding: 5px 10px 5px;
			}
		}
		input {
			padding: 3px 6px;
			color: @inputColor;
			.box-shadow(inset 0 2px 1px rgba(0,0,0,.075));
			font-size: @baseFontSize;
			.box-sizing(border-box);
			height: 28px;
			border: 1px solid @inputBorder;
			.border-radius(4px);
			background-color: @inputBackground;
			&:focus {
				border-color: rgba(148,176,223,1);
				.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.075), 0 0 5px rgba(29,75,159,.6)");
				color: @inputFocusColor;
			}
		}
		input, select, textarea {
			width: 100%;
		}
	}
	> .gadgets-gadget-user-prefs-dialog-action-bar {
		border: 1px solid @borderColor;
		border-top: none;
		.border-radius(0 0 @baseBorderRadius @baseBorderRadius);
		padding: 5px 10px 10px;
		margin: 0 2% 0;
		input[type="button"] {
          display: inline-block;
          margin-bottom: 0; // For input.btn
          font-size: @baseFontSize;
          line-height: @baseLineHeight;
          text-align: center;
          vertical-align: middle;
          cursor: pointer;
          .buttonBackground(@btnBackground, @btnBackgroundHighlight, @grayDark, 0 1px 1px rgba(255,255,255,.75));
          border: 1px solid @btnBorder;
          border-bottom-color: @btnBorder;
          .border-radius(@baseBorderRadius);
          .box-shadow(~"inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05)");
          padding: @paddingDefault;
          height: 28px;
          text-shadow: none!important;
          color: @btnColor;
            &:hover,
            &:focus {
              text-decoration: none;
              background-position: 0 -15px;
              .transition(background-position .1s linear);
              color: @btnColor;
            }
            &:first-child {
              font-family: @sansBoldFontFamily;
              font-weight: bold;
              .buttonBackgroundEXO(@btnPrimaryBackground, @btnPrimaryBackgroundHighlight, @btnPrimaryBorder, @btnPrimaryColor);

            }
		}
        input[type="button"] +  input[type="button"] {
          margin-right: 10px;
        }
    }
}