/**
 * NOO Customizer Package.
 *
 * StyleSheet used in NOO-Customizer control
 * This file contains all the style used on Control part of NOO-Customizer.
 *
 * @package    NOO Framework
 * @subpackage NOO Customizer
 * @version    1.0.0
 * @author     Kan Nguyen <khanhnq@nootheme.com>
 * @copyright  Copyright (c) 2014, NooTheme
 * @license    http://opensource.org/licenses/gpl-2.0.php GPL v2 or later
 * @link       http://nootheme.com
 */
 /* ============================================================================= */

/* Hide WP Sidebar Widget sections */
li[id*="accordion-section-sidebar-widgets"] {
  /*display: none !important;*/
}

/* Sub-Section Heading */
.noo-sub-section-heading {
	display: block;
	margin: 10px -20px 5px;
	border: 1px solid #dfdfdf;
	border-left: 0;
	border-right: 0;
	border-bottom-color: #dbdbdb;
	padding: 8px 20px;
	font-size: 11px;
	letter-spacing: 1px;
	line-height: 1;
	text-transform: uppercase;
	color: #777;
	background: #f5f5f5;
}

/* Sub-Section Description */
.noo-sub-section-desc {
	margin: 0 0 10px 0;
	font-size: 11px;
	line-height: 1.4;
	color: #777;
}

.customize-control.hide-option,
.customize-control .hide-option {
  display: none !important;
  opacity: 0 !important;
  height: 0 !important;
  padding: 0 !important;
}

/* Favicon Image */
#customize-control-noo_custom_favicon .container {
  max-width: 25px;
  min-height: inherit;
  max-height: 25px;
}

/* Font Select */
.noo-font-selects select {
	float: left;
	min-width: 40%;
}

.noo-font-family {
	width: 238px;
}
.noo-font-weight-and-style,
.noo-font-subset {
	width: 118px;
}

/* Alpha color Picker */
.noo-alpha-container .transparency {
    height:24px;
    width:100%;
    background-color:#FFF;
    background-image:url(../images/transparency-grid.png);
    box-shadow:0 0 5px rgba(0,0,0,0.4) inset;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding:0;
}

.noo-alpha-container .ui-slider-handle {
    color:#777;
    background-color:#FFF;
    text-shadow:0 1px 0 #FFF;
    text-decoration:none;
    position:absolute;
    z-index:2;
    box-shadow:0 1px 2px rgba(0,0,0,0.2);
    border:1px solid #aaa;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    opacity:0.9;
    margin-top:-2px;
    height:20px;
    cursor:ew-resize;
    font-size:12px;
    padding:3px;
}

.noo-alpha-container .ui-slider {
    position:relative;
    text-align:center;
    width:88%;
}

.wp-picker-container a.wp-picker-open ~ div.noo-alpha-container {
    display:block;
}

.noo-alpha-container {
    box-sizing:padding-box;
    display:none;
    border:1px solid #dfdfdf;
    border-top:none;
    background:#FFF;
    padding:0 11px 6px;
}

.customize-control-alpha_color .wp-picker-container .iris-picker {
    border-bottom:none;
}

/* NOO Switch style */
.noo-switch {
  display:block;
  position:relative;
  text-align:left;
  width: 66px;
  height: 30px;
  background-color: #777;
  overflow:hidden;
  -webkit-box-shadow: inset 0 1px 2px black,0 1px 0 rgba(255,255,255,0.1);
  -moz-box-shadow:inset 0 1px 2px black,0 1px 0 rgba(255,255,255,0.1);
  box-shadow: inset 0 1px 2px black,0 1px 0 rgba(255,255,255,0.1);
  -webkit-border-radius:6px;
  -moz-border-radius:6px;
  border-radius:6px;
}

.noo-switch input {
  display:block;
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  width:100%;
  height:100%;
  margin:0 0;
  cursor:pointer;
  opacity:0;
  filter:alpha(opacity=0);
  z-index:2;
}

.noo-switch label {
  background-color: #333;
  /* background-image:-webkit-linear-gradient(-40deg,rgba(0,0,0,0),rgba(255,255,255,0.1),rgba(0,0,0,0.2));
  background-image:-moz-linear-gradient(-40deg,rgba(0,0,0,0),rgba(255,255,255,0.1),rgba(0,0,0,0.2));
  background-image:-ms-linear-gradient(-40deg,rgba(0,0,0,0),rgba(255,255,255,0.1),rgba(0,0,0,0.2));
  background-image:-o-linear-gradient(-40deg,rgba(0,0,0,0),rgba(255,255,255,0.1),rgba(0,0,0,0.2));
  background-image:linear-gradient(-40deg,rgba(0,0,0,0),rgba(255,255,255,0.1),rgba(0,0,0,0.2)); */
  -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.7);
  -moz-box-shadow:0 0 0 1px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.7);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.1),0 1px 2px rgba(0,0,0,0.7);
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
  display:inline-block;
  width: 40px;
  text-align:center;
  font:bold 11px/28px Arial,Sans-Serif;
  color: #999;
  /* text-shadow:0 -1px 0 rgba(0,0,0,0.7); */
  -webkit-transition:margin-left 0.2s ease-in-out;
  -moz-transition:margin-left 0.2s ease-in-out;
  -ms-transition:margin-left 0.2s ease-in-out;
  -o-transition:margin-left 0.2s ease-in-out;
  transition:margin-left 0.2s ease-in-out;
  margin:1px;
}

.noo-switch label:before {
  content:attr(data-off);
}

.noo-switch input:checked + label {
  margin-left: 25px;
  background-color: #47bfa9;
  color:white;
}

.noo-switch input:checked + label:before {
  content:attr(data-on);
}

/* Upload Button */
.noo-file-upload {
  position: relative;
  overflow: hidden;
  margin: 10px;
}
.noo-file-upload .noo-upload {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0;
  font-size: 20px;
  cursor: pointer;
  opacity: 0;
  filter: alpha(opacity=0);
}