/*
 * Styling for the admin
 *
*/

/**************************
**** SETTINGS *******
**************************/

.fpd-color-box {
	float: left;
	margin-right: 10px;
}

.fpd-color-box span {
	display: block;
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 3px;
}

.fpd-color-box span .help_tip {
	float: right;
}


/**************************
**** PRODUCT POST *******
**************************/

/* Custom tab */

#fancy_product_data #fpd-export {
	margin-right: 10px;
}

/* Views list in tab panel */
#fpd-view-list li {
	line-height: 25px;
	margin-right: 5px;
}

#fpd-view-list li h3 {
	border: 1px solid #ECECEC;
	cursor: move;
}

#fpd-view-list li h3 > img {
	max-height: 25px;
	border: 1px solid #BBBBBB;
	margin-right: 10px;
	float: left;
}

#fpd-view-list li h3 > span {
	line-height: 25px;
	float: left;
}

#fpd-view-list li h3 > a.button {
	float: right;
	margin-left: 5px;
}

#fpd-modal-settings .chosen-container {
	width: 100% !important;
}

.fpd-sortable-placeholder {
  background-color: #f5f5f5;
  border-color: #bbb;
  border-style: dashed;
  border-width: 1px;
  margin-bottom: 9px;
}

#fpd-modal-templates li {
	padding: 10px;
	background: #fff;
	border: 1px solid #c9d0d3;
	margin-bottom: 5px;
}

#fpd-modal-templates li a,
#fpd-modal-templates li a:hover {
	text-decoration: none;
	color: inherit;
}

#fpd-modal-templates li .fpd-remove-template {
	font-size: 20px;
	cursor: pointer;
}

#fpd-modal-templates li:hover {
	background: rgba(255,255,255, 0.8);
}


/********************************
**** EDIT FANCY PRODUCT POST ***
********************************/

#fpd-product-builder,
#fpd-product-builder * {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

#fpd-product-builder h3 {
	margin: 0 0 20px;
}

#fpd-product-builder #fpd_view_switcher_chosen {
	border: 1px solid #e5e5e5;
	margin-right: 20px;
}

#fpd-manage-elements,
#fpd-edit-parameters,
#fpd-product-stage {
	border: 1px solid #e5e5e5;
	background: #fff;
	padding: 15px;
	margin-bottom: 20px;
}

#fpd-edit-parameters {
	max-height: 450px;
	overflow: auto;
}

#fpd-fabric-stage-wrapper {
	position: relative;
	overflow: hidden;
	overflow-x: auto;
}

#fpd-fabric-stage-wrapper > div {
	border: 1px solid #dfdfdf;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

#fpd-fabric-stage {
	background: #fff url(../img/grid.png) repeat;
}

#fpd-element-toolbar {
	margin-bottom: 10px;
}

#fpd-element-toolbar > button {
	margin-right: 10px;
	width: 30px;
}

#fpd-edit-parameters-for {
	font-style: italic;
}


/* Elements list in Product Builder Page */

#fpd-elements-list {
	padding: 10px;
}

#fpd-elements-list li {
	background: #f1f1f1;
	border: 1px solid #d7d7d7;
	width: 130px;
	height: 130px;
	padding: 5px;
	margin-right: 10px;
	margin-bottom: 10px;
	float: left;
	position: relative;
}

#fpd-elements-list li.fpd-active-item {
	background: #EAF2FA;
	-webkit-transition: background 500ms ease-out;
	-moz-transition: background 500ms ease-out;
	-ms-transition: background 500ms ease-out;
	-o-transition: background 500ms ease-out;
	transition: background 500ms ease-out;
}

#fpd-elements-list li .fpd-element-identifier {
	height: 50px;
	width: 100%;
	cursor: pointer;
	margin: 10px 0 13px
}

.fpd-element-identifier img,
.fpd-element-identifier i {
	max-width: 70%;
	max-height: 100%;
	text-align: center;
	font-size: 60px;
	display: block;
	margin: auto;
}

