/* Notification Alert */
.ns_notification-alert {
	position: relative;
	display: flex;
	padding-left: 12px;
}

.ns_notification-alert:before {
	position: absolute;
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
}

.ns_notification-alert[data-type='success']:before {
	background: var(--hipnos-color-state-success-1);
	box-shadow: 0 0 0 var(--hipnos-color-state-success-2);

	animation: notification_alert_pulse_success 2s infinite;
}

.ns_notification-alert[data-type='warning']:before {
	background: var(--hipnos-color-state-warning-1);
	box-shadow: 0 0 0 var(--hipnos-color-state-warning-2);

	animation: notification_alert_pulse_warning 2s infinite;
}

@-webkit-keyframes notification_alert_pulse_success {
	0% {
		-webkit-box-shadow: 0 0 0 0 var(--hipnos-color-state-success-1);
	}

	70% {
		-webkit-box-shadow: 0 0 0 10px rgba(223, 240, 216, 0);
	}

	100% {
		-webkit-box-shadow: 0 0 0 0 rgba(223, 240, 216, 0);
	}
}

@keyframes notification_alert_pulse_success {
	0% {
		-moz-box-shadow: 0 0 0 0 var(--hipnos-color-state-success-1);
		box-shadow: 0 0 0 0 var(--hipnos-color-state-success-1);
	}

	70% {
		-moz-box-shadow: 0 0 0 5px rgba(223, 240, 216, 0);
		box-shadow: 0 0 0 5px rgba(223, 240, 216, 0);
	}

	100% {
		-moz-box-shadow: 0 0 0 0 rgba(223, 240, 216, 0);
		box-shadow: 0 0 0 0 rgba(223, 240, 216, 0);
	}
}

@-webkit-keyframes notification_alert_pulse_warning {
	0% {
		-webkit-box-shadow: 0 0 0 0 var(--hipnos-color-state-warning-1);
	}

	70% {
		-webkit-box-shadow: 0 0 0 10px rgba(255, 154, 82, 0);
	}

	100% {
		-webkit-box-shadow: 0 0 0 0 rgba(255, 154, 82, 0);
	}
}

@keyframes notification_alert_pulse_warning {
	0% {
		-moz-box-shadow: 0 0 0 0 var(--hipnos-color-state-warning-1);
		box-shadow: 0 0 0 0 var(--hipnos-color-state-warning-1);
	}

	70% {
		-moz-box-shadow: 0 0 0 5px rgba(255, 154, 82, 0);
		box-shadow: 0 0 0 5px rgba(255, 154, 82, 0);
	}

	100% {
		-moz-box-shadow: 0 0 0 0 rgba(255, 154, 82, 0);
		box-shadow: 0 0 0 0 rgba(255, 154, 82, 0);
	}
}
