/* modou dsp — bbPress forums.
   Loaded only on bbPress screens (inc/enqueue.php), and loaded *instead
   of* bbPress's own stylesheet rather than on top of it — see
   inc/bbpress.php for why.

   Because bbPress's sheet is gone, this file owns the layout as well as
   the paint. bbPress builds its tables out of nested <ul>/<li> with the
   columns implied by class name, so every table here is a grid with one
   column template shared between the header row and the body rows: the
   two cannot drift out of alignment because they are the same rule. */

.page-forums .forums-hero { padding-bottom: var(--space-lg); }
.page-forums .forums-body { padding-top: 0; }

/* bbPress nests its own wrapper divs; none of them should reintroduce
   width limits, since .section-inner already sets the measure. */
#bbpress-forums,
.bbpress-wrapper { max-width: none; }

/* ── Breadcrumb ────────────────────────────────────────────────────────
   Matched to modou_breadcrumb() in main.css so the forums do not carry a
   second breadcrumb style. */
#bbpress-forums .bbp-breadcrumb {
  margin: 0 0 var(--space-lg);
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums .bbp-breadcrumb p { margin: 0; }
#bbpress-forums .bbp-breadcrumb a { color: var(--text-muted); }
#bbpress-forums .bbp-breadcrumb a:hover { color: var(--product-accent); }
#bbpress-forums .bbp-breadcrumb-sep { padding: 0 0.4rem; color: var(--border-overlay); }

/* ── Shared table shell ────────────────────────────────────────────── */
#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-topics,
#bbpress-forums ul.bbp-replies,
#bbpress-forums ul.bbp-search-results {
  list-style: none;
  margin: 0 0 var(--space-lg);
  padding: 0;
  border: 1px solid var(--border-overlay);
  border-radius: var(--radius-card);
  background: var(--bg-charcoal);
  overflow: hidden;
}

#bbpress-forums li { margin: 0; }

/* The column headings. Set like the theme's eyebrows — these are labels,
   not content. */
#bbpress-forums li.bbp-header {
  background: color-mix(in srgb, var(--bg-obsidian) 55%, var(--bg-charcoal));
  border-bottom: 1px solid var(--border-overlay);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-faint);
}

#bbpress-forums li.bbp-footer { display: none; }

#bbpress-forums ul.bbp-forums li.bbp-body > ul,
#bbpress-forums ul.bbp-topics li.bbp-body > ul,
#bbpress-forums ul.bbp-search-results li.bbp-body > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--border-overlay);
  transition: background-color var(--duration-fast) var(--ease-out-expo);
}

#bbpress-forums li.bbp-body > ul:last-child { border-bottom: 0; }
#bbpress-forums li.bbp-body > ul:hover { background: var(--bg-charcoal-hover); }

/* bbPress alternates .even/.odd on every row. Striping on top of a hover
   state and a border is one signal too many, so it is left off — the row
   separators already do that job. */

/* ── Column templates ──────────────────────────────────────────────────
   Header and body share the grid, so a column can never be widened in one
   and not the other. Counts are fixed and narrow; freshness gets what a
   date plus a name needs; the title takes the rest. */
#bbpress-forums ul.bbp-forums li.bbp-header ul.forum-titles,
#bbpress-forums ul.bbp-forums li.bbp-body > ul,
#bbpress-forums ul.bbp-topics li.bbp-header ul.forum-titles,
#bbpress-forums ul.bbp-topics li.bbp-body > ul,
#bbpress-forums ul.bbp-search-results li.bbp-header ul.forum-titles,
#bbpress-forums ul.bbp-search-results li.bbp-body > ul {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 5.5rem 5.5rem 15rem;
  align-items: center;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
}

#bbpress-forums li.bbp-header ul.forum-titles {
  list-style: none;
  margin: 0;
}

