////
/// @group components
////

/// A panel is a container for visually separating content.
/// Often used within a sidebar.
/// @since 0.1.0
.panel {
  background: $colour-panel-default;
  margin: em($spacing-medium 0 $spacing-large);
  padding: em($spacing-medium);

  :first-child {
    margin-top: 0;
  }

  :last-child {
    margin-bottom: 0;
  }
}

/// Modifier for the panel, to use a inverse (dark) background.
/// Autmatically uses inverse links within it. Doesn't affect buttons
/// though, so any buttons within a dark panel should be `.btn.btn--light`.
/// @require %inverse-links
/// @require .panel
/// @since 0.1.0
.panel--inverse {
  @include links-inverse;
  background: $colour-panel-inverse;
  color: $colour-text-inverse;
}

////
/// @group components
////

/// A panel is a container for visually separating content.
/// Often used within a sidebar.
/// @since 0.1.0
.panel {
  background: $colour-panel-default;
  margin: em($spacing-medium 0 $spacing-large);
  padding: em($spacing-medium);

  // sass-lint:disable no-combinators
  > :first-child {
    margin-top: 0;
  }

  // sass-lint:disable no-combinators
  > :last-child {
    margin-bottom: 0;
  }
}

/// Modifier for the panel, to use a inverse (dark) background.
/// Autmatically uses inverse links within it. Doesn't affect buttons
/// though, so any buttons within a dark panel should be `.btn.btn--light`.
/// @require %inverse-links
/// @require .panel
/// @since 0.1.0
.panel--inverse {
  @include links-inverse;
  background: $colour-panel-inverse;
  color: $colour-text-inverse;
}

Fix bug with panel first/last child items having margins removed
Fix bug with panel first/last child items having margins removed
