/* 會員登入（login.html）與註冊會員（register.html）共用樣式。
   設計前提：60 歲以上的使用者。內文 18px、輸入框 20px、按鈕至少 52px 高，
   錯誤訊息貼在欄位正下方，狀態一律「符號＋文字」，不只靠顏色。 */
:root{
  --bg:#FAF8F5; --card:#FFFFFF; --ink:#1C1C1C; --ink2:#4A4D49; --ink3:#6C6F6B;
  --a:#5B7665; --ah:#465E50; --faint:#EFF4F1; --bd:#DAD3C9; --bd2:#EDE7DF;
  --err:#B3261E; --err-bg:#FDECEA; --ok:#2E6B4A; --ok-bg:#EAF4EE; --focus:#1F5FBF;
  --serif:"Noto Serif TC",'Songti TC','PMingLiU',Georgia,serif;
  --sans:"Noto Sans TC",system-ui,-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:18px;line-height:1.65}
a{color:var(--a);text-underline-offset:3px}
a:hover{color:var(--ah)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:6px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:10}

.au-top{display:flex;align-items:center;justify-content:space-between;max-width:560px;margin:0 auto;padding:14px 16px}
.au-logo{font-family:var(--serif);font-size:22px;font-weight:700;color:var(--ink);text-decoration:none;letter-spacing:.08em}
.au-top a.au-home{font-size:17px}

.au-card{max-width:560px;margin:0 auto 40px;background:var(--card);border:1px solid var(--bd2);border-radius:18px;
  padding:28px 28px 30px;box-shadow:0 6px 24px rgba(40,30,20,.06)}
@media (max-width:600px){ .au-card{border-radius:0;border-left:0;border-right:0;padding:22px 16px 26px} }
.au-card h1{font-family:var(--serif);font-size:28px;font-weight:700;margin:0 0 6px;text-align:center;letter-spacing:.06em}
.au-lede{color:var(--ink2);text-align:center;margin:0 0 18px}

