/* ==========================================================
   bbPress responsive lists + post layout (Citizens of Interest)
   Goals:
   - <=767: single column (Title/Info only)
   - 768–1023: two columns (Title/Info + Last Post)
   - >=1024: four columns (Title/Info + Voices + Posts + Last Post)
   - Keep post/reply author stacked above content on phones
   ========================================================== */


/* ==========================================================
   0) Smartphone density + post layout (phones)
   ========================================================== */
@media screen and (max-width: 600px) {

  #bbpress-forums {
    padding: 0.75rem 0.5rem 1rem;
  }

  #bbpress-forums li.bbp-header,
  #bbpress-forums li.bbp-footer {
    padding: 0.45rem 0.6rem;
    font-size: 0.85rem;
    line-height: 1.2;
  }

  #bbpress-forums li.bbp-body ul.topic,
  #bbpress-forums li.bbp-body ul.forum {
    padding: 0.4rem 0.25rem !important;
  }

  #bbpress-forums a.bbp-topic-permalink,
  #bbpress-forums a.bbp-forum-title {
    font-size: 1.05rem;
    line-height: 1.2;
  }

  #bbpress-forums .bbp-topic-title p.bbp-topic-meta,
  #bbpress-forums .bbp-topic-title .bbp-topic-started-by,
  #bbpress-forums .bbp-topic-title .bbp-topic-started-in,
  #bbpress-forums .bbp-topic-title .bbp-topic-freshness {
    font-size: 0.88rem;
    line-height: 1.25;
  }

  /* Post/reply header compact */
  #bbpress-forums .bbp-reply-header,
  #bbpress-forums .bbp-topic-header {
    padding: 0.2rem 0.6rem;
    margin: 0 0 0.3rem;
    font-size: 0.80rem;
  }

  /* Stack author ABOVE content card on phones */
  #bbpress-forums .bbp-reply-author,
  #bbpress-forums .bbp-topic-author {
    float: none !important;
    width: 100% !important;
    margin: 0 0 0.35rem 0 !important;
    padding: 0.55rem 0.65rem !important;
    box-sizing: border-box;
  }

  #bbpress-forums .bbp-reply-content,
  #bbpress-forums .bbp-topic-content {
    float: none !important;
    width: 100% !important;
    padding: 0.75rem 0.8rem !important;
    margin: 0 0 0.75rem !important;
    box-sizing: border-box;
  }

  /* Keep zebra tint subtle */
  #bbpress-forums ul.bbp-replies > li:nth-child(even) div.bbp-reply-content,
  #bbpress-forums ul.bbp-topics  > li:nth-child(even) div.bbp-topic-content {
    background: #f0f4f7;
  }

  /* Prevent sideways scroll from long URLs/code */
  #bbpress-forums .bbp-reply-content,
  #bbpress-forums .bbp-topic-content {
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* Pagination: smaller but tappable */
  #bbpress-forums .bbp-pagination-links a,
  #bbpress-forums .bbp-pagination-links span.current {
    padding: 0.22rem 0.45rem;
    font-size: 0.9rem;
  }
}


/* ==========================================================
   1) <=767px: SINGLE COLUMN (topics + forums)
   - Hide ALL secondary columns everywhere (header + rows)
   ========================================================== */
@media screen and (max-width: 767px) {

  /* Hide all non-primary columns (header + rows) */
  #bbpress-forums .bbp-topic-voice-count,
  #bbpress-forums .bbp-topic-reply-count,
  #bbpress-forums .bbp-topic-freshness,
  #bbpress-forums .bbp-forum-topic-count,
  #bbpress-forums .bbp-forum-reply-count,
  #bbpress-forums .bbp-forum-freshness {
    display: none !important;
  }

  /* Header titles: keep ONLY the primary cell */
  #bbpress-forums li.bbp-header ul.forum-titles > li:not(.bbp-topic-title):not(.bbp-forum-info) {
    display: none !important;
  }

  /* Topic rows: keep ONLY title */
  #bbpress-forums li.bbp-body ul.topic > li:not(.bbp-topic-title) {
    display: none !important;
  }

  /* Forum rows: keep ONLY forum info */
  #bbpress-forums li.bbp-body ul.forum > li:not(.bbp-forum-info) {
    display: none !important;
  }

  /* Force block layout so nothing “table-squeezes” */
  #bbpress-forums li.bbp-header ul.forum-titles,
  #bbpress-forums li.bbp-body ul.topic,
  #bbpress-forums li.bbp-body ul.forum {
    display: block !important;
  }

  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-title,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-info,
  #bbpress-forums li.bbp-body ul.topic > li.bbp-topic-title,
  #bbpress-forums li.bbp-body ul.forum > li.bbp-forum-info {
    width: 100% !important;
    float: none !important;
    display: block !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }

  /* Prevent overflow on narrow screens */
  #bbpress-forums .bbp-topic-permalink,
  #bbpress-forums .bbp-forum-title,
  #bbpress-forums .bbp-topic-meta {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}


