/* Tủ sách điện tử — mọi lớp tiền tố ts- */
.ts [hidden], .ts-doc [hidden] { display: none !important; }
.ts-gt { color: var(--phu); margin-bottom: 1rem; }
.ts-nav { margin-bottom: 1rem; }
.ts-loc { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; align-items: end; margin-bottom: .5rem; }
.ts-loc__tim { grid-column: 1 / -1; }
.ts-loc .field { margin: 0; }
.ts-loc select, .ts-loc input { width: 100%; }
.ts-loc__nut { justify-self: start; }
@media (min-width: 700px) { .ts-loc { grid-template-columns: 1fr 1fr 1fr auto; } }

.ts-luoi { list-style: none; margin: .75rem 0 1.5rem; padding: 0; display: grid; gap: 12px; grid-template-columns: 1fr; }
@media (min-width: 560px) { .ts-luoi { grid-template-columns: 1fr 1fr; } }
.ts-the { display: flex; gap: 12px; background: var(--the); border: 1px solid var(--vien); border-radius: var(--r); padding: 12px; }
.ts-the__bia { flex: 0 0 64px; height: 90px; border-radius: 4px 8px 8px 4px; display: flex; align-items: center; justify-content: center;
  padding: 6px; text-decoration: none; color: #fff; font-size: .62rem; line-height: 1.2; text-align: center; font-weight: 700;
  box-shadow: inset 5px 0 0 rgba(0,0,0,.18), 0 1px 3px rgba(0,0,0,.15); background: #093166; overflow: hidden; }
.ts-the__bia span { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.ts-bia--tho { background: #6b3b5e; } .ts-bia--truyen_tho { background: #7a4a1e; } .ts-bia--truyen { background: #093166; }
.ts-bia--chinh_luan { background: #7a1f1f; } .ts-bia--phong_su { background: #2f5d50; } .ts-bia--khao_cuu { background: #4a4f57; }
.ts-bia--dan_gian { background: #5d5a1c; } .ts-bia--tuyen_tap { background: #3b4f7a; }
.ts-the__nd { min-width: 0; }
.ts-the__ten { font-size: 1.02rem; margin: 0 0 .2em; }
.ts-the__ten a { text-decoration: none; }
.ts-the__ten a:hover { text-decoration: underline; }
.ts-the__tg { margin: 0 0 .2em; font-size: .92rem; }
.ts-ng-vai { color: var(--phu); }
.ts-the__phu { margin: 0; color: var(--phu); font-size: .84rem; }
.ts-chan { margin-top: 1.5rem; }
.ts-doc-tiep { background: var(--nhan-nhat); border: 1px solid #efd9a8; border-radius: var(--r-nho); padding: 8px 12px; margin: .5rem 0 1rem; }
.ts-doc-tiep__h { font-weight: 700; margin: 0 0 .25em; }
.ts-doc-tiep ul { margin: 0; padding-left: 1.1rem; }

/* Trang sách */
.ts-sach__dau { display: flex; gap: 16px; align-items: flex-start; margin-bottom: 1rem; }
.ts-sach__bia { flex-basis: 96px; height: 136px; font-size: .78rem; }
.ts-sach__dau h1 { margin-top: 0; }
.ts-tt { display: grid; grid-template-columns: max-content 1fr; gap: 2px 12px; margin: 0 0 .8rem; font-size: .95rem; }
.ts-tt dt { color: var(--phu); } .ts-tt dd { margin: 0; }
.ts-ml { padding-left: 1.6rem; columns: 1; }
@media (min-width: 620px) { .ts-sach .ts-ml { columns: 2; column-gap: 28px; } }
.ts-ml li { margin: 0 0 .3em; break-inside: avoid; }
.ts-ml a[aria-current] { font-weight: 700; }
.ts-nguon { border-top: 1px solid var(--vien); margin-top: 1.25rem; padding-top: .75rem; }
.ts-tg-ds { list-style: none; padding: 0; columns: 1; }
@media (min-width: 560px) { .ts-tg-ds { columns: 2; } }
.ts-tg-ds li { margin: 0 0 .5em; break-inside: avoid; }
.ts-tg-ds .phu { display: block; }
.ts-tg-nam { font-size: 1.1rem; color: var(--phu); margin-top: -.3rem; }
.ts-lk li { margin-bottom: .6em; }
.ts-vb h2 { margin-top: 1.25rem; }

/* Trình đọc */
.ts-doc { --ts-co: 19px; --ts-nen: #fff; --ts-chu: #1d2a2c; --ts-phu: #5c6b6d; --ts-vien: #e2e6e1; }
.ts-doc[data-nen="giay"] { --ts-nen: #f6ecd6; --ts-chu: #3b2f1e; --ts-phu: #6e5d44; --ts-vien: #e2d3b3; }
.ts-doc[data-nen="toi"] { --ts-nen: #16191b; --ts-chu: #e2ded6; --ts-phu: #a3a8a6; --ts-vien: #33393c; }
body.ts-body-toi { background: #0e1012; }
body.ts-body-giay { background: #ece0c4; }
body.ts-body-toi .ts-doc a { color: #9cc3ff; }
.ts-cong-cu { position: sticky; top: 58px; z-index: 5; display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center;
  background: var(--the); border: 1px solid var(--vien); border-radius: var(--r-nho); padding: 6px 10px; margin: 0 0 12px; }
.ts-cong-cu__sach { font-weight: 700; text-decoration: none; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1 1 140px; }
.ts-cong-cu__nhom { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ts-nen-chon { min-height: 34px; border-radius: var(--r-nho); border: 1px solid var(--c-vien); padding: 2px 6px; background: #fff; }
.ts-ml-nho { position: relative; }
.ts-ml-nho summary { cursor: pointer; font-weight: 600; color: var(--c-dam); padding: 4px 2px; }
.ts-ml-nho[open] .ts-ml { position: absolute; left: 0; top: 100%; z-index: 6; width: min(86vw, 420px); max-height: 60vh; overflow: auto;
  background: var(--the); border: 1px solid var(--vien); border-radius: var(--r-nho); box-shadow: var(--bong); padding: 10px 10px 10px 2.2rem; margin: 4px 0 0; }
.ts-an-nhan { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ts-van { background: var(--ts-nen); color: var(--ts-chu); border: 1px solid var(--ts-vien); border-radius: var(--r); padding: 22px 20px 26px;
  font-family: "Noto Serif", "Times New Roman", Times, serif; font-size: var(--ts-co); line-height: 1.75; overflow-wrap: break-word; }
.ts-van__dau { text-align: center; margin-bottom: 1.2em; }
.ts-van__dau h1 { font-size: 1.35em; margin: .1em 0 .2em; }
.ts-van__dau .phu, .ts-van__sach { color: var(--ts-phu); font-size: .8em; margin: 0; }
.ts-van p { margin: 0 0 .9em; text-align: justify; hyphens: auto; }
.ts-van .ts-tho { text-align: left; margin-left: auto; margin-right: auto; width: fit-content; max-width: 100%; }
.ts-van .ts-dm { font-size: 1.05em; text-align: center; margin: 1.4em 0 .8em; }
.ts-van .ts-sao { text-align: center; color: var(--ts-phu); }
.ts-van sup { line-height: 0; font-size: .65em; }
.ts-van .ts-cc { text-decoration: none; }
.ts-chu-thich { border-top: 1px solid var(--ts-vien); margin-top: 1.5em; padding-top: .6em; font-size: .82em; line-height: 1.55; }
.ts-chu-thich h2 { font-size: 1em; }
.ts-chu-thich li { margin-bottom: .35em; }
.ts-chuyen { display: flex; justify-content: space-between; gap: 10px; margin: 14px 0; }
.ts-van__nguon { margin-top: 10px; }
body.ts-body-toi .ts-van__nguon, body.ts-body-toi .ts-chuyen + .ts-van__nguon { color: #a3a8a6; }
@media (max-width: 480px) { .ts-van { padding: 16px 14px 20px; border-radius: var(--r-nho); } .ts-sach__bia { display: none; }
  .ts-tt { grid-template-columns: 1fr; } .ts-tt dd { margin-bottom: .35em; } .ts-van p { text-align: left; } }

/* Duyệt */
.ts-duyet { list-style: none; padding: 0; margin: 1rem 0; display: grid; gap: 12px; }
.ts-duyet__muc { background: var(--the); border: 1px solid var(--vien); border-radius: var(--r); padding: 12px 14px; }
.ts-duyet__dau { display: flex; gap: 10px; align-items: baseline; justify-content: space-between; }
.ts-duyet__dau h2 { font-size: 1.05rem; margin: 0 0 .3em; }
.ts-duyet__form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ts-duyet__form input[name="ghi_chu"] { flex: 1 1 220px; min-height: 36px; border: 1px solid var(--c-vien); border-radius: var(--r-nho); padding: 4px 10px; }

@media print {
  body:has(.ts-doc) .dau, body:has(.ts-doc) .chan, body:has(.ts-doc) .demo-bar, .ts-cong-cu, .ts-chuyen { display: none !important; }
  body.ts-body-toi, body.ts-body-giay { background: #fff; }
  .ts-doc { --ts-nen: #fff; --ts-chu: #000; --ts-vien: #fff; }
  .ts-van { border: 0; padding: 0; font-size: 12pt; }
}