/* ==========================================================================
   wpForo alignment overrides — presentation only
   Loaded ONLY on the wpForo page (/community/, see functions.php enqueue at
   priority 20, after wpForo's own stylesheet). Aligns wpForo tables,
   colours, buttons and search with the ki-* design tokens. No wpForo
   markup, templates, tables or behaviour are modified. Badges/authorship
   injection is intentionally NOT attempted here (CSS-only cannot add
   badges honestly) — the house /forum/ landing covers disclosure.
   ========================================================================== */

/* ---- Font + text colour baseline --------------------------------------- */
#wpforo,
#wpforo #wpforo-wrap,
#wpforo #wpforo-wrap .wpf-table,
#wpforo #wpforo-wrap input,
#wpforo #wpforo-wrap select,
#wpforo #wpforo-wrap textarea,
#wpforo #wpforo-wrap button {
    font-family: var(--ki-font-family, system-ui, -apple-system, "Segoe UI", sans-serif);
    color: var(--ki-ink, #0f172a);
}

#wpforo #wpforo-wrap {
    font-size: var(--ki-font-size-body, 1rem);
    line-height: var(--ki-line-height-body, 1.6);
}

#wpforo #wpforo-wrap a {
    color: var(--ki-sky, #075985);
}

#wpforo #wpforo-wrap a:hover {
    color: var(--ki-teal, #0f766e);
}

/* ---- Cards: forum rows, topic rows, posts, profile ---------------------- */
#wpforo #wpforo-wrap .wpforo-forum,
#wpforo #wpforo-wrap .wpforo-topic,
#wpforo #wpforo-wrap .wpforo-post,
#wpforo #wpforo-wrap .wpforo-profile,
#wpforo #wpforo-wrap .wpforo-profile .wpforo-profile-head {
    border-radius: var(--ki-radius, 12px);
    border-color: var(--ki-line, #e2e8f0);
}

#wpforo #wpforo-wrap .wpforo-forum-title,
#wpforo #wpforo-wrap .wpforo-forum-title a,
#wpforo #wpforo-wrap .wpforo-topic-title,
#wpforo #wpforo-wrap .wpforo-topic-title a {
    color: var(--ki-ink, #0f172a);
    line-height: var(--ki-line-height-heading, 1.25);
}

#wpforo #wpforo-wrap .wpforo-forum-title a:hover,
#wpforo #wpforo-wrap .wpforo-topic-title a:hover {
    color: var(--ki-teal, #0f766e);
}

/* ---- Buttons ------------------------------------------------------------ */
#wpforo #wpforo-wrap .wpf-button,
#wpforo #wpforo-wrap .wpf-button-secondary,
#wpforo #wpforo-wrap .wpf-action-link {
    border-radius: 999px;
    font-family: inherit;
    font-weight: 600;
}

#wpforo #wpforo-wrap .wpf-button:not(.wpf-button-secondary) {
    background: var(--ki-teal, #0f766e);
    border-color: var(--ki-teal, #0f766e);
    color: var(--ki-white, #fff);
}

#wpforo #wpforo-wrap .wpf-button:not(.wpf-button-secondary):hover {
    background: var(--ki-teal-hover, #115e59);
    border-color: var(--ki-teal-hover, #115e59);
    color: var(--ki-white, #fff);
}

#wpforo #wpforo-wrap .wpf-button:focus-visible,
#wpforo #wpforo-wrap .wpf-button-secondary:focus-visible,
#wpforo #wpforo-wrap a:focus-visible,
#wpforo #wpforo-wrap input:focus-visible,
#wpforo #wpforo-wrap button:focus-visible {
    outline: 2.5px solid var(--ki-gold, #d97706);
    outline-offset: 2px;
}

/* ---- Search field --------------------------------------------------------- */
#wpforo #wpforo-wrap .wpf-search .wpf-search-field,
#wpforo #wpforo-wrap .wpf-search-form input[type="text"] {
    border: 1px solid var(--ki-line, #e2e8f0);
    border-radius: 999px;
    padding: .55rem 1.1rem;
    font: inherit;
    background: var(--ki-white, #fff);
}

#wpforo #wpforo-wrap .wpf-search .wpf-search-field:focus {
    border-color: var(--ki-teal, #0f766e);
    box-shadow: var(--ki-focus-ring, 0 0 0 3px rgba(14, 116, 144, .35));
    outline: none;
}

/* ---- Layout container: never wider than the viewport ---------------------- */
#wpforo,
#wpforo #wpforo-wrap {
    max-width: 100%;
    box-sizing: border-box;
}

/* ---- House trust card rendered inside the wpForo profile head --------------- */
#wpforo #wpforo-wrap .wpf-profile-head-right .ki-profile-trust {
    max-width: 280px;
    display: inline-block;
}

@media (max-width: 640px) {
    #wpforo #wpforo-wrap .wpf-profile-head-right .ki-profile-trust {
        max-width: 100%;
    }
}

/* ---- Mobile ≤640px: collapse the "last post" column, stop horizontal scroll -- */
@media (max-width: 640px) {
    /* "ล่าสุด" column of the board list — timestamp/avatar rows wrap badly on phones */
    #wpforo #wpforo-wrap .wpforo-forum-topic-toggle,
    #wpforo #wpforo-wrap [class^="wpforo-last-topics-"],
    #wpforo #wpforo-wrap .wpforo-last-topics-list {
        display: none !important;
    }

    /* wide structural rows scroll inside themselves instead of breaking the page */
    #wpforo #wpforo-wrap .wpf-table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #wpforo #wpforo-wrap .wpforo-post,
    #wpforo #wpforo-wrap .wpforo-topic,
    #wpforo #wpforo-wrap .wpforo-forum {
        min-width: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    #wpforo #wpforo-wrap a,
    #wpforo #wpforo-wrap .wpf-button {
        transition: none;
    }
}