/** FORUM **/
:root {
    --forum_bg: transparent;
    --forum_bg_panel: transparent;
    --forum_bg_elevated: #000000;
    --forum_border: #2d333b;
    --forum_text: #e8eaed;
    --forum_text_muted: #8b949e;
    --forum_accent: #d9b071;
    --forum_accent_hover: #fff7b5;
    --forum_success: #3fb950;
    --forum_warn: salmon;
    --forum_error: #f85149;
    --forum_admin: #bc8cff;
    --forum_radius: 6px;
    --forum_font: 'Segoe UI', system-ui, sans-serif;
}

#forum_root.forum_root,
.forum_root {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
    min-height: 480px;
    background: var(--forum_bg);
    color: var(--forum_text);
    font-family: var(--forum_font);
    font-size: 14px;
    box-sizing: border-box;
    overflow: hidden;
}

#forum_root *,
#forum_root *::before,
#forum_root *::after {
    box-sizing: border-box;
}

/* Left sidebar — 20% width, full height */
#forum_left.forum_left {
    flex: 0 0 10%;
    width: 10%;
    max-width: 10%;
    height: 100%;
    background: var(--forum_bg_panel);
    border-right: 1px solid var(--forum_border);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.forum_sidebar_inner {
    height: 100%;
    overflow-y: auto;
}

.forum_sidebar {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100%;
}

.forum_brand_title {
    display: block;
    font-size: 18px;
    font-weight: 700;
    color: var(--forum_accent);
    letter-spacing: 0.5px;
}

.forum_brand_user {
    display: block;
    font-size: 12px;
    margin-top: 4px;
}

.forum_nav_list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.forum_nav_list li {
    margin: 0;
}

.forum_nav_link {
    display: block;
    padding: 8px 10px;
    color: var(--forum_text);
    text-decoration: none;
    border-radius: var(--forum_radius);
    transition: background 0.15s;
}

.forum_nav_admin {
    color: var(--forum_admin);
}

.forum_nav_sep {
    font-size: 11px;
    text-transform: uppercase;
    color: var(--forum_text_muted);
    padding: 12px 10px 4px;
    letter-spacing: 1px;
}

.forum_boardinfo {
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid var(--forum_border);
}

.forum_boardinfo_title {
    font-size: 11px;
    text-transform: uppercase;
    color: var(--forum_text_muted);
    margin-bottom: 8px;
    letter-spacing: 0.5px;
}

.forum_stat_row {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
    font-size: 13px;
}

.forum_stat_row strong {
    color: var(--forum_accent);
}

.forum_stat_link {
    color: var(--forum_accent);
    text-decoration: none;
}

.forum_stat_link:hover {
    text-decoration: underline;
}

.forum_stat_small {
    font-size: 11px;
    color: var(--forum_text_muted);
}

.forum_online_list_title {
    font-size: 11px;
    color: var(--forum_text_muted);
    margin-top: 10px;
    margin-bottom: 6px;
}

.forum_online_users {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.forum_online_chip {
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    border-radius: 12px;
    padding: 2px 8px;
    font-size: 11px;
}

/* Right side — 80% width, split top/bottom 50% each */
#forum_right.forum_right {
    flex: 1 1 80%;
    width: 80%;
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#forum_top.forum_top,
#forum_bottom.forum_bottom {
    flex: 0 0 50%;
    height: 50%;
    max-height: 50%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

#forum_top.forum_top {
    border-bottom: 1px solid var(--forum_border);
}

.forum_panel_inner {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px;
    background: var(--forum_bg);
}

#forum_top .forum_panel_inner {
    background: var(--forum_bg_panel);
}

#forum_top .forum_panel_inner:has(.forum_categories_panel) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 0;
}

.forum_panel_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.forum_panel_title {
    font-size: 16px;
    font-weight: 600;
    color: var(--forum_text);
}

.forum_header_actions {
    display: flex;
    gap: 8px;
}

/* Categories panel */
.forum_categories_panel {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}

.forum_cat_scroll {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

.forum_cat_block {
    margin-bottom: 16px;
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    overflow: hidden;
}

.forum_cat_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: var(--forum_bg_elevated);
    border-bottom: 1px solid var(--forum_border);
}

.forum_cat_title {
    font-weight: 600;
    color: var(--forum_accent);
}

.forum_cat_desc {
    padding: 6px 12px;
    font-size: 12px;
    color: var(--forum_text_muted);
    border-bottom: 1px solid var(--forum_border);
}

.forum_sub_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.forum_sub_table th,
.forum_sub_table td {
    padding: 8px 10px;
    text-align: left;
    border-bottom: 1px solid var(--forum_border);
}

