/* Respark Command Center 2.9.2 — content flow and mobile text containment */

/* Universal text containment: content should grow vertically, never force the viewport wider. */
:where(
  .page-title,.panel-title,.panel-sub,.subtle,
  .mission-title,.mission-key,.mission-hero h1,.mission-hero-key,
  .wb-title,.wb-title strong,.wb-title small,
  .review-card h4,.review-card p,.result-card h4,.result-body,
  .feedback-content,.activity-title,.activity-meta,
  .sys-card h3,.sys-card p,.metric,.routing-row,
  .artifact h4,.artifact p,.text-block,.mini-block,.hint,
  .identity,.nav-item,.badge,.btn,label,summary,
  td,th,a,p,h1,h2,h3,h4,strong,span
){
  min-width:0!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  text-overflow:clip!important;
}

:where(
  .page-title,.panel-title,.mission-title,.mission-hero h1,
  .wb-title strong,.review-card h4,.result-card h4,.activity-title
){
  overflow:visible!important;
  line-height:1.45;
  unicode-bidi:plaintext;
}

:where(pre,code,.mini-block,.text-block,.result-body,.feedback-content){
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}

/* Grid/flex children must be allowed to shrink before text wrapping is calculated. */
:where(
  .panel,.panel-head,.panel-body,.topbar,.top-actions,
  .mission-hero,.mission-hero-top,.hero-badges,.mission-tabs,
  .detail-grid,.detail-card,.layout-2,.layout-3,.grid-stats,
  .review-card,.result-card,.result-head,.result-meta,.result-extra,
  .feedback-item,.feedback-top,.activity-item,.routing-row,
  .sys-card,.sys-top,.artifact,.section,.section-title,
  .composer,.composer-actions,.modal,.modal-footer,
  .wb-metrics,.wb-sync,.wb-sync-meta,.wb-filters,.wb-links,.wb-title
) > *{
  min-width:0!important;
  max-width:100%;
}

/* Work Board had explicit horizontal minimums; remove them from content containers. */
.wb-title{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
}
.wb-links,.wb-sync-meta{
  min-width:0!important;
  max-width:100%!important;
}
.wb-links a{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

@media(max-width:900px){
  .table-wrap,.wb-table-wrap{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
    margin-inline:0!important;
  }
  table,.wb-table{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  tbody,tr,td{
    min-width:0!important;
    max-width:100%!important;
  }
  tbody tr{
    width:100%!important;
  }
  tbody td > *{
    min-width:0!important;
    width:auto;
    max-width:100%!important;
  }
  .wb-progress,.progress-line{
    width:100%!important;
    max-width:180px!important;
  }
}

/* On phone widths, place the field label above the value. This gives titles and values the full card width. */
@media(max-width:560px){
  tbody td{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:5px!important;
    align-items:start!important;
    width:100%!important;
    padding:11px 0!important;
  }
  tbody td::before{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 2px!important;
  }
  tbody td > *{
    width:100%!important;
    max-width:100%!important;
  }
  .wb-title,.mission-title,.mission-key{
    width:100%!important;
    min-width:0!important;
  }
  .routing-row,.feedback-top,.result-head,.sys-top,.section-title,.composer-actions,
  .artifact,.activity-item{
    min-width:0!important;
    max-width:100%!important;
  }
  .routing-row > *, .feedback-top > *, .result-head > *, .sys-top > *,
  .section-title > *, .composer-actions > *, .artifact > *, .activity-item > *{
    min-width:0!important;
    max-width:100%!important;
  }
  .badge{
    white-space:normal!important;
    height:auto!important;
  }
  .btn,.nav-item{
    white-space:normal!important;
    height:auto!important;
    min-height:42px!important;
  }
}
