/* ============================================================
   Forum THREAD SHOW — modern "community/Typeform" reading +
   nested-comment redesign.
   Scoped strictly under the `.tm-thread` marker that
   thread_show.blade.php emits. Cannot leak to other forum pages.
   Enqueued ONLY from resources/views/frontend/forum/thread_show.
   ============================================================ */

#forum-tw .tm-thread {
    --tm-type: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --tm-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
    --tm-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, monospace;

    /* light palette (default) */
    --tm-page: #f5f6f8;
    --tm-surface: #ffffff;
    --tm-surface-2: #f8f9fb;
    --tm-surface-3: #eef0f4;
    --tm-ink: #16181c;
    --tm-body: #3a3d45;
    --tm-muted: #6d7180;
    --tm-faint: #9ba0ab;
    --tm-line: #e6e8ee;
    --tm-line-2: #d8dbe3;
    --tm-accent: #5b47e8;
    --tm-accent-2: #4a38d6;
    --tm-accent-ink: #ffffff;
    --tm-accent-soft: #eef0ff;
    --tm-accent-softer: #f6f7ff;
    --tm-good: #16a34a;
    --tm-good-soft: #e7f6ec;
    --tm-warn: #d97706;
    --tm-warn-soft: #fdf0dd;
    --tm-bad: #dc4136;
    --tm-bad-soft: #fdecea;
    --tm-thread: #dcdce6;
    --tm-hi: rgba(72, 55, 216, .10);

    --tm-border-radius: 14px;
    --tm-border-radius-sm: 9px;
    --tm-shadow: 0 1px 2px rgba(16, 24, 40, .03), 0 12px 30px -18px rgba(16, 24, 40, .12);
    --tm-shadow-pop: 0 14px 34px -12px rgba(16, 24, 40, .24);
}

html.dark-theme #forum-tw .tm-thread {
    --tm-page: #0f1115;
    --tm-surface: #181b21;
    --tm-surface-2: #1d2129;
    --tm-surface-3: #262b35;
    --tm-ink: #eceff5;
    --tm-body: #c7cbd6;
    --tm-muted: #969eaf;
    --tm-faint: #6b7383;
    --tm-line: #2a2f3a;
    --tm-line-2: #384050;
    --tm-accent: #8b7bff;
    --tm-accent-2: #6f5df2;
    --tm-accent-ink: #ffffff;
    --tm-accent-soft: rgba(124, 107, 255, .16);
    --tm-accent-softer: rgba(124, 107, 255, .07);
    --tm-good: #2fd071;
    --tm-good-soft: rgba(47, 208, 113, .14);
    --tm-warn: #f5a742;
    --tm-warn-soft: rgba(245, 167, 66, .14);
    --tm-bad: #ff6b5e;
    --tm-bad-soft: rgba(255, 107, 94, .14);
    --tm-thread: #3a3f4d;
    --tm-hi: rgba(139, 123, 255, .14);

    --tm-shadow: inset 0 0 0 1px rgba(255, 255, 255, .02), 0 12px 30px -18px rgba(0, 0, 0, .6);
    --tm-shadow-pop: 0 16px 40px -12px rgba(0, 0, 0, .7);
}

/* ------- reading canvas that visually merges with the theme ------- */
#forum-tw .tm-thread {
    font-family: var(--tm-type);
    color: var(--tm-body);
}
#forum-tw .tm-thread *,
#forum-tw .tm-thread *::before,
#forum-tw .tm-thread *::after { box-sizing: border-box; }

#forum-tw .tm-thread .container { max-width: none; }

/* Redesign the old strong-coloured chip chrome used on other forum pages
   but reused here purely to carry shared controls (love, report, vote…). */
#forum-tw .tm-thread .forum-civis-block {
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    overflow: visible;
}
#forum-tw .tm-thread .forum-civis-btn,
#forum-tw .tm-thread .forum-btn {
    border-radius: 999px;
}
#forum-tw .tm-thread .forum-civis-btn {
    border: 1px solid var(--tm-line);
    background: var(--tm-surface);
    color: var(--tm-muted);
    box-shadow: none;
}
#forum-tw .tm-thread .forum-civis-btn:hover {
    background: var(--tm-surface-2);
    color: var(--tm-ink);
    border-color: var(--tm-line-2);
}
#forum-tw .tm-thread .forum-civis-btn.forum-civis-btn--ghost {
    background: var(--tm-surface);
    color: var(--tm-muted);
    border-color: var(--tm-line);
}
#forum-tw .tm-thread .forum-btn:focus-visible { outline: 2px solid var(--tm-accent); outline-offset: 2px; }

