/* Menu da equipe: lateral fixa em grupos + barra de cima com o nome da tela e o menu do nome. Claro por padrão, escuro com data-tema="escuro". */
:root{--tp-fundo:#FFFFFF;--tp-borda:#E6E6EB;--tp-texto:#16161B;--tp-texto-2:#55555F;--tp-texto-3:#8C8C97;--tp-hover:#F0F0F3;--tp-ativo:#FFF1EA;--tp-sombra:0 12px 34px rgba(20,20,30,.14);--lg-w:232px}
:root[data-tema="escuro"]{--tp-fundo:#121214;--tp-borda:#2A2A31;--tp-texto:#F1F1F4;--tp-texto-2:#B0B0B8;--tp-texto-3:#7A7A84;--tp-hover:#212127;--tp-ativo:rgba(254,101,26,.14);--tp-sombra:0 12px 34px rgba(0,0,0,.55)}
:root.lg-mini{--lg-w:64px}
body:has(.lg){padding-left:var(--lg-w)}
:root:not([data-tema="escuro"]) .lg .so-escuro,:root[data-tema="escuro"] .lg .so-claro{display:none}

/* lateral */
.lg{position:fixed;left:0;top:0;bottom:0;width:var(--lg-w);z-index:40;display:flex;flex-direction:column;background:var(--tp-fundo);border-right:1px solid var(--tp-borda);font:400 14px/1.2 Lato,system-ui,sans-serif;color:var(--tp-texto);transition:width .18s}
.lg a{text-decoration:none;color:inherit}
.lg-cabeca{height:56px;flex:0 0 56px;display:flex;align-items:center;justify-content:space-between;padding:0 10px 0 16px;border-bottom:1px solid var(--tp-borda)}
.lg-logo{display:flex;align-items:center}
.lg-logo img{height:22px;display:block}
.lg-logo .lg-marca{display:none;height:26px}
.lg-recolher{width:30px;height:30px;border-radius:8px;border:0;background:none;color:var(--tp-texto-3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.lg-recolher:hover{background:var(--tp-hover);color:var(--tp-texto)}
.lg-nav{flex:1;overflow-y:auto;padding:10px 10px;display:flex;flex-direction:column;gap:2px}
.lg-grupo{font-size:10.5px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--tp-texto-3);padding:14px 10px 6px}
.lg-grupo:first-child{padding-top:4px}
.lg-item{position:relative;display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:9px;color:var(--tp-texto-2);font-weight:700;white-space:nowrap}
.lg-item:hover{background:var(--tp-hover);color:var(--tp-texto)}
.lg-item.atual{background:var(--tp-ativo);color:var(--tp-texto)}
.lg-item.atual .lg-svg{color:#FE651A}
.lg-svg{width:19px;height:19px;flex:0 0 19px}
.lg-nome{flex:1;overflow:hidden;text-overflow:ellipsis}
.lg-bolha{min-width:20px;height:19px;padding:0 6px;border-radius:10px;background:#FE651A;color:#fff;font-size:11px;font-weight:900;display:inline-flex;align-items:center;justify-content:center}
.lg-bolha.vermelha{background:#E03131}
.lg-bolha.amarela{background:#E8A200}
.lg-bolha.cinza{background:var(--tp-hover);color:var(--tp-texto-2)}
.lg-pe{padding:8px 10px 12px;border-top:1px solid var(--tp-borda);display:flex;flex-direction:column;gap:2px}
/* recolhido: só os ícones */
:root.lg-mini .lg-cabeca{padding:0;justify-content:center;flex-direction:column;gap:2px;height:auto;min-height:56px}
:root.lg-mini .lg-logo .so-claro,:root.lg-mini .lg-logo .so-escuro{display:none}
:root.lg-mini .lg-logo .lg-marca{display:block;margin-top:8px}
:root.lg-mini .lg-recolher svg{transform:rotate(180deg)}
:root.lg-mini .lg-nome,:root.lg-mini .lg-grupo{display:none}
:root.lg-mini .lg-nav{padding-top:6px}
:root.lg-mini .lg-grupo+.lg-item,:root.lg-mini .lg-item+.lg-grupo{margin-top:0}
:root.lg-mini .lg-item{justify-content:center;padding:10px 0}
:root.lg-mini .lg-bolha{position:absolute;top:2px;right:4px;min-width:16px;height:16px;padding:0 4px;font-size:10px}
.lg-fundo{display:none}

/* barra de cima */
.tp{position:sticky;top:0;z-index:30;height:56px;display:flex;align-items:center;gap:10px;padding:0 20px;background:var(--tp-fundo);border-bottom:1px solid var(--tp-borda);font:400 14px/1.2 Lato,system-ui,sans-serif;color:var(--tp-texto)}
.tp a{text-decoration:none;color:inherit}
.tp-titulo{font-weight:900;font-size:15px}
.tp-seta{font-size:10px;color:var(--tp-texto-3)}
.tp-drop{position:relative}
.tp-drop>summary{list-style:none}
.tp-drop>summary::-webkit-details-marker{display:none}
.tp-caixa{position:absolute;top:calc(100% + 8px);left:0;min-width:240px;padding:6px;display:flex;flex-direction:column;background:var(--tp-fundo);border:1px solid var(--tp-borda);border-radius:12px;box-shadow:var(--tp-sombra);z-index:31}
.tp-caixa a,.tp-caixa button{display:flex;align-items:center;gap:11px;width:100%;padding:9px 10px;border:0;border-radius:8px;background:none;color:var(--tp-texto);font:700 14px/1.25 Lato,system-ui,sans-serif;text-align:left;cursor:pointer}
.tp-caixa a:hover,.tp-caixa button:hover{background:var(--tp-hover)}
.tp-caixa small{display:block;font-weight:400;font-size:12px;color:var(--tp-texto-3);margin-top:2px}
.tp-caixa .tp-ic{width:22px;flex:0 0 22px;text-align:center;font-size:15px}
.tp-cabeca{display:flex;align-items:center;gap:10px;padding:8px 10px 12px;margin-bottom:4px;border-bottom:1px solid var(--tp-borda)}
.tp-cabeca small{display:block;font-size:12px;color:var(--tp-texto-3);margin-top:2px}
.tp-sep{height:1px;background:var(--tp-borda);margin:4px 0}
.tp-eu{margin-left:auto}
.tp-eu .tp-caixa{left:auto;right:0}
.tp-eu>summary{display:flex;align-items:center;gap:8px;padding:4px 10px 4px 4px;border-radius:999px;cursor:pointer;color:var(--tp-texto-2);font-weight:700}
.tp-eu>summary:hover,.tp-eu[open]>summary{background:var(--tp-hover);color:var(--tp-texto)}
.tp-avatar{width:32px;height:32px;flex:0 0 32px;border-radius:50%;background:var(--cor,#FE651A);color:#fff;font:900 12px/1 Lato,system-ui,sans-serif;display:inline-flex;align-items:center;justify-content:center}
.tp-menu-botao{display:none;width:38px;height:38px;border-radius:9px;border:1px solid var(--tp-borda);background:var(--tp-fundo);color:var(--tp-texto);font-size:17px;cursor:pointer;align-items:center;justify-content:center}

/* celular: a lateral vira gaveta */
@media (max-width:900px){
  body:has(.lg){padding-left:0}
  .lg{width:260px;transform:translateX(-100%);transition:transform .2s;box-shadow:var(--tp-sombra)}
  :root.lg-mini .lg{width:260px}
  :root.lg-mini .lg-nome,:root.lg-mini .lg-grupo{display:block}
  :root.lg-mini .lg-item{justify-content:flex-start;padding:8px 10px}
  .lg-recolher{display:none}
  :root.lg-aberto .lg{transform:none}
  :root.lg-aberto .lg-fundo{display:block;position:fixed;inset:0;z-index:39;background:rgba(0,0,0,.35)}
  .tp-menu-botao{display:inline-flex}
  .tp{padding:0 12px}
  .tp-eu-nome{display:none}
}

/* botão de tema para as telas sem menu (entrar, senha, erro) */
.tema-flutuante{position:fixed;top:14px;right:14px;z-index:40;width:40px;height:40px;border-radius:50%;border:1px solid var(--tp-borda);background:var(--tp-fundo);color:var(--tp-texto);font-size:17px;cursor:pointer;box-shadow:var(--tp-sombra)}