#fpd-elements-list li input {
	width: 100%;
	margin: 0;
}

#fpd-elements-list li span {
	width: 20px;
	text-align: center;
	font-size: 14px;
	cursor: pointer;
}

#fpd-elements-list li span.fpd-trash-element {
	color: #E74C3C;
	float: right;
}

#fpd-elements-list li span.fpd-lock-element {
	color: #1a1a1a;
	float: left;
}

#fpd-elements-list li span.fpd-change-image {
	color: #1d9e74;
	position: absolute;
	top: 38px;
	right: 5px;
	z-index: 5;
}

#fpd-elements-list li textarea {
	display: none;
}


/********************************
**** PARAMETERS FORM ***********
********************************/

#fpd-elements-form .form-table {
	width: 25%;
	min-width: 240px;
	float: left;
	clear: none;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

#fpd-elements-form .form-table:last-child {
	padding: 0;
}

#fpd-elements-form .form-table thead th {
	font-size: 16px;
}

#fpd-elements-form .form-table th {
	width: 30%;
	font-weight: normal;
	padding: 10px;
	font-size: 13px;
}

#fpd-elements-form .form-table td {
	padding: 10px;
	width: 70%;
}


#fpd-elements-form label {
	margin-right: 10px;
	font-size: 12px;
	font-weight: normal;
	font-style: italic;
	display: inline-block;
}

#fpd-elements-form .checkbox-inline {
	display: block;
	margin-top: 5px;
}

#fpd-elements-form input[type="text"] {
	padding: 5px;
	font-size: 12px;
}

#fpd-elements-form input:disabled {
	opacity: 0.5;
}

#boundig-box-params label {
	width: 40px;
}

#fpd-elements-form .ui-spinner > .ui-spinner-button {
	display: none;
}

#fpd-elements-form .chosen-container {
	width: 100% !important;
}

#fpd-elements-form .chosen-container .chosen-results {
	max-height: 100px !important;
}

#fpd-elements-form .tm-tag .tm-tag-remove {
	text-decoration: none;
	margin-left: 6px;
	color: red;
	background: #fff;
	padding: 1px 3px;
	display: inline-block;
	line-height: 1;
}

#fpd-color-control-desc {
	display: none;
}


/********************************
**** MANAGE DESIGNS ************
********************************/

.fpd-design-category {
	margin-bottom: 20px;
}

.fpd-design-category > h3 {
	padding: 5px;
	margin-bottom: 0;
	line-height: 25px;
	cursor: default !important;
}

.fpd-design-category > h3 > span {
	float: left;
	font-weight: bold;
}

.fpd-design-category > h3 > .button {
	margin-right: 10px;
}

.fpd-design-category ul {
	padding: 10px 0;
	margin: 0;
}

.fpd-design-category ul > li {
	width: 80px;
	height: 80px;
	background: #fff;
	border: 1px solid #DFDFDF;
	padding: 5px;
	float: left;
	margin: 0 10px 10px 0;
	cursor: move;
	position: relative;
}

.fpd-design-category ul > li img {
	max-width: 100%;
	max-height: 100%;
	display: block;
	margin: auto;
}

.fpd-design-category ul > li > a {
	position: absolute;
	bottom: 0;
	padding: 1px 4px;
	font-size: 14px;
	text-decoration: none;
	z-index: 100;
}

.fpd-design-category ul > li > .fpd-edit-parameters {
	left: 0;
	color: #1D9E74;
}

.fpd-design-category ul > li > .fpd-remove-design {
	right: 0;
	color: #E74C3C;
}

li.ui-state-highlight {
	background: #FBF9EE !important;
	border: 1px solid #FCEFA1 !important;
}


/********************************
**** ORDER POST ****************
********************************/

#fpd-order-panel {
	padding: 23px 0 12px;
}

#fpd-order-designer {
	margin-bottom: 20px;
	max-width: none !important;
	overflow: auto !important;
}

