/* ==========================================================
   bbPress: Single-column layout for small screens (≤600px)
   Keep native layout everywhere else
   ========================================================== */

@media screen and (max-width: 600px) {

  /* Hide ALL non-title columns (headers + 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;
  }

  /* Make the first column full width */
  #bbpress-forums .bbp-topic-title,
  #bbpress-forums .bbp-forum-info {
    width: 100% !important;
    float: none !important;
  }

  /* Ensure header matches body (critical) */
  #bbpress-forums li.bbp-header .bbp-topic-title,
  #bbpress-forums li.bbp-header .bbp-forum-info {
    width: 100% !important;
  }

  /* Prevent overflow on very narrow screens (320px) */
  #bbpress-forums {
    overflow-x: hidden;
  }

  /* Tighten vertical spacing slightly for mobile */
  #bbpress-forums li.bbp-body ul.topic,
  #bbpress-forums li.bbp-body ul.forum {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}

/* ==========================================================
   Ultra-small screens: prevent author link overflow (<320px)
   ========================================================== */

/* ==========================================================
   <320px: stop author area overflow (role + link/name)
   ========================================================== */
@media (max-width: 320px) {

  /* Make the author row a real flex row that can wrap */
  #bbpress-forums .bbp-reply-author,
  #bbpress-forums .bbp-topic-author {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0.65rem !important;
  }

  /* Allow flex children to shrink (prevents overflow) */
  #bbpress-forums .bbp-reply-author .bbp-author-link,
  #bbpress-forums .bbp-topic-author .bbp-author-link {
    min-width: 0 !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;

    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  #bbpress-forums .bbp-reply-author .bbp-author-name,
  #bbpress-forums .bbp-topic-author .bbp-author-name {
    min-width: 0 !important;
    max-width: 100% !important;

    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* Key fix: undo bbPress "author column" float/clear behavior */
  #bbpress-forums .bbp-reply-author .bbp-author-role,
  #bbpress-forums .bbp-topic-author .bbp-author-role {
    clear: none !important;     /* was clear:left */
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.25 !important;
  }

  /* If avatar is still crowding, reduce it slightly */
  #bbpress-forums .bbp-author-avatar img.avatar {
    width: 56px !important;
    height: 56px !important;
  }
}

/* ==========================================================
   Razr portrait hardening: prevent clipping in author block
   ========================================================== */
@media (max-width: 360px) {

  /* Allow flex items to actually shrink (critical for clipping bugs) */
  #bbpress-forums .bbp-reply-author,
  #bbpress-forums .bbp-topic-author,
  #bbpress-forums .bbp-reply-author * ,
  #bbpress-forums .bbp-topic-author * {
    min-width: 0 !important;
  }

  /* Force the author link to be a shrinkable container */
  #bbpress-forums .bbp-reply-author .bbp-author-link,
  #bbpress-forums .bbp-topic-author .bbp-author-link {
    display: flex !important;
    align-items: center !important;
    flex: 1 1 0% !important;   /* 0% basis is key */
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Ensure avatar never pushes layout wider than viewport */
  #bbpress-forums .bbp-author-avatar {
    flex: 0 0 auto !important;
  }

  /* Name must be allowed to wrap/break inside the link */
  #bbpress-forums .bbp-author-name {
    display: block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* If any theme CSS sets nowrap on links, kill it here */
  #bbpress-forums .bbp-reply-author a,
  #bbpress-forums .bbp-topic-author a {
    white-space: normal !important;
  }
}