/* ==========================================================
   2) 768–1023px: TWO COLUMNS (topics + forums)
   - Show Title/Info + Last Post
   - Hide count columns
   ========================================================== */
@media screen and (min-width: 768px) and (max-width: 1023px) {

  /* Hide count columns (header + rows) */
  #bbpress-forums .bbp-topic-voice-count,
  #bbpress-forums .bbp-topic-reply-count,
  #bbpress-forums .bbp-forum-topic-count,
  #bbpress-forums .bbp-forum-reply-count {
    display: none !important;
  }

  /* Explicitly show freshness (header + rows) */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-freshness,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-freshness {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Header + rows use the same flex model */
  #bbpress-forums li.bbp-header ul.forum-titles,
  #bbpress-forums li.bbp-body ul.topic,
  #bbpress-forums li.bbp-body ul.forum {
    display: flex !important;
    align-items: center;
    gap: 0.65rem;
  }

  /* Neutralize legacy floats/widths */
  #bbpress-forums li.bbp-header ul.forum-titles > li,
  #bbpress-forums li.bbp-body   ul.topic        > li,
  #bbpress-forums li.bbp-body   ul.forum        > li {
    float: none !important;
    clear: none !important;
    width: auto !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  /* Primary column gets most of the space */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-title,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-title,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-info,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-info {
    flex: 1 1 auto;
    min-width: 0;
  }

  /* Last Post column constrained but present */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-freshness,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-freshness {
    flex: 0 0 200px;
    max-width: 200px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Allow titles to wrap instead of crushing columns */
  #bbpress-forums .bbp-topic-permalink,
  #bbpress-forums .bbp-forum-title {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* Keep list meta tight */
  #bbpress-forums .bbp-topic-title .bbp-topic-meta,
  #bbpress-forums .bbp-topic-freshness .bbp-topic-meta,
  #bbpress-forums .bbp-forum-freshness .bbp-topic-meta {
    margin: 0.25rem 0 0 !important;
    line-height: 1.25;
  }

  /* No tiny avatars in lists/meta */
  #bbpress-forums ul.topic img.avatar,
  #bbpress-forums ul.forum img.avatar,
  #bbpress-forums ul.topic .bbp-author-avatar,
  #bbpress-forums ul.forum .bbp-author-avatar {
    display: none !important;
  }
}


/* ==========================================================
   3) >=1024px: FOUR COLUMNS (topics + forums)
   - Match headers to rows reliably
   - Topic/Forum title wide, count columns compact, last post fixed
   ========================================================== */
@media screen and (min-width: 1024px) {

  /* Ensure all columns are enabled (override any earlier display:none) */
  #bbpress-forums .bbp-topic-voice-count,
  #bbpress-forums .bbp-topic-reply-count,
  #bbpress-forums .bbp-topic-freshness,
  #bbpress-forums .bbp-forum-topic-count,
  #bbpress-forums .bbp-forum-reply-count,
  #bbpress-forums .bbp-forum-freshness {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Flex layout for header + rows (same model) */
  #bbpress-forums li.bbp-header ul.forum-titles,
  #bbpress-forums li.bbp-body   ul.topic,
  #bbpress-forums li.bbp-body   ul.forum {
    display: flex !important;
    align-items: center;
    gap: 0.65rem;
  }

  /* Neutralize legacy floats/widths that can collapse columns */
  #bbpress-forums li.bbp-header ul.forum-titles > li,
  #bbpress-forums li.bbp-body   ul.topic        > li,
  #bbpress-forums li.bbp-body   ul.forum        > li {
    float: none !important;
    clear: none !important;
    width: auto !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  /* Primary column: as wide as possible */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-title,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-title,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-info,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-info {
    flex: 1 1 auto;
    min-width: 0;
  }

  /* Count columns: compact */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-voice-count,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-voice-count,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-reply-count,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-reply-count,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-topic-count,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-topic-count,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-reply-count,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-reply-count {
    flex: 0 0 70px;
    max-width: 70px;
    text-align: center;
    white-space: nowrap;
  }

  /* Last Post column: fixed width, ellipsize */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-body   ul.topic        > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-freshness,
  #bbpress-forums li.bbp-body   ul.forum        > li.bbp-forum-freshness {
    flex: 0 0 240px;
    max-width: 240px;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Titles should wrap if needed (don’t crush the first column) */
  #bbpress-forums .bbp-topic-permalink,
  #bbpress-forums .bbp-forum-title {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* No tiny avatars in lists/meta */
  #bbpress-forums ul.topic img.avatar,
  #bbpress-forums ul.forum img.avatar,
  #bbpress-forums ul.topic .bbp-author-avatar,
  #bbpress-forums ul.forum .bbp-author-avatar {
    display: none !important;
  }
}