/* Every cell, whichever table it belongs to. */
#bbpress-forums li.bbp-forum-info,
#bbpress-forums li.bbp-forum-topic-count,
#bbpress-forums li.bbp-forum-reply-count,
#bbpress-forums li.bbp-forum-freshness,
#bbpress-forums li.bbp-topic-title,
#bbpress-forums li.bbp-topic-voice-count,
#bbpress-forums li.bbp-topic-reply-count,
#bbpress-forums li.bbp-topic-freshness {
  min-width: 0;
  padding: 0;
}

#bbpress-forums li.bbp-forum-topic-count,
#bbpress-forums li.bbp-forum-reply-count,
#bbpress-forums li.bbp-topic-voice-count,
#bbpress-forums li.bbp-topic-reply-count {
  text-align: center;
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  color: var(--text-muted);
}

#bbpress-forums li.bbp-forum-freshness,
#bbpress-forums li.bbp-topic-freshness {
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums li.bbp-forum-freshness a,
#bbpress-forums li.bbp-topic-freshness a { color: var(--text-muted); }
#bbpress-forums li.bbp-forum-freshness a:hover,
#bbpress-forums li.bbp-topic-freshness a:hover { color: var(--product-accent); }

/* ── Titles ────────────────────────────────────────────────────────── */
#bbpress-forums a.bbp-forum-title,
#bbpress-forums a.bbp-topic-permalink {
  display: block;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-lg);
  letter-spacing: -0.01em;
  color: var(--text-primary);
}

#bbpress-forums a.bbp-forum-title:hover,
#bbpress-forums a.bbp-topic-permalink:hover { color: var(--product-accent); }

#bbpress-forums .bbp-forum-content,
#bbpress-forums p.bbp-topic-meta {
  margin: 0.3rem 0 0;
  font-size: var(--text-sm);
  color: var(--text-muted);
}

#bbpress-forums p.bbp-topic-meta { font-size: var(--text-xs); color: var(--text-faint); }
#bbpress-forums p.bbp-topic-meta a { color: var(--text-muted); }
#bbpress-forums p.bbp-topic-meta a:hover { color: var(--product-accent); }

/* Sub-forum list under a forum row. */
#bbpress-forums .bbp-forums-list {
  margin: 0.5rem 0 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem var(--space-sm);
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums .bbp-forums-list li { display: inline; }
#bbpress-forums .bbp-forums-list a { color: var(--text-muted); }
#bbpress-forums .bbp-forums-list a:hover { color: var(--product-accent); }

/* A pinned topic is the one thing in the list that has to out-rank the
   others, so it gets the accent rather than a background tint that would
   fight the hover state. */
#bbpress-forums li.bbp-body > ul.sticky > li.bbp-topic-title > a.bbp-topic-permalink,
#bbpress-forums li.bbp-body > ul.super-sticky > li.bbp-topic-title > a.bbp-topic-permalink {
  color: var(--product-accent);
}

#bbpress-forums li.bbp-body > ul.sticky,
#bbpress-forums li.bbp-body > ul.super-sticky {
  box-shadow: inset 2px 0 0 var(--product-accent);
}

/* ── Replies ───────────────────────────────────────────────────────────
   A different shape from the tables above: an author column beside the
   post, not a row of counts. */
#bbpress-forums ul.bbp-replies li.bbp-header,
#bbpress-forums ul.bbp-replies li.bbp-body > div.reply,
#bbpress-forums ul.bbp-replies li.bbp-body > div.topic {
  display: grid;
  grid-template-columns: 12rem minmax(0, 1fr);
  gap: var(--space-md);
  padding: var(--space-md);
}

#bbpress-forums ul.bbp-replies li.bbp-body > div {
  border-bottom: 1px solid var(--border-overlay);
}

#bbpress-forums ul.bbp-replies li.bbp-body > div:last-child { border-bottom: 0; }

