/* === Стили для форума о проблемах зрения === */
/* Основные принципы: высокая контрастность, чёткость, безопасные цвета */

/* 🌿 ОБЩАЯ СТИЛИЗАЦИЯ */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Более читаемый шрифт по умолчанию */
    color: #2C2C2C; /* Высокий контраст - тёмно-серый вместо коричневого */
    background-color: #F8F9FA; /* Светлый, не утомляющий глаза фон */
    line-height: 1.8; /* Увеличенный интерлиньяж для лучшей читаемости */
    font-size: 18px; /* Увеличенный базовый размер шрифта */
}

/* 🔗 ССЫЛКИ */
a {
    color: #0056B3; /* Стандартный, высококонтрастный синий для ссылок */
    text-decoration: underline; /* Всегда подчёркнуты для явного обозначения */
    font-weight: 600; /* Полужирные для выделения */
    transition: color 0.3s ease-in-out, background-color 0.3s ease;
    outline: none; /* Убираем outline по умолчанию, зададим свой */
}
a:hover,
a:focus { /* Важно для навигации с клавиатуры */
    color: #003366; /* Более тёмный оттенок при наведении */
    background-color: #FFFACD; /* Светло-жёлтый фон для высокого контраста */
    text-decoration: none;
}
/* Чёткий контур для фокуса (доступность) */
a:focus-visible {
    outline: 3px solid #FF9900; /* Ярко-оранжевый контур для фокуса */
    outline-offset: 2px;
}

/* 📄 РАЗДЕЛИТЕЛИ */
hr {
    border: none;
    border-top: 3px solid #4682B4; /* Чёткая, контрастная синяя линия */
    margin: 25px 0;
}

/* 📦 КОНТЕЙНЕРЫ ФОРУМА */
.bodyline, .forumline {
    background-color: #FFFFFF;
    border: 2px solid #4682B4; /* Контрастная синяя рамка */
    border-radius: 8px; /* Умеренные скругления */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 25px;
}

/* 🧵 ТАБЛИЧНЫЕ ЯЧЕЙКИ (Чередование для удобства чтения строк) */
td.row1 {
    background-color: #FFFFFF;
}
td.row2 {
    background-color: #E8F4F8; /* Очень светлый голубой фон */
}
td.row3 {
    background-color: #F0F8FF; /* Alice Blue для заголовков тем */
}

/* ЗАГОЛОВКИ ТАБЛИЦ */
th {
    background: linear-gradient(to bottom, #4682B4, #2E5A8A); /* Градиент синий */
    font-family: 'Segoe UI', sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF; /* Белый текст на тёмном фоне */
    padding: 15px 10px;
    text-align: left;
}

/* 🖋 ЗАГОЛОВКИ СТРАНИЦ И РАЗДЕЛОВ */
a.maintitle, h1, h2, h3, h4 {
    font-family: 'Segoe UI', sans-serif; /* Читаемый шрифт для заголовков */
    color: #2E5A8A; /* Тёмно-синий цвет */
    font-weight: 700; /* Жирное начертание */
    text-shadow: none; /* Убираем тени для чёткости */
    letter-spacing: 0.5px;
}
h1 { font-size: 32px; }
h2 { font-size: 26px; border-bottom: 2px solid #4682B4; padding-bottom: 5px; }
h3 { font-size: 22px; }

/* 📋 ЦИТАТЫ И КОД */
.quote, .code {
    background-color: #EDF7FF; /* Светло-голубой фон */
    border-left: 6px solid #4682B4; /* Толстая синяя полоса */
    padding: 15px;
    margin: 15px 0;
    border-radius: 0 8px 8px 0; /* Скругляем только правую сторону */
    font-style: normal; /* Убираем курсив, он может быть плохо читаем */
    font-family: 'Courier New', monospace; /* Моноширинный для кода */
    color: #2C2C2C;
    overflow-x: auto; /* Полоса прокрутки для длинных строк кода */
}

/* 🧭 НАВИГАЦИЯ (хлебные крошки, пагинация) */
.nav, a.nav {
    font-weight: bold;
    color: #2E5A8A; /* Тёмно-синий */
    text-transform: none; /* Оставляем обычный регистр */
    letter-spacing: normal;
    font-size: 16px;
}
.nav:hover, a.nav:hover {
    color: #FF4500; /* Оранжево-красный при наведении */
}

/* 🧵 ПОЛЯ ВВОДА (сообщения, логин, поиск) */
input, textarea, select {
    background-color: #FFFFFF;
    border: 2px solid #5A5A5A; /* Чёткая тёмная рамка */
    font-family: 'Segoe UI', sans-serif;
    font-size: 18px; /* Крупный шрифт в полях */
    padding: 10px;
    border-radius: 6px;
    transition: border-color 0.3s ease-in-out;
    color: #000000;
    width: 100%; /* Адаптивность */
    box-sizing: border-box; /* Чтобы padding не ломал ширину */
}
input:focus, textarea:focus, select:focus {
    border-color: #FF9900; /* Ярко-оранжевая рамка при фокусе */
    outline: none; /* Убираем системный outline, т.к. рамка уже сигнализирует */
    box-shadow: 0 0 0 2px rgba(255, 153, 0, 0.3); /* Мягкое свечение */
}

/* 🔘 КНОПКИ */
input[type="submit"], input[type="button"], button, .button {
    background: linear-gradient(to bottom, #4682B4, #2E5A8A);
    color: #FFFFFF !important; /* Важно, чтобы перебить другие стили */
    font-weight: bold;
    border: 2px solid #2E5A8A;
    border-radius: 8px;
    padding: 12px 24px;
    cursor: pointer;
    font-size: 18px;
    transition: background-color 0.3s ease, opacity 0.3s ease;
    display: inline-block;
    text-decoration: none;
    text-align: center;
}
input[type="submit"]:hover, input[type="button"]:hover, button:hover, .button:hover,
input[type="submit"]:focus, input[type="button"]:focus, button:focus, .button:focus {
    background: linear-gradient(to bottom, #5A9BD4, #4682B4);
    opacity: 0.95;
    outline: 3px solid #FF9900; /* Контур фокуса */
    outline-offset: 2px;
}

/* 👤 АВАТАР ГОСТЕЙ (ИКОНКА ПО УМОЛЧАНИЮ) */
.guestavatar {
    background-color: #E8F4F8;
    color: #4682B4; /* Синий цвет иконки/буквы */
    font-size: 48px;
    font-weight: bold;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    border: 3px solid #4682B4;
}

/* ✨ МИНИМАЛЬНАЯ АНИМАЦИЯ (без смещения, только плавное появление) */
.forumline {
    animation: fadeIn 0.5s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0.7; }
    to { opacity: 1; }
}

/* 📱 ДОПОЛНИТЕЛЬНО: Стиль для важных уведомлений или предупреждений */
.alert-box {
    background-color: #FFFACD; /* Светло-жёлтый */
    border: 3px solid #FF9900;
    color: #8B6508; /* Тёмно-жёлтый/коричневый текст */
    padding: 15px;
    margin: 15px 0;
    border-radius: 6px;
    font-weight: bold;
}