/* 
   Copyright (C) 2016-2017 Cuckoo Foundation.
   This file is part of Cuckoo Sandbox - http://www.cuckoosandbox.org
   see the file 'docs/LICENSE' for copying permission.
 */

.cuckoo-analysis {

	font-family: "Roboto";
	background-color: #fafafa;
	margin-top: -20px;
	padding-top: 80px;

	&:focus {
		outline: none;
	}

	& > .container-fluid {
		padding: 0 25px;
	}

	&__header {
		display: flex;
		flex-shrink: 0;
		align-items: center;
		text-shadow: 0px 1px 0px #fff;
		margin: 0 0 15px 0;
		padding: 15px 25px;

		& > h2 {
			color: #ccc;
			font-weight: 200;
			margin: 0;	
		}

		& > h1 {
			font-size: 36px;
			color: #555;
			margin: 0;
			padding-top: 0px;

			@include cuckoo-theme('cyborg') { color: $cyborg_text_color; }
			@include cuckoo-theme('night') { color: $night_text_color; }
		}

		&.page-header {
			box-shadow: 0px 1px 0px #fff;
		}

		.header-right { 
			margin-left: auto; 
			vertical-align: middle;
			text-shadow: none;

			.btn-circle {
				text-align: center;
				font-size: 14px;
				box-shadow: none;

				i {
					margin-right: 5px;
				}

				&.active {
					color: #3c763d;
					i:before {
						content: "\f070";
					}
				}
			}

			a:not(.btn-circle) {
				color: $cuckoo_secundary_color;
				font-size: 12px;
				font-weight: 700;

				@include cuckoo-theme('cyborg') { color: $cyborg_secundary_color; } 
				@include cuckoo-theme('night') { color: $cyborg_secundary_color; } 
			}

			&.valign-bottom {
				align-self: flex-end;
			}

		}

		.file-name {
			display: inline-block;
			font-family: monospace;
			border: 1px solid #ccc;
			font-size: 11px;
			border-radius: 20px;
			overflow: hidden;
			padding-right: 10px;

			& > i {
				color: #eee;
				background-color: #888;
				padding: 5px 5px 5px 7px;
				text-shadow: none;
			}
		}

		// alternate fix for a disabled overflow in network page
		// mostly resets a lot of bootstrap garbage
		.flex-nav__body--disable-overflow & {

			+ .container-fluid {
				display: flex;
				flex-direction: column;
				overflow: hidden;
				flex-basis: 100%;

				& > .row {
					display: flex;
					flex-direction: column;
					flex-basis: 100%;
					width: 100%;
					overflow: hidden;
					margin: auto;

					.col-md-12 {
						min-height: initial;
						flex-basis: 100%;
						overflow: hidden;
						padding: 0;
					}

					.network-analysis-menu {
						flex-basis: 45px;
						flex-shrink: 0;
						margin-bottom: 15px;
					}

					.network-analysis-pages {
						display: flex;
						width: 100%;

						& > div {
							flex-basis: 100%;
							overflow: hidden;

							.flex-grid__fluid {
								height: 100%;
							}
						}
					}

				}
			}

		}

	}

	// collapsible panels 
	&__panels {
		margin-bottom: 30px;

		& > section:first-child {
			border-top-right-radius: 4px;
			border-top-left-radius: 4px;
		}

		& > section:last-child {
			border-bottom-right-radius: 4px;
			border-bottom-left-radius: 4px;
		}
	}

	&__panel {

		background-color: #ccc;
		overflow: hidden;
		border: 1px solid #999;
		font-size: 14px;

		&.warning {
			background-color: #fcf8e6;
			border-color: #faebcc;

			.collapse.in { border-top: 1px solid #faebcc; }
		}

		&.info {
			background-color: #d9edf7;
			border-color: #bce8f1;

			.collapse.in { border-top: 1px solid #bce8f1; }
		}

		&.danger {
			background-color: #f2dede;
			border-color: #ebccd1;

			.collapse.in { border-top: 1px solid #ebccd1; }
		}

		&--toggle {
			display: block;
			margin: 0;
			padding: 15px;
			font-weight: 700;

			&:hover,
			&:focus,
			&:active {
				background-color: rgba(0,0,0,.05);
				text-decoration: none !important;
			}

			&:before {
				@extend .fa;
				margin-right: 5px;
			}

			&:after {
				@extend .fa;
				float: right;
				margin-top: 4px;
				content: "\f054";
			}

			&[aria-expanded="true"]:after {
				content: "\f078";
			}

			.warning & {
				color: #8A6D40;
				&:before { content: "\f06a"; }
			}

			.info & {
				color: #31708f;
				&:before { content: "\f05a"; }
			}

			.danger & {
				color: #A94441;
				&:before { content: "\f057"; }
			}

		}

		&--body {
			.cuckoo-table { 
				border: 0; 
				font-size: 14px;
			}
		}

		// cyborg optimized
		@include cuckoo-theme('cyborg') {

			&.warning {
				background-color: #1F1E02;
				border-color: #352913;
				.collapse.in { border-top: 1px solid #352913; }
			}

			&.info {
				background-color: #1c2e4a;
				border-color: #304667;
				.collapse.in { border-top: 1px solid #304667; }
			}

			&.danger {
				background-color: #5c2330;
				border-color: #733244;
				.collapse.in { border-top: 1px solid #733244; }
			}

		}

		@include cuckoo-theme('night') {

			&.info {
				background-color: #375a7f;
				border-color: #132233;
				.collapse.in { border-top: 1px solid #132233; }

				& > a {
					color: #B4BFCA;
				}
			}

			&.warning {
				background-color: #5a5a5a;
				border-color: #4a4a4a;
				.collapse.in { border-top: 1px solid #4a4a4a; }

				& > a {
					color: #d2891a;
				}
			}

			&.danger {
				background-color: #371d1d;
				border-color: #06030C;
				.collapse.in { border-top: 1px solid #06030C; }

				& > a {
					color: #D43237;
				}
			}

		}

	}

}

// page switcher defaults
.page-switcher {
	&__pages > div:not(.active) {
		display: none;
	}
}
