body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background-color: #f0f2f5;
    color: #1c1e21;
    margin: 0;
    padding: 20px;
}
.container {
    /* max-width: 800px; */
    /* margin: 0 auto; */
    background-color: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

h1 {
    font-size: 24px;
    color: #1877f2;
}

/* Новые стили для группировки полей */
.form-group {
    margin-bottom: 15px; /* Отступ между группами полей */
}

.form-row {
    display: flex;
    flex-wrap: wrap; /* Позволяет элементам переноситься на новую строку при нехватке места */
    gap: 20px; /* Расстояние между элементами в строке */
    margin-bottom: 15px;
}

.form-group-inline {
    flex: 1; /* Позволяет элементам занимать равное пространство */
    min-width: 280px; /* Минимальная ширина для каждого поля, чтобы они не были слишком узкими */
}

input[type="text"], input[type="number"] {
    width: 95%; /* Изменено на 95% для учета padding и border */
    padding: 10px;
    margin-bottom: 10px; /* Убрано, так как form-group управляет отступами */
    border: 1px solid #ddd;
    border-radius: 6px;
    box-sizing: border-box; /* Включает padding и border в общую ширину */
}

label {
    display: block; /* Чтобы метка занимала всю ширину и поле ввода начиналось с новой строки */
    margin-bottom: 5px;
    font-weight: bold;
}

button {
    background-color: #1877f2;
    color: white;
    padding: 10px 15px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 16px;
    margin-top: 10px; /* Добавлен отступ сверху для кнопки */
}

button:disabled {
    background-color: #a0bdf2;
    cursor: not-allowed;
}

#logs {
    background-color: #282c34;
    color: #abb2bf;
    padding: 15px;
    border-radius: 6px;
    margin-top: 20px;
    height: 100px;
    overflow-y: scroll;
    white-space: pre-wrap;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}

#result {
    margin-top: 20px;
}

#csv-table-container {
    margin-top: 20px;
    max-height: 400px; /* Максимальная высота блока */
    overflow: auto; /* Добавляет прокрутку, если содержимое не помещается */
    border: 1px solid #ddd;
    border-radius: 6px;
}

#csv-table-container table {
    width: 100%;
    border-collapse: collapse;
}

#csv-table-container th, #csv-table-container td {
    padding: 8px 12px;
    border: 1px solid #e0e0e0;
    text-align: left;
    min-width: 150px;
}

#csv-table-container th {
    background-color: #f8f8f8;
    position: sticky; /* "Приклеиваем" заголовок */
    top: 0;
}