#forum-tw .tm-thread .forum-civis-btn.forum-civis-btn--primary,
#forum-tw .tm-thread .forum-btn.forum-btn--primary {
    background: linear-gradient(135deg, var(--tm-accent), var(--tm-accent-2));
    border-color: transparent;
    color: #fff;
}

/* =========== 1) HERO ========================================== */
/* The topic/category eyebrow + large title + author meta row */
#forum-tw .tm-thread .tm-hero {
    position: relative;
    padding: .25rem .25rem 2.1rem;
}
#forum-tw .tm-thread .tm-hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .34rem .7rem;
    border-radius: 999px;
    background: var(--tm-accent-soft);
    color: var(--tm-accent-2);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-decoration: none;
}
#forum-tw .tm-thread .tm-hero__eyebrow:hover { background: var(--tm-accent-softer); color: var(--tm-accent); }
#forum-tw .tm-thread .tm-hero__title {
    margin: .8rem 0 .7rem;
    font-family: var(--tm-serif);
    font-size: clamp(1.55rem, 2.6vw, 2.1rem);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -.018em;
    color: var(--tm-ink);
    max-width: 20ch;
}

/* author meta row under headline */
#forum-tw .tm-thread .tm-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem 1rem;
    color: var(--tm-muted);
    font-size: .82rem;
}
#forum-tw .tm-thread .tm-meta-row__chip {
    display: inline-flex;
    align-items: center;
    gap: .32rem;
}
#forum-tw .tm-thread .tm-meta-row .bi { opacity: .8; }

/* Flag pills (pinned/locked/solved) */
#forum-tw .tm-thread .tm-flag {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    padding: .16rem .5rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .01em;
    vertical-align: middle;
}
#forum-tw .tm-thread .tm-flag--pin { background: var(--tm-accent-soft); color: var(--tm-accent-2); }
#forum-tw .tm-thread .tm-flag--lock { background: var(--tm-surface-3); color: var(--tm-muted); }
#forum-tw .tm-thread .tm-flag--solved { background: var(--tm-good-soft); color: var(--tm-good); }

/* tone down the legacy thread-stats/headline meta that is not redesigned */
#forum-tw .tm-thread .forum-civis-thread-meta { opacity: .92; }

#forum-tw .tm-thread .tm-main {
    width: 100%;
    max-width: 46rem;             /* ~736px settled content column */
    margin-inline: auto;
}
#forum-tw .tm-thread .tm-main .reading-space-x { width: 100%; }

/* =========== 3) OP / CONTENT CARD ============================== */
/* The legacy two-column `.forum-civis-post` shell is reused here but only
   neutralised *inside* `.tm-thread` so other forum pages keep the old style. */
#forum-tw .tm-thread article.forum-civis-post,
#forum-tw .tm-thread .forum-civis-post {
    display: block;
    background: transparent;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    padding: 0;
    grid-template-columns: none;
}
#forum-tw .tm-thread .forum-civis-post__user { display: none; }
#forum-tw .tm-thread .forum-civis-post__head {
    background: transparent;
    border: 0;
    padding: 0 0 .5rem;
    color: var(--tm-faint);
}
#forum-tw .tm-thread .forum-civis-post__content {
    padding: 0;
    font-size: 1.06rem;
    color: var(--tm-body);
}
#forum-tw .tm-thread .forum-civis-post__media {
    margin: 1rem 0;
    border: 1px solid var(--tm-line);
    border-radius: 12px;
}
#forum-tw .tm-thread .forum-civis-post__tags {
    padding: 0;
    margin-top: 1.2rem;
}
#forum-tw .tm-thread .forum-civis-post__tag {
    background: var(--tm-surface-2);
    border: 1px solid var(--tm-line);
    color: var(--tm-muted);
    border-radius: 999px;
}
#forum-tw .tm-thread .forum-civis-post__tag:hover { color: var(--tm-accent-2); border-color: var(--tm-accent); }
#forum-tw .tm-thread .forum-civis-post__foot {
    background: transparent;
    border: 0;
    padding: .9rem 0 0;
}
#forum-tw .tm-thread .forum-civis-badge-op { display: none; }
/* The author identity that the grid used to place in a side rail is now shown
   cleanly in the hero block via `.tm-op-author`. */