.forum_sub_table th {
    font-size: 11px;
    text-transform: uppercase;
    color: var(--forum_text_muted);
    background: var(--forum_bg);
}

.forum_sub_table tr:last-child td {
    border-bottom: none;
}

.forum_sub_link {
    color: var(--forum_text);
    text-decoration: none;
    font-weight: 500;
}

.forum_sub_link:hover {
    color: var(--forum_accent);
}

.forum_sub_desc {
    font-size: 11px;
    color: var(--forum_text_muted);
    margin-top: 2px;
}

.forum_num {
    text-align: center;
    color: var(--forum_accent);
    white-space: nowrap;
}

.forum_last {
    font-size: 12px;
    color: var(--forum_text_muted);
}

/* Buttons & inputs */
.forum_btn {
    background: var(--forum_bg_elevated);
    color: var(--forum_text);
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    padding: 6px 14px;
    cursor: pointer;
    font-size: 13px;
    text-decoration: none;
    display: inline-block;
}

.forum_btn:hover {
    border-color: var(--forum_accent);
    color: var(--forum_accent);
}

.forum_btn_accent {
    background: var(--forum_accent);
    color: #0d1117;
    border-color: var(--forum_accent);
    font-weight: 600;
}

.forum_btn_accent:hover {
    background: var(--forum_accent_hover);
    color: #0d1117;
}

.forum_btn_sm {
    padding: 4px 10px;
    font-size: 12px;
}

.forum_input {
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    color: var(--forum_text);
    border-radius: var(--forum_radius);
    padding: 8px 10px;
    font-size: 13px;
    width: 100%;
}

.forum_input:focus {
    outline: none;
    border-color: var(--forum_accent);
}

.forum_input_sm {
    width: 70px;
}

.forum_label {
    display: block;
    margin: 10px 0 4px;
    font-size: 12px;
    color: var(--forum_text_muted);
}

.forum_form {
    max-width: 100%;
}

.forum_form_inline {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    align-items: center;
}

.forum_form_inline .forum_input {
    flex: 1 1 140px;
    width: auto;
}

.forum_form_actions {
    margin-top: 14px;
}

/* Messages */
.forum_msg {
    padding: 10px 12px;
    border-radius: var(--forum_radius);
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    margin-bottom: 10px;
}

.forum_msg_ok { border-color: var(--forum_success); color: var(--forum_success); }
.forum_msg_warn { border-color: var(--forum_warn); color: var(--forum_warn); }
.forum_msg_error { border-color: var(--forum_error); color: var(--forum_error); }

.forum_muted { color: var(--forum_text_muted); }
.forum_pad_sm { padding: 8px 0; }

.forum_nickname { color: var(--forum_accent); }

/* Topics table */
.forum_topics_table,
.forum_admin_table,
.forum_profile_table {
    width: 100%;
    border-collapse: collapse;
}

.forum_topics_table th,
.forum_topics_table td,
.forum_admin_table th,
.forum_admin_table td,
.forum_profile_table th,
.forum_profile_table td {
    padding: 8px 10px;
    border-bottom: 1px solid var(--forum_border);
    text-align: left;
}

.forum_topics_table th,
.forum_admin_table th,
.forum_profile_table th {
    font-size: 11px;
    text-transform: uppercase;
    color: var(--forum_text_muted);
}

.forum_topic_link {
    color: var(--forum_text);
    text-decoration: none;
    font-weight: 500;
}

.forum_topic_link:hover {
    color: var(--forum_accent);
}

/* Posts */
.forum_post {
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    margin-bottom: 12px;
    overflow: hidden;
}

.forum_post_header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: var(--forum_bg_elevated);
    border-bottom: 1px solid var(--forum_border);
    font-size: 12px;
}

.forum_post_num {
    color: var(--forum_text_muted);
    font-weight: 600;
}

.forum_post_date {
    color: var(--forum_text_muted);
}

.forum_post_actions {
    margin-left: auto;
}

.forum_post_body {
    padding: 12px 14px;
    line-height: 1.55;
    word-break: break-word;
}

.forum_post_body a {
    color: var(--forum_accent);
}

/* Quick action links */
.forum_quick_link {
    color: var(--forum_accent);
    text-decoration: none;
    font-size: 12px;
    margin-left: 6px;
}

.forum_quick_link:hover {
    text-decoration: underline;
}

.forum_quick_actions {
    white-space: nowrap;
}

/* Rich text editor */
.forum_editor_wrap {
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    overflow: hidden;
    background: var(--forum_bg_elevated);
}

