/* stats.html: geladen via <link> zodat de browser het cachet. */
  /* Tab-strip: past de rij niet, dan scrollt hij horizontaal i.p.v. de
     labels over twee regels te persen en de pagina breder te maken. */
  .tab-strip {
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .tab-strip::-webkit-scrollbar { display: none; }
  .tab-btn {
    padding: 0.5rem 1rem;
    border-bottom: 2px solid transparent;
    color: #6b7280;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .tab-btn:hover { color: #111827; }
  .tab-btn.active {
    color: #003082;
    border-bottom-color: #003082;
    font-weight: 600;
  }
  .period-btn {
    padding: 0.35rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    color: #374151;
    background: white;
    cursor: pointer;
  }
  .period-btn.active {
    background: #003082;
    color: white;
    border-color: #003082;
  }
  .period-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
  }
  /* Touch: knoppen minstens 44px hoog (desktop houdt de compacte maat). */
  @media (pointer: coarse) {
    .tab-btn, .period-btn, #p-clear { min-height: 44px; }
  }
  .ac-dropdown {
    position: absolute; z-index: 30; background: white;
    border: 1px solid #e5e7eb; border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
    max-height: 15rem; overflow-y: auto; width: 100%;
    list-style: none; padding: 0.25rem 0; margin: 0.25rem 0 0;
  }
  .ac-item {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.5rem 0.75rem; cursor: pointer; font-size: 0.875rem;
  }
  .ac-item:hover, .ac-item.active { background: #f3f4f6; }
  .ac-code {
    font-family: ui-monospace, monospace; font-size: 0.75rem;
    color: #6b7280; background: #f3f4f6; padding: 0.1rem 0.4rem; border-radius: 0.25rem;
  }
  .sort-hdr, .vtr-hdr { cursor: pointer; user-select: none; }
  .sort-hdr:hover, .vtr-hdr:hover { color: #003082; }
  .sort-hdr .arrow, .vtr-hdr .arrow { color: #9ca3af; font-size: 0.75rem; }
  .sort-hdr.asc  .arrow::before,
  .vtr-hdr.asc   .arrow::before { content: '▲'; color: #003082; }
  .sort-hdr.desc .arrow::before,
  .vtr-hdr.desc  .arrow::before { content: '▼'; color: #003082; }