#bbpress-forums div.bbp-reply-header,
#bbpress-forums div.bbp-topic-header {
  padding: var(--space-xs) var(--space-md);
  background: color-mix(in srgb, var(--bg-obsidian) 40%, transparent);
  border-bottom: 1px solid var(--border-overlay);
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums div.bbp-reply-header a,
#bbpress-forums div.bbp-topic-header a { color: var(--text-muted); }
#bbpress-forums div.bbp-reply-header a:hover,
#bbpress-forums div.bbp-topic-header a:hover { color: var(--product-accent); }

#bbpress-forums div.bbp-reply-author,
#bbpress-forums div.bbp-topic-author {
  text-align: center;
  font-size: var(--text-sm);
}

#bbpress-forums div.bbp-reply-author img.avatar,
#bbpress-forums div.bbp-topic-author img.avatar {
  display: block;
  margin: 0 auto 0.5rem;
  border-radius: 50%;
  border: 1px solid var(--border-overlay);
}

#bbpress-forums .bbp-author-name {
  display: block;
  font-weight: 600;
  color: var(--text-primary);
}

#bbpress-forums .bbp-author-role {
  display: block;
  margin-top: 0.2rem;
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-faint);
}

#bbpress-forums div.bbp-reply-content,
#bbpress-forums div.bbp-topic-content { color: var(--text-muted); }

#bbpress-forums div.bbp-reply-content > :first-child,
#bbpress-forums div.bbp-topic-content > :first-child { margin-top: 0; }
#bbpress-forums div.bbp-reply-content > :last-child,
#bbpress-forums div.bbp-topic-content > :last-child { margin-bottom: 0; }

#bbpress-forums div.bbp-reply-content a,
#bbpress-forums div.bbp-topic-content a { color: var(--product-accent); }

#bbpress-forums blockquote {
  margin: var(--space-sm) 0;
  padding: var(--space-sm) var(--space-md);
  border-left: 2px solid var(--border-overlay);
  background: color-mix(in srgb, var(--bg-obsidian) 45%, transparent);
  color: var(--text-faint);
}

#bbpress-forums code,
#bbpress-forums pre {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  background: var(--bg-obsidian);
  border: 1px solid var(--border-overlay);
  border-radius: 8px;
}

#bbpress-forums code { padding: 0.1em 0.4em; }
#bbpress-forums pre { padding: var(--space-sm); overflow-x: auto; }
#bbpress-forums pre code { border: 0; padding: 0; background: none; }

/* ── Row and admin actions ─────────────────────────────────────────── */
#bbpress-forums .bbp-admin-links,
#bbpress-forums .bbp-row-actions {
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums .bbp-admin-links a { color: var(--text-faint); }
#bbpress-forums .bbp-admin-links a:hover { color: var(--product-accent); }

/* ── Pagination ────────────────────────────────────────────────────── */
#bbpress-forums .bbp-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-bottom: var(--space-lg);
}

#bbpress-forums .bbp-pagination-count {
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums .bbp-pagination-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

#bbpress-forums .bbp-pagination-links a,
#bbpress-forums .bbp-pagination-links span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 34px;
  padding: 0 0.6rem;
  border: 1px solid var(--border-overlay);
  border-radius: 8px;
  font-size: var(--text-sm);
  color: var(--text-muted);
  transition: color var(--duration-fast) var(--ease-out-expo),
              border-color var(--duration-fast) var(--ease-out-expo);
}

#bbpress-forums .bbp-pagination-links a:hover {
  color: var(--product-accent);
  border-color: var(--product-accent);
}

#bbpress-forums .bbp-pagination-links span.current {
  color: var(--bg-obsidian);
  background: var(--product-accent);
  border-color: var(--product-accent);
  font-weight: 700;
}

/* ── Notices ───────────────────────────────────────────────────────────
   "This forum is empty", "you must be logged in", validation errors. */
