/**
 * @file
 * The "Download PDF" button on a gated publication.
 *
 * The markup reuses the theme's own button hook
 * (.views-field-field-attachment-document), so the locked button is the public
 * one, pixel for pixel. Only the modal-specific behaviour is added here.
 */

.additional-link .views-field-field-gated-pdf a.pcns-gated-link {
  cursor: pointer;
  text-decoration: none;
}

.additional-link .views-field-field-gated-pdf a.pcns-gated-link:focus-visible {
  outline: 2px solid #00155e;
  outline-offset: 2px;
}

/* While the modal is being fetched, core drops its throbber right after the
   link. Turning it into an overlay keeps the layout still and reads as the
   button working, rather than as something appearing next to it. */
.additional-link .views-field-field-gated-pdf .field-content {
  position: relative;
}

.additional-link .views-field-field-gated-pdf .ajax-progress,
.additional-link .views-field-field-gated-pdf .ajax-progress-throbber {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  border-radius: 2px;
  background: rgba(68, 151, 208, 0.96);
  font-size: 0;
}

.additional-link .views-field-field-gated-pdf .ajax-progress .throbber {
  display: block;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  background: none;
  animation: pcns-gated-button-spin 0.7s linear infinite;
}

.additional-link .views-field-field-gated-pdf .ajax-progress .message {
  display: none;
}

@keyframes pcns-gated-button-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .additional-link .views-field-field-gated-pdf .ajax-progress .throbber {
    animation: none;
  }
}