/* ==========================================================
   Desktop/tablet column sizing: give the first column room
   - Counts are narrow (digits)
   - Last Post is wide enough for time + author
   ========================================================== */

/* >=768px: forums + topics use flex columns with explicit sizing */
@media screen and (min-width: 768px) {

  /* Ensure header + rows are flex (wins over theme defaults) */
  #bbpress-forums li.bbp-header ul.forum-titles,
  #bbpress-forums li.bbp-body ul.forum,
  #bbpress-forums li.bbp-body ul.topic {
    display: flex !important;
    align-items: flex-start; /* allows multi-line title/desc without squeezing */
    gap: 0.75rem;
  }

  /* Neutralize any old floats/percent widths */
  #bbpress-forums li.bbp-header ul.forum-titles > li,
  #bbpress-forums li.bbp-body ul.forum > li,
  #bbpress-forums li.bbp-body ul.topic > li {
    float: none !important;
    clear: none !important;
    width: auto !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  /* ---------- FORUM INDEX (Forum / Topics / Posts / Last Post) ---------- */

  /* First column (Forum info) gets the space */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-info,
  #bbpress-forums li.bbp-body ul.forum > li.bbp-forum-info {
    flex: 1 1 auto !important;     /* grow */
    min-width: 420px;              /* prevents “skinny” forum column */
  }

  /* Counts are narrow */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-topic-count,
  #bbpress-forums li.bbp-body ul.forum > li.bbp-forum-topic-count,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-reply-count,
  #bbpress-forums li.bbp-body ul.forum > li.bbp-forum-reply-count {
    flex: 0 0 64px !important;     /* fixed */
    text-align: center;
    white-space: nowrap;
  }

  /* Last post gets a meaningful width */
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-forum-freshness,
  #bbpress-forums li.bbp-body ul.forum > li.bbp-forum-freshness {
    flex: 0 0 260px !important;    /* fixed */
    max-width: 260px;
    text-align: right;
    white-space: normal;           /* allow wrap if needed */
  }

  /* ---------- TOPIC INDEX (Topic / Voices / Posts / Last Post) ---------- */

  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-title,
  #bbpress-forums li.bbp-body ul.topic > li.bbp-topic-title {
    flex: 1 1 auto !important;
    min-width: 420px;
  }

  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-voice-count,
  #bbpress-forums li.bbp-body ul.topic > li.bbp-topic-voice-count,
  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-reply-count,
  #bbpress-forums li.bbp-body ul.topic > li.bbp-topic-reply-count {
    flex: 0 0 64px !important;
    text-align: center;
    white-space: nowrap;
  }

  #bbpress-forums li.bbp-header ul.forum-titles > li.bbp-topic-freshness,
  #bbpress-forums li.bbp-body ul.topic > li.bbp-topic-freshness {
    flex: 0 0 260px !important;
    max-width: 260px;
    text-align: right;
    white-space: normal;
  }

  /* Keep long titles/descriptions from forcing overflow */
  #bbpress-forums .bbp-forum-title,
  #bbpress-forums .bbp-topic-permalink,
  #bbpress-forums .bbp-forum-content {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

