/* ============================================================================
   DOFT Loadboard — Round 11 Bulk Post alignment / width fix (2026-07-31)
   Base: Round 10 fixed project. Loaded last.
   ============================================================================ */

/* --------------------------------------------------------------------------
   Post Shipments in Bulk — all labels/controls share one baseline.
   Nested l-blocks retained legacy margin-bottom, lifting Truck type / Weight /
   Price by ~8px. Remove that inherited margin and normalize label/control rows.
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
  html[data-refresh] .bulk-post-page .load-inner {
    align-items: flex-start !important;
    gap: 5px !important;
  }

  html[data-refresh] .bulk-post-page .load-inner > :is(
    .l-block,
    .wp-points-wrp,
    .truck-type-wrp,
    .price-wrp,
    .features-block
  ) {
    align-self: flex-start !important;
  }

  html[data-refresh] .bulk-post-page .truck-type-wrp,
  html[data-refresh] .bulk-post-page .price-wrp {
    align-items: flex-start !important;
    gap: 5px !important;
  }

  html[data-refresh] .bulk-post-page .truck-type-wrp > .l-block,
  html[data-refresh] .bulk-post-page .price-wrp > .l-block {
    margin-bottom: 0 !important;
    align-self: flex-start !important;
  }

  html[data-refresh] .bulk-post-page .load-inner label {
    display: flex !important;
    align-items: flex-end !important;
    min-height: 22px !important;
    margin: 0 0 4px !important;
    line-height: 18px !important;
  }

  html[data-refresh] .bulk-post-page .load-inner :is(
    .form-control,
    .bootstrap-select,
    .bootstrap-select > .dropdown-toggle,
    .input-group-text
  ) {
    margin-bottom: 0 !important;
  }

  /* Give selected truck types enough room. Compact commas in JSP let two or
     three short codes remain visible; 4+ selections switch to "N selected". */
  html[data-refresh] .bulk-post-page .truck-type-block,
  html[data-refresh] .bulk-post-page .truck-type-block .bootstrap-select,
  html[data-refresh] .bulk-post-page .truck-type-block .bootstrap-select > .dropdown-toggle {
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
  }

  html[data-refresh] .bulk-post-page .truck-type-block .bootstrap-select > .dropdown-toggle {
    padding-left: 10px !important;
    padding-right: 25px !important;
  }

  html[data-refresh] .bulk-post-page .truck-type-block .filter-option-inner-inner {
    /* NOTE: round7 sets display:flex on this runtime element with higher
       specificity, so a true text-overflow ellipsis won't render here — but
       data-selected-text-format="count > 3" keeps the visible text to <=3 short
       codes that fit 140px, so overflow effectively never happens. */
    width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* TL/LTL must be readable, not reduced to a vertical stroke. */
  html[data-refresh] .bulk-post-page .weight-block .input-group {
    flex-wrap: nowrap !important;
  }

  html[data-refresh] .bulk-post-page .weight-block .weight {
    width: 78px !important;
    min-width: 78px !important;
    max-width: 78px !important;
  }

  html[data-refresh] .bulk-post-page .weight-block .bootstrap-select,
  html[data-refresh] .bulk-post-page .weight-block .load-size,
  html[data-refresh] .bulk-post-page .weight-block .load-size > .dropdown-toggle,
  html[data-refresh] .bulk-post-page .weight-block button.dropdown-toggle {
    width: 72px !important;
    min-width: 72px !important;
    max-width: 72px !important;
  }

  html[data-refresh] .bulk-post-page .weight-block .load-size > .dropdown-toggle,
  html[data-refresh] .bulk-post-page .weight-block button.dropdown-toggle {
    padding-left: 10px !important;
    padding-right: 22px !important;
  }

  html[data-refresh] .bulk-post-page .weight-block :is(
    .filter-option,
    .filter-option-inner,
    .filter-option-inner-inner
  ) {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
  }

  /* Reclaim width from flexible/non-critical fields so Features never wraps. */
  html[data-refresh] .bulk-post-page .load-inner > .wp-points-wrp {
    flex: 1 1 170px !important;
    min-width: 170px !important;
  }

  html[data-refresh] .bulk-post-page .price {
    width: 64px !important;
  }

  html[data-refresh] .bulk-post-page .ref-num {
    width: 64px !important;
  }

  html[data-refresh] .bulk-post-page .desc-ctrl {
    width: 100px !important;
  }

  html[data-refresh] .bulk-post-page .load-inner > .features-block {
    flex: 0 0 56px !important;
    min-width: 56px !important;
  }
}

