﻿/* ==========================================================================
   1. ВНЕШНИЙ ТЕМНЫЙ ФОН СТРАНИЦЫ
   ========================================================================== */
body {
    background-color: #00043f; /* Темный графитовый фон */
    color: #1a1a1a;            /* Цвет текста на самом листе (почти черный) */
    font-family: "Courier New", Courier, monospace; /* Шрифт машинки/терминала */
    margin: 0;
    padding: 40px 0;           /* Паддинг только сверху/снизу, центрируем через margin */
    text-align: center;        /* Хак для старых браузеров: центрирует блочный контейнер внутри body */
}

/* ==========================================================================
   2. СВЕТЛО-БЕЛЫЙ БЛОК В ВИДЕ ЛИСТА БУМАГИ
   ========================================================================== */
.document-container {
    max-width: 760px;          /* Ограничение ширины */
    width: 760px;              /* КРИТИЧНО ДЛЯ FF3/IE6: жесткая ширина для старых версий */
    background-color: #fcfbfa; /* Цвет качественной плотной бумаги */
    padding: 50px 60px;        /* Внутренние поля документа */
    box-sizing: border-box;
    
    /* Старый хак центрирования блочных элементов */
    margin: 0 auto;
    text-align: left;          /* Возвращаем выравнивание текста по левому краю */
    
    /* Эффект лежащего листа бумаги (мягкая тень с префиксом Mozilla) */
    -moz-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5), 
                     0 1px 3px rgba(0, 0, 0, 0.2);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5), 
                0 1px 3px rgba(0, 0, 0, 0.2);
    
    /* Небольшое скругление углов с префиксом Mozilla */
    -moz-border-radius: 4px;
    border-radius: 4px; 
}

/* ==========================================================================
   3. ЭЛЕМЕНТЫ ДОКУМЕНТА (ШАПКА, ЗАГОЛОВКИ, СЕКЦИИ)
   ========================================================================== */
.header {
    text-align: center;
    margin-bottom: 40px;
}

.logo-img {
    display: block;        
    width: 200px;
    height: 200px;
    margin: 0 auto 20px auto;
}

h1 {
    font-size: 22px;
    letter-spacing: 3px;
    margin: 0 0 10px 0;
}

