/* กระดิ่งแจ้งเตือน + ข้อความ บนแถบหัวเว็บ */
.tvs-hdr { display: flex; align-items: center; gap: 2px; margin: 0 4px; }
.tvs-hdr-wrap { position: relative; }
.tvs-hdr-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 0; border-radius: 21px; background: transparent; color: #33423F; cursor: pointer; text-decoration: none; padding: 0; }
.tvs-hdr-btn:hover, .tvs-hdr-btn[aria-expanded="true"] { background: #F2F4F3; color: #12201F; }
.tvs-hdr-n { position: absolute; top: 4px; right: 3px; min-width: 17px; height: 17px; padding: 0 4px; box-sizing: border-box; border-radius: 9px; background: #C2410C; color: #fff; font-size: 11px; font-weight: 500 !important; line-height: 17px; text-align: center; }
.tvs-hnotes { position: absolute; right: 0; top: calc(100% + 8px); z-index: 1000; width: min(360px, 92vw); max-height: 70vh; overflow-y: auto; background: #fff; border: 1px solid #E1E6E5; border-radius: 16px; box-shadow: 0 12px 40px rgba(18, 32, 31, .16); padding: 8px; text-align: left; }
.tvs-hnotes-h { margin: 6px 8px 8px; font-weight: 500; font-size: 15px; color: #12201F; }
.tvs-hnotes ul { list-style: none; margin: 0; padding: 0; }
.tvs-hnotes li { display: flex; gap: 10px; align-items: flex-start; padding: 8px; border-radius: 12px; font-size: 14px; line-height: 1.45; color: #12201F; }
.tvs-hnotes li.is-new { background: #FDF1EA; }
.tvs-hnotes li small { display: block; color: #5A6A68; font-size: 12px; }
.tvs-hnotes li a { color: #12201F; font-weight: 500; text-decoration: none; }
.tvs-hnotes li b { font-weight: 500; }
.tvs-hnotes .tvs-hnotes-e { color: #5A6A68; justify-content: center; }
.tvs-hdr-av { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 16px; background: #F3D9C6; color: #7C2D12; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 500; }
@media (max-width: 760px) { .tvs-hdr-btn { width: 38px; height: 38px; } }