/* GPL-2.0-or-later. Borderless image-only controls; PhotoSwipe has its own MIT stylesheet. */
.bctimeline .tl-player button.bct-image-trigger {
  display:flex; align-items:center; justify-content:center; appearance:none; width:100%; min-width:0;
  height:var(--bct-image-slot-height,350px); min-height:0; flex-shrink:0;
  margin:0; padding:0; border:0!important; border-radius:var(--tl-radius,4px);
  background:transparent!important; color:inherit; box-shadow:none!important;
  cursor:zoom-in; line-height:0; overflow:hidden; transform:none!important;
}
.bctimeline .tl-player .bct-image-trigger > img.tl-media--image {
  display:block; width:auto; height:auto; max-width:100%;
  max-height:var(--bct-image-normal-height,350px); margin:0; object-fit:contain;
  flex:0 1 auto; cursor:zoom-in; transition:filter .15s ease;
}
.bctimeline .tl-player .tl-slide[data-bct-image-size="large"] .bct-image-trigger > img.tl-media--image {
  max-height:var(--bct-image-slot-height,350px);
}
.bctimeline .tl-player .bct-image-trigger:hover > img.tl-media--image { filter:brightness(1.035); }
.bctimeline .tl-player button.bct-image-trigger:hover:not(:focus-visible) { outline:none!important; }
.bctimeline .tl-player button.bct-image-trigger:focus-visible { outline:3px solid #0587CB!important; outline-offset:3px; }

/* The picture and text occupy equal halves of the whole visible stage.
   Symmetric padding excludes the navigator from their common vertical center.
   Both sizes share one slot, so changing size cannot move the text or image center. */
.bctimeline .tl-player .tl-slide[data-bct-image-size] {
  --bct-image-block-padding:var(--tl-slide-padding,2rem);
  --bct-image-gutter:var(--tl-btn-size,52px);
  padding-inline:0;
  padding-top:var(--bct-image-block-padding);
  padding-bottom:calc(var(--tl-nav-overlap,0px) + var(--bct-image-block-padding));
}
.bctimeline .tl-player .tl-slide[data-bct-image-size] > .tl-slide__inner {
  width:100%; max-width:none; gap:0; align-items:center; margin-block:auto;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
.bctimeline .tl-player .tl-slide[data-bct-image-size] .tl-slide__media {
  box-sizing:border-box; width:100%; min-width:0;
  padding-inline:var(--bct-image-gutter);
}
.bctimeline .tl-player .tl-slide[data-bct-image-size] .tl-slide__text {
  box-sizing:border-box; min-width:0; width:fit-content;
  max-width:min(46ch,calc(100% - 2 * var(--bct-image-gutter)));
  justify-self:center;
}
@container tl-player (max-width:600px) {
  .bctimeline .tl-player .tl-slide[data-bct-image-size] > .tl-slide__inner {
    grid-template-columns:minmax(0,1fr); gap:var(--tl-gap,1rem);
  }
  .bctimeline .tl-player .tl-slide[data-bct-image-size] .tl-slide__text {
    width:calc(100% - 2 * var(--bct-image-gutter)); max-width:46ch;
  }
}
@container tl-player (max-width:480px) {
  .bctimeline .tl-player .tl-slide[data-bct-image-size] { --bct-image-block-padding:1rem; }
}

/* Scope every customization to this instance so an existing Event Gallery keeps its skin. */
.pswp.bct-image-lightbox {
  --pswp-bg:#000;
  --pswp-icon-color:#fff;
  --pswp-icon-color-secondary:#333;
  --pswp-icon-stroke-color:#333;
  --pswp-root-z-index:2147483100;
  font-family:var(--fpr-font-body,"Special Elite",Georgia,serif);
}
.pswp.bct-image-lightbox .pswp__top-bar { background:transparent!important; border:0!important; box-shadow:none!important; }
.pswp.bct-image-lightbox .pswp__button {
  min-height:44px; margin:0; padding:0; border:0!important; border-radius:0!important;
  background:transparent!important; box-shadow:none!important;
}
.pswp.bct-image-lightbox .pswp__button:hover:not(:focus-visible) { outline:none!important; }
.pswp.bct-image-lightbox .pswp__button:focus-visible { outline:3px solid #0587CB!important; outline-offset:-4px; }
.pswp.bct-image-lightbox.pswp--zoom-allowed .pswp__img { cursor:zoom-in; }
.pswp.bct-image-lightbox.pswp--zoomed-in .pswp__img { cursor:grab; }
.pswp.bct-image-lightbox.pswp--zoomed-in .pswp__img:active { cursor:grabbing; }
.pswp.bct-image-lightbox .pswp__error-msg { font-size:1.125rem; line-height:1.6; }

/* Same borderless dark overlay while the original dimensions are loading. */
.bct-image-pending {
  position:fixed; inset:0; z-index:2147483101; display:grid; place-items:center;
  padding:4rem 1.25rem 1.25rem; box-sizing:border-box;
  background:rgb(0 0 0 / 85%); color:#fff;
}
.bct-image-pending .bct-image-pending-close {
  position:absolute; top:0; right:0; appearance:none; display:grid; place-items:center;
  width:50px; height:60px; min-height:44px; margin:0; padding:0;
  border:0!important; border-radius:0!important; background:transparent!important; color:#fff!important;
  font:400 2rem/1 system-ui,sans-serif; box-shadow:none!important; cursor:pointer;
}
.bct-image-pending .bct-image-pending-close:hover:not(:focus-visible) { outline:none!important; }
.bct-image-pending .bct-image-pending-close:focus-visible { outline:3px solid #0587CB!important; outline-offset:-4px; }
.bct-image-pending-status { max-width:36rem; margin:0; padding:0; font:400 1.125rem/1.6 var(--fpr-font-body,"Special Elite",Georgia,serif); text-align:center; }
.bct-image-pending[data-state="loading"] .bct-image-pending-status::before {
  content:""; display:block; width:1.75rem; height:1.75rem; margin:0 auto .75rem;
  border:3px solid currentColor; border-right-color:transparent; border-radius:50%;
  animation:bct-image-loading .8s linear infinite;
}
@keyframes bct-image-loading { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) {
  .bctimeline .tl-player .bct-image-trigger > img.tl-media--image { transition:none; }
  .bct-image-pending-status::before { animation:none!important; }
}
@media (forced-colors:active) {
  .bctimeline .tl-player button.bct-image-trigger:focus-visible,
  .pswp.bct-image-lightbox .pswp__button:focus-visible,
  .bct-image-pending .bct-image-pending-close:focus-visible { outline-color:Highlight!important; }
}