/* Layout responsivo do editor de treino.
   Mantém todos os campos e ações existentes; altera somente a largura útil
   e a distribuição dos campos durante a edição. */

.treino-editor {
  width: 100%;
  max-width: 1280px !important;
  box-sizing: border-box;
}

/* Desktop: aproveita a largura disponível e mantém os quatro campos
   do formulário de exercício na mesma linha. */
@media (min-width: 900px) {
  .treino-editor {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }

  .treino-editor [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: repeat(4, minmax(120px, 1fr)) !important;
    align-items: end;
  }
}

/* Tablet: preserva duas colunas e amplia a área útil. */
@media (min-width: 720px) and (max-width: 899px) {
  .treino-editor {
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}

/* Celular: mantém o comportamento atual sem rolagem horizontal. */
@media (max-width: 719px) {
  .treino-editor {
    max-width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    overflow-x: hidden;
  }

  .treino-editor [style*="grid-template-columns: 1fr 1fr"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}