body {
    font-family: Arial, sans-serif;
    margin: 20px;
    background-color: #f4f4f4;
}

h1 {
    color: #333;
}

a {
    color: #0066cc;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

form {
    max-width: 600px;
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
}

label {
    display: block;
    margin: 10px 0 5px;
}

input, textarea {
    width: 100%;
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

button {
    padding: 10px 20px;
    background-color: #0066cc;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}

button:hover {
    background-color: #005bb5;
}

/* Стили для кнопки "Редактировать" */
.edit-button {
    display: inline-block;
    margin-top: 20px;
    padding: 10px 20px;
    background-color: #ff9900;
    color: #fff;
    border-radius: 5px;
    text-decoration: none;
}

.edit-button:hover {
    background-color: #e68a00;
}






/* Добавьте этот стиль в ваш блок <style> или maket.css */

.image-option-container label[for="addImagesCheckbox"] {
    display: inline;      /* Переопределяем display на inline */
    font-weight: normal;  /* Убираем жирность (как у вас в инлайн-стиле) */
    margin-bottom: 0;     /* Убираем нижний отступ, если он наследуется */
    cursor: pointer;
    vertical-align: middle; /* Добавим для лучшего выравнивания с чекбоксом */
}

/* Можно также немного скорректировать стиль для самого чекбокса */
.image-option-container input[type="checkbox"]#addImagesCheckbox {
    margin-right: 5px;
    vertical-align: middle;
    /* Можно убрать width:auto, если он где-то задан глобально */
    width: auto;
    /* Убедимся, что он не display: block */
    display: inline-block; /* или inline */
}




/* Стили для блока опций скачивания файлов */
.file-download-options {
    margin-top: 10px; /* Небольшой отступ сверху */
}
.file-download-options label {
    display: block; /* Основная метка блока */
}
/* Контейнер для группы чекбоксов в ряд */
.file-checkbox-group {
    display: flex;
    flex-wrap: wrap; /* Позволяет перенос на новую строку */
    gap: 15px; /* Расстояние между парами чекбокс+метка */
}
/* Стили для пары чекбокс+метка (используем существующий класс) */
.checkbox-label-pair {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.checkbox-label-pair input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
    vertical-align: middle;
     width: auto; /* Убедимся, что ширина авто */
     display: inline-block; /* или inline */
}
.checkbox-label-pair label {
    font-weight: normal;
    margin-bottom: 0;
    cursor: pointer;
    white-space: nowrap;
    vertical-align: middle; /* Для лучшего выравнивания */
    display: inline; /* Убедимся, что метка inline */
}
/* Ссылки на скачанные файлы в контенте */
.downloaded-files-list {
    margin-top: 20px;
    padding-top: 10px;
    border-top: 1px solid #eee;
}
.downloaded-files-list h3 {
    margin-bottom: 10px;
}
.downloaded-files-list ul {
    list-style: none;
    padding-left: 0;
}
.downloaded-files-list li {
    margin-bottom: 5px;
}
 .downloaded-files-list li a {
    /* Добавьте иконку файла или другие стили по желанию */
    text-decoration: none;
 }
 .downloaded-files-list li a:hover {
    text-decoration: underline;
 }
 
 
 /* В maket.css или <style> в page.php */

.downloaded-files-list {
    margin-top: 20px;
    padding-top: 15px; /* Увеличил отступ */
    border-top: 1px solid #eee;
}
.downloaded-files-list h3 {
    margin-bottom: 10px;
    font-size: 1.1em; /* Чуть больше заголовок */
}
.downloaded-files-list ul {
    list-style: none; /* Убираем маркеры */
    padding-left: 0; /* Убираем отступ */
}
.downloaded-files-list li {
    margin-bottom: 8px; /* Немного увеличил отступ */
    line-height: 1.4; /* Для лучшей читаемости */
}
.downloaded-files-list li a {
    text-decoration: none;
    margin-right: 5px; /* Отступ от метаданных */
}
.downloaded-files-list li a:hover {
    text-decoration: underline;
}

/* Стиль для метаданных файла (размер, тип) */
.downloaded-files-list li span.file-meta {
    font-size: 0.85em;
    color: #555; /* Сделал чуть темнее */
    /* margin-left: 8px; */ /* Убрал, так как отступ у ссылки */
}



/* Стиль для изображений, вставленных ИИ */
.ai-inserted-image {
    max-width: 50%; /* Отображать не шире 50% контейнера */
    height: auto;   /* Сохранять пропорции */
    display: block; /* Сделать блочным элементом */
    margin: 1em auto; /* Отступы сверху/снизу и авто-выравнивание по центру */
    cursor: pointer; /* Указывает, что на картинку можно нажать */
    border: 1px solid #eee; /* Небольшая рамка для выделения */
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1); /* Небольшая тень */
}

/* Дополнительно: можно убрать подчеркивание у ссылки-обертки */
a.glightbox {
    text-decoration: none;
    border: none;
    display: block; /* Чтобы ссылка занимала блок и центрировалась с картинкой */
    text-align: center; /* Центрируем содержимое ссылки (картинку) */
}





/* Базовый стиль для всех AI изображений (внутри ссылок) */
.ai-inserted-image {
    height: auto;   /* Сохранять пропорции */
    display: block; /* Чтобы margin работал */
    border: 1px solid #eee;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
    background-color: #fff; /* Фон на случай прозрачности PNG */
    padding: 2px; /* Маленький внутренний отступ */
}

/* Стиль для ПЕРВОЙ картинки */
.ai-inserted-image-first {
    float: left;           /* Обтекание слева */
    max-width: 40%;        /* Макс. ширина 40% от контейнера */
    margin-right: 15px;    /* Отступ справа от текста */
    margin-bottom: 10px;   /* Отступ снизу */
    margin-left: 0;        /* Убираем левый отступ */
    cursor: pointer;
}

/* Контейнер для сетки ОСТАЛЬНЫХ картинок */
.ai-image-grid {
    display: grid;                     /* Используем CSS Grid */
    grid-template-columns: repeat(4, 1fr); /* 4 колонки равной ширины */
    gap: 10px;                         /* Промежуток между картинками */
    margin-top: 20px;                  /* Отступ сверху от предыдущего контента */
    clear: both;                       /* Очистка обтекания от первой картинки */
}

/* Стиль для ссылок-оберток ВНУТРИ СЕТКИ */
.ai-image-grid a.glightbox {
    text-decoration: none;
    border: none;
    display: block; /* Занимает всю ячейку грида */
    line-height: 0; /* Убрать лишнее пространство под картинкой в ссылке */
}

/* Стиль для картинок ВНУТРИ СЕТКИ */
.ai-image-grid .ai-inserted-image {
    width: 100%; /* Картинка занимает всю ширину своей ссылки/ячейки грида */
    max-width: 100%; /* Переопределяем max-width для сетки */
    margin: 0;       /* Убираем внешние отступы для картинок в сетке */
    cursor: pointer;
}

/* Общие стили для ссылок GLightbox (можно оставить старый) */
a.glightbox {
    text-decoration: none;
    border: none;
    /* display: block; убрали отсюда, задаем контекстно */
    /* text-align: center; убрали отсюда */
}

.delete-link {
            color: red;
            font-weight: bold; /* Можно добавить выделение */
}




/* Общие стили */
.oblast1, .oblast3, .oblast5, .oblast6, .oblast2 {
    padding: 10px;
    border: solid 1px #000;
    font-family: Arial;
}
.oblast1, .oblast3, .oblast5, .oblast6, .oblast4, .oblast2 {
    overflow: visible;
}
/* Заголовок */
.oblast1 {
    background: #BFC4D3;
    font-size: 14px;
}
/* Навигация по сайту */
.oblast3 {
    width: auto;
    float: top;
    margin: 5px 0;
    background: #D4DCF8;
}
.oblast3 ul {
    list-style: none;
    padding: 0;
}
/* Основное содержание страницы */
.oblast5 {
    background: #fff;
    margin-right: 0;
}
/* Дополнительная секция */
.oblast6 {
    background: #F3F0B7;
}
/* Область с особым содержимым */
.oblast2 {
    background: #F6CDC6;
    font-size: 10px;
    margin: 5px 0;
}
/* Контейнер секций */
.oblast4 {
    margin: 15px 0;
    overflow: auto;
    background: #fff;
}
/* Стили ссылок */
a:link {
    color: #00f;
    text-decoration: none;
}
a:hover {
    color: red;
}
/* Заголовок */
h1 {
    font-size: 15px;
}

.opisanie { height: 30px; width: 90%; background: #F7D1DC; border: 1px solid #fff; overflow-y: scroll; margin: 0 auto; }


.skachat-pdf {
    display: inline-flex;
    align-items: center;
    padding: 10px 10px;
    font-size: 16px;
    font-weight: bold;
    background-color: #81FF68;
    border: 2px solid red;
    border-radius: 30px;
    transition: color 0.3s ease, background-color 0.3s ease, transform 0.1s ease;

}

.skachat-pdf:hover {
    color: white;
    background-color: #4968FF;
}