.gfcpn-notice--info {
	background-color: #eaf6ff;
}

.gfcpn-notice--info.is-shadowed--small {
	box-shadow: 0 5px 0 -3px rgba( 0, 149, 255, 0.35 );
}

.gfcpn-notice--warning {
	background-color: #fff4e5;
}

.gfcpn-notice.resource-card:not( .gfcpn-notice--extensible ) {
	margin-top: 30px;
}

.gfcpn-notice--extensible.resource-card {
	margin-bottom: 30px;
}

.gfcpn-notice--neutral {
	background-color: #ffffff;
	margin-top: 1.5rem;
}

.gfield--input-type-gfcpn_title + .gfield .gfcpn-notice,
.gfield--input-type-gfcpn_label_text + .gfield .gfcpn-notice {
	margin-top: 0;
}

.gfield--type-section + .gfield .gfcpn-notice.resource-card:not( .gfcpn-notice--extensible ),
.gfield--type-section + .gfield .gfcpn-notice--neutral {
	margin-top: 10px;
}

.gfcpn-notice__title {
	margin: 0 0 0.5rem 0;
}

.resource-card__title.is-with-icon {
	font-size: 18px;
}

.gfcpn-notice.resource-card .resource-card__icon {
	border: 2px solid #ffffff;
	border-radius: 50%;
}

@media screen and ( max-width: 991px ) {
	.gfcpn-notice.resource-card:not( .gfcpn-notice--extensible ):not( :has( .resource-card__title.is-with-icon ) ) {
		padding-left: 50px;
	}
}

@media screen and ( min-width: 992px ) {
	.gfcpn-notice.resource-card {
		padding: 12px 30px;
	}

	.gfcpn-notice.resource-card .resource-card__icon {
		top: 16px;
		left: -18px;
		transform: none;
	}
}

.gfcpn-notice-toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	background: none;
	border: none;
	margin: 0;
	padding: 0;
	font: inherit;
	color: inherit;
	text-align: left;
	cursor: pointer;
}

.gfcpn-notice-toggle .resource-card__title {
	flex: 1 1 auto;
	margin: 0;
	padding: 0;
	border-bottom: none;
}

.gfcpn-notice-toggle-icon {
	position: relative;
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
}

.gfcpn-notice-toggle-icon::before,
.gfcpn-notice-toggle-icon::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	background: currentColor;
	transform: translate( -50%, -50% );
}

.gfcpn-notice-toggle-icon::before {
	width: 14px;
	height: 2px;
}

.gfcpn-notice-toggle-icon::after {
	width: 2px;
	height: 14px;
	transition: transform 0.2s ease;
}

.gfcpn-notice-toggle[aria-expanded="true"] .gfcpn-notice-toggle-icon::after {
	transform: translate( -50%, -50% ) rotate( -90deg );
}

.gfcpn-notice-body {
	margin-top: 0.75rem;
}

.gfcpn-notice .rich-text h4 {
	font-size: 20px;
}

.gfcpn-notice .rich-text h4 + * {
	margin-top: 0.5em;
}