/**
 * Block type frontend style definition.
 * It will be enqueued both in the editor and when viewing
 * the content on the front of the site.
 */
.wp-block-xwp-newsletter-subscription {
  position: relative;
  overflow: hidden;
  padding: var(--evolve-media-theme--spacing--small);
  border-radius: 8px;
  background: var(--evolve-media-theme--color--foreground);
  color: var(--evolve-media-theme--color--background);
}

.wp-block-xwp-newsletter-subscription__background-decoration {
  position: absolute;
  top: 15%;
  right: -52px;
  width: 104px;
  height: 104px;
  border: 10px solid var(--evolve-media-theme--color--tertiary);
  border-radius: 50%;
}

.wp-block-xwp-newsletter-subscription__background-decoration-inner-circle {
  position: absolute;
  top: 14px;
  right: 14px;
  bottom: 14px;
  left: 14px;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--evolve-media-theme--color--primary);
}

.wp-block-xwp-newsletter-subscription__title,
.wp-block-xwp-newsletter-subscription__form {
  isolation: isolate;
}

label[for=wp-block-xwp-newsletter-subscription__email] {
  display: block;
  font-size: var(--evolve-media-theme--typography--font-size--small);
  font-weight: var(--evolve-media-theme--typography--font-weight--light);
  text-decoration: underline;
}
label[for=wp-block-xwp-newsletter-subscription__email]::after {
  content: "*";
}

.wp-block-xwp-newsletter-subscription__email-input {
  display: block;
  width: min(100%, 400px);
  padding: var(--evolve-media-theme--spacing--tiny) var(--evolve-media-theme--spacing--small);
  margin-bottom: var(--evolve-media-theme--spacing--tiny);
  background: var(--evolve-media-theme--color--background);
  color: var(--evolve-media-theme--color--foreground);
}
.wp-block-xwp-newsletter-subscription__email-input::placeholder {
  opacity: 0.4;
}

.wp-block-xwp-newsletter-subscription__submit.wp-block-button__link {
  --evolve-media-theme--color--button--background-hover: var(--evolve-media-theme--color--secondary);
  border-radius: 8px;
}