/* Темный фон для блока выбора монет */
.coin-selection {
    background-color: #2c2c2c; /* Темно-серый фон */
    border-radius: 10px; /* Скругленные углы */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Тень для выделения блока */
    padding: 20px; /* Внутренние отступы */
    max-width: 400px; /* Максимальная ширина блока */
    margin: 20px auto; /* Центрирование блока по горизонтали с отступами сверху и снизу */
    text-align: center; /* Выравнивание текста по центру */
}

/* Стили для заголовка в блоке выбора монет */
.coin-selection h3 {
    font-size: 24px;
    color: #f0f0f0; /* Очень светлый серый для заголовка */
    margin-bottom: 10px; /* Отступ снизу */
}

/* Стили для описания в блоке выбора монет */
.coin-selection p {
    font-size: 16px;
    color: #b0b0b0; /* Более светлый серый для текста */
    margin-bottom: 20px; /* Отступ снизу */
}

/* Стили для формы */
.coin-selection form {
    display: flex;
    flex-direction: column; /* Вертикальное расположение элементов */
    gap: 15px; /* Пробел между элементами формы */
}

/* Стили для метки поля ввода */
.coin-selection label {
    font-size: 14px;
    color: #e0e0e0; /* Светло-серый цвет текста для метки */
}

/* Стили для поля ввода количества монет */
.coin-selection input[type="number"] {
    padding: 12px; /* Внутренние отступы */
    border: 1px solid #444; /* Темная рамка */
    border-radius: 5px; /* Скругленные углы */
    font-size: 16px; /* Размер шрифта */
    color: #e0e0e0; /* Светлый цвет текста */
    background-color: #1f1f1f; /* Очень темный фон для поля ввода */
}

/* Стили для кнопки отправки формы */
.coin-selection button {
    background-color: #4a90e2; /* Яркий синий цвет фона */
    color: #fff; /* Белый цвет текста */
    padding: 12px 20px; /* Внутренние отступы */
    border: none; /* Убираем стандартные границы */
    border-radius: 5px; /* Скругленные углы */
    font-size: 16px; /* Размер шрифта */
    cursor: pointer; /* Курсор в виде руки при наведении */
    transition: background-color 0.3s; /* Плавный переход цвета фона */
}

/* Эффект при наведении на кнопку */
.coin-selection button:hover {
    background-color: #357abd; /* Темнее синий при наведении */
}

/* Стили для кнопки отправки формы при активации */
.coin-selection button:active {
    background-color: #2a5d9c; /* Еще темнее синий при нажатии */
}

/* Стили для ошибок и сообщений */
.coin-selection .error-message {
    color: #ff4d4d; /* Ярко-красный цвет для сообщений об ошибках */
    font-size: 14px; /* Размер шрифта для сообщений */
    margin-top: 10px; /* Отступ сверху */
}

.coin-selection .success-message {
    color: #4caf50; /* Зеленый цвет для успешных сообщений */
    font-size: 14px; /* Размер шрифта для сообщений */
    margin-top: 10px; /* Отступ сверху */
}