#bbpress-forums div.bbp-template-notice,
div.bbp-template-notice {
  margin: 0 0 var(--space-lg);
  padding: var(--space-md);
  border: 1px solid var(--border-overlay);
  border-left: 2px solid var(--text-faint);
  border-radius: var(--radius-card);
  background: var(--bg-charcoal);
  color: var(--text-muted);
  font-size: var(--text-sm);
}

/* bbPress puts the notice text in a <ul><li>, even when there is only
   one line of it. Left alone that inherits the theme's list styling and
   a one-sentence notice arrives as a bulleted list of one. */
#bbpress-forums div.bbp-template-notice ul,
div.bbp-template-notice ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

#bbpress-forums div.bbp-template-notice li,
div.bbp-template-notice li { margin: 0; }
#bbpress-forums div.bbp-template-notice li + li,
div.bbp-template-notice li + li { margin-top: 0.4rem; }

#bbpress-forums div.bbp-template-notice p,
div.bbp-template-notice p { margin: 0; }
#bbpress-forums div.bbp-template-notice p + p { margin-top: 0.4rem; }

#bbpress-forums div.bbp-template-notice.info,
div.bbp-template-notice.info { border-left-color: var(--accent-cyan); }

#bbpress-forums div.bbp-template-notice.error,
#bbpress-forums div.bbp-template-notice.warning,
div.bbp-template-notice.error,
div.bbp-template-notice.warning {
  border-left-color: var(--danger);
  color: var(--danger);
}

/* bbPress prints this when a forum has nothing in it yet, which on a new
   install is the first thing anyone sees. */
/* bbPress's empty-forum block wraps a notice that already draws its own
   panel, so this one only supplies the space around it — a dashed frame
   here would put a box inside a box. */
#bbpress-forums .bbp-no-topic { color: var(--text-faint); }
#bbpress-forums .bbp-no-topic > div.bbp-template-notice:last-child { margin-bottom: 0; }

/* ── Forms ─────────────────────────────────────────────────────────── */
#bbpress-forums fieldset.bbp-form {
  margin: 0 0 var(--space-lg);
  padding: var(--space-lg);
  border: 1px solid var(--border-overlay);
  border-radius: var(--radius-card);
  background: var(--bg-charcoal);
}

#bbpress-forums fieldset.bbp-form legend {
  padding: 0 0.6rem;
  margin-left: -0.6rem;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--text-lg);
  color: var(--text-primary);
}

#bbpress-forums fieldset.bbp-form p { color: var(--text-muted); font-size: var(--text-sm); }

#bbpress-forums label {
  display: inline-block;
  margin-bottom: 0.3rem;
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--text-primary);
}

#bbpress-forums input[type="text"],
#bbpress-forums input[type="password"],
#bbpress-forums input[type="email"],
#bbpress-forums input[type="url"],
#bbpress-forums input[type="search"],
#bbpress-forums select,
#bbpress-forums textarea {
  width: 100%;
  max-width: 100%;
  padding: 0.6rem 0.8rem;
  border: 1px solid var(--border-overlay);
  border-radius: 10px;
  background: var(--bg-obsidian);
  color: var(--text-primary);
  font-family: inherit;
  font-size: var(--text-sm);
  transition: border-color var(--duration-fast) var(--ease-out-expo);
}

#bbpress-forums input:focus,
#bbpress-forums select:focus,
#bbpress-forums textarea:focus {
  outline: none;
  border-color: var(--product-accent);
}

#bbpress-forums input[type="checkbox"],
#bbpress-forums input[type="radio"] { accent-color: var(--product-accent); }

#bbpress-forums textarea { min-height: 180px; resize: vertical; }

/* The rich-text editor bbPress drops into the reply form. Its chrome is
   the plugin's own markup, so only the frame is set here. */
#bbpress-forums .wp-editor-container,
#bbpress-forums .quicktags-toolbar,
#bbpress-forums .mce-panel {
  border-color: var(--border-overlay) !important;
  background: var(--bg-obsidian) !important;
}

