/*
  Thème de Fancybox 3 pour toutes les interfaces (backoffice, compte client, sites publics, présentations).

  Fancybox 3.5.7 reste notre moteur : c'est la dernière version compatible jQuery (2019), et rien ne change
  dans ses appels ($.fancybox.open, data-fancybox). Les versions suivantes abandonnent jQuery, et la 6 est sous
  licence propriétaire ; le choix est noté sur https://www.santego.com/admin/page/6720. Son aspect vieillot vient de sa
  feuille par défaut, qu'on reprend ici à la manière d'une modale Bootstrap (T56050) : carte arrondie et ombrée,
  fond assombri sans être noirci, croix discrète avec un fond au survol.

  Ce fichier se charge par le partiel layouts/_fancybox_css, juste après la feuille d'origine.
  Démonstration : /test/metronic_fancybox.
*/

/* Fond : la page reste lisible derrière (défaut : #1e1e1e à 90 %). */
.fancybox-bg {
  background: #000;
}

.fancybox-is-open .fancybox-bg {
  opacity: .5;
}

/* Contenu (html, inline, ajax) : une carte. */
.fancybox-slide--html .fancybox-content {
  animation: sgo-fancybox-in .2s ease-out;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .08);
  border-radius: 12px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, .25);
  padding: 2rem;
}

@keyframes sgo-fancybox-in {
  from { transform: translateY(-16px); }
  to { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .fancybox-slide--html .fancybox-content {
    animation: none;
  }
}

@media (max-width: 576px) {
  .fancybox-slide--html .fancybox-content {
    padding: 1.25rem;
  }
}

/* La croix : discrète, un fond rond au survol, dans le coin de la carte. */
.fancybox-slide--html .fancybox-close-small {
  border-radius: 50%;
  color: #6b7280;
  height: 28px;
  opacity: 1;
  padding: 4px;
  right: 6px;
  top: 6px;
  width: 28px;
}

.fancybox-slide--html .fancybox-close-small:hover,
.fancybox-slide--html .fancybox-close-small:focus-visible {
  background: #f1f3f5;
  color: #1f2937;
}

/* Iframe et vidéo : mêmes coins que la carte. */
.fancybox-slide--iframe .fancybox-content,
.fancybox-slide--video .fancybox-content {
  border-radius: 12px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, .25);
  overflow: hidden;
}
