/* Fancybox 6 — site skin: deep surface, pill buttons, Roboto Flex captions.
   Overrides the library's custom properties; loaded after fancybox.css. */

.fancybox__container {
  --fancybox-color: #fff;
  --fancybox-backdrop-bg: rgba(17, 35, 49, 0.94);
  --f-toolbar-padding: calc(16px * var(--mi-s)) calc(20px * var(--mi-s));
  --f-toolbar-font: 300 14px/1 var(--mi-font);
  --f-toolbar-font-size: 14px;
  --f-toolbar-font-weight: 300;
  --f-toolbar-color: rgba(255, 255, 255, 0.72);
  --f-toolbar-text-shadow: none;
  --f-toolbar-bg: none;
  --f-button-width: 44px;
  --f-button-height: 44px;
  --f-button-bg: rgba(255, 255, 255, 0.08);
  --f-button-hover-bg: rgba(255, 255, 255, 0.18);
  --f-button-active-bg: rgba(255, 255, 255, 0.24);
  --f-button-color: #fff;
  --f-button-hover-color: #fff;
  --f-button-border: 0;
  --f-button-border-radius: 100px;
  --f-button-shadow: none;
  --f-button-backdrop-filter: blur(8px);
  --f-button-svg-width: 20px;
  --f-button-svg-height: 20px;
  --f-button-svg-stroke-width: 1.8;
  --f-button-svg-filter: none;
  --f-arrow-bg: rgba(255, 255, 255, 0.08);
  --f-arrow-hover-bg: rgba(255, 255, 255, 0.18);
  --f-arrow-active-bg: rgba(255, 255, 255, 0.24);
  --f-arrow-color: #fff;
  --f-arrow-hover-color: #fff;
  --f-arrow-border-radius: 100px;
  --f-arrow-shadow: none;
  --f-arrow-width: 56px;
  --f-arrow-height: 56px;
  --f-close-button-bg: rgba(255, 255, 255, 0.08);
  --f-close-button-hover-bg: rgba(255, 255, 255, 0.18);
  --f-close-button-active-bg: rgba(255, 255, 255, 0.24);
  --f-close-button-color: #fff;
  --f-close-button-hover-color: #fff;
  --f-close-border-radius: 100px;
  --f-caption-margin: 0 auto;
  --f-caption-padding: 14px 16px 6px;
  --f-caption-font: 300 var(--mi-fs-18) / 1.4 var(--mi-font);
  --f-caption-color: rgba(255, 255, 255, 0.86);
  --f-caption-bg: none;
  --f-counter-padding: 0 12px;
  --f-spinner-color-1: rgba(255, 255, 255, 0.25);
  --f-spinner-color-2: #fff;
}

.fancybox__container .f-caption {
  max-width: min(760px, 92vw);
  text-align: center;
}

.fancybox__container .f-caption a {
  color: var(--mi-color-inverse);
  text-decoration: underline;
  text-decoration-color: var(--mi-color-blue);
  text-underline-offset: 0.18em;
  transition: text-decoration-color var(--mi-duration) var(--mi-ease);
}

.fancybox__container .f-caption a:hover {
  text-decoration-color: transparent;
}

.fancybox__container .f-panzoom__content img,
.fancybox__container .f-zoomable img {
  border-radius: calc(24px * var(--mi-s));
}

@media (max-width: 767px) {
  .fancybox__container {
    --f-toolbar-padding: 10px 12px;
    --f-button-width: 40px;
    --f-button-height: 40px;
    --f-arrow-width: 44px;
    --f-arrow-height: 44px;
    --f-caption-font: 300 14px / 1.4 var(--mi-font);
  }

  .fancybox__container .f-panzoom__content img,
  .fancybox__container .f-zoomable img {
    border-radius: 16px;
  }
}