#forum-tw .tm-thread .tm-op-author {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-top: .35rem;
}

/* tone down the old two-column thread-STATS tiles reused only in OP */
#forum-tw .tm-thread .tm-prose,
#forum-tw .tm-thread .forum-civis-post__content { font-family: var(--tm-serif); line-height: 1.72; }
#forum-tw .tm-thread article.tm-op-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    display: block;
    padding: 0;
}
#forum-tw .tm-thread .tm-op-card__headline {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding-bottom: 1.05rem;
    border-bottom: 1px solid var(--tm-line);
    margin-bottom: 1.15rem;
}
#forum-tw .tm-thread .tm-avatar-core {
    position: relative;
    flex-shrink: 0;
}
#forum-tw .tm-thread .tm-avatar {
    display: block;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--tm-surface-3);
    border: 2px solid var(--tm-surface);
    box-shadow: 0 0 0 1px var(--tm-line-2), var(--tm-shadow-card);
}
#forum-tw .tm-thread .tm-avatar-core--sm .tm-avatar { width: 38px; height: 38px; }
#forum-tw .tm-thread .tm-avatar-core--xs .tm-avatar { width: 30px; height: 30px; }
#forum-tw .tm-thread .tm-avatar-core .tm-avatar-badge {
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--tm-surface);
    border: 2px solid var(--tm-surface);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#forum-tw .tm-thread .tm-avatar-core .tm-avatar-badge i { font-size: .62rem; color: var(--tm-good); }

#forum-tw .tm-thread .tm-identity { min-width: 0; }
#forum-tw .tm-thread .tm-identity__name { font-size: 1rem; font-weight: 700; color: var(--tm-ink); line-height: 1.3; }
#forum-tw .tm-thread .tm-identity__name a { color: inherit; text-decoration: none; }
#forum-tw .tm-thread .tm-identity__name a:hover { color: var(--tm-accent); }

#forum-tw .tm-thread .tm-role-chip {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    padding: .08rem .42rem;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 700;
    vertical-align: middle;
    line-height: 1.4;
}

#forum-tw .tm-thread .tm-identity__meta {
    margin-top: .1rem;
    font-size: .76rem;
    color: var(--tm-faint);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
}
#forum-tw .tm-thread .tm-identity__meta a { color: inherit; text-decoration: none; }
#forum-tw .tm-thread .tm-meta-sep { opacity: .6; }

/* OP prose */
#forum-tw .tm-thread .tm-prose {
    font-family: var(--tm-serif);
    font-size: 1.03rem;
    line-height: 1.72;
    color: var(--tm-body);
}
#forum-tw .tm-thread .tm-prose p { margin: 0 0 1.05em; }
#forum-tw .tm-thread .tm-prose h1,
#forum-tw .tm-thread .tm-prose h2,
#forum-tw .tm-thread .tm-prose h3 { font-family: var(--tm-type); color: var(--tm-ink); letter-spacing: -.01em; }
#forum-tw .tm-thread .tm-prose h1 { font-size: 1.55rem; margin: 1.3em 0 .5em; line-height: 1.2; }
#forum-tw .tm-thread .tm-prose h2 { font-size: 1.3rem; margin: 1.35em 0 .45em; line-height: 1.25; }
#forum-tw .tm-thread .tm-prose h3 { font-size: 1.1rem; margin: 1.3em 0 .4em; }
#forum-tw .tm-thread .tm-prose ul,
#forum-tw .tm-thread .tm-prose ol { margin: 0 0 1.05em; padding-inline-start: 1.25em; }
#forum-tw .tm-thread .tm-prose li { margin: .25em 0; }
#forum-tw .tm-thread .tm-prose blockquote,
#forum-tw .tm-thread .tm-comment-body blockquote {
    margin: 1.1em 0;
    padding: .35em .9em;
    border-inline-start: 3px solid var(--tm-accent);
    background: var(--tm-accent-softer);
    border-radius: 0 8px 8px 0;
    color: var(--tm-body);
}
#forum-tw .tm-thread .tm-prose a,
#forum-tw .tm-thread .tm-comment-body a { color: var(--tm-accent-2); text-decoration: underline; text-underline-offset: 2px; }
html.dark-theme #forum-tw .tm-thread .tm-prose a,
html.dark-theme #forum-tw .tm-thread .tm-comment-body a { color: var(--tm-accent); }
#forum-tw .tm-thread .tm-prose img,
#forum-tw .tm-thread .tm-comment-body img { border-radius: 12px; margin: .4em 0; }
#forum-tw .tm-thread .tm-prose pre,
#forum-tw .tm-thread .tm-comment-body pre {
    background: var(--tm-surface-3);
    color: var(--tm-ink);
    padding: .8em 1em;
    border-radius: 10px;
    font-family: var(--tm-mono);
    font-size: .85em;
    overflow: auto;
}
#forum-tw .tm-thread .tm-prose code,
#forum-tw .tm-thread .tm-comment-body code { font-family: var(--tm-mono); background: var(--tm-surface-3); padding: .12em .3em; border-radius: 5px; font-size: .86em; }
#forum-tw .tm-thread .tm-prose hr { border: 0; border-top: 1px solid var(--tm-line); margin: 1.5em 0; }

