/* Usado por Components/Layout/Sidebar.razor */

/* ---- Marca ---- */
.brand {
  padding: 0 22px 20px; border-bottom: var(--border-w) solid var(--line); margin-bottom: 14px;
}
.brand-name {
  font-family: var(--f-display); font-weight: 600; font-size: 21px; letter-spacing: .01em;
}
.brand-name::after { content: "."; color: var(--accent); }
.brand-sub {
  font-family: var(--f-mono); font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--ink-3); margin-top: 2px;
}

/* ---- Navegação estilo índice de pranchas ---- */
.nav { flex: 1; padding: 4px 12px; }
.nav a {
  display: flex; align-items: baseline; gap: 10px;
  padding: 7px 10px; border-radius: var(--r);
  color: var(--ink-2); font-size: var(--fs-sm);
}
.nav a .n {
  font-family: var(--f-mono); font-size: 10px; color: var(--ink-3); width: 18px;
}
.nav a:hover { background: var(--surface-2); color: var(--ink); }
.nav a.active { background: var(--accent-soft); color: var(--ink); }
.nav a.active .n { color: var(--accent); }
.nav-sep {
  font-family: var(--f-mono); font-size: 9.5px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--ink-3); padding: 16px 10px 6px;
}

/* ---- Rodapé do sidebar: usuário + tema ---- */
.side-foot { padding: 14px 22px 0; border-top: var(--border-w) solid var(--line); }
.user { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; }
.avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--accent); color: var(--accent-ink);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 600; flex-shrink: 0;
}
/* min-width:0 é o que permite este item flex encolher abaixo do seu conteúdo — sem isso o
   texto empurra a sidebar ou quebra de forma estranha em vez de truncar numa linha só. */
.user-text { min-width: 0; }
.user b, .user span {
  display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.user b { font-size: var(--fs-sm); line-height: 1.2; }
.user span { font-size: var(--fs-xs); color: var(--ink-3); }
