/* Ferramentas da pasta Secretaria (RH, Alunos, Clube do Vet):
   barra superior e menu lateral iguais aos do Kaleizu Metrics (lancamento.html).
   Carregar depois do kaleizu.css. */

/* ── Barra superior ── */
header.topbar.km{height:54px;margin:12px 24px 0;border-radius:16px;background:rgba(10,13,30,.72)!important;border:1px solid rgba(255,255,255,.13);box-shadow:0 10px 30px rgba(0,0,0,.35);
  backdrop-filter:blur(22px) saturate(120%);-webkit-backdrop-filter:blur(22px) saturate(120%);display:flex;align-items:center;padding:0 10px 0 14px;gap:14px;position:sticky;top:12px;z-index:50}
.km .topbar-logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.km .topbar-logo img{height:22px;width:auto;object-fit:contain}
.km .topbar-name{font-family:var(--f-txt);font-size:15px;font-weight:600;color:#EDEFFA;letter-spacing:-.01em;white-space:nowrap}
.km .topbar-name b{color:#CDA04C;font-weight:600}
.km .topbar-right{margin-left:auto;display:flex;align-items:center;gap:8px}
.km .topbar-count{display:inline-block;font-family:var(--f-txt);font-size:12.5px;color:#9BA3C9;margin-right:6px;white-space:nowrap}
.km .btn-topbar{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:34px;padding:0 14px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  font-family:var(--f-txt);font-size:13px;font-weight:600;color:#EDEFFA;cursor:pointer;text-decoration:none;white-space:nowrap;transition:border-color .2s,background .2s,color .2s}
.km .btn-topbar svg{width:15px;height:15px;flex-shrink:0}
.km .btn-topbar:hover{border-color:rgba(205,160,76,.45);background:rgba(205,160,76,.08)}
.km .btn-topbar.voltar-app svg{color:#CDA04C;transition:transform .2s}
.km .btn-topbar.voltar-app:hover svg{transform:translateX(-2px)}
@media (max-width:640px){
  header.topbar.km{margin:8px 12px 0;top:8px;padding:0 10px 0 14px;gap:14px}
  header.topbar.km .topbar-count{display:none}
  header.topbar.km .topbar-name{display:inline;font-size:14px}
}

/* ── Menu lateral + conteúdo ── */
.sec-layout{max-width:1600px;margin:0 auto;padding:24px;display:grid;grid-template-columns:232px minmax(0,1fr);gap:28px;align-items:start}
.sec-corpo{min-width:0}
nav.tipo-abas{position:sticky;top:80px;display:flex;flex-direction:column;gap:2px;border-radius:16px;padding:8px;
  background:linear-gradient(160deg,rgba(22,26,44,.70),rgba(12,15,30,.74))!important;border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 30px rgba(0,0,0,.22);backdrop-filter:blur(22px) saturate(120%);-webkit-backdrop-filter:blur(22px) saturate(120%)}
.tipo-abas-rot{font-family:var(--f-rot);font-size:9.5px;text-transform:uppercase;letter-spacing:.14em;color:#7680AD;padding:14px 12px 6px}
.tipo-aba{position:relative;z-index:1;margin:0;line-height:1.5;background:none;border:none;box-shadow:none;color:#9BA3C9;font-family:var(--f-txt);font-size:13.5px;font-weight:600;padding:10px 12px;border-radius:10px;cursor:pointer;display:flex;align-items:center;gap:10px;text-align:left;transition:color .25s}
.tipo-aba:hover{color:#EDEFFA}
.tipo-aba.on,.tipo-aba.on:hover{color:#060B1F}
.tipo-aba i{width:8px;height:8px;border-radius:50%;background:var(--ct,#CDA04C);flex-shrink:0;transition:box-shadow .25s}
.tipo-aba.on i{background:#060B1F;box-shadow:0 0 0 2px rgba(6,11,31,.18)}
.tipo-aba > span{margin-left:auto;font-family:var(--f-rot);font-size:11px;font-weight:500;color:inherit;background:rgba(255,255,255,.07);padding:1px 8px;border-radius:99px;transition:background .25s}
.tipo-aba > span:empty{display:none}
.tipo-aba.on > span{background:rgba(6,11,31,.18)}
.tipo-aba:focus-visible{outline:2px solid #CDA04C;outline-offset:2px}
.tipo-ind{position:absolute;top:0;left:8px;right:8px;border-radius:10px;background:#CDA04C;box-shadow:0 4px 16px rgba(205,160,76,.3);pointer-events:none;
  transition:transform .42s cubic-bezier(.34,1.3,.5,1),height .42s cubic-bezier(.34,1.3,.5,1),width .42s cubic-bezier(.34,1.3,.5,1)}
.tipo-ind.sem-anim{transition:none}
/* primeiro item (visão geral): destaque próprio, como a Performance no Metrics */
.tipo-aba.emp{flex-direction:column;align-items:flex-start;gap:2px;padding:14px 14px 13px;margin-bottom:4px;border-radius:12px;
  background:rgba(205,160,76,.07);border:1px solid rgba(205,160,76,.25);color:#EDEFFA}
.tipo-aba.emp b{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;letter-spacing:-.01em;width:100%}
.tipo-aba.emp b svg{width:16px;height:16px}
.tipo-aba.emp b > span{margin-left:auto;font-family:var(--f-rot);font-size:11px;font-weight:500;background:rgba(255,255,255,.07);padding:1px 8px;border-radius:99px}
.tipo-aba.emp b > span:empty{display:none}
.tipo-aba.emp small{font-size:11.5px;font-weight:500;color:#9BA3C9}
.tipo-aba.emp.on,.tipo-aba.emp.on:hover{border-color:transparent;color:#060B1F}
.tipo-aba.emp.on small{color:rgba(6,11,31,.7)}
.tipo-aba.emp.on b > span{background:rgba(6,11,31,.18)}
@media (max-width:860px){
  .sec-layout{grid-template-columns:minmax(0,1fr);gap:16px}
  nav.tipo-abas{position:relative;top:auto;flex-direction:row;align-items:center;overflow-x:auto;border-radius:14px;padding:6px;scrollbar-width:none}
  nav.tipo-abas::-webkit-scrollbar{display:none}
  .tipo-abas-rot{display:none}
  .tipo-aba{white-space:nowrap;flex-shrink:0}
  .tipo-aba.emp{margin:0 4px 0 0;padding:10px 14px}
  .tipo-aba.emp b{font-size:13.5px}
  .tipo-aba.emp small{display:none}
  .tipo-ind{top:0;left:0;right:auto}
}
@media (max-width:520px){.sec-layout{padding:16px}}
@media (prefers-reduced-motion:reduce){.tipo-ind,.tipo-aba,.km .btn-topbar svg{transition:none}}
@media print{header.topbar.km,nav.tipo-abas{display:none!important}.sec-layout{display:block;padding:0;max-width:none}}
/* contador de alerta (vermelho) num item do menu */
.tipo-aba > span.alerta,.tipo-aba.emp b > span.alerta{background:rgba(240,122,122,.16);color:#F07A7A}
.tipo-aba.on > span.alerta,.tipo-aba.emp.on b > span.alerta{background:rgba(6,11,31,.18);color:#060B1F}