.meta-info {
    font-size: 12px;
    color: #555;
    border-bottom: 1px dashed #999;
    padding-bottom: 15px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

h2 {
    font-size: 18px;
    text-align: center;
    letter-spacing: 2px;
    border-bottom: 1px dashed #999;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.content-section {
    margin-bottom: 35px;
}

h3 {
    font-size: 16px;
    border-left: 4px solid #1a1a1a;
    padding-left: 10px;
    margin: 0 0 15px 0;
}

/* ==========================================================================
   4. СПИСКИ И ССЫЛКИ
   ========================================================================== */
ul {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}

li {
    margin-bottom: 12px;
    font-size: 14px;
}

a {
    color: #002288; 
    text-decoration: none;
    font-weight: bold;
}

a:visited {
    color: #551a8b;
    text-decoration: none;
}

a:hover {
    color: #0044cc;
    text-decoration: underline;
}

.system-status {
    color: #2e7d32; /* Неброский зеленый */
    font-weight: bold;
}

/* ==========================================================================
   5. СКВОЗНАЯ ТРЕХКОЛОНОЧНАЯ НАВИГАЦИЯ (НИЖНЕЕ МЕНЮ)
   ========================================================================== */
.bottom-nav-table {
    width: 100%;
    margin-top: 50px;           /* Отступ от основного текста до пунктирной линии */
    margin-bottom: 20px;
    font-size: 14px;
    border-collapse: collapse;
    
    /* Аккуратная пунктирная линия, отделяющая меню */
    border-top: 1px dashed #999999;
}

/* ЖЕСТКО ФИКСИРУЕМ ШИРИНУ КОЛОНОК, ЧТОБЫ ЦЕНТР ВСЕГДА БЫЛ В ЦЕНТРЕ */
.bottom-nav-table .nav-left {
    width: 33%;
    text-align: left;
    vertical-align: middle;
    padding-top: 20px;          /* Отступ от пунктира до ссылки */
}

.bottom-nav-table .nav-center {
    width: 34%;
    text-align: center;
    vertical-align: middle;
    padding-top: 20px;          /* Отступ от пунктира до ссылки */
}

.bottom-nav-table .nav-right {
    width: 33%;
    text-align: right;
    vertical-align: middle;
    padding-top: 20px;          /* Отступ от пунктира до ссылки */
}


/* ==========================================================================
   6. СХЕМЫ, ИЛЛЮСТРАЦИИ И ПОДВАЛ
   ========================================================================== */
/* Контейнер для схем с отступом от текста */
.scheme-preview-container {
    text-align: center;
    margin: 40px 0 30px 0;
}

/* Стиль картинок-схем без рамок и без прозрачности (Строго CSS2) */
.scheme-thumb {
    border: none;       
    padding: 0;         
    display: block;     
    margin: 0 auto;     
    cursor: pointer;    
}

/* Мета-информация в самом низу страницы */
.footer-info {
    font-size: 12px;
    color: #555;
    border-top: 1px dashed #999; /* Пунктирная линия СВЕРХУ текста */
    padding-top: 15px;           
    margin-top: 15px;            
    text-transform: uppercase;   
    text-align: center;          
    letter-spacing: 1px;         
}

/* Индикатор-гифка в подвале */
.img-mini {
    text-align: center;
    margin: 20px auto;  
    display: block;     
    border: none;       
}

/* ==========================================================================
   7. СТИЛИ ТЕХНИЧЕСКИХ ТАБЛИЦ СТРАНИЦЫ ИНФОРМАЦИИ
   ========================================================================== */
.report-table {
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #000000;
    font-family: "Courier New", Courier, monospace;
    font-size: 10pt;
    width: 640px;               /* Скорректировано под ширину нашего текстового поля */
}

.report-table th {
    font-weight: bold;
    padding: 5px;
    color: #ffffff;             /* Чистый белый контрастный текст */
    background: #00043f;        /* Наш фирменный темный фон шапки сервера */
    text-align: center;
    border: 1px solid #000000;
}

.report-table td {
    padding: 5px 10px;
    text-align: left;
    border: 1px solid #000000;
}

/* Чередование строк: заливка применяется к НЕЧЕТНЫМ строкам данных */
.report-table tr:nth-child(odd) td {
    background: #dfdfdf;        /* Легкий аккуратный ретро-оттенок */
}


/* ==========================================================================
   8. ОФОРМЛЕНИЕ КОНСОЛЬНЫХ КОМАНД (TERMINAL STYLE)
   ========================================================================== */
code {
    display: block;            /* КРИТИЧНО: переносит команду на новую строку как блок */
    font-family: "Courier New", Courier, monospace;
    font-size: 13px;
    background-color: #ededed; /* Светлая подложка терминала */
    color: #001166;            /* Спокойный, глубокий темно-синий цвет команды */
    padding: 6px 12px;         /* Внутренние поля блока команды */
    margin: 8px 0 12px 20px;   /* Отступы: команда сдвинута вправо относительно текста */
    border-left: 3px solid #00043f; /* Плотный левый маркер цвета шапки */
    font-weight: bold;
    white-space: pre-wrap;     /* Сохраняет пробелы и переносит длинные строки */
}


/* ==========================================================================
   9. БЛОК ЭКСТРЕННЫХ ОПОВЕЩЕНИЙ (ALERT BOX)
   ========================================================================== */
.alert-box {
    border: 4px double #1a1a1a;  /* Классическая двойная ретро-рамка */
    background-color: #f0eee9;  /* Плотный серый фон, выделяющийся на листе */
    padding: 15px 20px;
    margin: 20px 0 35px 0;
    font-size: 14px;
    text-align: left;
}

.alert-title {
    color: #b30000;             /* Строгий красный цвет для заголовка уведомления */
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 5px;
}
