/* V25 — correctifs éditeur de rognage mobile : largeur, ratios et zone droite */
@media (max-width:639px){
  .crop-editor,
  .crop-editor *{
    box-sizing:border-box;
  }

  .crop-editor{
    width:100vw!important;
    max-width:100vw!important;
    overflow:hidden!important;
  }

  .crop-editor-top,
  .crop-editor-canvas,
  .crop-editor-controls,
  .crop-editor-bottom{
    width:100%!important;
    min-width:0!important;
    max-width:100vw!important;
  }

  .crop-editor-canvas{
    padding:8px 12px!important;
    overflow:hidden!important;
  }

  .crop-frame{
    width:min(560px,calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
    height:auto!important;
    max-height:60dvh!important;
    margin:0 auto!important;
  }

  /* En mode libre il faut conserver une hauteur exploitable malgré l'absence de ratio. */
  .crop-frame[style*="auto"]{
    width:min(560px,calc(100vw - 24px))!important;
    height:min(56dvh,calc(100vw - 24px))!important;
    aspect-ratio:auto!important;
  }

  .crop-ratios{
    width:100%!important;
    min-width:0!important;
    max-width:100vw!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    overflow:visible!important;
    padding:0 4px!important;
  }

  .crop-ratios button{
    min-width:0!important;
    width:100%!important;
    height:82px!important;
    padding:0 2px!important;
  }

  .crop-ratios small{
    white-space:nowrap!important;
    font-size:10px!important;
  }

  .crop-editor-bottom{
    padding-left:8px!important;
    padding-right:8px!important;
  }

  .crop-editor-bottom button{
    flex:0 0 48px!important;
  }

  .crop-editor-bottom span{
    min-width:0!important;
    flex:1 1 auto!important;
    text-align:center!important;
  }
}