/*
 * Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved.
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *     http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.panel-view {
	display: none;
}

.panel-view.active {
    @include flex; 
    @include northstar-bg;
	display: block;
	border-top: 1px solid rgba(255,255,255,.15);
	color: white;
	z-index: 0;
	position: relative;
	overflow: hidden;
}

.panel-view.active > :first-child {
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: auto;
	top: 0px;
	left: 0px;
	margin: 0px;
}

.panel-tab-list {
	@include hbox;
    @include noflex;
	background: #2b2d2d;
}

/* Disable CSS Custom Filters. */
#filter-dock .panel-tab-list {
    display: none;
}

.panel-tab {
    border-radius: 4px 4px 0 0;
	padding: 5px 10px;
    border-top: 1px solid rgba(0,0,0,0);
    border-right: transparent;
	color: #aaa;
    text-shadow: 0 1px 0 #000;
	font-size: 12px;
	cursor: pointer;
    white-space: nowrap;
	
	&.active{
        @include northstar-bg;
    	position: relative;
    	z-index: 10;
    	border-top: 1px solid #6a6a6a;
    	border-bottom: 2px solid #494D4E;
        border-right: 1px solid #555;
    	color: white; 
        text-shadow: 0 -1px 0 #000;
    	top: 1px;
    	padding-top:4px;
	}
}

.panel-container {
	z-index: 0;
    @include vbox;
    @include flex;
}

.panel-column {
    @include flexbox;
    @include flex;
    position: relative;
}

.panel-column.horizontal,
.panel-column.horizontal > .panel-column-items {
    @include hbox;
}

.panel-column.vertical,
.panel-column.vertical > .panel-column-items {
	@include vbox;
}

.panel-column-header {
	@include noflex;
	font-weight: bold;
	color: white;
	padding: 8px;
	background: $baseColorDark;
}

.panel-column-title {
    font-weight: normal;
    text-shadow: 0 -1px 0 #000;
}

.panel-column-close-button {
	float: right;
}

.panel-column-items {
	@include flexbox;
	@include flex;
}

.panel-column.horizontal > .panel-column-items > .panel-separator {
	width: 1px;
	@include noflex;
	background:  #1f1f1f;
    border-right: 1px solid rgba(0,0,0,0);
    border-left: 1px solid rgba(0,0,0,0);
	cursor: col-resize;
}

.panel-column.vertical > .panel-column-items > .panel-separator {
	height: 3px;
	@include noflex;
	background: #1f1f1f;
	cursor: row-resize;
}

/* trim down on needless resizing handles */
.panel-separator:first-of-type,
.panel-column-handle {
    display: none;
}

.light {
    
    section{
        background: white;
    }    
    
    .panel-tab-list{
        background: #D4D7D7;
        border-bottom: 1px solid #c4c6c6;
    }  
    
    .panel-tab,
    .panel-view.active{
        background: #DFE2E2;
        border-top: 1px solid #DFE2E2;   
    }

    .panel-view.active {
        color: black;
    }
    
    .panel-tab{    
        border: none;
        color: $baseColorDark;
        margin: -1px 0 0;
        text-shadow: 0 1px 0 white;
        background: none;
        border-right: none;
        
        &.active{
            background: #DFE2E2;
            border-top: 1px solid #c4c6c6;            
            border-right: 1px solid #c4c6c6;
            border-left: 1px solid #c4c6c6;
            border-radius: 4px 4px 0 0;
            box-shadow: inset 0 1px 0 #FFF; 
            
            &:first-child{
                border-left: none;
            };
        }
    }
}

#main-view .light .panel-separator {   
        border: none;
        background: #bcbcbc !important;
    }

#active-filters {
    overflow-x: hidden;
}