@import "../colors";
@import "../fonts";
@import "../buttons";

.operation-button(@color) {
  background: @color;
}
.try-operation {
  position: relative;

  .json-body {
    border: none;
    margin: 0;
    padding: 0;
  }

  .response-info {
    padding: .5em;
    margin: .5em 0;
    background: lighten(@green, 50%);

    &.error {
      background: lighten(@red, 40%);
    }
  }

  .options-table {
    td {
      padding: .25em 1em;
    }
  }

  .raw-model {
    min-height: 300px;
  }

  .headers {
    margin: 1em 0;
  }

  .cors-warning {
    background-color: @try-operation-warning;
    padding: 0.6em .4em;
    line-height: 1.5;
    margin: 1em 0;
    p {margin: 0;}
    code {
      background: none;
    }
  }

  .call[disabled] {
    cursor: not-allowed;
  }

  // json schema form adjustment (Hack)
  [data-schemaid="root"] {
    > h3 .btn-group {
      display: none; // hide [Edit JSON] and [Object Properties] in root
    }

    > .well > div > div > .row > div > h3 >.btn-group {
      display: none; // hide buttons in [Parameters] hash
    }
  }

  >div {
    >h5 {
      font-size: 1.0em;
      .sw-font-med;

      &:first-child {
        margin-top: 25px;
      }
    }

    >div {
      padding: .5em 0 1em;
    }

    .raw {
      width: 100%;
      padding: .4em;
      background: @pre-bg;
      font-family: monospace;
      border: none;
      margin: 1em 0;
      word-wrap: break-word;
    }

    .parameters {

      .required-icon {
            color: @sw-error-header;
          }

      table.edit-params {
        width: 100%;

        td {
          vertical-align: top;


        }

        .param-name {
          text-align: right;
          padding: 0.3em 0.6em;
          font-size: .9em;
        }

        textarea, input {
          -webkit-appearance: none;
          border: 1px solid lighten(@gray-md, 20%);
          border-radius: 2px;
          display: block;
          width: 100%;
          padding: .4em .6em
        }
      }
    }

    .request {
      .raw-request {
      }
      .form-control {
        color: @gray-dk !important;
      }
    }

    .response {
      .failed-bar {
        .sw-font-light;
        background: @sw-error-header;
        color: @white;
        padding: .3em;
      }
      .raw-response {
        white-space: pre;
      }

      .responses-tabs .tab-content {
        max-height: 300px;
        overflow: auto;
      }
    }
  }
}