/********************************************************* {COPYRIGHT-TOP} ***
* Licensed Materials - Property of IBM
* 5725-Z22, 5725-Z63, 5725-U33, 5725-Z63
*
* (C) Copyright IBM Corporation 2017
*
* All Rights Reserved.
* US Government Users Restricted Rights - Use, duplication or disclosure
* restricted by GSA ADP Schedule Contract with IBM Corp.
********************************************************** {COPYRIGHT-END} **/
.apim
  .main-nav-button-container .staging-dropdown .dropdown-menu
    .dropdown-header
      color: grey
      font-size: 14px
      padding: 5px 20px
      width: 300px

    .dropdown-item
      color: black
      margin: 15px 0
      padding: 5px 30px
      width: 100%

      div
        white-space: nowrap

      .staging-nav-key
        color: grey
    li
      :hover
        background-color: #f2f2f2

    hr
      margin: 0

    .select-other-target
      height: 50px

  .staging-modal
    padding-left: 30px
    padding-right: 30px

    .title-subheader
      font-size: 12px
      margin-top: 10px

    .scrollable-list
      height: 350px
      overflow-y: auto

    .modal-header
      border: 0
      padding-top: 25px

    .modal-body
      padding-top: 10px

      button
        height: 50px
        margin: 5px 0

      .targetButtonRow
        background: linear-gradient(90deg, white 50%, #D7DFF6 50%)
        margin-bottom: 5px

        button
          margin: 0
          vertical-align: top

        button:hover
          color: #636d6b

          .orgLine
            color: white

          .catalogSpaceLine
            color: white

      .targetButton
        min-width: 200px
        width: calc(100% - 44px)

        .catalogSpaceLine
          line-height: 14px

        .orgLine
          color: grey
          font-size: 12px
          line-height: 14px
          padding-top: 5px

      .deleteButton
        background: transparent
        border: 0
        min-width: 40px

        :hover
          color: #636d6b

      .planButtons
        margin-top: 15px

        button
          height: 80px
          padding: 10px 40px
          text-align: left

          &:hover .planDesc
            color: white

        .selected
          background-color: #4b68fa
          color: white

        .planInfo
          font-size: 16px

        .planDesc
          font-size: 12px
          font-weight: normal
          line-height: 18px

        :not(.selected) .planDesc
          color: black

    .modal-footer
      border: 0
      padding-bottom: 25px !important // @stylint ignore important

    .bluemix-logo
      size: 50px

    md-input-container
      margin-left: 0
      padding: 2px

    .smallTextLink
      font-size: 10px
      margin-top: 10px

    .stagingListSelector
      border: 1px solid #e0e0e0
      height: 400px
      margin-top: 10px

      .resetButton
        height: 16px

      .selected
        background-color: #e0e0e0

    .listDisabled
      background-color: rgba(0, 0, 0, .15)
      position: fixed
      size: calc(100% - 111px) 400px
      z-index: 17

      .spinner:after
        background-color: rgb(217, 217, 217)

    .stagingListSelectorItem
      flex: 1
      height: 50px
      line-height: 50px
      padding-left: 30px
      padding-right: 10px

      .requiresApproval
        color: #788299
        font-size: 14px
        padding-right: 30px

      .spaceParentOrgName
        color: grey
        font-size: 10px

      &:hover
        background-color: #f2f2f2

    .addAppBar
      height: 50px

      .addAppButton
        absolute: top 5px right 10px
        height: 28px

    .addAppInput
      border-bottom: 1px solid #e0e0e0
      border-left: 0
      border-right: 0
      border-top: 1px solid #e0e0e0
      padding: 14px 20px

    .targetSignIn
      margin-bottom: 25px
      margin-top: 40px

    .bluemixLogin button
      background: embedurl('../images/bluemix_logo.svg', 'utf-8') no-repeat 55px center
      background-color: white
      background-size: 28px
      border-color: #4b68fa
      color: #4b68fa
      cursor: pointer
      font-family: Arial, Verdana, Helvetica, sans-serif
      font-size: 16px
      font-weight: bold
      padding: 15px 15px 15px 45px
      transition: background-color .2s, color .2s
      width: 100%

      &:disabled
        background: #ccc
        border-color: #ccc
        color: #999
        cursor: not-allowed

    .appName
      color: grey
      font-style: italic
      margin-left: 15px

  .clearLoadingOverlay
    position: fixed
    width: calc(100% - 111px)
    z-index: 17

  .staging-modal .animate-show.ng-hide-add, .animate-show.ng-hide-remove
    transition: all linear .5s

  .staging-modal .bluemixLogin button
    &:hover:not(:disabled),
    &:focus
      background-color: #4b68fa
      background-image: embedurl('../images/bluemix_logo_white.svg', 'utf-8')
      border-color: #4b68fa
      color: white

.staging-modal-backdrop-z-index
  z-index: 49 !important // @stylint ignore important

.staging-modal-z-index
  z-index: 50 !important // @stylint ignore important