/* media */
#forum-tw .tm-thread .tm-media {
    margin: 1rem 0;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--tm-line);
    background: var(--tm-surface);
}
#forum-tw .tm-thread .tm-media img, #forum-tw .tm-thread .tm-media video, #forum-tw .tm-thread .tm-media audio { width: 100%; display: block; }

/* tags */
#forum-tw .tm-thread .tm-tags { margin-top: 1.2rem; display: flex; flex-wrap: wrap; gap: .35rem; }
#forum-tw .tm-thread .tm-tag {
    font-size: .72rem;
    font-weight: 600;
    color: var(--tm-muted);
    background: var(--tm-surface-2);
    border: 1px solid var(--tm-line);
    padding: .2rem .6rem;
    border-radius: 999px;
    text-decoration: none;
}
#forum-tw .tm-thread .tm-tag:hover { border-color: var(--tm-accent); color: var(--tm-accent-2); }

/* reaction toolbar under body */
#forum-tw .tm-thread .tm-op-actions,
#forum-tw .tm-thread .tm-comment-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
    margin-top: 1.15rem;
    padding-top: .9rem;
    border-top: 1px solid var(--tm-line);
}
#forum-tw .tm-thread .tm-op-actions { margin-top: 1.5rem; }

/* action micro-buttons (love / reply / bookmark / flags) */
#forum-tw .tm-thread .tm-act {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .42rem .8rem;
    font-size: .78rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid var(--tm-line);
    background: var(--tm-surface);
    color: var(--tm-muted);
    cursor: pointer;
    text-decoration: none;
    transition: background .14s, color .14s, border-color .14s, transform .1s;
    line-height: 1;
}
#forum-tw .tm-thread .tm-act:hover { background: var(--tm-surface-2); color: var(--tm-ink); border-color: var(--tm-line-2); }
#forum-tw .tm-thread .tm-act:active { transform: translateY(1px); }
#forum-tw .tm-thread a.tm-act { text-decoration: none !important; }
#forum-tw .tm-thread .tm-act--neutral:disabled,
#forum-tw .tm-thread .tm-act.tm-act--readonly { opacity: .6; cursor: default; }
#forum-tw .tm-thread .tm-act--love:hover { color: var(--tm-bad); border-color: rgba(220, 65, 54, .35); }
#forum-tw .tm-thread .tm-act.is-loved { color: var(--tm-bad); border-color: rgba(220, 65, 54, .35); background: var(--tm-bad-soft); }
#forum-tw .tm-thread .tm-act--primary {
    background: linear-gradient(135deg, var(--tm-accent), var(--tm-accent-2));
    color: #fff;
    border-color: transparent;
}
#forum-tw .tm-thread .tm-act--primary:hover { color: #fff; opacity: .96; }
#forum-tw .tm-thread .tm-act.is-bm .bi { color: var(--tm-warn); }

