// studio - developer
// ====================
// NOTE: use this area for any developer-needed or created styling that needs to be refactored into patterns or visually polished. Please list any template/view that your styles reference when definining them (example below):

// Views: Login, Sign Up
// .crazy-new-feature {
//   background: transparent;
// }

// --------------------

//.wrapper-xblock-header {

.view-outline {

  .add-xblock-component {
    text-align: center;

    .add-button {
      padding: 5px 10px;
      background-color: $blue;
      color: $white;
      text-align: center;
    }
  }

  .draggable-drop-indicator {
    left: 0;
  }

  .nav-actions {
    .collapse-all {
      .expand-all {
        display: none;
      }
    }

    .expand-all {
      .collapse-all {
        display: none;
      }
    }
  }

  .outline-item {
    padding: 6px 8px 8px 16px;
    text-wrap: avoid;
    border: 1px solid $gray;
    margin: 5px;
    background-color: $white;

    .wrapper-xblock-header-secondary {
      padding: 0px 8px 0px 26px;

      .meta-info {
        font-size: 12px;
      }
    }

    .xblock-title {
      width: 100%;
    }

    .actions-list {
      .action-item {
        display: inline-block;
      }
    }
  }

  .outline-item.collapsed {
    .sortable-list,
    .add-xblock-component {
      display: none;
    }
  }

  .item-actions {
    .configure-button {
      float: left;
      margin-right: 13px;
      color: #a4aab7;
    }
  }
}