/* tree-menu — menu em árvore (details/summary) usado nas páginas de conteúdo.
   Carregado globalmente no layout público; basta usar a marcação .tree-menu. */
.tree-menu{
  font-family:-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  display:inline-block;min-width:380px;margin:20px 0;font-size:15px;line-height:1.3;
  color:#334155;-webkit-font-smoothing:antialiased;
}
.tree-menu details{margin:2px 0}
/* indentação + guia vertical sutil dos filhos */
.tree-menu details > *:not(summary){
  margin-left:18px;border-left:1px solid #eef1f5;padding-left:14px;
}
/* nó clicável (pai) */
.tree-menu summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;
  padding:8px 13px;border-radius:9px;font-weight:600;color:#1e3a5f;
  letter-spacing:.1px;transition:background .15s ease,color .15s ease;
}
.tree-menu summary::-webkit-details-marker{display:none}
.tree-menu summary:hover{background:#f4f7fb}
.tree-menu details[open] > summary{color:#2563eb}
/* chevron desenhado em CSS (sem fonte/emoji) */
.tree-menu summary::before{
  content:'';width:6px;height:6px;margin-right:12px;flex:none;
  border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;
  transform:rotate(-45deg);transition:transform .18s ease;opacity:.7;
}
.tree-menu details[open] > summary::before{transform:rotate(45deg)}
/* nó folha (link final) */
.tree-menu .leaf{
  display:block;padding:8px 13px 8px 31px;color:#475569;
  text-decoration:none;border-radius:9px;font-weight:400;
  white-space:nowrap;
  transition:background .15s ease,color .15s ease;
}
.tree-menu .leaf:hover{background:#eff4ff;color:#2563eb}