// Place all the styles related to the pages controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/

body.debugging {
  overflow-x: hidden;
}

section#superconductor_panel {
  details summary { cursor: pointer; }
  color: white;
  z-index: 998;
  a, a:link, a:visited { color: white; }
  -webkit-transition: opacity 0.5s;
  display: none;
  font-family: Verdana, Helvetica, sans-serif;
  font-size: 13px;
  color: white;
  background-color: #333333;
  position: fixed;
  top: 0px;
  bottom: 0px;
  right: -300px;
  width: 300px;
  br { clear: both; height: 0px; }
  background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#222222));
  > details {
    > summary {
      background: -webkit-gradient(linear, left top, left bottom, from(#333333), to(#000000));
      white-space: nowrap;
      padding: 10px;
      > a { float: right; }
    }
    dl {
      padding: 5px 10px 10px 10px;
      margin: 0px 5px 0px 5px;
      dt {
        font-weight: bold;
        clear: left;
        float: left;
        min-width: 100px;
        &:after { content: ':' }
      }
      dd {
        &.nowrap {
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
        }
        > details {
        }
      }
    }
  }
  textarea {
    background-color: #333333;
    color: white;
    width: 99%;
    max-width: 99%;
    height: 300px;
    line-height: 16px;
  }
  &.resizing {
    opacity: 0.85;
  }
  & .resizer {
    position: absolute;
    width: 10px;
    height: 100%;
    margin-left: -10px;
    padding: 0px;
    background: -webkit-gradient(linear, left top, right top, from(transparent), to(#111111));
    background: gradient(linear, left top, right top, from(#FFFFFF), to(#111111));
    cursor: w-resize;
    border: none;
  }
}