#fpd-order-designer * {
	max-width: none !important;
}

#fpd-order-designer .ui.button {
	height: auto;
	font-size: 10px;
}

.fpd-container .fpd-sidebar {
	width: 100% !important;
}

.fpd-navigation,
.fpd-menu-bar {
	display: none !important;
}

#fpd-order-panel .inline .field label {
	margin-right: 15px;
}

.fpd-ajax-loader {
	display: none;
	background: url(../img/ajax-loader.gif) no-repeat;
	width: 22px;
	height: 22px;
	margin-top: 4px;
}


/********************************
**** MODAL WINDOW ****************
********************************/

.fpd-modal-wrapper {
	position: fixed;
	background: #000;
	background: rgba(0,0,0,0.7);
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 100000;
	display: none;
	overflow-y: auto;
}

.fpd-modal-wrapper > .modal-dialog {
	width: 700px;
	min-height: 400px;
	background: #F2F4F5;
	padding: 30px;
	top: 60px;
	left: 50%;
	position: absolute;
	margin-left: -350px;
}

.fpd-modal-wrapper label {
	margin-right: 15px;
}

.fpd-modal-wrapper img {
	max-height: 18px;
	padding: 4px;
	border: 1px solid #aaa;
}

.fpd-modal-wrapper input[type="radio"] {
	margin-right: 0;
}

.modal-open {
	overflow: hidden;
}


/********************************
**** MODAL WINDOW ****************
********************************/

.fpd-tabs {
  overflow: hidden;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fpd-tabs li {
  float: left;
  margin: 0 5px 0 0;
}

.fpd-tabs a {
  position: relative;
  background: #D4DADE;
  padding: 10px 30px;
  float: left;
  text-decoration: none;
  color: rgba(0,0,0,0.4);
  font-weight: bold;
  font-size: 12px;
  border: 1px solid #C9D0D3;
  border-bottom: none;
}

.fpd-tabs li:first-child {
	margin-left: 30px;
}

.fpd-tabs a:hover,
.fpd-tabs a:focus {
  background: #D7DDE1;
}

.fpd-tabs a:focus {
  outline: 0;
}

.fpd-tabs #current a {
  background: #fff;
  z-index: 3;
  color: #292929;
}

.fpd-tabs-content {
	background: #fff;
	padding: 10px 30px;
	outline: 1px solid #C9D0D3;
	overflow: hidden;
}

.fpd-tabs-content h4 {
	font-size: 15px;
}

.fpd-tabs-content label {
	font-weight: normal;
}

/********************************
**** MESSAGE BOX ****************
********************************/

.fpd-message-box {
	position: fixed;
	left: 50%;
	bottom: 30px;
	padding: 20px;
}

.fpd-message-box > h4 {
	font-size: 16px;
	margin-bottom: 10px;
}

.fpd-message-box > p {
	font-size: 14px;
}

.fpd-message-box.fpd-success {
	background-color: #defcd5;
	color: #52a954;
	border: 1px solid #bdffa9;
}


.fpd-message-box.fpd-error {
	background-color: #f1d7d7;
	color: #a95252;
	border: 1px solid #e8a0a0;
}


.fpd-message-box.fpd-info {
	background-color: #f6f3d5;
	color: #96904d;
	border: 1px solid #e9e4a4;
}

/********************************
**** SELECT2 ****************
********************************/

.select2-drop {
  z-index: 999999;
}


/* Helper */
.fpd-clearfix:before, .fpd-clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.fpd-clearfix:after { clear: both; }
.fpd-clearfix { zoom: 1; }
.fpd-help {font-size: 11px; cursor: help;}
.fpd-children-floated > * {float: left;padding-right: 20px;}
.fpd-children-floated > *:last-child {padding: 0;}
.fpd-clear {clear: both;}
.fpd-hidden {display: none !important;}
.chosen-container {border: none !important;}
.fpd-two-column > div {width: 50%;}
.fpd-left {float: left;}
.fpd-right {float: right;}