/* ------- legacy control pill re-skin used under new page ------- */
#forum-tw .tm-thread .forum-civis-btn { background: var(--tm-surface); color: var(--tm-muted); border-color: var(--tm-line); border-radius: 999px; box-shadow: none; font-weight: 600; }
#forum-tw .tm-thread .forum-civis-btn.forum-civis-btn--ghost { background: var(--tm-surface); color: var(--tm-muted); border-color: var(--tm-line); }
#forum-tw .tm-thread .forum-civis-btn:hover,
#forum-tw .tm-thread .forum-btn.forum-btn--ghost:hover { color: var(--tm-ink); border-color: var(--tm-line-2); }
#forum-tw .tm-thread .forum-civis-btn.forum-civis-btn--primary { background: linear-gradient(135deg, var(--tm-accent), var(--tm-accent-2)); border-color: transparent; color: #fff; }
#forum-tw .tm-thread .forum-btn--ghost { background: transparent; }
#forum-tw .tm-thread .forum-vote { background: transparent; border-color: var(--tm-line); color: var(--tm-faint); }
#forum-tw .tm-thread .forum-vote-score { color: var(--tm-muted); }
#forum-tw .tm-thread .forum-vote button { color: var(--tm-faint); }
#forum-tw .tm-thread .forum-vote button:hover { color: var(--tm-accent); background: var(--tm-accent-soft); }

/* =========== 4) COMMENT FILTER CHIPS ======================== */
#forum-tw .tm-thread .tm-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
    padding-block: .9rem 1rem;
}
#forum-tw .tm-thread .tm-chips__label {
    font-size: .78rem;
    font-weight: 700;
    color: var(--tm-ink);
    margin-inline-end: .15rem;
    letter-spacing: -.01em;
}
#forum-tw .tm-thread .tm-chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .34rem .78rem;
    font-size: .76rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid var(--tm-line);
    background: var(--tm-surface);
    color: var(--tm-muted);
    cursor: pointer;
    transition: all .13s;
    line-height: 1;
}
#forum-tw .tm-thread .tm-chip:hover { border-color: var(--tm-line-2); color: var(--tm-ink); }
#forum-tw .tm-thread .tm-chip .tm-chip__count {
    font-size: .64rem;
    font-weight: 700;
    padding: .04rem .42rem;
    border-radius: 999px;
    background: var(--tm-surface-3);
    color: var(--tm-faint);
    line-height: 1.4;
}
#forum-tw .tm-thread .tm-chip.is-active {
    background: linear-gradient(135deg, var(--tm-accent), var(--tm-accent-2));
    border-color: transparent;
    color: #fff;
}
#forum-tw .tm-thread .tm-chip.is-active .tm-chip__count { background: rgba(255, 255, 255, .22); color: #fff; }

/* =========== 5) COMMENT CARD / CONVERSATION ================= */
#forum-tw .tm-thread .tm-comments {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .7rem;
}
#forum-tw .tm-thread .tm-comment {
    border-radius: var(--tm-border-radius);
    background: var(--tm-surface);
    border: 1px solid var(--tm-line);
    box-shadow: var(--tm-shadow);
    overflow: visible;
}
#forum-tw .tm-thread .tm-comment.is-highlighted { border-color: var(--tm-accent); }
#forum-tw .tm-thread .tm-comment.is-deleted {
    opacity: .85;
    background: var(--tm-surface-2);
    border-style: dashed;
}
#forum-tw .tm-thread .tm-comment__inner { padding: .95rem 1.05rem 1.05rem; }

/* author strip inside each comment */
#forum-tw .tm-thread .tm-comment__author {
    display: flex;
    align-items: center;
    gap: .7rem;
}
#forum-tw .tm-thread .tm-comment__author .tm-avatar-core--sm .tm-avatar-badge { width: 16px; height: 16px; right: -2px; bottom: -2px; border-width: 2px; }
#forum-tw .tm-thread .tm-comment__idbox { min-width: 0; flex: 1 1 auto; }

#forum-tw .tm-thread .tm-name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .3rem .35rem;
    font-size: .88rem;
    font-weight: 700;
    color: var(--tm-ink);
    line-height: 1.3;
}
#forum-tw .tm-thread .tm-name a { color: inherit; text-decoration: none; }
#forum-tw .tm-thread .tm-name a:hover { color: var(--tm-accent); }

#forum-tw .tm-thread .tm-time {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .745rem;
    color: var(--tm-faint);
}
#forum-tw .tm-thread .tm-author-tag {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-size: .62rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--tm-accent-2);
    background: var(--tm-accent-soft);
    padding: .1rem .45rem;
    border-radius: 999px;
}
html.dark-theme #forum-tw .tm-thread .tm-author-tag { color: var(--tm-accent); }

