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

.comments-modal-container {
	.comments-modal-header {
		border-bottom: 0.1rem solid $aeap-color-grey;
		color: $aeap-title-primary;

		.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;
		}

		.id-container {
			span {
				font-size: 1.6rem;
				font-weight: 700;
				&.label {
					margin-right: 0.8rem;
				}

				&.label-data {
					font-weight: 300;
				}
			}
		}
	}

	.comments-modal-body {
		.comments-stat-group {
			.comments-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;
		}

		.comments-modal-body-apply-ribbon {
			background-color: $aeap-color-blue;
			bottom: 0;
			height: 4.8rem;
			position: relative;
		}
	}

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