/**
 * Stylesheet for ParaView components
*/

/* ========================================================================= */
/* ========================== Pipeline Browser ============================= */
/* ========================================================================= */

.pipelineBrowser {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.pipelineBrowser li div {
    display: inline-block;
}

/* ==========================  General purpose  ============================ */

.pipeline-line.server {
    height: 2em !important;
    border-bottom: solid 0.5px black;
    border-top: solid 0.5px black;

    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

/* ==========================  Panel visibility ============================ */

.pipelineBrowser li.server > ul {
    display: none;
}

.pipelineBrowser .pipeline-files {
    display: none;
}

.pipelineBrowser .pipeline-sources {
    display: none;
}

div.pipelineBrowser:not(.view-pipeline) .pipeline-tree li {
    background: none  no-repeat scroll left top transparent;
}

.pipelineBrowser.view-pipeline li.server > ul {
    display: block;
    margin-right: 10px;
}

.pipelineBrowser.view-files .pipeline-files {
    display: block;
    overflow-y: auto;
    position: absolute;
    top: 35px;
    bottom: 0;
    left: 0;
    right: 0;
}

.pipelineBrowser.view-sources .pipeline-sources {
    display: block;
    overflow-y: auto;
    position: absolute;
    top: 35px;
    bottom: 0;
    left: 0;
    right: 0;
}

/* =============================  Pipeline  =============================== */

.pipeline-tree {
    line-height: 1.5;
    -moz-user-select: none;
    position: relative;
    margin: 0px;
}

.pipeline-tree .head-icon {
}

.pipeline-control div {
    position: relative;
    width: 25px;
    height: 25px;
}

.head-icon.server {
    margin-left: 5px !important;
    position: relative;
    top: 5px;
    width: 25px;
    height: 25px;
    background: url("paraview/pipeline/server.png") no-repeat transparent;
}

.pipelineBrowser li.proxy {
    list-style: none;
    line-height: 1.5em;
    position: relative;
    top: 0px;
}

.pipelineBrowser .pipeline-line {
    position: relative;
    height: 26px;
    width: 100%;
    margin-left: -5px;
    padding-right: 5px;
    cursor: pointer;
}

.server.pipeline-line{
    cursor: auto;
    margin-bottom: 5px;
    margin-left: 0px;
    padding-right: 0px;
}

.pipelineBrowser .pipeline-control {
    height: 26px;
    position: absolute;
    right: 0px;
}

.pipelineBrowser .pipeline-control > div {
    margin-left: 10px;
    cursor: pointer;
}

.pipelineBrowser .proxy-control {
    position: relative;
}
.pipelineBrowser .color-control {
    height: 26px;
    position: absolute;
    right: 0px;
}

.pipelineBrowser .selected {
    margin-left: -10px;
    margin-top: -1px;
    height: 24px;

    padding-left: 4px;

    border: 1px solid #B4B4B4;
    border-radius: 8px;
    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EFEFEF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, left center, right center, from(#EFEFEF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(left center,  #EFEFEF,  #CFCFCF); /* for firefox 3.6+ */
}

.pipeline-tree ul {
    margin: 0 0 0 -1.5em;
    padding: 0 0 0 1.5em;
}

.pipeline-tree ul ul {
    background: url("paraview/pipeline/list-item-contents.png") repeat-y scroll 5px center transparent;
}

.pipeline-tree li {
    background: url("paraview/pipeline/list-item-root.png") no-repeat scroll left top transparent;
    list-style: none;
    margin: 0;
    padding: 0;
}

.pipeline-tree li li {
    background-image: url("paraview/pipeline/list-item.png");
    padding-left: 1.5em;
}

.pipeline-tree li.lastChild > ul {
    background-image: none;
}

.pipeline-tree li.lastChild {
    background-image: url("paraview/pipeline/list-item-last.png");
}

.pipeline-tree li.open {
    background-image: url("paraview/pipeline/list-item-open.png");
}

.pipeline-tree li.open.lastChild {
    background-image: url("paraview/pipeline/list-item-last-open.png");
}

.pipeline-tree li ul {
    position: relative;
}

.pipelineBrowser .label {
    font-family: Arial,sans-serif;
    font-size: 1em;
    font-weight: bold;
    position: relative;
    top: -0.4em;
    margin-left: 10px;
}

.pipelineBrowser li.server > div > div.label {
    top: -0.25em;
    left: -0.25em;
    margin-left: 0px;
}

/* ==========================  Pipeline Control ============================ */

.server.pipeline-line {
    position: relative;
}

.server .pipeline-control {
    position: absolute;
    right: 10px;
    margin: 0;
    padding: 0;
    height: 2em;
    overflow: hidden;
}

.server .action {
    width: 25px;
    display: inline-block;
    margin-top: 2px;
    padding: 2px;
}

.server .action:hover:not(.disabled) {
    padding: 1px;
    margin-top: 1px;

    border-radius: 8px;
    border: 1px solid #B4B4B4;

    background: #FFFFFF;
}

.server .pipeline-control .active {
    padding: 1px;
    margin-top: 1px;

    border-radius: 8px;
    border: 1px solid #B4B4B4;

    background: #CFCFCF; /* for non-css3 browsers */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EFEFEF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, left center, right center, from(#EFEFEF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(left center,  #EFEFEF,  #CFCFCF); /* for firefox 3.6+ */
}

.server .pipeline-control .edit .icon {
    background: url("paraview/pipeline/edit.png") no-repeat center center transparent;
}

.server .pipeline-control .files .icon {
    background: url("paraview/pipeline/folder.png") no-repeat center center transparent;
}
.server .pipeline-control .add .icon {
    background: url("paraview/pipeline/add.png") no-repeat center center transparent;
}
.server .pipeline-control .delete-proxy .icon {
    background: url("paraview/pipeline/delete.png") no-repeat center center transparent;
}
.server .pipeline-control .delete-proxy.disabled .icon {
    background: url("paraview/pipeline/delete_disabled.png") no-repeat center center transparent;
}

/* ==========================  Representations  ============================ */

.pipelineBrowser .representation-selector {
    display: none;
    position: absolute;
    padding: 3px;
    width: 195px;
    height: 26px;
    border-radius: 8px;
    border: 1px solid #B4B4B4;
    z-index: 100;

    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

.pipelineBrowser .representation-overlay-selector {
    display: none;
    position: absolute;
    top: -1px;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: white;
    border: 1px solid #B4B4B4;
    z-index: 101;
}

.pipelineBrowser .representation-overlay-label {
    display: none;
    position: absolute;
    top: -1px;
    z-index: 100;
    font-weight: bold;
    border-radius: 8px;
    background: white;
    border: 1px solid #B4B4B4;
    height: 26px;
    padding: 5px;
    padding-bottom: 0;
    vertical-align: bottom;
}

.pipelineBrowser .representation {
    position: relative;
    width: 25px;
    height: 26px;
    background: url("paraview/pipeline/representations.png") no-repeat center center transparent;
    z-index: 105;
}

.pipelineBrowser .representation.all {
    width: 195px;
    top: 0px;
    background-position: 0px;
}

.pipelineBrowser .representation.hide {
    background-position: 0px;
}

.pipelineBrowser .representation.outline {
    background-position: -34px;
}

.pipelineBrowser .representation.wireframe {
    background-position: -68px;
}

.pipelineBrowser .representation.surface {
    background-position: -102px;
}

.pipelineBrowser .representation.surface_edge {
    background-position: -136px;
}

.pipelineBrowser .representation.volume {
    background-position: -170px;
}

/* =============================  Color By  =============================== */

.pipelineBrowser .tooltip {
    display: none;
    padding: 4px;
    padding-bottom: 0;
    position: absolute;
    border-radius: 8px;
    border: 1px solid #B4B4B4;
    z-index: 200;

    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

.pipelineBrowser .colorBy {
    width: 25px;
    height: 25px;
    position: relative;
}

.pipelineBrowser .colorBy.color {
    top: -6px;
    left: 6px;
    width: 12px;
    height: 12px;
    margin-right: 11px;
    border-radius: 30px;
    background: white;
    border: 1px solid black;
}

.pipelineBrowser .colorBy.points {
    background: url("paraview/pipeline/colorByPoints.png") no-repeat transparent !important;
    width: 25px !important;
}

.pipelineBrowser .colorBy.cells {
    background: url("paraview/pipeline/colorByCells.png") no-repeat transparent !important;
    width: 25px !important;
}

/* ============================  Scalar Bar  ============================== */

.pipelineBrowser .scalarbar {
    position: relative;
    width: 25px;
    height: 25px;
    background: url("paraview/pipeline/scalarbar.png") no-repeat transparent;
    background-position: 0px;
}
.pipelineBrowser .scalarbar.disable, .pipelineBrowser .scalarbar.off {
    background-position: -25px;
}

/* ==========================  Array Selection  ============================ */

.pipelineBrowser .array-selector {
    display: none;
    position: absolute;
    padding: 0;
    position: absolute;
    border-radius: 8px;
    border: 1px solid #B4B4B4;
    z-index: 200;

    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

.pipelineBrowser .array-selector ul {
    margin: 0;
    padding: 10px;
}

.pipelineBrowser .array-selector li {
    list-style: none;
    margin: 0 0 5px 0;
    padding: 0;
    line-height: 1.5em;
    cursor: pointer;
    background: none;
}

.pipelineBrowser .array-selector li:hover {
    background: white;
}

.pipelineBrowser .array-selector li.points {
    background: url("paraview/pipeline/colorByPoints.png") no-repeat left top transparent;
    padding-left: 30px;
}

.pipelineBrowser .array-selector li.cells {
    background: url("paraview/pipeline/colorByCells.png") no-repeat left top transparent;
    padding-left: 30px;
}

.pipelineBrowser .array-selector li.color {
    background: url("paraview/pipeline/pickColor.png") no-repeat left top transparent;
    padding-left: 30px;
    border-bottom: 1px solid black;
}

/* ===========================  Color Picker  ============================= */

.pipelineBrowser .colorPicker {
    display: none;
}

/* ===========================  File Browser  ============================= */

.pipeline-files ul, .pipeline-sources ul {
    margin: 0;
    padding: 0;
}

.pipeline-files li, .pipeline-sources li {
    position: relative;
    line-height: 1.5;
    text-align: left;
    list-style: none;
    font-weight: bolder;
    cursor: pointer;
    padding-left: 30px;
}

.pipeline-files .icon {
    width: 25px;
    height: 25px;
    position: absolute;
    top: -1px;
    left: 2px;
}

.pipeline-files li.menu-link .icon {
    background: url("paraview/pipeline/folder.png") no-repeat left center transparent;
}

.pipeline-files li.open-file .icon {
    background: url("paraview/pipeline/file.png") no-repeat left center transparent;
}

.pipeline-files li:hover {
    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

/* =======================  Source/Filter Browser  ========================= */

.pipeline-sources .icon {
    width: 25px;
    height: 25px;
    position: absolute;
    top: -1px;
    left: 2px;
}

.pipeline-sources li.action[category=filter] {
    display: none;
}

.view-filters .pipeline-sources li.action[category=filter] {
    display: block;
}

.pipeline-sources li.action[category=filter] .icon {
    background: url("paraview/pipeline/filter.png") no-repeat left center transparent;
}

.pipeline-sources li.action[category=source] .icon {
    background: url("paraview/pipeline/source.png") no-repeat left center transparent;
}

.pipeline-sources li.action:hover {
    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

/* ==========================  Property editor  ============================ */

.pipeline-editor {
    display: none;
}

.pipelineBrowser.view-pipeline.view-pipeline-editor .pipeline-editor {
    display: block;
}

.pipeline-editor td.pv-widget {
    width: 100%;
}

.pipeline-editor td.title {
    font-weight: bold;
    font-size: 0.8em;
}

.pipeline-editor .text-1 > input[type=text] {
    width: 96%;
}
.pipeline-editor .text-2 > input[type=text] {
    width: 45%;
    margin-right: 1%;
    position: relative;
}
.pipeline-editor .text-3 > input[type=text] {
    width: 30%;
    margin-right: 1%;
    position: relative;
}
.pipeline-editor .text-6 > input[type=text] {
    width: 30%;
    margin-right: 1%;
    position: relative;
}
.pipeline-editor .pv-widget > select {
    width: 96%;
}

.pipeline-editor .property input.multi-value {
    width: 96%;
}

.pipeline-editor .property .multi-value .add {
    width: 26px;
    background: url("paraview/pipeline/add.png") no-repeat scroll center transparent;
}

.pipeline-editor .property .multi-value .delete-value {
    width: 26px;
    background: url("paraview/pipeline/delete.png") no-repeat scroll center transparent;
}

.pipeline-editor .pv-widget-slider {
    margin: 10px;
    font-size: 0.5em;
    margin-left: 0px;
}

.pipeline-editor .pipeline-editor-content > table {
    margin-left: 5px;
    margin-top: 10px;
}

.pipeline-editor-header .apply .icon {
    background: url("paraview/pipeline/apply.png") no-repeat scroll center transparent;
}
.pipeline-editor-header .apply.modified .icon {
    background: url("paraview/pipeline/apply_modified.png") no-repeat scroll center transparent;
}

.pipeline-editor-header .reset .icon {
    background: url("paraview/pipeline/reset.png") no-repeat scroll center transparent;
}

.pipeline-editor {
    margin-top: 15px;
}

.pipeline-editor-header {
    position: relative;
    height: 2em;
    width: 100%;
}

.pipeline-editor-header .pipeline-control {
    position: absolute;
    right: 10px;
    top: 0px;
    margin: 0;
    padding: 0;
    height: 2em;
    overflow: hidden;
}

.pipeline-editor-header .action {
    width: 25px;
    display: inline-block;
    margin-top: 2px;
    padding: 2px;
}

.pipeline-editor-header .action:hover {
    padding: 1px;
    margin-top: 1px;
    border-radius: 8px;
    border: 1px solid #B4B4B4;

    background: #FFFFFF;
}

.pipelineBrowser div.pipeline-editor-header {
    border-bottom: solid 0.5px black;
    border-top: solid 0.5px black;

    background: #CFCFCF; /* for non-css3 browsers */

    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#CFCFCF'); /* for IE */
    background: -webkit-gradient(linear, center top, center bottom, from(#FFFFFF), to(#CFCFCF)); /* for webkit browsers */
    background: -moz-linear-gradient(center top,  #FFFFFF,  #CFCFCF); /* for firefox 3.6+ */
}

.pipeline-editor .label {
    top: 0.5em;
    margin-left: 0.5em;
}