/* =====================================================================
   รอบ 102: แถบแท็บของกลุ่มหน้า <PageTabs> (Components/PageTabs.razor) — prefix ptab-
   - อยู่บนสุดของ .content (MainLayout วางให้ตามหน้าปัจจุบัน) · สีจากตัวแปรใน :root → โหมดมืดใช้ได้เลย
   - มือถือ: เลื่อนแนวนอนในแถว (ไม่ทำให้หน้าเลื่อนข้าง) · ห้ามหด (บทเรียนรอบ 98: แถวที่มี overflow ใน flex column หดได้ถึง 0)
   ===================================================================== */
.ptab-bar {
  display: flex; gap: 2px; flex: none; flex-shrink: 0; min-height: 44px;
  margin: 0 0 16px; padding: 0 2px; border-bottom: 1px solid var(--line);
  overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.ptab-bar::-webkit-scrollbar { display: none; }
.ptab {
  display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto;
  min-height: 44px; padding: 8px 14px; margin-bottom: -1px;
  border-bottom: 2.5px solid transparent; border-radius: 10px 10px 0 0;
  color: var(--muted); font-weight: 500; white-space: nowrap; text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.ptab:hover { color: var(--ink); background: var(--brand-tint); }
.ptab:focus-visible { outline: 2px solid var(--brand); outline-offset: -2px; }
.ptab.active { color: var(--brand-text, var(--brand-strong)); border-bottom-color: var(--brand); font-weight: 700; }
.ptab-badge {
  display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 6px;
  border-radius: 999px; background: var(--brand); color: var(--brand-ink); font-style: normal; font-size: .74rem; font-weight: 700; line-height: 1;
}

/* หน้าพอดีจอ (.content เป็น flex column): แถบไม่หด ไม่ยืด */
@media screen and (min-width: 1025px) {
  .content:has(> .fit) > .ptab-bar { margin-bottom: 12px; }
}

@media (max-width: 760px) {
  .ptab-bar { margin: -4px -16px 12px; padding: 0 12px; }
  .ptab { padding: 8px 12px; font-size: .95rem; }
}

@media print {
  .ptab-bar { display: none !important; }
}