/* Khách hàng «Thư Ký Siêu Việt» (16/10): đồng hồ dùng thử, trạng thái chờ duyệt, đăng ký, pháp lý, trang quản trị Khách hàng. Không style nội tuyến (CSP). */
.cust-meter { border: 1px solid var(--ws-line, var(--line, #2a3350)); border-radius: 12px; padding: 10px 12px; margin: 0 0 10px; background: var(--ws-card, transparent); }
.cust-meter-h { margin: 0 0 6px; font-weight: 600; font-size: .9rem; }
.cust-meter-dl { display: grid; grid-template-columns: 1fr; gap: 4px; margin: 0; }
.cust-meter-dl div { display: flex; justify-content: space-between; gap: 8px; font-size: .85rem; }
.cust-meter-dl dt { color: var(--muted, #9aa3b8); }
.cust-meter-dl dd { margin: 0; }
.cust-bar { width: 100%; height: 6px; margin-top: 8px; accent-color: var(--gold, #d4a93a); }
.cust-pill { display: inline-block; padding: 0 8px; border-radius: 999px; font-size: .75rem; font-weight: 600; }
.cust-pill.ok { background: var(--ok-soft, #1b3a2b); color: var(--ok, #4ccf8a); }
.cust-pill.warn { background: var(--warn-soft, #3a311b); color: var(--warn, #e6b54a); }
.cust-pill.bad { background: var(--warn-soft, #3a1b1b); color: var(--warn, #ef7a7a); }
.cust-state { margin: 12px 16px 0; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--warn, #e6b54a); background: var(--warn-soft, #2d2716); }
.cust-state-h { margin: 0 0 4px; font-weight: 700; display: flex; align-items: center; gap: 8px; font-size: 1.05rem; }
.cust-state p { margin: 0; }
.cust-state-pending { border-color: var(--gold, #d4a93a); background: var(--gold-soft, #2b2614); }
.ws-side-brand a { color: inherit; }
/* trang đăng ký / 2 lớp / pháp lý */
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.signup-card { max-width: 460px; }
.login-hint { font-size: .8rem; color: var(--muted, #9aa3b8); margin: 4px 0 0; }
.login-alt { text-align: center; margin: 12px 0 0; font-size: .9rem; }
.login-alt a, .footer-note a, .consent a { color: var(--gold, #d4a93a); }
.consent { display: flex; gap: 10px; align-items: flex-start; font-size: .85rem; line-height: 1.45; margin: 6px 0 12px; }
.consent input { margin-top: 3px; flex: none; width: 18px; height: 18px; }
.twofa-qr { display: flex; justify-content: center; margin: 8px 0; }
.twofa-qr svg { max-width: 100%; height: auto; border-radius: 8px; }
.twofa-secret { word-break: break-all; }
.twofa-codes { columns: 2; font-size: 1rem; padding-left: 22px; }
a.login-btn { display: block; text-align: center; text-decoration: none; }
.legal-page { background: var(--ws-bg, #0b1020); color: var(--text, #e8ecf5); }
.legal { max-width: 760px; margin: 0 auto; padding: 24px 16px 64px; line-height: 1.6; }
.legal h1 { font-size: 1.6rem; } .legal h2 { font-size: 1.15rem; margin-top: 1.6em; }
.legal a { color: var(--gold, #d4a93a); }
/* quản trị Khách hàng */
.cust-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.cust-filter a { padding: 4px 12px; border-radius: 999px; border: 1px solid var(--line, #2a3350); text-decoration: none; }
.cust-filter a[aria-current="page"] { background: var(--gold-soft, #2b2614); border-color: var(--gold, #d4a93a); }
.cust-list { display: grid; gap: 12px; }
.cust-row-h { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cust-row-meta { font-size: .8rem; margin: 4px 0; }
.cust-acts { display: grid; gap: 8px; }
.cust-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.cust-form label { display: grid; gap: 2px; font-size: .8rem; }
.cust-form input { width: 9em; max-width: 100%; }
.cust-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.sec-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
@media (max-width: 480px) { .cust-form input { width: 100%; } .cust-form label { flex: 1 1 100%; } .twofa-codes { columns: 1; } }
/* 18/10 v2: đăng ký gọn — giải thích «học chung» sau «Chi tiết» */
.su-more { display: inline; }
.su-more > summary { display: inline; cursor: pointer; color: var(--gold, #d4a93a); font-weight: 600; }
.su-more[open] { display: block; margin-top: 4px; color: var(--muted, #9aa3b8); }
/* 18/10 v2 (phản biện): ô đồng ý NẰM CÙNG DÒNG với chữ; nhãn chữ thường (dễ đọc dấu tiếng Việt); chữ gợi ý + chân trang đủ tương phản ở chủ đề sáng */
body .login-form label.consent { display: flex; flex-direction: row; align-items: flex-start; gap: 10px; text-transform: none; letter-spacing: 0; font-weight: 500; }
body .login-form label.consent > input { flex: none; margin-top: 2px; }
body .login-form label.consent > span { flex: 1 1 auto; min-width: 0; }
body .login-field label { text-transform: none; letter-spacing: 0; font-size: .875rem; }
:root[data-theme="zeus-sang"] .login-input-wrap input::placeholder, :root[data-theme="toi-gian"] .login-input-wrap input::placeholder { color: #6b6352; opacity: 1; }
:root[data-theme="zeus-sang"] .login-field label, :root[data-theme="toi-gian"] .login-field label { color: #4a4537; }
body .login-footer { color: var(--muted, #99a2c6); padding: 0 16px; overflow-wrap: anywhere; }
body .login-footer a { color: inherit; font-weight: 650; white-space: nowrap; }
/* đăng nhập (phản biện 18/10 vòng 2): cùng cách sửa như đăng ký + chú thích chân thẻ đủ tương phản, không tràn ở 360 */
body .footer-note { color: var(--muted, #99a2c6); text-align: center; line-height: 1.7; }
body .footer-note a { color: var(--text, #eef1ff); }
:root[data-theme="zeus-sang"] .footer-note, :root[data-theme="toi-gian"] .footer-note { color: #4a4537; }
:root[data-theme="zeus-sang"] .footer-note a, :root[data-theme="toi-gian"] .footer-note a { color: #1c1a16; }
body .login-alt a { white-space: nowrap; }
body .login-btn { white-space: nowrap; }
.login-alt .nw { white-space: nowrap; }
:root[data-theme="zeus-sang"] .footer-note a, :root[data-theme="toi-gian"] .footer-note a { color: #8a5600; }
/* 19/10 «Quên mật khẩu» */
.login-forgot { margin: -6px 0 0; text-align: right; font-size: .85rem; }
.login-forgot a { color: var(--gold, #d4a93a); }
.login-alert.ok { background: rgba(80,200,140,.12); border: 1px solid rgba(80,200,140,.35); color: #7fdcae; }
:root[data-theme="zeus-sang"] .login-alert.ok, :root[data-theme="toi-gian"] .login-alert.ok { color: #1d6b45; }
.pw-steps { margin: 0 0 14px; padding-left: 1.2em; font-size: .88rem; line-height: 1.6; }
.pw-temp { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 10px 0; }
.pw-temp code { font-size: 1.15rem; letter-spacing: .04em; padding: 6px 10px; border-radius: 8px; user-select: all; word-break: break-all; }
.pw-card-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.cust-alias { margin-top: 6px; }