/*!
 * jQuery QueryBuilder 1.3.0
 * Copyright 2014 Damien "Mistic" Sorel (http://www.strangeplanet.fr)
 * Licensed under MIT (http://opensource.org/licenses/MIT)
 */

.rule-container,
.rules-group-container,
.rule-placeholder {
  margin:4px 0;
  border-radius:5px;
  padding:5px;
  border:1px solid #eee;
  background:#fff;
  background:rgba(255, 255, 255, 0.9);
}

/* GROUPS */
.rules-group-container {
  padding:10px 10px 5px 10px;
  border:1px solid #DCC896;
  background:#FCF9ED;
  background:rgba(250, 240, 210, 0.5);
}
  .rules-group-header {
    margin-bottom:10px;
  }
    .rules-group-header input[name$=_cond] {
      display:none;
    }
  .rules-list {
    list-style:none;
    padding:0 0 0 20px;
    margin:0;
  }

/* RULES */
.rule-container  {}
  .rule-container>div:not(.rule-header) {
    display:inline-block;
    margin:0 5px 0 0;
    vertical-align:top;
  }
  .rule-value-container:not(:empty) {
    border-left:1px solid #ddd;
    padding-left:5px;
  }
  .rule-value-container label {
    margin-bottom:0;
  }
  .rule-value-container label.block {
    display:block;
  }
  .rule-container select,
  .rule-container input[type=text],
  .rule-container input[type=number] {
    padding:1px;
  }

.rules-group-container.has-error,
.rule-container.has-error {
  background:#fdd;
  border-color:#f99;
}

/* TICKS */
.rules-list>* {
  position:relative;
}
  .rules-list>*:before,
  .rules-list>*:after {
    content:'';
    position:absolute;
    left:-15px;
    width:15px;
    height:calc(50% + 4px);
    border-color:#ccc;
    border-style:solid;
  }

  .rules-list>*:before {
    top:-5px;
    border-width:0 0 2px 2px;
  }
  
  .rule-container {
    float: left;
    width: 100%;
  }
  
  .rules-list>*:after {
    top:50%;
    border-width:0 0 0 2px;
  }

  .rules-list>*:first-child:before {
    top:-12px;
    height:calc(50% + 14px);
  }
  .rules-list>*:last-child:before {
    border-radius:0 0 0 4px;
  }
  .rules-list>*:last-child:after {
    display:none;
  }

/* DRAG & DROP */
.rule-container .drag-handle,
.rules-group-container .drag-handle {
  cursor:move;
  display:inline-block;
}

.rule-container .dragged,
.rules-group-container .dragged {
  opacity:0.5;
}

.rule-placeholder {
  border:1px dashed #bbb;
  opacity:0.7;
}