/* ── block 1/2 ── */
body { background-color: var(--bg); color: var(--text); }
/* logo light/dark sync */
.db-logo{height:38px;width:auto;display:block}
.logo-dark,.theme-dark .logo-light{display:none!important}
.theme-dark .logo-dark{display:block!important}
/* sb-foot-btn / sun-moon icon toggle / lang-dropdown 已集中至 _components.css */

/* ── 亮模式覆蓋 — 主 body 已吃 token；以下保留 divide / globe / banner 等需單獨處理的 ── */
.theme-light .divide-\[\#2a2a35\]>:not([hidden])~:not([hidden]){border-color:#e3e3ec!important}
/* 亮版 Email 未驗證提示：amber 在白底太淡，加深對比 */
.theme-light #email-banner{background-color:#fff7e6!important;border-color:#f59e0b!important}
.theme-light #email-banner .text-amber-300{color:#b45309!important}
.theme-light #email-banner #resend-btn{background-color:#fef3c7!important;border-color:#f59e0b!important;color:#92400e!important}
.theme-light #email-banner #resend-btn:hover{background-color:#fde68a!important}

/* ══════════════════════════════════════════════════════════
   ARSHIRE SIDEBAR LAYOUT (aligned with about.html)
   theme + color tokens 全吃 _tokens.css；本檔只留 layout var
   ══════════════════════════════════════════════════════════ */
:root{ --sidebar-w:220px; --pad-x:2rem; }
@media(max-width:768px){ :root{ --sidebar-w:0px; --pad-x:1.25rem } }

body.has-sidebar{overflow:hidden}
@media(max-width:768px){body.has-sidebar{overflow:auto}}

#neural-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}

.dash-wrap{position:fixed;inset:0;z-index:1;display:grid;grid-template-columns:var(--sidebar-w) 1fr;background:var(--bg);overflow:hidden}
.dash-sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border-dim);display:flex;flex-direction:column;overflow:hidden;height:100vh}
.dash-main{display:flex;flex-direction:column;height:100vh;overflow:hidden;min-width:0}
.dash-content{flex:1;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;min-height:0;background:var(--bg)}
.dash-content::-webkit-scrollbar{width:4px}
.dash-content::-webkit-scrollbar-track{background:transparent}
.dash-content::-webkit-scrollbar-thumb{background:var(--border-mid);border-radius:2px}
.dash-content section[id]{scroll-margin-top:1rem}

/* .sb-* 已集中至 _components.css（含 .sb-footer / .lang-dropdown / .sb-item.danger / .sb-cta::before）
 * dashboard 多了 .sb-cta::before 裝飾圈（centralized 帶入），其他無視覺變化 */

/* Mobile topbar / overlay */
/* m-topbar / m-tb-* / m-logo-img / m-ham-line / m-top-lang-drop 收歸 _components.css；以下只保留 dashboard 專屬 .m-icon-btn namespace + .m-ham-btn flex 排版補充 */
.m-icon-btn{width:36px;height:36px;border:1px solid rgba(108,110,229,.14);background:#6c6ee512;border-radius:9px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#6c6ee5;flex-shrink:0;padding:0;transition:background .2s ease}
.m-icon-btn svg{width:14px;height:14px;display:block}
.m-icon-btn .icon-theme{width:22px;height:22px;display:block}
.theme-dark .m-icon-btn{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff}
.m-ham-btn{flex-direction:column;justify-content:center;gap:6px;padding:0 10px}

/* m-overlay 結構樣式收歸 _components.css；下行只保留 dashboard 專屬 danger 變體 */
.m-ov-item.danger{color:rgba(229,115,115,.9)}
.m-top-lang-drop{position:fixed;top:58px;right:1.25rem;background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:.35rem;box-shadow:0 4px 24px rgba(0,0,0,.16);display:none;flex-direction:column;gap:.1rem;z-index:60;min-width:128px}
.m-top-lang-drop.open{display:flex}

/* Footer (about.html-style) */
.as-footer{border-top:1px solid var(--border-dim);background:var(--bg-titlebar)}
.as-footer-inner{max-width:1200px;margin:0 auto;padding:2.5rem var(--pad-x);display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:start;gap:2.5rem}
.as-footer .logo{height:72px;width:auto;display:block;margin-bottom:.45rem;opacity:.7}
.as-footer .tagline{font-size:.76rem;color:var(--text-dim);max-width:26rem;line-height:1.65}
.as-footer-links{display:flex;gap:2rem}
.as-footer-links a{font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);text-decoration:none}
.as-footer-links a:hover{color:var(--text-muted)}
.as-footer-contact{display:flex;flex-direction:column;gap:.5rem}
.as-footer-contact-title{font-family:'DM Mono',monospace;font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin-bottom:.2rem}
.as-footer-contact-item{display:flex;align-items:center;gap:.45rem;font-size:.76rem;color:var(--text-dim);text-decoration:none}
.as-footer-contact-item:hover{color:var(--text-muted)}
.as-footer-contact-item svg{width:13px;height:13px;flex-shrink:0}
.as-copy{font-family:'DM Mono',monospace;font-size:.62rem;color:var(--text-dim);width:100%;grid-column:1/-1;opacity:.6;text-align:center;padding-bottom:1.5rem}