#bbpress-forums .wp-editor-container { border-radius: 10px; overflow: hidden; }

#bbpress-forums div.bbp-submit-wrapper {
  margin-top: var(--space-md);
  display: flex;
  justify-content: flex-end;
}

/* bbPress's buttons, given the theme's primary button. */
#bbpress-forums button,
#bbpress-forums input[type="submit"],
#bbpress-forums a.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.7rem 1.4rem;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--product-accent);
  color: var(--bg-obsidian);
  font-family: inherit;
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
  transition: transform var(--duration-fast) var(--ease-out-expo),
              background-color var(--duration-fast) var(--ease-out-expo);
}

#bbpress-forums button:hover,
#bbpress-forums input[type="submit"]:hover,
#bbpress-forums a.button:hover {
  transform: translateY(-1px);
  background: color-mix(in srgb, var(--product-accent) 85%, white);
}

/* Secondary: the small links bbPress renders as buttons in row actions
   and next to a topic (subscribe, favorite, reply). */
#bbpress-forums .bbp-row-actions a.button,
#bbpress-forums #subscription-toggle a,
#bbpress-forums #favorite-toggle a {
  padding: 0.35rem 0.8rem;
  background: transparent;
  border: 1px solid var(--border-overlay);
  color: var(--text-muted);
  font-size: var(--text-xs);
  font-weight: 600;
}

#bbpress-forums .bbp-row-actions a.button:hover,
#bbpress-forums #subscription-toggle a:hover,
#bbpress-forums #favorite-toggle a:hover {
  background: transparent;
  border-color: var(--product-accent);
  color: var(--product-accent);
}

/* ── Login form ────────────────────────────────────────────────────────
   Shown on any forum a logged-out visitor opens, so on a new install it
   is one of the most-seen components here. */
#bbpress-forums .bbp-login-form {
  max-width: 34rem;
}

#bbpress-forums .bbp-login-form .bbp-username,
#bbpress-forums .bbp-login-form .bbp-email,
#bbpress-forums .bbp-login-form .bbp-password {
  margin-bottom: var(--space-sm);
}

#bbpress-forums .bbp-login-form .bbp-remember-me {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: var(--space-sm) 0;
  font-size: var(--text-sm);
  color: var(--text-muted);
}

#bbpress-forums .bbp-login-form .bbp-remember-me input { width: auto; }
#bbpress-forums .bbp-login-form .bbp-remember-me label { margin: 0; font-weight: 400; }

#bbpress-forums .bbp-login-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
  font-size: var(--text-xs);
}

#bbpress-forums .bbp-login-links a { color: var(--text-faint); }
#bbpress-forums .bbp-login-links a:hover { color: var(--product-accent); }

/* ── Search ────────────────────────────────────────────────────────────
   bbPress wraps the controls in a <div>, so the row has to be declared on
   that rather than on the <form> — the form has exactly one child. */
#bbp-search-form { margin: 0 0 var(--space-lg); }

#bbp-search-form > div {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

/* type="text", not type="search" — bbPress's own markup. */
#bbp-search-form input[type="text"] { flex: 1; min-width: 0; }

/* bbPress labels this "screen-reader-text" and relied on its own
   stylesheet to hide it. That sheet is gone, so the utility has to exist
   here — and as a visually-hidden one, not display:none, which would take
   the label away from the screen readers it was written for. */
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ── Topic tags ────────────────────────────────────────────────────── */
#bbpress-forums .bbp-topic-tags {
  margin-top: var(--space-sm);
  font-size: var(--text-xs);
  color: var(--text-faint);
}

#bbpress-forums .bbp-topic-tags a {
  display: inline-block;
  margin: 0 0.3rem 0.3rem 0;
  padding: 0.15rem 0.55rem;
  border: 1px solid var(--border-overlay);
  border-radius: var(--radius-pill);
  color: var(--text-muted);
}

#bbpress-forums .bbp-topic-tags a:hover { border-color: var(--product-accent); color: var(--product-accent); }

