/* [8-64] Скопируйте сюда всё содержимое тега <style> из файла index.htm.txt */
body { font-family: Arial, sans-serif; margin: 20px; padding: 0; }
h1, h2, h3 { text-align: center; }
.form-container { max-width: 400px; margin: 0 auto 20px; padding: 20px; border: 1px solid #ccc; border-radius: 5px; }
.form-container input, .form-container select, .form-container textarea { width: 100%; margin: 10px 0; padding: 8px; box-sizing: border-box; }
.form-container button { width: 100%; padding: 10px; background-color: #4CAF50; color: white; border: none; border-radius: 5px; cursor: pointer; }
.form-container button:hover { background-color: #45a049; }
.form-container button:disabled { background-color: #cccccc; cursor: not-allowed; }
.form-container p { text-align: center; color: red; }
.hidden { display: none !important; }
#voting-section, #admin-section, #profile-section { margin: 20px auto; max-width: 800px; }
.meeting { border: 1px solid #ccc; padding: 10px; margin-bottom: 10px; border-radius: 5px; }
.agenda-item { margin-left: 20px; margin-top: 10px; }
.link { text-align: center; margin-top: 10px; }
.profile-info { margin-bottom: 20px; }
.profile-info p { margin: 5px 0; }
#vote-totals { display: block; margin-top: 5px; font-size: 0.9em; }
.error-message { color: red; font-size: 0.8em; margin: 0; display: none; }
.invalid { border-color: red; }
.valid { border-color: green; }
.custom-radio { margin-right: 15px; }
.btn-transparent { background-color: transparent; border: 1px solid #ccc; color: #000; /* Цвет текста, чтобы он оставался читаемым */ }
.btn-transparent:hover { background-color: rgba(0, 0, 0, 0.05); /* Лёгкий эффект при наведении */ }
.btn:disabled { background-color: transparent; /* Убираем серый фон для неактивных кнопок */ opacity: 1; /* Убираем полупрозрачность */ }
.agenda-item .voting-container { display: flex; flex-direction: row; align-items: flex-start; gap: 20px; margin-top: 10px; }
.agenda-item .buttons-and-text { display: flex; flex-direction: column; gap: 10px; }
.agenda-item .vote-totals { flex: 1; }
.agenda-item .vote-donut { width: 280px !important; height: 180px !important; border: 1px solid #ccc; border-radius: 10px; }
.agenda-item .legend-container { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 5px; }
.agenda-item .legend-item { display: flex; align-items: center; gap: 5px; }
.agenda-item .legend-color { width: 10px; height: 10px; }
.menu-toggle { display: none; }
#nav-menu { display: flex; flex-direction: column; width: 100%; /* Базовая ширина */ }
#nav-menu button { margin: 5px 0; }
@media (max-width: 600px) {
    .form-container, #voting-section, #admin-section, #profile-section { margin: 0px; padding: 0px; }
    h1 { font-size: 1.5em; }
    h2, h3 { font-size: 1.2em; }
    .meeting { margin: 0; padding: 8px 0; border-radius: 0; }
    .agenda-item { margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; }
    .button { font-size: 0.9em; }
    .menu-toggle { display: block; }
    .agenda-item .voting-container { flex-direction: column; align-items: center; }
    .agenda-item .vote-donut { width: 100% !important; max-width: 400px !important; height: 200px !important; }
    .agenda-item .buttons-and-text { width: 100%; max-width: 400px; text-align: center; }
    #main-buttons .btn:not(.menu-toggle) { display: none; }
    #nav-menu:not(.hidden) .btn { display: block !important; }
    #nav-menu { width: 100%; /* Для мобильных */ }
    #nav-menu button { width: 100%; /* Для мобильных кнопки на всю ширину */ }
    #voting-section { margin: 0; padding: 0; max-width: 100%; }
}
@media (min-width: 601px) {
    .container { max-width: 800px; width: 100%; padding-left: 0; padding-right: 0; }
    #main-buttons { max-width: 800px; width: 100%; margin-left: auto; margin-right: auto; }
    #nav-menu { max-width: 800px; width: 100%; margin-left: auto; margin-right: auto; }
    #nav-menu .btn { max-width: 800px !important; width: 100% !important; display: block !important; margin-left: auto; margin-right: auto; text-align: center; }
    #main-buttons .btn:not(.menu-toggle) { display: block !important; }
}

/* Добавляем правило с высокой специфичностью для #admin-button.hidden */
#admin-button.hidden {
    display: none !important;
}