/* #23 — phone readability floor, loaded after every other portal sheet.
 * Earlier sheets tuned the feed for density (9-12 px text, 30 px buttons).
 * On a phone the floor wins: content text >= 14 px, small caps labels
 * >= 12 px, every touch target >= 44 px, visible keyboard focus.
 * `!important` is deliberate and confined to this file: it is a floor over
 * very specific density selectors, not a style of its own.
 */
@media (max-width: 700px) {
  /* Content text */
  .offers-page,
  .opportunity-page,
  .retenders-page,
  .buyer-history,
  .itp-step,
  .itp-step li,
  .itp-step small,
  .offers-page p,
  .offers-page li,
  .offers-page small,
  .offers-page strong,
  .offers-page span,
  .opportunity-page p,
  .opportunity-page dd,
  .opportunity-page span,
  .opportunity-page strong,
  .buyer-history p,
  .buyer-history li,
  .buyer-history span,
  .buyer-history strong,
  .retenders-page p,
  .retenders-page li,
  .retenders-page span,
  .retenders-page strong,
  .card-title,
  .card-title-link,
  .buyer-name,
  .boamp-link,
  .reason,
  .context-meta,
  .paid-value,
  .opportunity-source-link,
  .feed-state p,
  .offers-lead,
  .lead-detail,
  .transparency-link,
  .decision-count,
  .deadline-badge span,
  .score-label,
  footer,
  footer div,
  footer a,
  .topbar a,
  .menu-trigger,
  .mobile-menu-link {
    font-size: max(14px, 1em) !important;
  }
  .card-title,
  .card-title-link {
    font-size: 16px !important;
    line-height: 1.35 !important;
  }
  .deadline-short {
    font-size: 16px !important;
  }

  /* Small caps labels: kept compact, never under 12 px */
  .eyebrow,
  .decision-caption,
  .feedback-label,
  .filter-label,
  .paid-label,
  .opportunity-section-kicker,
  .opportunity-page dt,
  .opportunity-kicker,
  .home-eyebrow,
  .itp .eyebrow {
    font-size: 12px !important;
    letter-spacing: 0.04em;
  }

  /* Touch targets */
  .feedback-button,
  .quick-filter,
  .menu-trigger,
  .button,
  .top-link,
  .feed-filter-submit,
  .feed-filter-reset,
  .retender-follow button,
  .itp-chip button,
  .itp-delete > summary,
  .feed-filters-toggle > summary,
  .opportunity-breadcrumb a,
  .mobile-menu-link,
  .logout-button {
    /* Never force `display` here: layout.css hides some of these on phones. */
    min-height: 44px !important;
    min-width: 44px;
    align-items: center;
    justify-content: center;
    font-size: 14px !important;
  }
  .opportunity-breadcrumb a, .itp-delete > summary { display: inline-flex; }
  .quick-filters { flex-wrap: wrap !important; }
  .quick-filters .quick-filter { flex: 1 1 auto !important; }
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    min-height: 44px !important;
    font-size: 16px !important;
  }
  /* The card title is the whole tap zone of its heading. */
  .card-title-link {
    display: block;
    padding-block: 12px;
    margin-block: -12px;
  }
  /* Standalone links next to other controls get a real 44 px box
     (a negative-margin hit area would overlap the next row). */
  .buyer-name.buyer-link,
  a.boamp-link,
  .transparency-link {
    display: inline-flex !important;
    align-items: center;
    min-height: 44px;
  }
  .footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
  }
  .footer-links a {
    padding-block: 12px;
    margin-block: 0;
  }

  /* Feed: filters fold behind one line so the first contract is in view */
  .feed-filters-toggle > summary {
    display: flex;
    list-style: none;
    cursor: pointer;
    width: 100%;
    justify-content: space-between;
    padding: 0 12px;
    border: 1px solid var(--line, #2a353d);
    border-radius: 10px;
    font-weight: 600;
  }
  .feed-filters-toggle > summary::-webkit-details-marker {
    display: none;
  }
  .feed-filters-toggle[open] > summary {
    margin-bottom: 12px;
  }
}

@media (min-width: 701px) {
  .feed-filters-toggle > summary {
    display: none;
  }
}

/* Keyboard focus is always visible, on every width */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--blue, #4aa3ff);
  outline-offset: 2px;
}