/* Hover styling */
@media (hover: hover) {
  .copy-email-button:hover .copy-email-icon__wrap {
    background: rgba(34, 80, 46, 0.9);
  }

  .copy-email-button:hover .copy-email-text__el {
    transform: translate(0px, -100%);
  }
}

/* Keyboard focus styling */
.copy-email-button:focus .copy-email-icon__wrap {
  background: rgba(34, 80, 46, 0.9);
}

.copy-email-button:focus .copy-email-text__el {
  transform: translate(0px, -100%);
}

/* 'Copied' state, when a user has clicked the button */
[data-copy-button="copied"] .copy-email-icon__wrap {
  background: #0F8E2E !important;
}

[data-copy-button="copied"] .copy-email-text__el {
  transform: translate(0px, -200%) !important;
}