/* Correctif global anti-débordement horizontal sur mobile. */
html,
body {
  width:100%;
  max-width:100%;
  overflow-x:hidden;
}

@supports (overflow-x:clip) {
  html,
  body {
    overflow-x:clip;
  }
}

.tool-page,
.optimizer-shell,
.content-section,
.ad-space,
.summary,
.list,
.card {
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

.tool-page *,
.tool-page *::before,
.tool-page *::after {
  box-sizing:border-box;
}

.tool-page img,
.tool-page canvas,
.tool-page svg,
.tool-page video {
  max-width:100%;
}

@media (max-width:780px) {
  .tool-page {
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  @supports (overflow-x:clip) {
    .tool-page {
      overflow-x:clip;
    }
  }
}

/* Correctif spécifique aux deux outils PDF : évite tout débordement horizontal
   sur téléphone sans modifier la mise en page des autres outils. */
body.pdf-mobile-safe {
  overflow-x: clip;
}

body.pdf-mobile-safe .tool-page,
body.pdf-mobile-safe .optimizer-shell,
body.pdf-mobile-safe .pdf-options,
body.pdf-mobile-safe .pdfi-options,
body.pdf-mobile-safe .pdf-option-card,
body.pdf-mobile-safe .pdfi-option-card,
body.pdf-mobile-safe .pdf-card-body,
body.pdf-mobile-safe .pdfi-card-body,
body.pdf-mobile-safe .pdf-preview-wrap,
body.pdf-mobile-safe .pdfi-preview-wrap,
body.pdf-mobile-safe .range-inline,
body.pdf-mobile-safe .toolbar-actions-split,
body.pdf-mobile-safe .toolbar-actions-split .toolbar-actions,
body.pdf-mobile-safe .pdf-result,
body.pdf-mobile-safe .list,
body.pdf-mobile-safe .card {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

body.pdf-mobile-safe .pdf-preview,
body.pdf-mobile-safe .pdfi-preview {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  box-sizing: border-box;
}

@media (max-width: 780px) {
  /* La règle générale du site passe .size-options sur 5 colonnes à 480 px.
     Elle convient aux pourcentages des optimiseurs, pas aux réglages PDF. */
  body.pdf-mobile-safe .pdf-option-card .size-options,
  body.pdf-mobile-safe .pdfi-option-card .size-options {
    display: flex;
    flex-wrap: wrap;
    grid-template-columns: none;
    width: 100%;
    min-width: 0;
  }

  body.pdf-mobile-safe .pdf-option-card .size-chip,
  body.pdf-mobile-safe .pdfi-option-card .size-chip {
    flex: 1 1 95px;
    min-width: 0;
    max-width: 100%;
  }

  body.pdf-mobile-safe .pdf-option-card .size-chip span,
  body.pdf-mobile-safe .pdfi-option-card .size-chip span {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    white-space: normal;
  }

  body.pdf-mobile-safe .range-inline {
    grid-template-columns: minmax(0, 1fr);
  }

  body.pdf-mobile-safe .range-inline button {
    width: 100%;
  }

  body.pdf-mobile-safe .toolbar-actions-split .toolbar-actions {
    width: 100%;
    min-width: 0;
  }

  body.pdf-mobile-safe .toolbar-actions-split .toolbar-actions button,
  body.pdf-mobile-safe .pdf-card-actions button,
  body.pdf-mobile-safe .pdfi-card-actions button {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
  }
}
