/* GPT Forum - Design Refinements */

/* ══ COMMUNITY/SECTION PAGE ══════════════════════════════ */

/* Full-bleed banner - taller, no top border radius */
.ff-section-header {
    border-radius: 0 0 var(--ff-radius) var(--ff-radius) !important;
    border-top: none !important;
    margin-bottom: 24px !important;
    margin-left: -1px;
    margin-right: -1px;
}

.ff-section-header__banner {
    height: 220px !important;
    position: relative;
}

/* Gradient overlay on banner for text readability */
.ff-section-header__banner::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(to top, rgba(0,0,0,0.3), transparent);
}

/* Larger community icon */
.ff-section-header__icon-wrap {
    width: 84px !important;
    height: 84px !important;
    margin-top: -42px !important;
    border-width: 5px !important;
    z-index: 2;
    position: relative;
}

.ff-section-header__icon-wrap svg {
    width: 56px !important;
    height: 56px !important;
}

/* Better info section spacing */
.ff-section-header__info {
    padding: 16px 24px 20px !important;
    gap: 20px !important;
}

.ff-section-header__title {
    font-size: 1.65rem !important;
    font-weight: 800 !important;
    margin-bottom: 2px !important;
}

.ff-section-header__desc {
    font-size: 0.9rem !important;
    margin-top: 6px !important;
    max-width: 600px;
}

.ff-section-header__stats {
    margin-top: 10px !important;
    display: flex;
    gap: 20px;
}

.ff-section-header__stat-num {
    font-weight: 700 !important;
    font-size: 1rem !important;
    color: var(--ff-text) !important;
}

/* ══ TOPIC DETAIL PAGE ═══════════════════════════════════ */

/* Better content area */
.ff-topic-detail__content-area {
    padding: 0 20px 20px !important;
}

.ff-topic-detail__content.ff-prose {
    font-size: 0.95rem;
    line-height: 1.75;
    padding-top: 8px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--ff-border);
    margin-bottom: 12px;
}

/* Ensure topic content is visible and well-spaced */
.ff-topic-detail__content.ff-prose p {
    margin-bottom: 1.1em;
}

.ff-topic-detail__content.ff-prose:empty {
    display: none;
}

/* Better title sizing on detail */
.ff-topic-detail__title {
    font-size: 1.6rem !important;
    letter-spacing: -0.025em !important;
    line-height: 1.35 !important;
}

/* Tags styling */
.ff-tag {
    padding: 4px 12px !important;
    font-size: 0.75rem !important;
    border-radius: 20px !important;
}

/* ══ REPLY/COMMENT IMPROVEMENTS ══════════════════════════ */

/* Better comment card spacing */
.ff-reply {
    padding: 16px 0 !important;
}

/* Avatar next to content instead of above */
.ff-reply__body {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.ff-reply__avatar {
    flex-shrink: 0;
}

.ff-reply__avatar img {
    border-radius: 50% !important;
}

/* ══ SIDEBAR IMPROVEMENTS ════════════════════════════════ */

/* About card in sidebar - more visual weight */
.ff-card--sidebar .ff-card__header {
    padding: 14px 16px !important;
}

.ff-card--sidebar .ff-card__body {
    padding: 16px !important;
}

.ff-section-about__stat {
    display: flex;
    gap: 6px;
    align-items: baseline;
    margin-bottom: 12px;
}

.ff-section-about__stat-num {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--ff-text);
}

/* ══ FEED CARD IMPROVEMENTS ══════════════════════════════ */

/* Slightly more padding on topic cards in feed */
.ff-card-topic {
    padding: 14px 16px !important;
}

.ff-card-topic__title {
    font-size: 1rem !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

/* ══ IMAGES IN POSTS & COMMENTS ══════════════════════════ */

.ff-prose img,
.ff-reply__content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 12px 0;
}

.ff-prose img:hover,
.ff-reply__content img:hover {
    opacity: 0.95;
}

/* ══ GENERAL POLISH ══════════════════════════════════════ */

/* Smoother transitions */
.ff-card-topic,
.ff-reply,
.ff-btn {
    transition: all 0.15s ease;
}

.ff-card-topic:hover {
    border-color: var(--ff-border-hover, rgba(255,255,255,0.15)) !important;
}

/* Better empty state */
.ff-empty-state {
    padding: 60px 20px !important;
    text-align: center;
}

/* Improve the "Join Community" button in sidebar */
.ff-btn--primary.ff-btn--full {
    margin-top: 8px;
    font-weight: 600;
    padding: 10px 16px !important;
}
