.panel when (@panels) {
    color         : inherit;
    border        : 1px solid @gray-light;
    margin-bottom : 2em;
    padding       : 0;

    .panel-header, .panel-content, .panel-footer {
        margin  : 0;
        padding : @padding-base-vertical @padding-base-horizontal;
        .clearfix-mixin();
    }

    .panel-header {
        display       : block;
        background    : @gray-lighter;
        color         : @gray-darker;
        border-bottom : inherit;
        font-size     : @font-size-large;
        font-family   : @font-family-headings;
    }

    .panel-content {
        background : #fff;
        overflow   : auto;
    }

    .panel-footer {
        background       : #fcfcfc;
        border-top       : inherit;
        border-top-color : #efefef;
    }

    // Alternate colors
    &.primary {
        border-color : @state-primary-border;

        .panel-header {
            background : @state-primary-bg;
            color      : @state-primary-color;
        }
    }

    &.success when (@panel-success) and (@panel-colors) {
        border-color : @state-success-border;

        .panel-header {
            background : @state-success-bg;
            color      : @state-success-color;
        }
    }
    &.warning when (@panel-warning) and (@panel-colors) {
        border-color : @state-warning-border;

        .panel-header {
            background : @state-warning-bg;
            color      : @state-warning-color;
        }
    }
    &.error when (@panel-error) and (@panel-colors) {
        border-color : @state-error-border;

        .panel-header {
            background : @state-error-bg;
            color      : @state-error-color;
        }
    }
    &.info when (@panel-info) and (@panel-colors) {
        border-color : @state-info-border;

        .panel-header {
            background : @state-info-bg;
            color      : @state-info-color;
        }
    }

    &.collapse when (@panel-collapse) and (@panel-types) {
        .panel-header {
            position      : relative;
            padding-right : @padding-base-horizontal + @icon-size-base;
        }

        .collapse-btn {
            position : absolute;
            right    : @padding-base-horizontal;
            top      : 0;
            bottom   : 0;
            margin   : auto;
            cursor   : pointer;
            color    : fade(#000, 30%);
            .icon-size(@icon-size-base; true)
        }
    }
}