/**
 * Reusable UI components for things like add block overlay, group selector, etc..
 */

 /* Newsflow dialog - move into ccm.menus.css */
.ui-dialog-titlebar {z-index: @index-level-dialog-title-bar;}


table.ccm-permission-grid {border: 0px;}
table.ccm-permission-grid td.ccm-permission-grid-name {text-align: right; width: auto; white-space: nowrap;}
table.ccm-permission-grid td {width: 100%; border-left: 0px !important; border-right: 0px !important;}

/* blocks */
div.ccm-block-field-group {margin-bottom: 10px; border-bottom: 1px dotted #aaa; padding-bottom: 10px}
div.ccm-block-field-group h2 {margin-bottom: 6px}

ul#ccm-block-type-list {padding: 2px 0px 0px 0px; margin: 8px 0px 16px 0px}
ul#ccm-block-type-list li {margin-left: 0px; list-style-type: none; display: none !important}
.ccm-block-type a.ccm-scrapbook-delete {top: 8px; right: 10px; position: absolute}
.ccm-block-type-inner .btn {position: relative; top: -6px;}
.ccm-block-type a.ccm-block-type-inner, .ccm-block-type p.ccm-block-type-inner, .ccm-block-type .ccm-block-type-inner {background-repeat: no-repeat; background-position: 8px 10px; background-size: 16px 16px; color: #666; margin-bottom: 2px; display: block; font-size: 14px; padding: 8px 8px 8px 30px; text-decoration: none; border: 1px solid #fff}
.ccm-block-type a.ccm-block-type-inner-nobkgd, .ccm-block-type p.ccm-block-type-inner-nobkgd, .ccm-block-type .ccm-block-type-inner-nobkgd {color: #666; display: block; font-size: 14px; text-decoration: none; border: 1px solid #fff}
.ccm-block-type p.ccm-block-type-inner {margin: 0px}
.ccm-block-type-selected a.ccm-block-type-inner {background-color: #BDD5FD; border: 1px solid #255E8A !important}
.ccm-block-type a.ccm-block-type-inner:hover {background-color: #d9e7ff; border: 1px solid #94a7c7 !important}
.ccm-block-type {position: static; padding: 0px 0px 2px 0px; border-bottom: 1px solid #e4e4e4 !important; margin-bottom: 2px !important; left:0px; top:0px; width:auto; height:auto;}
.ccm-block-type div.ccm-block-type-description {display: none; padding-left: 30px; color: #aaa; font-size: 12px; padding-top: 2px; padding-bottom: 6px}
.ccm-block-type.ccm-external-block-type li.ccm-block-price{ float:right; margin:10px 10px 0px 10px; font-weight: bold; color: #205334; text-transform: uppercase}
.ccm-block-type.ccm-external-block-type .ccm-block-type-description{display:block; padding-left: 0px;}

/* general overlay select list */
@import "../../vendor/font-awesome/variables.less";

.item-select-list-hover() {
  color: @text-color;
  background-color: #e7e7e7;
  text-decoration: none;
  .border-radius(4px);
  .transition(background-color 0.1s linear);
}

ul.item-select-list {padding: 2px 0px 0px 0px; margin: 0px 0px 15px 0px; list-style-type: none !important;}
ul.item-select-list > li {position: relative; margin-bottom: 2px; padding-bottom: 2px}
ul.item-select-list > li > a, ul.item-select-list > li > span {color: @text-color; background-repeat: no-repeat; display: block; padding: 8px 8px 8px 8px; text-decoration: none; border: 1px solid transparent}
ul.item-select-list > li > a:hover,
ul.item-select-list > li > span:hover {
  .item-select-list-hover();
}
ul.item-select-list > li > a:focus {
  text-decoration: none;
}
ul.item-select-list > li > a img, ul.item-select-list li > span img {vertical-align: middle; max-width: 16px; margin-right: 5px; display: Inline-block;}
ul.item-select-list > li > a i {vertical-align: middle; font-size: 16px;
  width: 16px; text-align: center; -webkit-font-smoothing: antialiased; margin-right: 5px; display: inline-block}
ul.item-select-list i.ccm-item-select-list-sort {
  position: absolute;
  top: 10px;
  right: 10px;
  font-style: normal;
  margin: 0px;
  padding-left: 5px; padding-right: 5px;
  &:after {
    font-family: FontAwesome;
    content: @fa-var-arrows-v;
  }
  &:hover {
    cursor: move;
  }
}
ul.item-select-list > li > div.item-select-list-content {
  padding: 10px;
  background-color: #efefef;
  margin-top: 2px;
  overflow: hidden;
}

[data-section=customize-results] {
  ul.item-select-list {
      li {
        padding: 8px;
        margin-bottom: 2px;

      &:hover {
          background-color: #e7e7e7;
          border-radius: 4px;
          .transition(background-color 0.1s linear);
      }
    }

    i.ccm-item-select-list-sort {
      top: 9px;
    }
  }
}

ul#ccm-page-attribute-list li {display: none !important}
ul#ccm-page-attribute-list .ccm-attribute-available {display: list-item !important}
ul#ccm-page-attribute-list .ccm-attribute-added a {text-decoration: line-through; color: #dedede}
ul#ccm-page-attribute-list .ccm-attribute-added a:hover {border: 1px solid #fafafa !important; cursor: default; background-color: transparent}
#ccm-properties-custom-tab div.well {position: relative}
#ccm-properties-custom-tab label {margin-top: -2px}
.ccm-meta-close {position: absolute; top: 18px !important; right: 20px}

table.ccm-block-type-table {border-collapse: collapse;width: 100%}
table.ccm-block-type-table div.ccm-block-type-inner {color: #666; display: block; font-size: 14px; text-decoration: none; border: 1px solid #fff}
table.ccm-block-type-table div.ccm-block-type-description {color: #aaa; font-size: 12px; padding-top: 10px}
table.ccm-block-type-table td {padding: 8px 2px 8px; border-bottom: 1px solid #DEDEDE}

/* Versions Grid */
table#ccm-versions-list tr.version-active td {font-weight: bold;}


/* user/group selector */
div.ccm-group span.ccm-group-inner, div.ccm-group a.ccm-group-inner {background-repeat: no-repeat; background-position: 8px 8px; color: #666; display: block; font-size: 14px; padding: 8px 8px 8px 30px; text-decoration: none; border: 1px solid #fff}
div.ccm-group div.ccm-group-inner-indiv {background-repeat: no-repeat; background-position: 8px 8px; color: #666; font-size: 14px; padding: 8px 8px 8px 30px; text-decoration: none; border: 1px solid #fff}
div.ccm-group a.ccm-group-inner-atag {color: #666; font-size: 14px; padding: 8px 0px; text-decoration: none; border: 1px solid #fff}
div.ccm-group a.ccm-group-inner-atag:hover {color: #666; font-size: 14px; padding: 8px 0px; text-decoration: none; border: 1px solid #fff}
div.ccm-group {position: relative; padding: 0px 0px 2px 0px; border-bottom: 1px solid #dedede; margin-bottom: 2px}
div.ccm-group a.ccm-group-inner:hover {background-color: #d9e7ff; border: 1px solid #94a7c7}
div.ccm-group .ccm-group-sort {position: absolute; top: 12px; right: 10px;}
.ccm-group-sort:hover {cursor: move}
div.ccm-group-description {padding-left: 30px; color: #aaa; font-size: 12px; padding-top: 2px; padding-bottom: 6px}
span.ccm-group-description {color: #aaa; font-size: 12px; padding-top: 2px; padding-bottom: 6px}
#ccm-group-search-fields {padding-left: 24px; background: transparent url(../images/icons/search.png) no-repeat scroll left 6px }

/* date controls */
.ccm-input-time-wrapper {
  select {
    width: auto;
    margin-right: 4px !important;
    &:last-child {
      margin-right: 0 !important;
    }
  }
  .separator {
    margin-right: 4px;
  }
}
.ccm-input-date {width: auto ; margin-right: 4px !important;}
div.popover {
  .ccm-input-date-wrapper {
    margin-bottom: 10px;
  }
  .ccm-input-time-wrapper, .ccm-input-date-wrapper {
    display: block;
  }
}

/* clipboard */
div.ccm-scrapbook-list-item {position:relative; margin-bottom: 20px;}
div.ccm-stack-content-wrapper {margin-bottom: 10px;}
/* stacks */
div.ccm-stack a {background-repeat: no-repeat; background-position: 8px 8px; background-image: url(../images/icons/stack.png); color: #666; display: block; font-size: 14px; padding: 8px 8px 8px 30px; text-decoration: none; border: 1px solid #fff}
div.ccm-stack {position: relative; padding: 0px 0px 2px 0px; border-bottom: 1px solid #dedede; margin-bottom: 2px}
div.ccm-stack a:hover {background-color: #d9e7ff; border: 1px solid #94a7c7; text-decoration: none; color: #666}

/* permission details list-item checkboxes */
#ccm-permission-detail .inputs-list {
    list-style: none;
    padding-left: 0;
}

/* icon coloring */
a.icon-link i.fa {
    color: @text-color;
    text-decoration: none;
}

a.icon-link.launch-tooltip {
  border-bottom: 0px;
}

a.icon-link:hover {
  text-decoration: none;
}

/* Tooltips - in dashboard and in panels */
.ccm-ui label.launch-tooltip, .ccm-ui span.launch-tooltip {
    border-bottom: 1px dotted #50e568;
}

.ccm-ui i.fa.launch-tooltip {
  border-bottom: 0px;
  text-decoration: none;
}

.ccm-ui {
  fieldset {
    legend {
      i.launch-tooltip {
        color: #ccc;
        position: absolute;
        top: 4px;
        left: -26px;
      }
    }
  }
}
/**
 * Tooltips
 */
div#ccm-tooltip-holder {
    z-index: @index-level-tooltip-holder;
    position: relative;
}

div#ccm-selectize-holder {
  div.selectize-dropdown {
    z-index: @index-level-tooltip-holder;
  }
}


.ccm-ui {
    div.tooltip-inner {
        font-size: 14px;
        line-height: 20px;
        font-weight: 300;
        padding: 7px 10px;
        max-width: 250px;
    }
}

input.ccm-activate-date-time {
  margin-right: 8px !important;
}

/**
 * Page/entity selector
 */
div.ccm-item-selector {
  min-height: 40px;
  .border-radius(2px);
  color: #ffffff;
  background-color: #3f9edc;
  text-align: center;
  padding: 8px 12px 8px 8px;
  .transition(.3s);

  &:before,
  &:after {
      content: "";
      display: table;
  }

  &:after {
      clear: both;
  }

  &:hover {
    background-color: darken(#3f9edc, 10%);
  }

  div.ccm-item-selector-item-selected-thumbnail {
    margin-right: 10px; float: left;

    img {
      max-width: 60px;
      max-height: 60px;
    }
  }

  a {
    color: #ffffff !important;
    display: block;

    &:hover {
      color: #ffffff !important;
      text-decoration: none;
    }
  }

  .ccm-item-selector-item-selected-title {
    text-align: left;
  }
/*  border: 1px solid #dedede;
  .border-radius(4px);
  margin-top: 8px;
  margin-bottom: 8px;
  padding: 10px
*/
}

a.ccm-item-selector-clear {
  float: right;
}