/* solution banner */
#forum-tw .tm-thread .tm-sol {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .64rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--tm-good);
    background: var(--tm-good-soft);
    padding: .12rem .5rem;
    border-radius: 999px;
}
#forum-tw .tm-thread .tm-sol--banner {
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: .2rem 0 .75rem;
    padding: .5rem .8rem;
    border-radius: 10px;
    background: var(--tm-good-soft);
    color: var(--tm-good);
    font-size: .72rem;
    font-weight: 700;
}

/* message body */
#forum-tw .tm-thread .tm-comment-body {
    margin-top: .6rem;
    font-family: var(--tm-serif);
    font-size: .95rem;
    line-height: 1.66;
    color: var(--tm-body);
    overflow-wrap: anywhere;
}
#forum-tw .tm-thread .tm-comment--md .tm-comment-body { font-size: .985rem; }
#forum-tw .tm-thread .tm-comment-body p { margin: 0 0 .7em; }
#forum-tw .tm-thread .tm-comment-body > :last-child { margin-bottom: 0; }

/* inline edit box reuse legacy textarea look */
#forum-tw .tm-thread .tm-comment-body textarea {
    width: 100%;
    border: 1px solid var(--tm-line-2);
    border-radius: 10px;
    padding: .6rem .7rem;
    background: var(--tm-surface-2);
    color: var(--tm-body);
    font-family: var(--tm-type);
    font-size: .85rem;
    resize: vertical;
}
#forum-tw .tm-thread .tm-comment-body textarea:focus { outline: 2px solid var(--tm-accent); outline-offset: 1px; }

/* 6) nested thread line */
#forum-tw .tm-thread .tm-replies {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    padding-inline-start: 1.25rem;
    padding-bottom: .85rem;
    margin-top: .4rem;
}
#forum-tw .tm-thread .tm-replies::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0.0px;
    width: 0;
    border-inline-start: 2px solid var(--tm-thread);
    border-radius: 1px;
    top: 10px;
    bottom: 22px;
    left: 2px;
    right: auto;
}
[dir="rtl"] #forum-tw .tm-thread .tm-replies::before,
#forum-tw .tm-thread[dir="rtl"] .tm-replies::before { left: auto; right: 2px; }

#forum-tw .tm-thread .tm-reply {
    border-radius: var(--tm-border-radius-sm);
    background: var(--tm-surface-2);
    border: 1px solid var(--tm-line);
    padding: .7rem .85rem .8rem;
}
#forum-tw .tm-thread .tm-reply.is-deleted { border-style: dashed; opacity: .8; }
#forum-tw .tm-thread .tm-reply__topline {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .3rem;
}
#forum-tw .tm-thread .tm-reply__autorow { min-width: 0; flex: 1; }

/* load more / empty / loading states */
#forum-tw .tm-thread .tm-comments { list-style: none; }
#forum-tw .tm-thread .forum-civis-posts-stack.tm-comments > * + * { margin-top: 0; }
#forum-tw .tm-thread .tm-comments-empty {
    display: none;
    text-align: center;
    color: var(--tm-faint);
    padding: 2.4rem 1rem;
    border: 1px dashed var(--tm-line-2);
    border-radius: var(--tm-border-radius);
    background: var(--tm-surface-2);
    font-size: .9rem;
}
#forum-tw .tm-thread .tm-comments-empty:not(.hidden) { display: block; }
#forum-tw .tm-thread .np-reading-toolbar { margin-inline: auto; }
#forum-tw .tm-thread .tm-morewrap { text-align: center; padding: 1.5rem 0 .1rem; }
#forum-tw .tm-thread .forum-civis-replies-head {
    border-bottom: 0;
    margin: 0;
    padding: 0;
    color: var(--tm-ink);
    font-size: 1.05rem;
}
#forum-tw .tm-thread .tm-empty {
    text-align: center;
    color: var(--tm-faint);
    padding: 2.4rem 1rem;
    border: 1px dashed var(--tm-line-2);
    border-radius: var(--tm-border-radius);
    background: var(--tm-surface-2);
    font-size: .9rem;
}