/* ==========================================================
   bbPress column widths (float layout, Twenty Seventeen friendly)
   Goal:
   - First column is wide (title + description)
   - Counts are narrow
   - Last Post is wide enough for date + author
   ========================================================== */

/* ---------- FORUM INDEX (Forum / Topics / Posts / Last Post) ---------- */
@media screen and (min-width: 768px) {

  /* Ensure bbPress stays in its native float/grid mode */
  #bbpress-forums ul.forum-titles li,
  #bbpress-forums ul.forum li {
    float: left;
    display: block;
    box-sizing: border-box;
  }

  /* 1) Forum column: BIG */
  #bbpress-forums li.bbp-header .bbp-forum-info,
  #bbpress-forums li.bbp-body   .bbp-forum-info {
    width: 62% !important;
  }

  /* 2) Topics + Posts counts: SMALL */
  #bbpress-forums li.bbp-header .bbp-forum-topic-count,
  #bbpress-forums li.bbp-body   .bbp-forum-topic-count {
    width: 7% !important;
    text-align: center;
    white-space: nowrap;
  }

  #bbpress-forums li.bbp-header .bbp-forum-reply-count,
  #bbpress-forums li.bbp-body   .bbp-forum-reply-count {
    width: 7% !important;
    text-align: center;
    white-space: nowrap;
  }

  /* 3) Last Post: WIDE */
  #bbpress-forums li.bbp-header .bbp-forum-freshness,
  #bbpress-forums li.bbp-body   .bbp-forum-freshness {
    width: 24% !important;
    text-align: right;
  }

  /* Keep long titles/descriptions from forcing overflow */
  #bbpress-forums .bbp-forum-title,
  #bbpress-forums .bbp-forum-content {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

/* ---------- TOPIC INDEX (Topic / Voices / Posts / Last Post) ---------- */
@media screen and (min-width: 768px) {

  #bbpress-forums ul.forum-titles li,
  #bbpress-forums ul.topic li {
    float: left;
    display: block;
    box-sizing: border-box;
  }

  /* Topic column: BIG */
  #bbpress-forums li.bbp-header .bbp-topic-title,
  #bbpress-forums li.bbp-body   .bbp-topic-title {
    width: 62% !important;
  }

  /* Voices + Posts: SMALL */
  #bbpress-forums li.bbp-header .bbp-topic-voice-count,
  #bbpress-forums li.bbp-body   .bbp-topic-voice-count {
    width: 7% !important;
    text-align: center;
    white-space: nowrap;
  }

  #bbpress-forums li.bbp-header .bbp-topic-reply-count,
  #bbpress-forums li.bbp-body   .bbp-topic-reply-count {
    width: 7% !important;
    text-align: center;
    white-space: nowrap;
  }

  /* Last Post: WIDE */
  #bbpress-forums li.bbp-header .bbp-topic-freshness,
  #bbpress-forums li.bbp-body   .bbp-topic-freshness {
    width: 24% !important;
    text-align: right;
  }

  #bbpress-forums .bbp-topic-permalink {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

/* ---------- >=1024px: give title + last-post even more breathing room ---------- */
@media screen and (min-width: 1024px) {

  #bbpress-forums li.bbp-header .bbp-forum-info,
  #bbpress-forums li.bbp-body   .bbp-forum-info,
  #bbpress-forums li.bbp-header .bbp-topic-title,
  #bbpress-forums li.bbp-body   .bbp-topic-title {
    width: 66% !important;
  }

  #bbpress-forums li.bbp-header .bbp-forum-freshness,
  #bbpress-forums li.bbp-body   .bbp-forum-freshness,
  #bbpress-forums li.bbp-header .bbp-topic-freshness,
  #bbpress-forums li.bbp-body   .bbp-topic-freshness {
    width: 22% !important;
  }

  #bbpress-forums li.bbp-header .bbp-forum-topic-count,
  #bbpress-forums li.bbp-body   .bbp-forum-topic-count,
  #bbpress-forums li.bbp-header .bbp-forum-reply-count,
  #bbpress-forums li.bbp-body   .bbp-forum-reply-count,
  #bbpress-forums li.bbp-header .bbp-topic-voice-count,
  #bbpress-forums li.bbp-body   .bbp-topic-voice-count,
  #bbpress-forums li.bbp-header .bbp-topic-reply-count,
  #bbpress-forums li.bbp-body   .bbp-topic-reply-count {
    width: 6% !important;
  }
}