/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you 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.
 */

@gray-light-lighter: lighten(@gray-light, 20%);

.activity-detail {
    .activity-header {
        -webkit-font-smoothing: antialiased;
        margin-bottom: 40px;
        status {
            width: 50px;
            height: 50px;

            margin-right: 20px;
            margin-top: 3px;
        }

        .activity-title {

            font-weight: bold;
            font-size: 21px;
        }

        .activity-entity {
            font-size: 16px;
            color: grey;
        }

        .activity-description {
            border-top: 1px solid @gray-lighter;
            border-bottom: 1px solid @gray-lighter;
            margin-top: 15px;
            padding-top: 5px;
            padding-bottom: 5px;
            color: @gray-light;
        }
    }
    
    table.summary {
        tr td:first-child {
            width: 25%;
            white-space: nowrap;
        }
    }

    stream pre {
        max-height: 28em;
    }

    .summary-block {
        padding-left: 71px;
    }

    .summary-body {
        margin-bottom: 24px;
    }
    
    .summary-item {
        margin-bottom: 35px;

        @greenColor: @brand-success;
        @redColor: @brand-danger;
        @greenColor: #58BA58;
        @redColor: #BA5858;
        .summary-item-value {
            &.status-completed {
                color: @greenColor;
                font-weight: bold;
                -webkit-font-smoothing: antialiased;
            }
            &.status-failed {
                color: @redColor;
                font-weight: bold;
                -webkit-font-smoothing: antialiased;
            }
            &.status-in-progress {

            }
            &.status-unknown {

            }
        }

        .summary-item-label {
            font-weight: bold;
            font-size: 14px;
            color: @gray-light-lighter;
            -webkit-font-smoothing: antialiased;
            text-transform: uppercase;
            margin-bottom: 7px;
            .monospace();
        }

        .monospace {
            .monospace();
        }
        
        .table-responsive,
        .table {
            margin-bottom: 0;
        }

        .summary-item-icon {
            position: absolute;
            left: -60px;
            width: 50px;
            height: 50px;
        }

        .icon-stopwatch {
            position: absolute;
            width: 48px;
            height: 48px;
            top: 0px;
            left: 1px;
            background-image: url('../../../../../img/stopwatch@2x.png');
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }

        &.summary-item-timestamp {
            .summary-item-value {
                display: block;

                > div {
                    opacity: 1.0;
                    position: absolute;
                    &.fade.ng-hide {
                        opacity: 0;
                    }

                    &.fade.ng-hide-remove,
                    &.fade.ng-hide-add {
                        display: block !important;
                    }

                    &.fade.ng-hide-remove {
                        transition: all linear 300ms;
                    }

                    &.fade.ng-hide-add {
                        transition: all linear 300ms;
                    }
                }
            }
        }
    }
    .result-parent {
        .monospace();
    }
    .result-parent.big-result {
       border: 1px solid @gray-lighter;
      .result-body {
        padding: 4px;
      }
    }
    .result-body {
        max-height: 56pt;
        overflow: scroll;
    }
    
    .collapsing {
        // internal class used by bootstrap when opening/closing:
        // activity viewers are probably power users - don't want to
        // wait too long for accordions to open/close; speed them up
        .transition-duration(.1s);
        // inherited: .transition-property(~"height, visibility");, timing-function ease
    }
    
}
