//
// Panels
// --------------------------------------------------


// Base class
.panel {
  margin-bottom: $lineHeightComputed;
  background-color: $panelBg;
  border: 1px solid transparent;
  border-radius: $panelBorderRadius;
  @include box-shadow(#{0 1px 1px rgba(0,0,0,.05)});
}

// Panel contents
.panel-body {
  padding: 15px;
  @include clearfix();
}


// List groups in panels
//
// By default, space out list group content from panel headings to account for
// any kind of custom content between the two.

.panel {
  > .list-group {
    margin-bottom: 0;

    .list-group-item {
      border-width: 1px 0;

      // Remove border radius for top one
      &:first-child {
        @include border-top-radius(0);
      }
      // But keep it for the last one
      &:last-child {
        border-bottom: 0;
      }
    }
  }
}
// Collapse space between when there's no additional content.
.panel-heading + .list-group {
  .list-group-item:first-child {
    border-top-width: 0;
  }
}


// Tables in panels
//
// Place a non-bordered `.table` within a panel (not within a `.panel-body`) and
// watch it go full width.

.panel {
  > .table {
    margin-bottom: 0;
  }
  /*
  > .panel-body + .table {
    border-top: 1px solid @table-border-color;
  }
  */
}


// Optional heading
.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  @include border-top-radius($panelBorderRadius - 1);
}

// Within heading, strip any `h*` tag of it's default margins for spacing.
.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: ceil(($baseFontSize * 1.125));
  > a {
    color: inherit;
  }
}

// Optional footer (stays gray in every modifier class)
.panel-footer {
  padding: 10px 15px;
  background-color: $panelFooterBg;
  border-top: 1px solid $panelInnerBorder;
  @include border-bottom-radius($panelBorderRadius - 1);
}


// Collapsable panels (aka, accordion)
//
// Wrap a series of panels in `.panel-group` to turn them into an accordion with
// the help of our collapse JavaScript plugin.

.panel-group {
  // Tighten up margin so it's only between panels
  .panel {
    margin-bottom: 0;
    border-radius: $panelBorderRadius;
    overflow: hidden; // crop contents when collapsed
    + .panel {
      margin-top: 5px;
    }
  }

  .panel-heading {
    border-bottom: 0;
    + .panel-collapse .panel-body {
      border-top: 1px solid $panelInnerBorder;
    }
  }
  .panel-footer {
    border-top: 0;
    + .panel-collapse .panel-body {
      border-bottom: 1px solid $panelInnerBorder;
    }
  }

  // New subcomponent for wrapping collapsable content for proper animations
  .panel-collapse {

  }
}


// Contextual variations
.panel-default {
  @include panel-variant($panelDefaultBorder, $panelDefaultText, $panelDefaultHeadingBg, $panelDefaultBorder);
}
.panel-primary {
  @include panel-variant($panelPrimaryBorder, $panelPrimaryText, $panelPrimaryHeadingBg, $panelPrimaryBorder);
}
.panel-success {
  @include panel-variant($panelSuccessBorder, $panelSuccessText, $panelSuccessHeadingBg, $panelSuccessBorder);
}
.panel-warning {
  @include panel-variant($panelWarningBorder, $panelWarningText, $panelWarningHeadingBg, $panelWarningBorder);
}
.panel-danger {
  @include panel-variant($panelDangerBorder, $panelDangerText, $panelDangerHeadingBg, $panelDangerBorder);
}
.panel-info {
  @include panel-variant($panelInfoBorder, $panelInfoText, $panelInfoHeadingBg, $panelInfoBorder);
}