/* =========================================================
   /forums/css/forum.css
   Every rule here is scoped under .forumApp on purpose - the forum
   section shares the site's Bootstrap base but needs its own heading
   sizes (the main site's h1/h2 are sized for full-page content, not
   compact list items like a forum name in a listing row).
   Add any future forum-only style tweaks here, scoped the same way.
========================================================= */

.forumApp h1 {
    font-size: 1.6rem !important;
}

.forumApp h2 {
    font-size: 1.05rem !important;
    margin-bottom: 0.25rem !important;
}

.forumApp h3,
.forumApp h4,
.forumApp h5,
.forumApp h6 {
    font-size: 1rem !important;
}

/* Site's global .btn styling overrides Bootstrap's own btn-sm/
   btn-group-sm sizing (same specificity fight as the h1-h6 rules above),
   so force it explicitly here. */
.forumApp .btn-sm,
.forumApp .btn-group-sm > .btn {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.775rem !important;
    line-height: 1.5 !important;
    border-radius: 0.25rem !important;
}

.forumApp .card-header {
    font-weight: 600;
}

/* Was referenced throughout the forum/thread listing markup but never
   actually defined - this is why those columns stacked awkwardly on
   phones instead of hiding. Matches Bootstrap's md breakpoint (768px). */
@media (max-width: 767.98px) {
    .forumApp .hide-on-small-screens {
        display: none !important;
    }
}

/* Subtle pulse on the unread-PM badge in the persistent toolbar */
.forumApp .forum-pulse {
    animation: forumPulse 1.6s ease-in-out infinite;
}

@keyframes forumPulse {
    0%   { transform: scale(1);    opacity: 1; }
    50%  { transform: scale(1.25); opacity: 0.75; }
    100% { transform: scale(1);    opacity: 1; }
}

/* Persistent toolbar strip - sits above everything else on every forum
   page, as its own distinct bar rather than blending into whatever
   content follows it. */
.forum-toolbar-strip {
    background-color: rgba(0, 0, 0, 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* The row itself never wraps - on a narrow screen with many buttons
   (a logged-in member can see eight or more), it scrolls horizontally
   instead, which stays predictable everywhere rather than reflowing
   differently on every page. */
.forum-toolbar-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.forum-toolbar-scroll .btn {
    flex-shrink: 0;
}
