.gs-message {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 20px 0;
	padding: 10px;
	background-color: #f0f2f5;
	border-radius: 6px;
	box-shadow: 0 0 0 1px #ced3d9 inset;

	&--info {
		background-color: #f2effd;
		box-shadow: 0 0 0 1px #d7ccfa inset, 0 0 0 0 transparent;

		svg {
			color: #7662db;
			fill: #7662db;
		}
	}

	&--success {
		background-color: #dffaee;
		box-shadow: 0 0 0 1px #b7e1d0 inset, 0 0 0 0 transparent;

		svg {
			color: #59ba54;
			fill: #59ba54;
		}
	}

	&--error {
		background-color: #fdedec;
		box-shadow: 0 0 0 1px #fbc1bc inset, 0 0 0 0 transparent;

		svg {
			color: #c44a4c;
			fill: #c44a4c;
		}
	}

	&--warning {
		background-color: #fdf2d0;
		box-shadow: 0 0 0 1px #f5ce93 inset, 0 0 0 0 transparent;

		svg {
			color: #f4b026;
			fill: #f4b026;
		}
	}

	&--custom-content {
		flex-direction: column;
		align-items: flex-start;

		.gs-message__header {
			display: flex;
			align-items: center;
			flex-flow: row nowrap;
			gap: 5px;
			width: 100%;
			padding-bottom: 8px;
			border-bottom: 1px solid rgba(0, 0, 0, 0.05);
			font-size: 13px;

			svg {
				width: 24px;
				height: auto;
			}
		}
	}

	&__content {
		flex: 1 1 auto;

		p {
			margin: 0 0 8px 0;
		}
	}

	&__header {
		font-size: 14px;
		font-weight: 600;
	}
}