@import "variables";
.panel {
	position: relative;
	margin: 0;
	@include border-radius(0);
	.panel-heading {
		padding: 18px 24px;
		@include border-radius(0);
		h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
			margin: 0;
		}
	}
	.panel-body {
		padding: 18px 24px;
		@include border-radius(0);
		&.sm {
			padding: 8px 12px;
		}
		&.xs {
			padding: 4px 8px;
		}
	}
	.panel-footer {
		padding: 18px 24px;
		@include border-radius(0);
	}

	&.panel-white {
		border: none;
		@include border-radius(5px);
		@include box-shadow(0 2px 7px 0 rgba(0,0,0,0.15));
	}

	&.panel-round {
		@include border-radius(3px);
		.panel-heading {
			@include border-radius(3px 3px 0 0);
		}
		.panel-footer {
			@include border-radius(0 0 3px 3px);
		}
	}

	&.panel-tab {
		.panel-heading {
			background: $color_gray_10;
			display: inline-block;
			padding: 4px 12px 2px;
			font-size: 12px;
			font-weight: bold;
		}
		.panel-body {
			border: 4px solid $color_gray_10;
			padding: 8px;
		}

		&.panel-tab_green {
			.panel-heading {
				background-color: #bff4ae;
			}
			.panel-body {
				border-color: #bff4ae;

				.mCustomScrollbar .mCustomScrollBox .mCSB_scrollTools .mCSB_draggerContainer .mCSB_dragger .mCSB_dragger_bar {
					background-color: $color_toxic !important;
				}
			}
		}
	}

	&.panel-default {
		border: 1px solid $color_gray_10;
		@include border-radius(3px);
		@include box-shadow(0 2px 7px 0 rgba(0,0,0,0.1));
	}

	&.panel-success {
		background: #ebffd6;
		border-color: #beeb90;
	}

	&.panel-warning {
		background: lighten($red_light, 5%);
		border-color: $red_light;
	}
	&.panel-outline-warning {
		background: #ffffca;
		border-color: #ffe48a;
	}

	&.panel-gray {
		background: #ededed;
		border-color: #ededed;
	}
	&.panel-outline-gray {
		background: transparent;
		border: 1px solid #DDE4EC;
		&.s4 {
			border-width: 4px;
		}
	}

	&.panel-gray-light {
		background: #F6F6F6;
		border-color: #F6F6F6;
	}

	&.panel-pink {
		background: lighten($color_body, 20%);
		border-color: $color_gray_10;
	}

	&.panel-yellow {
		background: $yellow_light;
		border-color: $yellow_light;
	}

	&.panel-water {
		background: $color_water;
		border-color: $color_water;
	}

	&.panel-violet {
		background: #f2e5f5;
		border-color: #f2e5f5;
		color: #772397;
	}

	//test
	&.panel-table {
		border: 1px solid $color_gray_20;
		position: relative;
		overflow: hidden;
		margin-bottom: 12px;
		@include border-radius(5px);
		@include box-shadow();
		font-size: 14px;
		.panel-heading {
			background: $color_gray_10;
			border: none;
			padding: 6px 8px;
			@include border-radius(5px 5px 0 0);
			.text-xxs-up-right {
				font-size: 12px;
			}
		}
		.panel-body {
			background: $color_white;
			border-top: 1px solid $color_gray_20;
			position: relative;
			padding: 4px 8px;
			&:before {
				content: '';
				background: inherit;
				position: absolute; left: 0; right: 0; bottom: 0; z-index: 5;
				display: block;
				height: 5px;
			}
			&:last-child {
				@include border-radius(0 0 5px 5px);
			}
		}
		.panel-footer {
			background: $color_gray_03;
			border: none;
			border-top: 1px solid $color_gray_20;
			padding: 6px 8px;
			font-size: 12px;
			@include border-radius(0 0 5px 5px);
			.btn {
				padding: 2px 8px 3px !important;
				font-size: 12px;
			}
		}
	}
}