/*!
Plugin Name: Tipi Components
Plugin URI: https://github.com/codetipi/tipi-components
Description: Collection of goodies from the tipi
Version: 1.0
Author: Codetipi
Author URI: http://www.codetipi.com
Text Domain: tipi-components
*/
/*------------------------------------------------------------------
[X. Admin]
*/
#tipi-components-insert-dialog {
  font-family: -apple-system,BlinkMacSystemFont,Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}

#tipi-components-insert-dialog .mce-window-head {
  min-height: 40px;
  text-transform: uppercase;
}

#tipi-components-insert-dialog .mce-window-head .mce-title {
  line-height: 40px;
  font-size: 13px;
  font-weight: 700;
}

#tipi-components-insert-dialog .tipi-spinner-wrap {
  text-align: center;
  padding: 50px 0;
  background-color: #fff;
}

#tipi-components-insert-dialog .tipi-spinner-wrap i {
  -webkit-animation: tipi-rotate 0.85s linear infinite;
          animation: tipi-rotate 0.85s linear infinite;
  font-size: 30px;
  display: inline-block;
}

#tipi-components-insert-dialog .tipi-components-box-wrap {
  background-color: #fff;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .tipi-title {
  text-transform: uppercase;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block {
  padding: 25px 15px;
  border-top: 1px solid #ddd;
}

#tipi-components-insert-dialog .tipi-components-box-wrap textarea {
  border: 1px solid #ddd;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-content {
  text-align: center;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-content select {
  width: 25%;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-content #content {
  width: 90%;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-content .checkbox-wrap {
  margin-left: 10px;
  line-height: 30px;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-content .checkbox-wrap input {
  margin-right: 10px;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-1 {
  border-top: 0;
}

#tipi-components-insert-dialog .tipi-components-box-wrap .block-title {
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1px;
  margin-bottom: 20px;
}

#tipi-components-insert-dialog .component-2 .block-content {
  text-align: left;
}

#tipi-components-insert-dialog .component-2 .input-title, #tipi-components-insert-dialog .component-2 .select-title {
  float: left;
  margin-right: 20px;
  min-width: 100px;
  line-height: 30px;
  font-size: 14px;
}

#tipi-components-insert-dialog .component-2 input {
  height: 30px;
  width: 50%;
}

#tipi-components-insert-dialog .wp-color-picker {
  width: 80px;
}

#tipi-components-insert-dialog .wp-picker-container .hidden {
  display: none;
}

#tipi-components-insert-dialog .wp-color-result {
  background-color: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: 3px;
  cursor: pointer;
  height: 22px;
  margin: 0 6px 6px 0;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  vertical-align: bottom;
  display: inline-block;
  padding-left: 30px;
  box-shadow: 0 1px 0 #ccc;
  top: 0;
}

#tipi-components-insert-dialog .wp-color-result:after {
  background: #f7f7f7;
  border-radius: 0 2px 2px 0;
  border-left: 1px solid #ccc;
  color: #555;
  content: attr(title);
  display: block;
  font-size: 11px;
  line-height: 22px;
  padding: 0 6px;
  position: relative;
  right: 0;
  text-align: center;
  top: 0;
}

#tipi-components-insert-dialog .wp-color-result:focus, #tipi-components-insert-dialog .wp-color-result:hover {
  background: #fafafa;
  border-color: #999;
  color: #23282d;
}

#tipi-components-insert-dialog .wp-color-result:focus:after, #tipi-components-insert-dialog .wp-color-result:hover:after {
  color: #23282d;
  border-color: #a0a5aa;
  border-left: 1px solid #999;
}

#tipi-components-insert-dialog .wp-color-result.wp-picker-open:after {
  content: attr(data-current);
}

#tipi-components-insert-dialog .wp-picker-container, #tipi-components-insert-dialog .wp-picker-container:active {
  display: inline-block;
  outline: 0;
}

#tipi-components-insert-dialog .wp-color-result:focus {
  border-color: #5b9dd9;
  box-shadow: 0 0 3px rgba(0, 115, 170, 0.8);
}

#tipi-components-insert-dialog .wp-picker-open + .wp-picker-input-wrap {
  display: inline-block;
  vertical-align: top;
}

#tipi-components-insert-dialog .wp-picker-container .button {
  margin-left: 6px;
}

#tipi-components-insert-dialog .wp-picker-container .iris-square-slider .ui-slider-handle:focus {
  background-color: #555;
}

#tipi-components-insert-dialog .wp-picker-container .iris-picker {
  border-radius: 0;
  border-color: #ddd;
  margin-top: 6px;
}

#tipi-components-insert-dialog .wp-picker-container input[type=text].wp-color-picker {
  width: 65px;
  font-size: 12px;
  font-family: monospace;
  line-height: 16px;
  margin: 0;
}

#tipi-components-insert-dialog .wp-color-picker::-webkit-input-placeholder {
  color: #72777c;
}

#tipi-components-insert-dialog .wp-color-picker::-moz-placeholder {
  color: #72777c;
  opacity: 1;
}

#tipi-components-insert-dialog .wp-color-picker:-ms-input-placeholder {
  color: #72777c;
}

#tipi-components-insert-dialog .wp-picker-container input[type=text].iris-error {
  background-color: #ffebe8;
  border-color: #c00;
  color: #000;
}

#tipi-components-insert-dialog-body {
  overflow-y: hidden;
}

#tipi-components-button-insert button {
  background: #0085ba;
  border-color: #0073aa #006799 #006799;
  box-shadow: 0 1px 0 #006799;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799;
  line-height: 27px;
  padding: 0 12px 2px;
  -webkit-appearance: none;
  width: 80px !important;
  font-size: 13px;
  border-radius: 3px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

#tipi-components-button-insert button:hover {
  background: #008ec2;
  border-color: #006799;
  color: #fff;
}

#tipi-components-button-insert button:active {
  background: #0073aa;
  border-color: #006799;
  box-shadow: inset 0 2px 0 #006799;
  vertical-align: top;
  outline: 0;
}

@-webkit-keyframes tipi-rotate {
  from {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}

@keyframes tipi-rotate {
  from {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
  to {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}