/* /home/lo0ni/digital_megalith/static/css/main.css */

/* Базовые стили */
body { background-color: #1a1a1a; color: #ccc; font-family: monospace; margin: 0; }
nav { background: #333; padding: 1rem; display: flex; gap: 1rem; border-bottom: 2px solid #444; align-items: center; }
nav a { color: #fff; text-decoration: none; font-weight: bold; }
nav span { margin-left: auto; color: #0f0; }
main { padding: 2rem; max-width: 1200px; margin: 0 auto; }
hr { border-color: #444; }

/* Стили для сетки постов */
.grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; }
.post-card { border: 1px solid #444; overflow: hidden; background: #222; }
.post-card img { width: 100%; height: 200px; object-fit: cover; display: block; }
.post-card p { padding: 1rem; margin: 0; color: #ddd; }
.post-link { text-decoration: none; color: inherit; }

/* Стили для страницы отдельного поста */
.post-detail-container { max-width: 800px; margin: 0 auto; }
.post-content img { max-width: 100%; }
.post-content p { font-size: 1.2em; line-height: 1.6; }
.back-link { display: block; margin-top: 1rem; }

/* Стили для комментариев */
.comments-section { margin-top: 2rem; }
.comment { display: flex; gap: 1rem; border-top: 1px solid #333; padding-top: 1rem; margin-top: 1rem; }
.comment-author-panel { flex-shrink: 0; width: 150px; text-align: center; }
.comment-avatar { width: 80px; height: 80px; border-radius: 50%; border: 1px solid #555; margin-bottom: 0.5rem; }
.author-name { display: block; word-wrap: break-word; }
.author-name a { color: #0f0; text-decoration: none; font-weight: bold; }
.author-name a:hover { text-decoration: underline; }
.author-status { display: block; font-size: 0.8em; color: #888; font-style: italic; }
.comment-content { flex-grow: 1; padding-top: 0.5rem; }
.comment-content p { margin: 0; }

/* Стили форм */
form { display: flex; flex-direction: column; max-width: 500px; gap: 0.5rem; }
input, textarea { padding: 0.5rem; background: #333; border: 1px solid #555; color: white; font-family: monospace; }
button { padding: 0.5rem; background: #555; color: white; border: none; cursor: pointer; }
button:hover { background: #666; }
.flash-error { background-color: #5a1d1d; color: #ffcccc; border: 1px solid #c53030; padding: 1rem; margin-bottom: 1rem; }

/* Стили для профиля */
.profile-header { position: relative; height: 300px; background-size: cover; background-position: center; display: flex; flex-direction: column; align-items: center; justify-content: center; color: white; text-shadow: 2px 2px 4px #000; border: 1px solid #444; }
.profile-avatar { width: 120px; height: 120px; border-radius: 50%; border: 3px solid #fff; margin-bottom: 1rem; }
.profile-username { margin: 0; }
.profile-status { margin: 0.2rem; font-style: italic; color: #0f0; }
.profile-body { display: grid; grid-template-columns: 2fr 1fr; gap: 2rem; margin-top: 2rem; }
.profile-bio h2, .profile-inventory h2 { border-bottom: 1px solid #444; padding-bottom: 0.5rem; }
.inventory-grid { display: flex; flex-wrap: wrap; gap: 1rem; }
.inventory-item { text-align: center; }
.inventory-item img { width: 64px; height: 64px; background: #333; border: 1px solid #555; }

/* Стили для макета с меню */
.site-wrapper { display: flex; }
.sidebar { width: 250px; border-right: 1px solid #444; padding: 1rem; height: 100vh; position: sticky; top: 0; }
.sidebar a { display: block; color: #ccc; text-decoration: none; padding: 0.5rem 0; }
.sidebar a:hover { color: #fff; }
.main-content { flex-grow: 1; padding: 2rem; }

/* Обновляем существующие стили комментариев или заменяем их */
.comments-section {
    margin-top: 2rem;
}

/* Убираем старые стили комментариев если они есть и добавляем новые */
.comment {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    background-color: #222;
    border-radius: 10px;
    border: 1px solid #333;
}

.comment-author-panel {
    flex-shrink: 0;
    width: 100px;
    text-align: center;
}

.comment-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 2px solid #444;
}

/* Добавляем подключение нового файла стилей в base.html */