.forum_editor_toolbar {
    display: flex;
    gap: 4px;
    padding: 6px 8px;
    background: var(--forum_bg_panel);
    border-bottom: 1px solid var(--forum_border);
    flex-wrap: wrap;
}

.forum_editor_btn {
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    color: var(--forum_text);
    border-radius: 4px;
    padding: 4px 10px;
    cursor: pointer;
    font-size: 13px;
}

.forum_editor_btn:hover {
    border-color: var(--forum_accent);
}

.forum_editor_color_label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border: 1px solid var(--forum_border);
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
}

.forum_editor_color {
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    cursor: pointer;
    background: transparent;
}

.forum_editor_area {
    min-height: 140px;
    max-height: 280px;
    overflow-y: auto;
    padding: 10px 12px;
    line-height: 1.5;
    outline: none;
}

.forum_editor_area:focus {
    box-shadow: inset 0 0 0 1px var(--forum_accent);
}

/* Home stats */
.forum_home_stats {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin: 16px 0;
}

.forum_home_stat {
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    padding: 12px 20px;
    text-align: center;
    min-width: 80px;
}

.forum_home_num {
    display: block;
    font-size: 22px;
    font-weight: 700;
    color: var(--forum_accent);
}

/* Search */
.forum_search_form {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

.forum_search_form .forum_input {
    flex: 1;
}

.forum_search_hit {
    padding: 10px 0;
    border-bottom: 1px solid var(--forum_border);
}

.forum_search_topic_link {
    color: var(--forum_accent);
    text-decoration: none;
    font-weight: 600;
}

.forum_search_snippet {
    font-size: 13px;
    margin: 4px 0;
}

.forum_search_meta {
    font-size: 11px;
    color: var(--forum_text_muted);
}

/* Admin */
.forum_admin_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 12px;
}

.forum_admin_card {
    display: block;
    padding: 16px;
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    text-decoration: none;
    color: var(--forum_text);
    transition: border-color 0.15s;
}

.forum_admin_card:hover {
    border-color: var(--forum_admin);
}

.forum_admin_card_title {
    display: block;
    font-weight: 600;
    color: var(--forum_admin);
    margin-bottom: 6px;
}

.forum_admin_card_desc {
    display: block;
    font-size: 12px;
    color: var(--forum_text_muted);
}

.forum_admin_table .forum_input {
    font-size: 12px;
    padding: 4px 8px;
}

/* Paginated list pages (members, admin users) */
.forum_panel_inner:has(.forum_list_page) {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 0;
}

.forum_list_page {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.forum_list_toolbar {
    flex-shrink: 0;
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}

.forum_list_toolbar .forum_input {
    flex: 1;
    min-width: 140px;
}

.forum_list_scroll {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
}

.forum_list_pagination {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    margin-top: 8px;
    border-top: 1px solid var(--forum_border);
    background: var(--forum_bg);
}

.forum_pagination_info {
    font-size: 12px;
    color: var(--forum_text_muted);
    white-space: nowrap;
}

.forum_pagination_links {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
}

.forum_pagination_btn,
.forum_pagination_num {
    display: inline-block;
    padding: 4px 10px;
    font-size: 12px;
    color: var(--forum_text);
    text-decoration: none;
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    background: var(--forum_bg_elevated);
}

.forum_pagination_btn:hover,
.forum_pagination_num:hover {
    border-color: var(--forum_accent);
    color: var(--forum_accent);
}

.forum_pagination_active {
    background: var(--forum_accent);
    color: #0d1117;
    border-color: var(--forum_accent);
    font-weight: 600;
}

.forum_pagination_gap {
    padding: 0 4px;
    color: var(--forum_text_muted);
    font-size: 12px;
}

.forum_list_footer_note {
    flex-shrink: 0;
    font-size: 12px;
    padding: 8px 0 12px;
    margin: 0;
}

.forum_members_table {
    margin-bottom: 0;
}

/* Toast notification */
#forum_toast.forum_toast {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 10px 18px;
    background: var(--forum_bg_elevated);
    border: 1px solid var(--forum_border);
    border-radius: var(--forum_radius);
    color: var(--forum_text);
    font-size: 13px;
    z-index: 99999;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s;
}

#forum_toast.forum_toast.forum_toast_show {
    opacity: 1;
}

/* Loading state */
.forum_loading {
    opacity: 0.5;
    pointer-events: none;
}

@media (max-width: 900px) {
    #forum_root.forum_root {
        flex-direction: column;
    }
    #forum_left.forum_left {
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
        height: auto;
        max-height: 35%;
    }
    #forum_right.forum_right {
        width: 100%;
        flex: 1;
    }
}