/* ==========================================================================
   ETHNOS R283 — PHOTOS / DOCUMENTS — 1280x720 UNIQUEMENT

   A MODIFIER :
   1. "Ajouter une photo" : largeur réduite pour rester proprement à droite
      de "Mes photos".
   2. Photo de profil : masquer le bouton "Aperçu" et centrer "Modifier"
      dans la zone d'actions.
   3. Documents : repositionner "Ouvrir" + "Supprimer" vers l'intérieur
      et verrouiller leur groupe pour empêcher tout débordement extérieur.

   A NE PAS TOUCHER :
   - Annuaire validé R282.
   - titre/sous-titre du volet Médias.
   - logique JS / ouverture / suppression / modification.
   - autres volets et autres résolutions.
   ========================================================================== */

@media (width:1280px) and (height:720px){

  /* 1 — Header Photos : deux zones garanties dans la largeur disponible. */
  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaPhotosSection .memberMediaSectionHeader{
    grid-template-columns:minmax(0,1fr) 132px !important;
    gap:8px !important;
  }

  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaPhotosSection
  button[data-media-library-upload="photos"].ethnosOfficialAction{
    box-sizing:border-box !important;
    width:132px !important;
    min-width:132px !important;
    max-width:132px !important;
    padding-left:8px !important;
    padding-right:8px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
  }

  /* 2 — Photo de profil : Aperçu retiré visuellement, Modifier seul et centré. */
  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaPhotosSection
  .memberMediaBand.isPhoto .memberMediaBandActions{
    position:static !important;
    left:auto !important;
    transform:none !important;
    width:88px !important;
    min-width:88px !important;
    max-width:88px !important;
    display:flex !important;
    justify-content:center !important;
    justify-self:end !important;
    align-items:center !important;
    overflow:hidden !important;
  }

  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaPhotosSection
  .memberMediaBand.isPhoto .memberMediaBandActions
  > button.memberMediaPreviewButton{
    display:none !important;
  }

  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaPhotosSection
  .memberMediaBand.isPhoto .memberMediaBandActions
  > button.memberMediaEditProfileButton{
    box-sizing:border-box !important;
    flex:0 0 82px !important;
    width:82px !important;
    min-width:82px !important;
    max-width:82px !important;
    margin:0 auto !important;
  }

  /* 3 — Documents : groupe borné à 146 px, déplacé vers l'intérieur. */
  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaDocumentsSection
  .memberMediaBand.isDocument{
    grid-template-columns:minmax(78px,1fr) 146px !important;
    column-gap:8px !important;
    overflow:hidden !important;
  }

  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaDocumentsSection
  .memberMediaBand.isDocument .memberMediaBandActions{
    position:static !important;
    transform:translateX(-6px) !important;
    box-sizing:border-box !important;
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
    display:flex !important;
    justify-content:flex-end !important;
    justify-self:end !important;
    gap:6px !important;
    overflow:hidden !important;
  }

  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaDocumentsSection
  .memberMediaBand.isDocument .memberMediaBandActions
  > button.memberMediaPreviewButton{
    box-sizing:border-box !important;
    flex:0 0 58px !important;
    width:58px !important;
    min-width:58px !important;
    max-width:58px !important;
    padding-left:5px !important;
    padding-right:5px !important;
  }

  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaDocumentsSection
  .memberMediaBand.isDocument .memberMediaBandActions
  > button.memberMediaDeleteButton{
    box-sizing:border-box !important;
    flex:0 0 76px !important;
    width:76px !important;
    min-width:76px !important;
    max-width:76px !important;
    padding-left:5px !important;
    padding-right:5px !important;
  }

  /* Le nom reste strictement borné au bandeau : aucun débordement de texte. */
  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaBandCopy,
  html[data-ethnos-ui] body
  .memberMediaDrawer .memberMediaBandCopy strong{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
  }
}
