/* Thành phần dùng chung giữa vỏ quản trị (index.html) và trang độc lập (sct.html): thanh tab
 * (.subtabs) và nhãn (.flag). Trước đây nằm ở shell.css và giao-dien.css; sct.html không nạp hai
 * tệp đó nên các thành phần này mất kiểu trên trang độc lập. Trong tệp này quy tắc gốc đứng trước,
 * phần ghi đè (từng ở giao-dien.css) đứng sau — cùng thứ tự cascade như cũ. */
/* Mỗi bộ danh mục là một phân hệ: tra cứu, cây, bản dịch, API — cùng một khuôn cho mọi bộ. */
.subtabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 16px;
  overflow-x: auto;
}
.subtabs button {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 8px 14px;
  min-height: 34px;
  font: inherit;
  color: var(--ink-soft);
  cursor: pointer;
  white-space: nowrap;
}
.subtabs button[aria-selected="true"] {
  color: var(--seal);
  border-bottom-color: var(--seal);
  font-weight: 600;
}

/* Thanh tab: gạch chân dày dưới tab đang mở, không nền, không viền hộp. */
.subtabs { border-bottom-color: var(--line); gap: 0; }
.subtabs button { font-size: var(--fs-l); padding: 9px 0; margin-right: 26px; }
.subtabs button[aria-selected="true"] { border-bottom-width: 2px; }

/* Nhãn trạng thái. */
.flag { font-size: var(--fs-xs); padding: 1px 8px; border-radius: 10px; white-space: nowrap; }
.flag.info { background: var(--seal-soft); color: var(--seal); }
.flag.warn { background: color-mix(in srgb, var(--warn) 16%, transparent); color: var(--warn); }
.flag.err { background: color-mix(in srgb, var(--err) 14%, transparent); color: var(--err); }
/* Ghi đè từng ở giao-dien.css (`.pill, .flag`). */
.flag { border-radius: 2px; white-space: nowrap; }