@import url('./styles-base.css');

/* Mobile layout hotfix — 2026-08-30 */
@media (max-width: 900px) {
  .topbar {
    height: auto;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    justify-content: stretch;
    gap: 10px;
    padding: 14px 16px;
  }

  .topbar > div:first-child {
    min-width: 0;
  }

  .topbar .eyebrow {
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: .12em;
    white-space: nowrap;
  }

  .topbar h2 {
    margin-top: 4px;
    font-size: 22px;
    line-height: 1.15;
    overflow-wrap: anywhere;
  }

  .scope-badge {
    justify-self: start;
    max-width: 100%;
    white-space: normal;
    line-height: 1.35;
  }

  #page-access .section-head {
    margin-top: 4px;
  }

  #page-access .grid2 > .card:first-child {
    min-width: 0;
    overflow-x: hidden;
  }

  /* The filter row currently contains inline !important grid rules.
     A mobile min-width gives those seven tabs enough room, while the
     card provides a contained horizontal scroller instead of text overlap. */
  #page-access .grid2 > .card:first-child {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  #leadershipMemberFilters {
    min-width: 720px !important;
  }

  #leadershipMemberFilters .leadership-filter {
    min-height: 42px;
  }
}

@media (max-width: 620px) {
  .content {
    padding: 14px;
  }

  .card {
    padding: 18px;
  }

  .section-head h1 {
    font-size: 30px;
    line-height: 1.1;
  }

  #page-access .search-row {
    width: min(100%, calc(100vw - 64px));
  }

  #page-access .search-row input,
  #page-access .search-row button {
    min-width: 0;
    width: 100%;
  }
}