/*
	Panels
    ==========================================================================

	Panel styling uses the Bootstrap classes and overrides some styles in order to make them
	look like the Gambio Admin theme.

	bower_components/bootstrap-sass/assets/stylesheets/bootstrap/_panels.scss

*/

$brand-gray: #ededed;

.panel {
	margin-bottom: $margin-large;
	border-radius: $border-radius-base;
	box-shadow: none;

	.panel-heading {
		height: $font-size-base * 3;
		padding: ($padding-small - 4) $padding-large;
		font-size: $font-size-base;
		font-weight: bold;
		line-height: 1.6em;
		color: $text-color-light;
		border-bottom: 0;

		.panel-link {
			border: 1px solid $btn-primary-color;
			border-radius: 1px;
			color: $btn-primary-color;
			cursor: pointer;
			font-weight: normal;
			height: 24px;
			line-height: 20px;
			margin-top: -3px;
			padding: 1px 12px;

			a {
				color: $btn-primary-color;

				&:hover {
					text-decoration: none;
				}
			}

			&:hover {
				background-color: rgba(0, 0, 0, 0.05);
			}

			&.default {
				border-color: $text-color-light;
				padding: 2px 12px;

				a {
					color: $text-color-light;
				}
			}
		}
	}

	.panel-body {
		padding: $padding-large;
	}

	// Color Variations

	&.panel-default {
		border: 1px solid $border-color;

		.panel-heading {
			background-color: $brand-gray;
			color: $text-color-light;
		}
	}

	&.panel-info {
		border-color: $brand-info;

		.panel-heading {
			background-color: $brand-info !important;
			color: $component-active-color;

		}
	}

	&.panel-danger {
		border-color: $brand-danger;

		.panel-heading {
			background-color: $brand-danger !important;
			color: $component-active-color;
		}
	}

	&.panel-warning {
		border-color: $brand-warning;

		.panel-heading {
			background-color: $brand-warning !important;
			color: $component-active-color;
		}
	}
}