/* Tight desktop / iPad landscape: preserve one row by compacting secondary
   fields, while keeping Truck type and TL/LTL readable. */
@media (min-width: 992px) and (max-width: 1199px) {
  html[data-refresh] .bulk-post-page .load-inner {
    gap: 4px !important;
  }

  html[data-refresh] .bulk-post-page .pu-date {
    width: 74px !important;
    min-width: 74px !important;
    max-width: 74px !important;
  }

  html[data-refresh] .bulk-post-page .pu-time {
    width: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
  }

  html[data-refresh] .bulk-post-page .load-inner > .wp-points-wrp {
    flex-basis: 155px !important;
    min-width: 155px !important;
  }

  html[data-refresh] .bulk-post-page .truck-type-block,
  html[data-refresh] .bulk-post-page .truck-type-block .bootstrap-select,
  html[data-refresh] .bulk-post-page .truck-type-block .bootstrap-select > .dropdown-toggle {
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
  }

  html[data-refresh] .bulk-post-page .weight-block .weight {
    width: 74px !important;
    min-width: 74px !important;
    max-width: 74px !important;
  }

  html[data-refresh] .bulk-post-page .weight-block .bootstrap-select,
  html[data-refresh] .bulk-post-page .weight-block .load-size,
  html[data-refresh] .bulk-post-page .weight-block .load-size > .dropdown-toggle,
  html[data-refresh] .bulk-post-page .weight-block button.dropdown-toggle {
    width: 68px !important;
    min-width: 68px !important;
    max-width: 68px !important;
  }

  html[data-refresh] .bulk-post-page .price {
    width: 60px !important;
  }

  html[data-refresh] .bulk-post-page .ref-num {
    width: 60px !important;
  }

  html[data-refresh] .bulk-post-page .desc-ctrl {
    width: 92px !important;
  }

  html[data-refresh] .bulk-post-page .load-inner > .features-block {
    flex-basis: 52px !important;
    min-width: 52px !important;
  }
}

/* --------------------------------------------------------------------------
   Round 11.1 (2026-08-03): TL/LTL STILL collapsed to a single "L". Root cause is
   not just width — round7 makes the filter-option chain display:flex and the
   round11 rule above adds min-width:0, so the text box shrinks below its own
   content and clips. Fix both: give the control a bit more room AND force its
   text to size to content (never shrink/clip). Reclaim the extra px from Desc so
   the single-row layout is preserved. Loaded last, so this wins the cascade.
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
  html[data-refresh] .bulk-post-page .weight-block .bootstrap-select,
  html[data-refresh] .bulk-post-page .weight-block .load-size,
  html[data-refresh] .bulk-post-page .weight-block .load-size > .dropdown-toggle,
  html[data-refresh] .bulk-post-page .weight-block button.dropdown-toggle {
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
  }
  html[data-refresh] .bulk-post-page .weight-block .load-size > .dropdown-toggle,
  html[data-refresh] .bulk-post-page .weight-block button.dropdown-toggle {
    padding-left: 10px !important;
    padding-right: 20px !important;
  }
  /* the actual clip fix: let the selected-value text keep its natural width */
  html[data-refresh] .bulk-post-page .weight-block .load-size :is(
    .filter-option,
    .filter-option-inner,
    .filter-option-inner-inner
  ) {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  /* reclaim the widened px so Features never wraps onto a second row */
  html[data-refresh] .bulk-post-page .desc-ctrl {
    width: 84px !important;
  }
}