/* Общие стили */
body {
  font-family: monospace;
  line-height: 1.6;
  margin: 0 auto;
  max-width: 90%;
  padding: 15px;
  background-color: #2c2c2c;
  color: #f0f0f0;
}

h1 {
  color: #00aa00;
  text-align: center;
  font-weight: 700;
}

/* Стиль для блока с сообщениями */
.chat-messages {
  font-family: monospace;
  white-space: pre-wrap; /* Перенос строк с сохранением пробелов */
  word-wrap: break-word; /* Разрыв длинных слов */
  background-color: #3a3a3a;
  color: #f0f0f0;
  padding: 10px;
  border-radius: 5px;
  overflow-y: hidden; /* Убираем скроллинг */
  line-height: 1.4; /* Убираем через-строчность */
}

code, pre {
  font-family: monospace;
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: 0.01em;
  color: #c9c9c9; /* Более светлый цвет текста */
  background-color: #333333; /* Темный фон */
  padding: 8px;
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); /* Небольшая тень */
  text-align: left;
  white-space: pre-wrap; 
  word-break: keep-all;
}


/* Стиль для полей ввода */
input[type="text"] {
  font-family: monospace;
  font-size: 18px;
  line-height: 1.6;
  color: #f0f0f0; /* Цвет текста, как и у body */
  background-color: #333333; /* Темный фон */
  border: 1px solid #555; /* Более темная граница */
  border-radius: 8px;
  padding: 10px;
  margin-bottom: 15px;
  width: 100%; /* Занимает всю ширину контейнера */
  box-sizing: border-box; /* Учитывает padding и border в ширине */
  transition: border-color 0.3s; /* Плавное изменение цвета границы */
}

input[type="text"]:focus {
  outline: none; /* Убираем стандартное выделение при фокусе */
  border-color: #1e90ff; /* Подсвечиваем границу при фокусе */
  box-shadow: 0 0 5px rgba(30, 144, 255, 0.5); /* Добавляем небольшую тень */
}

input[type="text"]::placeholder {
  color: #b0b0b0; /* Более светлый цвет для placeholder */
}

/* Стиль для кнопки */
button {
  background: linear-gradient(90deg, #4e73df 0%, #1c7ed6 100%);
  color: white;
  border: none;
  border-radius: 5px;
  padding: 10px 20px;
  font-size: 16px;
  cursor: pointer;
  transition: background 0.3s ease;
}

button:hover {
  background: linear-gradient(90deg, #1c7ed6 0%, #4e73df 100%);
}

/* Стиль для ссылок */
a {
  color: #00cc00; /* Оранжевый цвет */
  text-decoration: none; /* Удаление подчеркивания */
}

a:hover {
  color: #00ff00; /* Темно-оранжевый цвет при наведении */
}