/**
 * Buzzsprout Player for Elementor.
 *
 * Styling mirrors Buzzsprout's own wave player so the embed and the
 * "all episodes" button read as one component:
 * white card, 1rem radius, accent #05ab8a.
 */

.ncuk-buzzsprout-player {
  --ncuk-bs-accent: #05ab8a;
  --ncuk-bs-accent-hover: #049476;
  --ncuk-bs-radius: 1rem;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.75rem;

  iframe {
    display: block;
    width: 100%;
    height: 200px;
    border: 0;
    border-radius: var(--ncuk-bs-radius);
  }

  /**
	 * Nested so the selector carries two classes. The theme's
	 * `.elementor-kit-7 a` rule is specificity 0-1-1; a single-class
	 * rule loses and the label renders in the site link colour.
	 */
  .ncuk-buzzsprout-all-episodes {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border: 1px solid var(--ncuk-bs-accent);
    border-radius: var(--ncuk-bs-radius);
    background-color: var(--ncuk-bs-accent);
    color: #ffffff;
    font-family:
      -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto,
      "Helvetica Neue", Arial, sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition:
      background-color 150ms ease-in-out,
      border-color 150ms ease-in-out;

    &:visited,
    &:hover,
    &:focus {
      color: #ffffff;
    }

    &:hover,
    &:focus {
      background-color: var(--ncuk-bs-accent-hover);
      border-color: var(--ncuk-bs-accent-hover);
    }

    &:focus-visible {
      outline: 3px solid var(--ncuk-bs-accent);
      outline-offset: 3px;
    }

    & svg {
      flex-shrink: 0;
      width: 1em;
      height: 1em;
      fill: currentColor;
    }
  }
}

@media (max-width: 480px) {
  .ncuk-buzzsprout-player {
    align-items: stretch;

    .ncuk-buzzsprout-all-episodes {
      justify-content: center;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .ncuk-buzzsprout-player .ncuk-buzzsprout-all-episodes {
    transition: none;
  }
}
