/* Preserve the imported theme's palette, typography, desktop geometry and handlers. */
:is(
  .mobile-trigger,
  .submenu-icon,
  .slide-down-trigger,
  .load-more-btn,
  .modal-popup-trigger,
  .carousel-nav-trigger,
  .search-trigger,
  .mfp-close,
  .owl-prev,
  .owl-next,
  .owl-dot
):focus-visible {
  /* The imported theme resets every outline with !important. */
  outline: 2px solid currentColor !important;
  outline-offset: 4px;
}

@media (max-width: 991px) {
  /* Both legacy captions were absolutely positioned below the same thumbnail.
     Normal flow reserves the full caption height before the transcript action.
     The imported theme's tablet layout ends at 991px, not 767px. */
  .video-testimonial-a .flex-layout .item .video-img-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  /* The generic 65px color bar must stay over the thumbnail rather than
     following the wrapper's new height down over the caption/actions. */
  .video-testimonial-a .flex-layout .item .video-img-wrap::after,
  .video-testimonial-a .flex-layout .item .video-img-wrap > a.popup-video {
    grid-area: 1 / 1 / 2 / 2;
  }

  .video-testimonial-a .flex-layout .item .video-img-wrap > .patient-title,
  .video-testimonial-a .flex-layout .item .video-img-wrap > .video-title {
    position: static;
    inset: auto;
    display: block;
    width: auto;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow-wrap: anywhere;
  }

  .video-testimonial-a .flex-layout .item .video-img-wrap > .patient-title {
    grid-row: 2;
    margin-top: 1rem;
  }

  .video-testimonial-a .flex-layout .item .video-img-wrap > .video-title {
    grid-row: 3;
    margin-top: 0.5rem;
  }

  .video-testimonial-a .flex-layout .item .video-img-wrap > .video-title a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0.25rem 0;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  /* The theme uses white text/shadow for its on-video tablet action. The action
     now sits on the page below the video, so inherit the existing text color. */
  .video-testimonial-a .flex-layout .item .video-img-wrap > .video-title {
    color: inherit;
    text-shadow: none;
  }

  .video-testimonial-a .flex-layout .item .video-img-wrap > .video-title a:any-link {
    color: inherit;
  }
}