/**
 * Comments container.
 */
.imgw-comments {

	&__more {
		font-size: .9em;
		line-height: 1.2em;
		padding: 2px 0;
	}
}

/**
 * Single comment container.
 */
.imgw-comment {
	display: flex;
	font-size: .9em;
	line-height: 1.2em;
	padding: 2px 0;
	position: relative;

	&__content {
		flex-grow: 1;
	}

	&__username {
		font-weight: bold;

		a {
			color: inherit !important;
			text-decoration: none !important;
		}
	}

	&__actions {
		align-self: flex-start;
		position: relative;

		button {
			border: 0 none !important;
			color: inherit !important;
			font-size: .7em;
			margin: 0 !important;
			padding: 0 !important;

			&, &:hover {
				background: none !important;
				box-shadow: none !important;
			}

			.imgw-icon {
				display: block;
			}
		}

		.imgw-no-touch & {
			button {
				opacity: .5;
			}

			&:hover {
				button {
					opacity: 1;
				}
			}
		}
	}
}

/**
 * Commentbox container.
 */
.imgw-commentbox {
	box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .1);
	display: flex;
	position: relative;

	input {
		border: 0 none !important;
		flex-grow: 1;
		margin: 0 !important;
		padding: 1em !important;
	}

	button {
		border: 0 none !important;
		color: inherit !important;
		margin: 0 !important;
		padding: 0 .65em 0 5px !important;

		&, &:hover {
			background: none !important;
			box-shadow: none !important;
		}

		.imgw-icon {
			display: block;
		}
	}
}