/* ====================================================
   PHOTOS-FIX.CSS
   Chargé en dernier — priorité maximale
   FORMAT 1 = cercle (.avatar-img) | FORMAT 2 = rectangle (.photo-rect)
   ==================================================== */

/* ── Classes utilitaires globales ─────────────────────────────── */
.photo-rect {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: 0 !important;
}

.avatar-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: 50% !important;
}

/* ── Grille galerie profil (FORMAT 2) ─────────────────────────── */
.galerie-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
  padding: 0;
}

.galerie-cell {
  aspect-ratio: 1;
  border-radius: 10px;
  overflow: hidden;
  background: #1a1a2e;
  position: relative;
}

.galerie-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  border-radius: 0 !important;
}

.galerie-cell-vide {
  aspect-ratio: 1;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1.5px dashed rgba(255, 255, 255, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 150ms;
}

.galerie-cell-vide:active {
  background: rgba(255, 255, 255, 0.07);
}

/* ── RÈGLE 1 : images sans classe avatar → pas de cercle ─────── */
img:not(.avatar-img) {
  border-radius: 0 !important;
}

/* ── RÈGLE 2 : GALERIE (FORMAT 2) ─────────────────────────────── */
.galerie-cell img,
.galerie-cell > img,
[class*="galerie"] img:not(.avatar-img),
[class*="photo-grid"] img:not(.avatar-img),
[class*="photo_grid"] img:not(.avatar-img) {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
  display: block !important;
  max-width: none !important;
  max-height: none !important;
}

/* ── RÈGLE 3 : CHAT — bulles média uniquement (FORMAT 2, cover) ─ */
.message-bulle-image {
  max-width: 240px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  cursor: pointer !important;
  display: block !important;
}

.message-bulle-image img,
.message-bulle-image video {
  width: 100% !important;
  height: auto !important;
  max-height: 300px !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
  display: block !important;
}

.bubble.me .message-bulle-image,
.msgBubble.mine .message-bulle-image {
  border-radius: 14px !important;
  border-bottom-right-radius: 4px !important;
}

.bubble.them .message-bulle-image,
.msgBubble.theirs .message-bulle-image {
  border-radius: 14px !important;
  border-bottom-left-radius: 4px !important;
}

/* ── RÈGLE 4 : CARTE SWIPE — full bleed (cover + fort zoom), aligné .sw-photo--bleed. ─ */
#swipe-stack .sw-photo.sw-photo--bleed img.sw-photo-img,
.swipe-card .sw-photo.sw-photo--bleed img.sw-photo-img,
#swipe-stack .sw-photo.has-real-photo.sw-photo--bleed img.sw-photo-img,
.swipe-card .sw-photo.has-real-photo.sw-photo--bleed img.sw-photo-img {
  position: absolute !important;
  width: 182% !important;
  height: 182% !important;
  min-width: 182% !important;
  min-height: 182% !important;
  max-width: none !important;
  max-height: none !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  transform: translate3d(-50%, -50%, 0) scale(1.36) !important;
  transform-origin: center center !important;
  -webkit-transform: translate3d(-50%, -50%, 0) scale(1.36) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

/* RÈGLE 4b — Profil complet Découvrir : zoom bleed fort (remplit le cadre 4:5, anti bandes). */
.dpfHeroShell .dpfHeroMedia.dpfHero--bleed img.dpfHeroImg,
#dpfAvatar .dpfHeroMedia.dpfHero--bleed img.dpfHeroImg {
  position: absolute !important;
  width: 245% !important;
  height: 245% !important;
  min-width: 245% !important;
  min-height: 245% !important;
  max-width: none !important;
  max-height: none !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  transform: translate3d(-50%, -50%, 0) scale(1.58) !important;
  transform-origin: center center !important;
  -webkit-transform: translate3d(-50%, -50%, 0) scale(1.58) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

.dcGallerySlide.dcGallerySlide--bleed img.dcGalleryHeroImg {
  position: absolute !important;
  width: 156% !important;
  height: 156% !important;
  min-width: 156% !important;
  min-height: 156% !important;
  max-width: none !important;
  max-height: none !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  transform: translate3d(-50%, -50%, 0) scale(1.24) !important;
  transform-origin: center center !important;
  -webkit-transform: translate3d(-50%, -50%, 0) scale(1.24) !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

/* RÈGLE 4c — Vignettes galerie profil complet Découvrir (cover, pas de bandes). */
.dpfGalCell img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  transform: scale(1.08) !important;
}

/* Grille « Mes photos » (/me/profile) : rectangle plein dans chaque case (pas de cercle / coins noirs). */
#galerieGrid .galCell > img,
#galerieGrid .galCell img.me-gal-thumb,
#galerieGrid .galCell img.photo-rect {
  border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  transform: scale(1.1) !important;
  transform-origin: center center !important;
  -webkit-transform: scale(1.1) !important;
}

/* ── RÈGLE 5 : AVATARS (FORMAT 1) — sélecteurs explicites seulement
      (évite [class*="avatar"] qui matchait des faux positifs, ex. deck) ─ */
.avatar-wrap img,
.avatar-inner img,
.avatar-img,
.avatar-cercle > img,
.avatar-photo img,
.convAvatar img,
.msgAvatar28 img,
.mAvatar img,
.iAvatar img,
.pPhoto > img {
  border-radius: 50% !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}

.avatar-wrap,
.avatar-inner {
  border-radius: 50% !important;
}

.avatar-inner {
  overflow: hidden !important;
  width: 100% !important;
  height: 100% !important;
}

/* ── RÈGLE 6 : img dans un div inline « cercle » (non avatar) ──── */
div[style*="border-radius: 50%"] > img:not(.avatar-img),
div[style*="border-radius:50%"] > img:not(.avatar-img) {
  border-radius: 0 !important;
}

.avatar-wrap div[style*="border-radius: 50%"] > img,
.avatar-inner > img {
  border-radius: 50% !important;
}

/* ── RÈGLE 7 : classes historiques ambiguës (photo = rectangle) ─ */
img.sw-photo-img,
img.avatar-image {
  border-radius: 0 !important;
}

/* Mon profil — orb : l’img doit rester circulaire + cover (photos-fix RÈGLE 1
   forçait border-radius:0 sur tout img sans .avatar-img, d’où bandes / couleurs). */
.livingOrbCrop > #meAvatarImg.avatar-img {
  border-radius: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  min-width: 100% !important;
  min-height: 100% !important;
  display: block !important;
  transform: none !important;
}
.livingOrbCrop:not(.has-photo) > #meAvatarImg.avatar-img[src$=".svg"],
.livingOrbCrop:not(.has-photo) > #meAvatarImg.avatar-img[src*="/avatar/"],
img.avatar-img--preset,
.livingOrbCrop.has-preset-avatar .avatar-img,
.auPreview.is-preset img,
.auTile img {
  object-fit: contain !important;
  object-position: center bottom !important;
  transform-origin: center bottom !important;
}

/* Vraies photos dans avatars circulaires : dézoom léger (priorité sur RÈGLE 5). */
img.avatar-img.avatar-img--real,
.avatar-photo.has-real-photo img {
  object-position: center center !important;
  transform: scale(0.88) !important;
  transform-origin: center center !important;
}