@import '../../../../theme';

.anomaly-modal-container {
	.anomaly-modal-header {
		border-bottom: 0.1rem solid $aeap-color-grey;
		color: $aeap-title-primary;
		.anomaly-modal-title {
			flex: 1;
		}

		.icon-grey {
			color: $aeap-toolbar-icon-active-color;
		}

		.divider {
			border-right: 0.1 rem solid $aeap-border-divider;
		}

		&.multi {
			border-left: 1.1rem solid $aeap-color-secondary;
			transition: border 0.5s ease-in-out;
		}

		&.resolved {
			border-left: 1.1rem solid $aeap-color-success;
			transition: border 0.5s ease-in-out;
		}
	}

	.anomaly-modal-body {
		background: $aeap-bg;
		margin: 1.6rem 3.2rem;
		transition: background 0.5s ease-in-out;

		.anomaly-stat-group {
			.anomaly-stat-expected {
				border: 0.1rem solid $aeap-border-divider;
				padding: 1.6rem 2.4rem;
				width: 20.8rem;
			}
		}

		&.resolved-body {
			background: $aeap-color-white;
			border: 0.1rem solid $aeap-color-success;
			transition: background 0.5s ease-in-out;
		}
	}

	.anomaly-body-divider {
		border-bottom: 0.1rem solid $aeap-color-grey;
	}
}