// reuse the same setup we use for the main admin.
@import "../../../lektor/admin/static/less/bootstrap-overrides.less";

body {
  background: @header-taint;
  color: #eee;
  margin: 0;
  padding: 0;
  overflow: hidden;

  // make sure selects are disabled
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

h1 {
  font-weight: normal;
  margin: 0 0 10px 0;
  font-size: 24px;
  text-align: center;
}

.app {
  padding: 15px;
}

.app-initializing {
  text-align: center;
}

.main-nav {
  .list-group {
    font-size: 0;
    margin: 0;
    button {
      font-size: 15px;
      display: inline-block;
      text-align: center;
      width: 20%;
    }
    button[disabled=disabled], button:disabled {
      cursor: not-allowed;
      background: #ccc;
    }
    button:focus, button:active {
      outline: none;
    }
  }

  p.explanation {
    margin: 10px 0;
    height: 1em;
    font-style: italic;
  }
}

div.project-status {
  dl {
    background: lighten(@header-taint, 10);
    border: 1px solid lighten(@header-taint, 20);
    padding: 10px 15px;

    dt {
      font-weight: bold;
      display: inline-block;

      &:after {
        content: ": ";
      }
    }

    dd {
      display: inline-block;
      margin: 0;
      padding: 0 0 0 8px;
    }
  }

  ul.log {
    height: 150px;
    background: darken(@header-taint, 10);
    border: 1px solid darken(@header-taint, 20);
    font-size: 13px;
    font-family: @font-family-serif;
    overflow: auto;
    list-style: none;
    word-wrap: break-word;
    margin: 15px 0 0 0;
    padding: 8px 15px;

    li {
      margin: 0;
      padding: 0;

      & + li {
        margin-top: 5px;
      }
    }
  }
}