@media(max-width:768px){
  .dash-wrap{position:relative;display:block;height:auto;min-height:100svh;overflow:visible}
  .dash-sidebar{display:none}
  .dash-main{display:block;height:auto;overflow:visible}
  .dash-content{overflow:visible;height:auto;padding:calc(52px + 1rem) 1rem 0!important;padding-bottom:0;min-height:100svh}
  .m-topbar,.m-overlay{display:block}
  .as-footer-inner{justify-content:flex-start}
}

/* ── block 2/2 ── */
.theme-light .logo-light { display: block !important; }
.theme-light .logo-dark  { display: none  !important; }
.theme-dark  .logo-light { display: none  !important; }
.theme-dark  .logo-dark  { display: block !important; }

/* Phase D — 抽出原 inline styles */
.sb-logout-pad { margin: 0 .5rem .35rem; }
.dash-content-padded { padding: 1.5rem 1rem 0; position: relative; z-index: 1; }

/* Dashboard 章節分組 — h2 小標 + sidebar 群組 label */
.dash-group-title{
  font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;
  color:var(--text-muted);margin:1.75rem .25rem .65rem;padding-bottom:.55rem;
  border-bottom:1px solid var(--border-dim);display:flex;align-items:center;gap:.5rem;
}
.dash-group-title:first-of-type{margin-top:.25rem}
.dash-group-title .dgt-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);opacity:.7}
.dash-group-title .dgt-dot--danger{background:#ef4444}
.sb-group-label{
  font-size:.62rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;
  color:var(--text-dim);padding:.7rem .9rem .25rem;
}
.sb-group-label:first-child{padding-top:.2rem}
.m-ov-group-label{
  font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;
  color:var(--text-dim);padding:.6rem .9rem .15rem;
}

/* 帳號綁定 — provider 顏色 dot (原 inline style="background:${color}" 改 CSS) */
.bind-dot[data-provider="google"]   { background: #ea4335; }
.bind-dot[data-provider="discord"]  { background: #5865f2; }
.bind-dot[data-provider="line"]     { background: #06c755; }
.bind-dot[data-provider="facebook"] { background: #1877f2; }

/* Chrome / Safari autofill：用 inset box-shadow 蓋過 autofill 預設白底；
   transition 5000s 是業界 hack 壓掉 ~150ms autofill 動畫期間露出的白底。
   bg/text 全吃 token，dark/light 自動切換，不再需要 .theme-light 變體。 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-text-fill-color: var(--text) !important;
  -webkit-box-shadow: 0 0 0 1000px var(--bg-elevated) inset !important;
  caret-color: var(--text) !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

/* 密碼欄位顯示/隱藏（套用 login 同一視覺）*/
.field-input-wrap{position:relative}
.field-input-wrap .field-input{padding-right:2.75rem}
.eye-btn{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:var(--text-dim);padding:.25rem;display:flex;align-items:center;transition:color .18s ease}
.eye-btn:hover,.eye-btn.eye-active{color:var(--accent)}
.eye-btn svg{width:18px;height:18px}
