/* Layar login dan info akun. Memakai token warna dari styles.css. */
body.belum-masuk .topbar,
body.belum-masuk #view,
body.belum-masuk .bottomnav,
body.belum-masuk .skip { display: none; }

.layar-login { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.login-card { width: 100%; max-width: 380px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-l); padding: 28px 24px; display: grid; gap: 16px; }
.login-card h1 { font-size: 1.5rem; margin: 0; }
.login-card .brand { margin-bottom: 4px; }
.login-card .btn-lg { width: 100%; }
.login-card .muted { margin: -8px 0 0; }

.pengguna-info { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; font-size: .875rem; }
.pengguna-info span { color: var(--ink-2); font-size: .75rem; }
#pilihGudang:disabled { opacity: 1; color: var(--ink); background: var(--surface-2); cursor: default; }

@media (max-width: 720px) {
  .pengguna-info { display: none; }
  #btnKeluar, #btnAkun { min-height: 40px; padding: 0 10px; }
}

/* Akun: ganti password dan reset oleh superadmin (KF-24) */
.akun-form { display: grid; gap: 14px; }
.akun-form h3, .akun-reset h3 { margin: 0; }
.akun-reset { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); display: grid; gap: 10px; }
.akun-daftar { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.akun-daftar li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-m); }
.akun-daftar p { margin: 2px 0 0; }
.sandi-baris { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.sandi { font-size: 1.25rem; letter-spacing: .06em; padding: 6px 10px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r-s); user-select: all; }

/* HP: header aplikasi berisi pilihan gudang + Akun + Keluar. Nama BramantyaStock tidak muat bersama
   ketiganya, jadi di header hanya ikon (nama tetap di halaman login, judul tab, dan layar lebar). */
@media (max-width: 420px) {
  .topbar .brand-mark { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}