/* 
	Cronjobs Overview
    ========================================================================== 

	Contains specific styling for the new cronjob overview. 
	
*/

.cronjob-container {
	float: left;
	margin-bottom: 48px;
	width: 100%;

	.headline {
		margin-bottom: 24px;

		form {
			&.form-inline {
				label {
					display: inline-block;
					padding-right: 12px;
				}
			}
		}
	}

	.element-container {
		margin: 0;

		.cronjob-elements-list {
			list-style: none;
			padding: 0;

			.cronjob-element {
				border-top: 1px solid #E4E4E4;
				padding: 12px 6px;

				&:last-child {
					border-bottom: 1px solid #E4E4E4;
				}

				&:hover {
					background-color: #EBEBEB;
				}

				.job-icon {
					font-size: 20px;
					line-height: 26px;
					padding-left: 0;
					text-align: center;

					.fa {
						color: #C1C1C1;
						font-size: 20px;
						line-height: 26px;
					}

					&:hover {
						.fa {
							color: $brand-primary;
						}
					}
				}

				.miscellaneous-label {
					line-height: 26px;

					label {
						font-weight: normal;
						line-height: 31px;
						margin-bottom: 0;
					}
				}

				.job-name,
				.miscellaneous-status {
					line-height: 26px;
					padding-left: 0;

					.status-badge {
						line-height: 20px;
						margin-top: 2px;
						padding: 0;
						width: 95px;
						text-align: center;

						span {
							border-radius: 3px;
							display: inline-block;
							padding: 0 8px;
							width: 72px;
						}

						&.inactive {
							span {
								background-color: #F0F0F0;
								color: #333333;
							}
						}

						&.not-executed {
							span {
								background-color: #F0F0F0;
								color: #333333;
							}
						}

						&.active {
							span {
								background-color: #DFF0D8;
								color: #3C763D;
							}
						}

						&.error {
							span {
								background-color: #F2DEDE;
								color: #A94442;
							}
						}
					}
				}

				.miscellaneous-status {
					.status-badge {
						margin-right: 6px;

						span {
							width: auto;
						}
					}

					.execution-info {
						margin-left: 6px;
					}
				}

				.cronjob-url {
					padding-left: 0;

					input[type="text"] {
						border: 1px solid #CCCCCC;
						height: 30px;
						width: 100%;
						padding: 6px 12px;
					}
				}

				.job-action-icons,
				.miscellaneous-action-icons {
					text-align: right;
					visibility: hidden;

					a {
						margin-right: 24px;

						&:last-child {
							margin-right: 0;
						}

						&:hover {
							text-decoration: none;
						}

						.fa {
							color: #737373;
							cursor: pointer;
							font-size: 24px;

							&:hover {
								color: $brand-primary;
							}
						}
					}
				}

				.miscellaneous-action-icons {
					a {
						.fa {
							line-height: 30px;
						}
					}
				}
			}
		}
	}
}

// --------------------------------------------------------------------------
// MODALS
// --------------------------------------------------------------------------

.modal {
	&.logs {
		.modal-body {
			label {
				display: block;
				font-weight: normal;
			}

			textarea {
				border: 1px solid #CCCCCC;
				font-family: monospace, serif;
				height: 400px;
				width: 100%;
			}
		}
	}

	&.configuration {
		.modal-body {
			label {
				&.control-label {
					color: #212121;
					font-weight: normal;
					text-align: left;
				}
			}

			legend {
				font-size: 12px;
				border: 0;
			}
		}
	}
}