/* NOTE: Selector Specificity: (1, 5, 2) */
html body.et-db #et-boc .et_builder_outer_content .et-l[class*="et-l--"] .et_builder_inner_content {
	/* MARK :: SHORTCODE :: content-newsletter */
	& #content-newsletter {
		color: var(--color-white----);
		padding: var(--size-30-140);
		max-width: 800px;
		margin-inline: auto;

		& h2 {
			padding: 0;
			margin-block: var(--size-15-30) var(--size-5-10);
		}

		& .tnp-wrapper {
			& > p {
				color: var(--color-plum-----) !important;
				margin-block: 0 30px;
				border-radius: 5px;

				& > a {
					display: inline;
					padding: 0;
					color: inherit;

					&:hover {
						color: var(--color-plumlink-);
					}
				}
			}

			&.settings,
			&.actions {
				font: var(--type-base-body---fonts);
				letter-spacing: var(--type-base-body---space);
			}

			&.actions {
				display: flex;
				column-gap: var(--size-10-15);
				row-gap: var(--size-10-20);
			}

			& > .tnp-subscription,
			& > .tnp-profile {
				display: block;
				width: 100%;
				max-width: 100%;

				& form {
					display: grid;
					row-gap: var(--size-10-20);

					& .tnp-field {
						& > label {
							font: var(--type-base-body---fonts);
							letter-spacing: var(--type-base-body---space);
							margin-block-end: 5px;
						}

						&.tnp-privacy-field,
						&.tnp-field-list {
							& > label {
								display: flex;
								align-items: center;
								justify-content: start;
								column-gap: 10px;
								margin: 0;
							}
						}
					}
				}

				& a {
					display: inline;
					padding: 0;
					color: inherit;

					&:hover {
						color: var(--color-plumlink-);
					}
				}

				& input:not([type="checkbox"]):not([type="submit"]),
				& textarea {
					display: block;
					width: 100%;
					max-width: 100%;

					border: 0;
					border-radius: 5px;
					padding-block: 10px;
					padding-inline: var(--size-10-25);

					transition: var(--transition-color-foreground), var(--transition-color-background);

					color: var(--color-black----);
					background-color: var(--color-white----);

					font: var(--type-base-body---fonts);
					letter-spacing: var(--type-base-body---space);

					&::placeholder {
						color: var(--color-slate----);
						opacity: 1;
						white-space: pre-line;
					}
				}

				& textarea {
					min-height: 230px;
					resize: vertical;
				}

				& input[type="checkbox"] {
					&:focus-visible,
					&:focus-within {
						border-radius: 5px;
					}
				}

				& input[type="submit"] {
					cursor: pointer;
					text-indent: 4px;

					&.wpforms-disabled {
						cursor: not-allowed;
						color: transparent;

						& svg {
							display: none;
						}

						&,
						&:hover {
							background-color: var(--color-white----);
						}
					}
				}

				& input,
				& textarea {
					&:focus-visible,
					&:focus-within {
						outline: var(--outline-basis);
						outline-offset: var(--outline-off--);
					}
				}

				/* Remove Defaults */
				& ul,
				& ol,
				& ul li,
				& ol li {
					list-style: none;
					margin: 0;
					padding: 0;
				}
			}

			&[has-plugin="WPForms"] {
				& .wpforms-container {
					& .wpforms-field-container {
						& footer {
							display: grid;
							row-gap: 10px;
							justify-content: stretch;

							& .wpforms-field-submit-container {
								display: block;
								width: 100%;
								max-width: 100%;
							}

							& .wpforms-field-gdpr-checkbox {
								order: 1;
								text-align: center;
								max-width: 400px;
								margin-inline: auto;

								& a {
									display: inline;
									padding: 0;
									text-decoration: underline !important;
								}
							}
						}
					}
				}
			}
		}

		& .tfk-wrapper {
			display: grid;
			row-gap: var(--size-10-20);
			font: var(--type-base-body---fonts);
			letter-spacing: var(--type-base-body---space);

			& span[id] {
				display: block;
				width: 100%;
				max-width: 100%;

				border: 0;
				border-radius: 5px;
				padding-block: 10px;
				padding-inline: var(--size-10-25);

				transition: var(--transition-color-foreground), var(--transition-color-background);

				color: var(--color-black----);
				background-color: var(--color-white----);

				font: var(--type-base-body---fonts);
				letter-spacing: var(--type-base-body---space);
			}

			& #bwfan_unsubscribe_name {
			}

			& #bwfan_unsubscribe_fields {
				display: grid;
				row-gap: var(--size-10-20);

				& .bwfan-unsubscribe-lists {
					& .bwfan-unsubscribe-single-list {
						& .bwfan-unsubscribe-list-checkbox {
							display: flex;
							align-items: center;
							justify-content: start;
							column-gap: 10px;
							margin: 0;

							& input[type="checkbox"] {
							}

							& label {
							}
						}

						& .bwfan-unsubscribe-list-description {
							margin-block-start: var(--size-5-10);
						}
					}
				}
			}

			& .bwfan_response {
				margin-block-start: var(--size-5-10);
			}
		}

		&:has(#service-agreement) {
			max-width: 1000px;

			& a {
				color: var(--color-parchment);
				text-decoration: underline !important;

				&:hover {
					color: var(--color-white----);
				}
			}

			& footer.agree-redirect {
				& .wpforms-field-container {
					margin-block: 30px;
				}

				& .wpforms-error {
					margin-block-start: 10px;
				}

				& ul {
					margin: 0;

					& li:has(input[type="checkbox"]),
					& li:has(input[type="radio"]) {
						list-style: none;
						display: flex;
						align-items: center;
						justify-content: start;
						column-gap: 10px;

						& input[type="checkbox"],
						& input[type="radio"] {
							margin: 0;
						}

						& a {
							display: inline;
							padding: 0;
							color: var(--color-parchment);

							&:hover {
								color: var(--color-white----);
							}
						}
					}
				}
			}
		}

		&:has(#service-agreement-form) {
			max-width: 1200px;

			& #service-agreement-form {
				display: grid;
				padding-block: var(--size-20-30);
				padding-inline: var(--size-20-30);
				border-radius: 10px;
				background-color: var(--color-white----);
			}

			& h1 {
				color: var(--color-grape----);
			}

			& aside.notice-sla {
				display: grid;
				row-gap: 10px;
				margin-block: 20px;
				padding: 20px;
				border-radius: 10px;
				color: var(--color-white----);
				background-color: var(--color-plum-----);

				& mark.circled {
					margin-inline-end: 15px;
				}

				& p {
					padding: 0;
				}
			}

			& .wpforms-container {
				display: grid;
				row-gap: var(--size-20-40);
				color: var(--color-black----);
				margin-block-start: 5px;
				margin-inline: 0;
				padding-block: var(--size-15-20);
				padding-inline: var(--size-15-20);
				border-radius: var(--size-10-5);
				background-color: var(--color-ghost----);
			}

			& .wpforms-field-container {
				--gap-row: var(--size-20-30);

				& .wpforms-field {
					& .wpforms-field-label {
						margin-block-end: 10px;
						font: var(--type-base-body---fonts);
						font-weight: 600;
						letter-spacing: var(--type-base-body---space);
					}

					& .wpforms-field-description {
						font: inherit;
						font-size: 0.8em;
						font-weight: 400;
						line-height: 1.6em;
						letter-spacing: inherit;
						padding-block-start: 1em;

						& a {
							display: inline;
							padding: 0;
							color: var(--color-grape----);

							&:hover {
								color: var(--color-proofread);
							}
						}
					}

					& ul li:has(input[type="checkbox"]),
					& ul li:has(input[type="radio"]) {
						display: flex;
						align-items: center;
						justify-content: start;
						column-gap: 10px;

						& a {
							display: inline;
							padding: 0;
							color: var(--color-grape----);

							&:hover {
								color: var(--color-white----);
							}
						}
					}

					&.fix-column-gap {
						& .wpforms-field-row {
							justify-content: space-between;

							& .wpforms-one-half {
								width: calc(50% - 15px);
							}

							&::before,
							&::after {
								content: unset;
							}
						}
					}
				}

				& textarea {
					min-height: unset;
				}

				& input[type="checkbox"],
				& input[type="radio"] {
					display: block;
					width: max-content;
					max-width: 100%;
				}
			}

			& .wpforms-submit-container {
				width: max-content;
				max-width: 100%;
				margin-block-start: var(--size-15-30);

				& .wpforms-submit-spinner {
					position: absolute;
					inset: 50%;
					translate: -50% -50%;
					background-color: white;
					border-radius: 100%;
					padding: 5px;
					box-sizing: content-box;
				}
			}
		}
	}

	/* MARK :: SHORTCODE :: content-newsletter-solaris */
	& #content-newsletter-solaris {
		color: var(--color-white----);
		background-color: var(--color-grape----);
		margin-block: var(--size-50-100);
		margin-inline: auto;
		padding-block: var(--size-15-30);
		padding-inline: var(--size-15-30);
		border-radius: var(--size-10-20);
		max-width: 700px;

		display: grid;
		row-gap: var(--size-15-30);

		& [has-plugin="WPForms"] {
			& .wpforms-container {
				& form {
					& .wpforms-field-container {
						& footer {
							display: grid;
							grid-auto-columns: 1fr;
							grid-auto-rows: max-content;
							place-items: center;

							& > * {
								text-align: center;
							}

							& .wpforms-field-gdpr-checkbox {
								color: var(--color-parchment);

								& label {
									padding: 0;

									& a {
										color: inherit;
										display: inline-block;
										padding: 0;
										text-decoration: underline !important;

										&:hover {
											color: var(--color-white----);
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
}