/* =========== 7) REPLY COMPOSER (sticky within column) ======= */
#forum-tw .tm-thread .tm-composer-anchor {
    margin-top: 1.25rem;
    scroll-margin-top: 6.5rem;
}
#forum-tw .tm-thread .tm-composer {
    border-radius: var(--tm-border-radius);
    background: var(--tm-surface);
    border: 1px solid var(--tm-line);
    box-shadow: var(--tm-shadow);
    overflow: hidden;
}
/* when column has room below rail it becomes sticky bottom bar */
@media (min-width: 1024px) {
    #forum-tw .tm-thread .tm-composer--sticky { position: sticky; bottom: 1rem; }
}
#forum-tw .tm-thread .tm-composer__row {
    display: flex;
    gap: .7rem;
    padding: .9rem 1rem;
}
#forum-tw .tm-thread .tm-composer__inputbox { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .5rem; }
#forum-tw .tm-thread .tm-composer textarea {
    width: 100%;
    min-height: 74px;
    border: 1px solid transparent;
    border-radius: 12px;
    background: var(--tm-surface-2);
    color: var(--tm-body);
    padding: .65rem .8rem;
    font-family: var(--tm-type);
    font-size: .9rem;
    line-height: 1.5;
    resize: vertical;
    transition: border-color .15s, background .15s;
}
#forum-tw .tm-thread .tm-composer textarea:focus {
    outline: none;
    border-color: var(--tm-accent);
    background: var(--tm-surface);
    box-shadow: 0 0 0 3px var(--tm-hi);
}
#forum-tw .tm-thread .tm-composer__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
}
#forum-tw .tm-thread .tm-composer__tools { display: flex; align-items: center; gap: .3rem; }
#forum-tw .tm-thread .tm-composer__cta {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .5rem 1rem;
    border-radius: 999px;
    font-weight: 700;
    font-size: .8rem;
    background: linear-gradient(135deg, var(--tm-accent), var(--tm-accent-2));
    color: #fff;
    border: 0;
    cursor: pointer;
}
#forum-tw .tm-thread .tm-composer__cta:disabled { opacity: .55; cursor: not-allowed; }

#forum-tw .tm-thread .forum-reply-focus-bar {
    margin: 0 0 .55rem;
    background: var(--tm-accent-soft);
    border-color: transparent;
    color: var(--tm-accent-2);
    border-radius: 10px;
}
html.dark-theme #forum-tw .tm-thread .forum-reply-focus-bar { color: var(--tm-accent); }
#forum-tw .tm-thread .forum-reply-focus-bar__close { color: currentColor; }
#forum-tw .tm-thread .forum-reply-focus-bar__close:hover { background: var(--tm-accent-softer); }

/* guest prompt */
#forum-tw .tm-thread .tm-lock-guest {
    text-align: center;
    padding: 1.6rem 1rem;
    color: var(--tm-muted);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .7rem;
}
#forum-tw .tm-thread .tm-lock-note {
    display: flex; align-items: center; justify-content: center; gap: .5rem;
    padding: .8rem 1rem;
    color: var(--tm-warn);
    font-weight: 600; font-size: .86rem;
}

/* =========== 8) AUTHOR MINI POPOVER ========================= */
#forum-tw .tm-pop {
    position: fixed;
    z-index: 1060;
    width: min(300px, calc(100vw - 28px));
    background: var(--tm-surface);
    color: var(--tm-body);
    border: 1px solid var(--tm-line);
    border-radius: 14px;
    box-shadow: var(--tm-shadow-pop), 0 0 0 4px var(--tm-accent-softer);
    padding: .8rem;
    opacity: 0;
    transform: translateY(5px);
    pointer-events: none;
    transition: opacity .13s ease, transform .13s ease;
}
#forum-tw .tm-pop.is-open { opacity: 1; transform: translateY(0); }
html.dark-theme #forum-tw .tm-pop { box-shadow: 0 6px 5px -4px rgba(0,0,0,.4), var(--tm-shadow-pop); }
#forum-tw .tm-pop__head { display: flex; align-items: center; gap: .7rem; }
#forum-tw .tm-pop__avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; background: var(--tm-surface-3); }
#forum-tw .tm-pop__handle { font-family: var(--tm-mono); font-size: .74rem; color: var(--tm-faint); }
#forum-tw .tm-pop__role {
    display: inline-flex; align-items: center; gap: .22rem;
    font-size: .66rem; font-weight: 700; margin-top: .2rem;
    padding: .04rem .4rem; border-radius: 999px;
}
#forum-tw .tm-pop__divider { border: 0; border-top: 1px solid var(--tm-line); margin: .6rem 0; }
#forum-tw .tm-pop__stats { display: flex; gap: .55rem; align-items: stretch; }
#forum-tw .tm-pop__stat {
    flex: 1;
    background: var(--tm-surface-2);
    border-radius: 10px;
    padding: .45rem .3rem;
    text-align: center;
}
#forum-tw .tm-pop__stat b { display: block; font-size: .9rem; color: var(--tm-ink); line-height: 1.1; }
#forum-tw .tm-pop__stat span { font-size: .6rem; color: var(--tm-faint); text-transform: uppercase; letter-spacing: .04em; }
#forum-tw .tm-pop__bio {
    margin: .6rem 0 0;
    font-size: .78rem;
    line-height: 1.5;
    color: var(--tm-muted);
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
#forum-tw .tm-pop__cta {
    display: block;
    margin-top: .6rem;
    text-align: center;
    padding: .5rem;
    border-radius: 999px;
    background: var(--tm-accent);
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}
#forum-tw .tm-pop__cta:hover { filter: brightness(1.05); color: #fff; }