/* ── Attachments (gd-bbpress-attachments) ──────────────────────────────
   A third-party plugin whose own stylesheet is left in place — removing
   it would take its uploader UI with it. Only the panel it draws inside a
   reply is brought into line here. */
#bbpress-forums .bbp-attachments,
#bbpress-forums .gdbbpressattachments {
  margin-top: var(--space-md);
  padding: var(--space-sm) var(--space-md);
  border: 1px solid var(--border-overlay);
  border-radius: var(--radius-card);
  background: color-mix(in srgb, var(--bg-obsidian) 45%, transparent);
  font-size: var(--text-sm);
}

#bbpress-forums .bbp-attachments a,
#bbpress-forums .gdbbpressattachments a { color: var(--product-accent); }

/* ── Responsive ────────────────────────────────────────────────────────
   The counts and the freshness column are the first things to go: a
   four-column table in a 390px viewport gives the topic title about nine
   characters. */
@media (max-width: 860px) {
  #bbpress-forums li.bbp-header { display: none; }

  /* Title and freshness take the full width; the two counts share a row
     between them. Stacking all four made a three-topic list as tall as
     the screen, most of it a single number per line. */
  #bbpress-forums ul.bbp-forums li.bbp-body > ul,
  #bbpress-forums ul.bbp-topics li.bbp-body > ul,
  #bbpress-forums ul.bbp-search-results li.bbp-body > ul {
    grid-template-columns: auto auto;
    justify-content: start;
    gap: 0.35rem var(--space-md);
  }

  #bbpress-forums li.bbp-forum-info,
  #bbpress-forums li.bbp-topic-title,
  #bbpress-forums li.bbp-forum-freshness,
  #bbpress-forums li.bbp-topic-freshness { grid-column: 1 / -1; }

  /* Counts read as a line of meta under the title rather than columns. */
  #bbpress-forums li.bbp-forum-topic-count,
  #bbpress-forums li.bbp-forum-reply-count,
  #bbpress-forums li.bbp-topic-voice-count,
  #bbpress-forums li.bbp-topic-reply-count {
    text-align: left;
    font-size: var(--text-xs);
    color: var(--text-faint);
  }

  #bbpress-forums li.bbp-forum-topic-count::before { content: "Topics: "; }
  #bbpress-forums li.bbp-forum-reply-count::before { content: "Posts: "; }
  #bbpress-forums li.bbp-topic-voice-count::before { content: "Voices: "; }
  #bbpress-forums li.bbp-topic-reply-count::before { content: "Posts: "; }

  #bbpress-forums ul.bbp-replies li.bbp-header { display: none; }

  #bbpress-forums ul.bbp-replies li.bbp-body > div.reply,
  #bbpress-forums ul.bbp-replies li.bbp-body > div.topic {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-sm);
  }

  /* The author becomes a byline above the post instead of a column. */
  #bbpress-forums div.bbp-reply-author,
  #bbpress-forums div.bbp-topic-author {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    text-align: left;
  }

  #bbpress-forums div.bbp-reply-author img.avatar,
  #bbpress-forums div.bbp-topic-author img.avatar {
    margin: 0;
    width: 32px;
    height: 32px;
  }

  #bbpress-forums div.bbp-reply-author br,
  #bbpress-forums div.bbp-topic-author br { display: none; }

  #bbpress-forums fieldset.bbp-form { padding: var(--space-md); }
  #bbpress-forums div.bbp-submit-wrapper { justify-content: stretch; }
  #bbpress-forums div.bbp-submit-wrapper button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  #bbpress-forums li.bbp-body > ul,
  #bbpress-forums button,
  #bbpress-forums input[type="submit"],
  #bbpress-forums a.button { transition: none; }
  #bbpress-forums button:hover,
  #bbpress-forums input[type="submit"]:hover,
  #bbpress-forums a.button:hover { transform: none; }
}