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

 /* Newsflow dialog - move into ccm.menus.css */

div.newsflow {z-index:@index-level-dialog; width:940px; /* height: 590px; overflow: hidden; */ min-height: 590px; margin: 0px auto 0px auto; position: relative; background-color:#ffffff; border:1px solid #ccc;  .border-radius(4px); -webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.15);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.15);box-shadow:0 3px 7px rgba(0, 0, 0, 0.15);}
div.newsflow table.newsflow-layout td {vertical-align: top; padding: 12px; border-top: 0px !important; border-left: 0px !important; height: 125px; border-right: 1px solid #dedede; background-clip: padding-box;}
div.newsflow table.newsflow-layout td:last-child {border-right: 0px;}
div.newsflow table.newsflow-layout h6 {line-height: 18px; margin-top: 0px; margin-bottom: 8px; padding-top: 0px;}
div.newsflow table.newsflow-layout tr:last-child td {border-bottom: 0px;}
div.newsflow a.ccm-newsflow-close {position: absolute; top: 5px; right: 8px;}
div.newsflow table.newsflow-layout tr:last-child td:last-child {.border-radius(0 0 6px 0);}
div.newsflow table.newsflow-layout tr:last-child td:first-child {.border-radius(0 0 0 6px);}
div.newsflow table.newsflow-layout tr:first-child td:first-child {.border-radius(6px 0 0 0);}
div.newsflow table.newsflow-layout tr:first-child td:last-child {.border-radius(0 6px 0 0);}
div.newsflow table.newsflow-layout tr:first-child td:only-child {.border-radius(6px 6px 0 0);}
div.newsflow table.newsflow-layout tr:last-child td:only-child {.border-radius(0 0 6px 6px);}

div.newsflow table.newsflow-layout {margin-bottom: 0px; height: 592px; border: 0px !important;}
div.newsflow table.newsflow-layout td.newsflow-em1 {height: 1px; background-color: #f1f1f1;}
div.newsflow table.newsflow-layout td.newsflow-column-quarter {height: 100%; width: 25%;}
div.newsflow table.newsflow-layout td.newsflow-em1 hr {border-bottom-color: #d1d1d1;}

div#newsflow-overlay {display: none; position: absolute; z-index: @index-level-dialog}
div#newsflow-overlay div.row {margin-left: 0px;}
div.newsflow .ccm-pane-header-icons li {margin-left: 2px; position: relative; z-index: @index-level-dialog; }
div.newsflow ul.ccm-pane-header-icons {list-style-type:none}

div.newsflow .ccm-pane-header-icons {top: 2px; right: 2px}
div#ccm-dashboard-welcome-back {margin: -13px -10px 0px -12px; overflow: hidden; color: #666; padding: 80px 30px 30px 155px; background: transparent url(../images/newsflow_logo_welcome_back.png) no-repeat 0 0}
div#ccm-dashboard-welcome-back h1 {font-size: 48px; color: #666; }
#newsflow-header-first-run {margin: -12px -10px -12px -12px; font-size: 48px; padding: 55px 0px 40px 310px; background: transparent url(../images/newsflow_logo_welcome_first_run.png) no-repeat 0 0}
#newsflow-header-first-run h1, div#newsflow-header h1 {font-size: 48px; margin-bottom: 10px;}
div#newsflow-header {background-color: #f1f1f1; padding: 40px 30px 10px 60px; background-clip: padding-box; .border-radius-top-only(5px); border-bottom: 1px solid #d1d1d1;
    -webkit-box-shadow:0 1px 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow:0 1px 5px rgba(0, 0, 0, 0.2);
    box-shadow:0 1px 5px rgba(0, 0, 0, 0.2)
}
.newsflow-column-first-run {min-height: 130px;}
.newsflow .ccm-pane-options {.border-radius-top-only(5px);}
.newsflow-paging-previous, .newsflow-paging-next {width: 33px; text-align: center; height: 100%; z-index: @index-level-dialog; position: absolute; top: 0px; background-clip: padding-box; }
.newsflow-paging-previous {left: -65px; padding-left: 10px;}
/*
.newsflow-paging-previous:hover {background: transparent url(../images/bg_newsflow_previous.png) repeat-y top left; .border-radius-left-only(4px); }
*/
.newsflow-paging-previous:hover span {background-image: url(../images/newsflow_previous_black.png)}
.newsflow-paging-next:hover span {background-image: url(../images/newsflow_next_black.png) }
.newsflow-paging-next {right: -65px; padding-right: 10px;}
/*
.newsflow-paging-next:hover {background: transparent url(../images/bg_newsflow_next.png) repeat-y top right;}
*/
.newsflow-paging-previous a, .newsflow-paging-next a {width: 33px; vertical-align: middle; display: table-cell;}
.newsflow-paging-previous span {width: 57px; height: 86px; background: transparent url(../images/newsflow_previous.png) no-repeat; display: inline-block;}
.newsflow-paging-next span {width: 57px; height: 86px; background: transparent url(../images/newsflow_next.png) no-repeat; display: inline-block}
div#newsflow-main {z-index: @index-level-base !important;}
#newsflow-wizard-content {padding: 48px 530px 20px 60px; background-repeat: no-repeat; background-position: right bottom;}
/* Newsflow block in dashboard */
td.newsflow-latest-edition-wrapper {
    #gradient > .vertical(#F3FAFC,#E7F7FF);
}

.ui-dialog-titlebar {z-index: @index-level-dialog-title-bar;}
.ui-dialog .ccm-pane-options {z-index: @index-level-dialog-options;}

.newsflow .ccm-pane-body {background-color: transparent;}
.newsflow .ccm-pane-body-inner {background-color: transparent; padding: 20px;}

div.ccm-pane-dialog-pagination div.pagination, .ccm-pane-footer div.pagination {margin-top: 0px !important; margin-bottom: 0px !important}

body.ccm-loading *, body.ccm-loading {
    cursor: progress !important;
}

/* page selector in blocks */
div.ccm-summary-selected-item {border: 1px solid #dedede; margin-top: 8px; margin-bottom: 8px; padding: 10px}

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";
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;border-bottom: 1px solid #efefef; 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 {color: @text-color; background-color: #D4F0F7; text-decoration: none; .border-radius(4px); .transition(0.1s linear background-color);}
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: 18px; -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;
}

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 !important; margin-right: 4px !important;}
.ccm-input-date {width: auto !important; margin-right: 4px !important;}

/* 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}

/* workflow */
div.ccm-workflow a {background-repeat: no-repeat; background-position: 8px 11px; background-image: url(../images/icons/wrench.png); color: #666; display: block; font-size: 14px; padding: 8px 8px 8px 30px; text-decoration: none; border: 1px solid #fff}
div.ccm-workflow {position: relative; padding: 0px 0px 2px 0px; border-bottom: 1px solid #dedede; margin-bottom: 2px}
div.ccm-workflow a:hover {background-color: #d9e7ff; border: 1px solid #94a7c7; text-decoration: none; color: #666}

/* 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 .launch-tooltip {
    border-bottom: 1px dotted #50e568;
}

.ccm-ui i.fa.launch-tooltip {
  border-bottom: 0px;
  text-decoration: none;
}
/**
 * Tooltips
 */
div#ccm-tooltip-holder {
    z-index: @index-level-tooltip-holder;
    position: relative;
}

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