.f{margin:0 0 18px}
.f > label, .f > .lab{display:flex;align-items:baseline;gap:8px;font-weight:700;font-size:18px;margin:0 0 6px}
.req{font-size:14px;font-weight:700;color:var(--err);border:1px solid #E6B8B4;border-radius:999px;padding:0 8px;line-height:1.6}
.opt{font-size:14px;font-weight:500;color:var(--ink3);border:1px solid var(--bd);border-radius:999px;padding:0 8px;line-height:1.6}
input[type=email],input[type=text],input[type=password],input[type=tel],input[type=date]{
  width:100%;min-height:54px;font-size:20px;font-family:inherit;color:var(--ink);background:#fff;
  border:1.5px solid var(--bd);border-radius:10px;padding:10px 14px}
input::placeholder{color:#8B8E89}
input:disabled{background:#F2EFEA;color:#8B8E89;cursor:not-allowed}
input[aria-invalid=true]{border-color:var(--err);box-shadow:0 0 0 1px var(--err)}
.row{display:flex;gap:10px;align-items:stretch}
.row > input{flex:1 1 auto;min-width:0}
.row > .btn{flex:0 0 auto}
@media (max-width:420px){ .row.stack{flex-direction:column} .row.stack > .btn{width:100%} }

.err{color:var(--err);font-weight:700;font-size:17px;margin:6px 0 0}
.err:empty{display:none}
.note{color:var(--ink2);font-size:16px;margin:6px 0 0}
.okline{color:var(--ok);font-weight:700;font-size:17px;margin:6px 0 0}
.okline:empty{display:none}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:8px 18px;
  font-size:19px;font-weight:700;font-family:inherit;border-radius:12px;border:1.5px solid var(--a);
  background:#fff;color:var(--a);cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover:not(:disabled){background:var(--faint)}
.btn-primary{width:100%;background:var(--a);color:#fff;font-size:21px;letter-spacing:.2em}
.btn-primary:hover:not(:disabled){background:var(--ah)}
.btn:disabled{background:#E7E3DD;border-color:#D3CDC4;color:#7E7A73;cursor:not-allowed;letter-spacing:normal}
.btn-primary:disabled{letter-spacing:.2em}
.btn[aria-busy=true]::before{content:"";width:18px;height:18px;border-radius:50%;border:3px solid currentColor;
  border-right-color:transparent;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .btn[aria-busy=true]::before{animation:none} }
.btn-google{width:100%;border-color:var(--bd);color:var(--ink);background:#fff;font-weight:700}
.btn-google svg{width:24px;height:24px;flex:0 0 auto}

.linkbtn{background:none;border:0;padding:6px 2px;font:inherit;font-size:18px;color:var(--a);text-decoration:underline;
  text-underline-offset:3px;cursor:pointer;min-height:44px}
.between{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin:-6px 0 14px}
.or{display:flex;align-items:center;gap:12px;color:var(--ink3);margin:20px 0}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--bd)}
.alt{text-align:center;margin:16px 0 0;font-size:18px}
.alt a{font-weight:700}

.alert{border-radius:10px;padding:12px 14px;margin:0 0 18px;font-size:17px;line-height:1.6}
.alert:empty{display:none}
.alert.bad{background:var(--err-bg);border:1px solid #E6B8B4;color:#7A1F1A}
.alert.good{background:var(--ok-bg);border:1px solid #B9D8C5;color:#1F4D33}
.alert.info{background:var(--faint);border:1px solid #CFE0D6;color:#2C4A3A}

.rules{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;font-size:16px}
@media (max-width:420px){ .rules{grid-template-columns:1fr} }
.rules li{color:var(--ink3)}
.rules li.ok{color:var(--ok);font-weight:700}
.rules li.no{color:var(--ink3)}

.radios{display:flex;gap:10px;flex-wrap:wrap}
.radios label{display:flex;align-items:center;gap:8px;min-height:50px;padding:6px 16px;border:1.5px solid var(--bd);
  border-radius:10px;font-size:19px;cursor:pointer;background:#fff}
.radios input{width:22px;height:22px;accent-color:var(--a)}
.radios label:has(input:checked){border-color:var(--a);background:var(--faint);font-weight:700}

.agree{border-top:1px solid var(--bd2);padding-top:16px;margin-top:6px}
.agree label{display:flex;gap:12px;align-items:flex-start;font-size:17px;line-height:1.6;cursor:pointer;margin:0 0 6px}
.agree input{width:24px;height:24px;margin-top:2px;flex:0 0 auto;accent-color:var(--a)}
.agree .docs{font-size:16px;margin:4px 0 14px 36px;color:var(--ink2)}
.verified{display:flex;align-items:center;gap:8px;background:var(--ok-bg);border:1px solid #B9D8C5;color:#1F4D33;
  border-radius:10px;padding:10px 14px;font-weight:700;word-break:break-all}
.hide{display:none!important}

/* ── 註冊：兩份文件分別閱讀確認（2026-10-16）── */
.docs-read{border:1px solid var(--bd);border-radius:12px;padding:12px 14px;background:#fff;margin:0 0 12px}
.docs-read .lab{font-weight:700;margin:0 0 8px}
.doc-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 8px}
.btn-doc{min-height:48px;font-size:18px;width:auto;padding:6px 16px}
.doc-st{font-size:16px;color:var(--ink3)}
.doc-st.done{color:#2E6B4A;font-weight:700}
.agree-all input:disabled + span{color:var(--ink3)}
body.doc-lock{overflow:hidden}
.doc-ov{position:fixed;inset:0;z-index:200;background:rgba(28,28,28,.55);display:flex;align-items:center;justify-content:center;padding:16px}
.doc-ov.hide{display:none}
.doc-box{background:#fff;border-radius:16px;width:100%;max-width:760px;max-height:calc(100vh - 32px);display:flex;flex-direction:column;overflow:hidden}
.doc-head{padding:14px 18px 8px;border-bottom:1px solid var(--bd2)}
.doc-head h2{margin:0;font-family:var(--serif);font-size:23px}
.doc-meta{margin:4px 0 0;font-size:16px;color:var(--ink2)}
.doc-body{flex:1 1 auto;overflow:auto;padding:12px 18px;font-size:18px;line-height:1.75;min-height:120px}
.doc-body:focus-visible{outline:3px solid #1F5FBF;outline-offset:-3px}
.doc-body h1{font-size:22px}.doc-body h2{font-size:20px}.doc-body h3{font-size:19px}
.doc-end{text-align:center;color:var(--ink3);margin:16px 0 4px}
.doc-foot{border-top:2px solid var(--bd);padding:10px 18px 14px;background:var(--bg)}
.doc-hint{margin:0 0 6px;font-size:16px;font-weight:700}
.doc-chk{display:flex;gap:10px;align-items:center;font-size:18px;cursor:pointer;min-height:44px}
.doc-chk input{width:24px;height:24px}
.doc-chk:has(input:disabled){opacity:.6;cursor:not-allowed}
.doc-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.doc-btns .btn{width:auto;min-height:50px;font-size:18px;padding:6px 18px}
@media (max-width:600px){
  .doc-ov{padding:0;align-items:stretch}
  .doc-box{max-height:none;height:100%;border-radius:0}
  .doc-btns{flex-direction:column}
  .doc-btns .btn{width:100%}
}

/* 註冊頁：兩份文件確認後收起的一行（2026-10-25） */
.docs-done{margin:0 0 10px;padding:10px 12px;border:1px solid #CFE0D6;border-radius:10px;background:var(--faint);font-size:16px;line-height:1.7}
.link-btn{font:inherit;font-size:16px;background:none;border:0;padding:0 4px;color:#2C4A3A;text-decoration:underline;cursor:pointer;min-height:36px}
