/* v0.48.0: giao diện sáng có thanh menu sáng, trang đăng nhập theo giao diện sáng / tối */

/* ---- Thanh menu bên trái ở giao diện sáng ---- */
body:not(.theme-dark) aside{background:#fff;border-right:1px solid #e4e9f0;scrollbar-color:#c7d0dc #eef1f6}
body:not(.theme-dark) .brand{color:#101828;border-bottom:1px solid #e4e9f0}
body:not(.theme-dark) .brand .brand-name{color:#101828}
body:not(.theme-dark) .brand button{color:#667085}
body:not(.theme-dark) .brand button:hover{background:#eef4ff;color:var(--brand,#0964fe)}
body:not(.theme-dark) nav a,body:not(.theme-dark) nav button,body:not(.theme-dark) nav details>summary{color:#344054}
body:not(.theme-dark) nav details>summary{background:#f6f8fb}
body:not(.theme-dark) nav .solid-icon,body:not(.theme-dark) nav details>summary .solid-icon{color:#667085}
body:not(.theme-dark) nav a:hover,body:not(.theme-dark) nav button:hover,body:not(.theme-dark) nav details>summary:hover{background:#eef4ff;color:var(--brand,#0964fe)}
body:not(.theme-dark) nav a:hover .solid-icon,body:not(.theme-dark) nav button:hover .solid-icon,body:not(.theme-dark) nav details>summary:hover .solid-icon{color:var(--brand,#0964fe)}
body:not(.theme-dark) nav .active,body:not(.theme-dark) nav a.active{background:color-mix(in srgb,var(--brand,#0964fe) 12%,#fff);color:var(--brand,#0964fe);font-weight:600;box-shadow:inset 3px 0 0 var(--brand,#0964fe)}
body:not(.theme-dark) nav .active .solid-icon{color:var(--brand,#0964fe)}
body:not(.theme-dark) nav .active:hover{background:color-mix(in srgb,var(--brand,#0964fe) 18%,#fff)}
body:not(.theme-dark) aside nav a:focus-visible,body:not(.theme-dark) aside nav button:focus-visible{outline:2px solid var(--brand,#0964fe);outline-offset:-2px}

/* ---- Trang đăng nhập ---- */
.login-card{position:relative}
.login-theme{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid #d0d5dd;border-radius:9px;background:transparent;color:#475467}
.login-theme:hover,.login-theme:focus-visible{border-color:var(--brand,#0964fe);background:#eef4ff;color:var(--brand,#0964fe)}
.login-theme .solid-icon{width:17px;height:17px;flex-basis:17px}
body:not(.theme-dark) .login-page{background:radial-gradient(circle at top,#eef4ff,#f3f5f8 70%)}
body:not(.theme-dark) .login-card{border:1px solid #e4e9f0;box-shadow:0 18px 48px #10182814}

body.theme-dark .login-page{background:radial-gradient(circle at top,color-mix(in srgb,var(--d-accent,#5b9dff) 18%,#0a101d),#070c15 70%)}
body.theme-dark .login-card{border:1px solid var(--d-line,#22304a);background:var(--d-surface,#111a2b);color:var(--d-ink,#e6ecf6);box-shadow:0 18px 48px #0009}
body.theme-dark .login-card h1,body.theme-dark .login-logo-text{color:var(--d-ink,#e6ecf6)}
body.theme-dark .login-card .login-input{border-color:var(--d-line-2,#2b3b59);background:var(--d-surface-2,#162034);color:var(--d-ink,#e6ecf6)}
body.theme-dark .login-card .login-input::placeholder{color:var(--d-ink-3,#93a2bb)}
body.theme-dark .login-card .login-input:focus{border-color:var(--d-accent,#5b9dff)}
body.theme-dark .login-card .login-or,body.theme-dark .login-card .hint,body.theme-dark .login-card .login-foot,body.theme-dark .login-card .login-remember{color:var(--d-ink-2,#c2cde0)}
body.theme-dark .login-card .google-login{border-color:var(--d-line-2,#2b3b59);background:var(--d-surface-2,#162034);color:var(--d-ink,#e6ecf6)}
body.theme-dark .login-card .google-login:hover{border-color:var(--d-accent,#5b9dff);background:#1b2942}
body.theme-dark .login-theme{border-color:var(--d-line-2,#2b3b59);color:var(--d-ink-2,#c2cde0)}
body.theme-dark .login-theme:hover,body.theme-dark .login-theme:focus-visible{border-color:var(--d-accent,#5b9dff);background:#1b2942;color:var(--d-accent,#5b9dff)}
body.theme-dark .login-card .login-help,body.theme-dark .login-card a{color:var(--d-accent,#5b9dff)}

/* ---- Cài đặt: ô logo cho giao diện tối ---- */
.brand-asset-dark .hint{margin:6px 0 0}