// Copyright (c) .NET Foundation and contributors. All rights reserved.
// Licensed under the MIT license. See LICENSE file in the project root for full license information.

@charset "utf-8";
@import "./constants";

@mixin output-panel-transition {
  transition: height $expansion-time ease-in, background $expansion-time ease-in,
    color $expansion-time ease-in;
}

@mixin output-panel-expanded {
  visibility: visible;
  max-height: 20em;
  padding: 2px;
  padding-left: 0.5em;
  margin: 1px;
}

.collapsed {
  visibility: collapse;
  min-height: 0px;
  height: 0px;
}

.output-panel {
  min-height: 160px;
  margin: 16px 0;
  border: 1px solid #ddd;
  padding: 2px;
  overflow: auto;
  pre {
    background: none;
  }
}

.output-panel-inline {
  position: relative;
  background: rgb(245, 244, 247);
  color: #000;
  pre {
    background: none;
  }
  div.trydotnet-run-result {
    position: absolute;
    top: 0px;
  }
}

.output-panel-inline.size-to-content {
  max-height: 20em;
}

.output-panel-inline.run-failure {
  @include output-panel-expanded;
  @include output-panel-transition;

  background: $run-failure-background;
  color: $run-failure-foreground;
}

.output-panel-inline.run-success {
  @include output-panel-expanded;
  @include output-panel-transition;
}

.output-panel-inline.error {
  @include output-panel-expanded;
  @include output-panel-transition;

  color: red;
  border: red;
  border-style: dotted;
}

.output-panel.run-failure {
  @include output-panel-transition;
  background: $run-failure-background;
  color: $run-failure-foreground;
}

.output-panel.run-success {
  @include output-panel-transition;
}

.output-panel.error {
  color: red;
  border: red;
  border-style: dotted;
}