/* =========== 9) AXES THAT MUST STAY PREDICTABLE ============== */
#forum-tw .tm-thread .forum-civis-compose {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: hidden;
}
#forum-tw .tm-thread .forum-civis-compose__head,
#forum-tw .tm-thread .forum-civis-compose__body { background: transparent; border: 0; padding: 0; }

/* small helpers added by the modern partials */
#forum-tw .tm-thread .tm-idbox-actions {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-shrink: 0;
}
#forum-tw .tm-thread .forum-civis-post__head-left {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .3rem .45rem;
}
#forum-tw .tm-thread .tm-comment.is-solution { border-color: var(--tm-good); }
#forum-tw .tm-thread .tm-sol-active { color: var(--tm-good); border-color: var(--tm-good); background: var(--tm-good-soft); }
#forum-tw .tm-thread .forum-btn--ghost { color: var(--tm-muted); }
#forum-tw .tm-thread .forum-btn--ghost:hover { color: var(--tm-ink); }
#forum-tw .tm-thread .is-bm .bi { color: var(--tm-warn); }

#forum-tw .tm-thread .forum-civis-panel { background: var(--tm-surface); border-color: var(--tm-line); box-shadow: var(--tm-shadow); border-radius: var(--tm-border-radius); }
#forum-tw .tm-thread .np-reader-chrome { justify-content: center; }

/* RTL safety */
#forum-tw .tm-thread { direction: inherit; }

/* Compose area refinements for the new markup used by thread_show */
#forum-tw .tm-thread #reply-form-block { position: relative; }
#forum-tw .tm-thread #reply-form-block .forum-reply-toolbar { justify-content: flex-start; min-height: 0; margin-top: .65rem; }
#forum-tw .tm-thread #reply-form-block .forum-reply-toolbar__actions { gap: .4rem; }
#forum-tw .tm-thread #reply-form-block .tm-act {
    width: 2.1rem; height: 2.1rem; padding: 0;
    justify-content: center;
    background: var(--tm-surface-2);
    color: var(--tm-muted);
    border-color: var(--tm-line);
}
#forum-tw .tm-thread #reply-form-block .tm-act:hover { color: var(--tm-accent-2); border-color: var(--tm-accent); box-shadow: none; }
#forum-tw .tm-thread #reply-form-block .tm-composer__notice-slot:empty { display: none; }
#forum-tw .tm-thread #reply-form-block .tm-composer__notice-slot { margin-top: .5rem; }
#forum-tw .tm-thread #reply-form-block .emoji-picker { --background: var(--tm-surface); }
#forum-tw .tm-thread #emojiPickerContainer { top: auto; }


/* respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    #forum-tw .tm-pop { transition: none; }
    #forum-tw .tm-thread .tm-comment { scroll-margin-top: 7rem; }
}

/* mobile tap sizes fine-tune for modern buttons only */
@media (max-width: 575.98px) {
    #forum-tw .tm-thread .tm-act { min-height: 40px; }
    #forum-tw .tm-thread .tm-comment__inner { padding: .8rem; }
    #forum-tw .tm-thread .tm-hero__title { font-size: 1.6rem; }
}