:root{
  --tp-rail:64px;
  --tp-panel:260px;
  --tp-bg:#07111e;
  --tp-glass:rgba(8,18,32,.96);
  --tp-border:rgba(255,255,255,.08);
  --tp-text:#f4f8ff;
  --tp-muted:#93a4ba;
  --tp-accent:#63ddff;
  --tp-accent2:#8b7dff;
}

/* remove menus customizados antigos */
#tp-future-menu,
#tp-old-menu,
.tp-future-menu,
.tp-old-menu,
[data-tp-old-menu],
[data-legacy-menu]{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* remove sidebars legadas comuns */
body.tp-compact-enabled .legacy-sidebar,
body.tp-compact-enabled #legacy-menu,
body.tp-compact-enabled aside.sidebar,
body.tp-compact-enabled .sidebar:not(#tp-compact-menu),
body.tp-compact-enabled nav.sidebar,
body.tp-compact-enabled .main-sidebar,
body.tp-compact-enabled .app-sidebar,
body.tp-compact-enabled .side-menu,
body.tp-compact-enabled .sidenav,
body.tp-compact-enabled .menu-lateral{
  display:none!important;
  visibility:hidden!important;
  width:0!important;
  min-width:0!important;
  max-width:0!important;
  overflow:hidden!important;
  pointer-events:none!important;
}

/* evita espaço reservado por menu antigo */
body.tp-compact-enabled{
  margin-left:0!important;
  padding-left:0!important;
}

body.tp-compact-enabled .main-content,
body.tp-compact-enabled .content-wrapper,
body.tp-compact-enabled .page-wrapper,
body.tp-compact-enabled main{
  margin-left:0!important;
}

*{box-sizing:border-box}

#tp-compact-menu{
  position:fixed;
  inset:0 auto 0 0;
  z-index:999999;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--tp-text)
}

#tp-compact-menu .rail{
  width:var(--tp-rail);
  height:100vh;
  padding:14px 7px;
  background:linear-gradient(180deg,#06101c,#0a1627);
  border-right:1px solid var(--tp-border);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  box-shadow:14px 0 45px rgba(0,0,0,.2)
}

#tp-compact-menu .brand{
  width:44px;
  height:44px;
  border-radius:15px;
  display:grid;
  place-items:center;
  font-weight:900;
  font-size:13px;
  letter-spacing:.08em;
  color:#04111c;
  background:linear-gradient(135deg,var(--tp-accent),var(--tp-accent2));
  margin-bottom:12px
}

#tp-compact-menu .nav{
  width:48px;
  height:48px;
  border:0;
  border-radius:15px;
  background:transparent;
  color:var(--tp-muted);
  font-size:20px;
  cursor:pointer;
  transition:.18s
}

#tp-compact-menu .nav:hover,
#tp-compact-menu .nav.active{
  color:#fff;
  background:rgba(99,221,255,.11);
  transform:translateY(-1px)
}

#tp-compact-menu .grow{flex:1}

#tp-compact-menu .panel{
  position:absolute;
  left:var(--tp-rail);
  top:0;
  width:var(--tp-panel);
  height:100vh;
  padding:22px;
  background:var(--tp-glass);
  backdrop-filter:blur(18px);
  border-right:1px solid var(--tp-border);
  box-shadow:20px 0 55px rgba(0,0,0,.3);
  transform:translateX(-110%);
  opacity:0;
  pointer-events:none;
  transition:.2s ease
}

#tp-compact-menu.open .panel{
  transform:translateX(0);
  opacity:1;
  pointer-events:auto
}

#tp-compact-menu h2{
  font-size:19px;
  margin:2px 0 3px
}

#tp-compact-menu .subtitle{
  font-size:12px;
  color:var(--tp-muted);
  margin-bottom:18px
}

#tp-compact-menu .search{
  width:100%;
  padding:11px 12px;
  border-radius:13px;
  border:1px solid var(--tp-border);
  background:rgba(255,255,255,.04);
  color:#fff;
  outline:none;
  margin-bottom:14px
}

#tp-compact-menu .section{
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--tp-muted);
  padding:11px 8px 5px
}

#tp-compact-menu .item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  text-decoration:none;
  color:var(--tp-text);
  padding:12px 13px;
  border-radius:13px;
  border:1px solid transparent;
  margin-bottom:5px;
  transition:.18s
}

#tp-compact-menu .item:hover{
  background:rgba(255,255,255,.055);
  border-color:var(--tp-border);
  transform:translateX(2px)
}

#tp-compact-menu .quick{
  position:fixed;
  top:14px;
  right:16px;
  z-index:999998;
  border:1px solid rgba(99,221,255,.25);
  background:linear-gradient(135deg,rgba(99,221,255,.16),rgba(139,125,255,.16));
  color:#fff;
  border-radius:14px;
  padding:10px 14px;
  cursor:pointer;
  backdrop-filter:blur(16px)
}

@media(max-width:820px){
  :root{--tp-rail:56px;--tp-panel:min(300px,calc(100vw - 56px))}
  #tp-compact-menu .rail{width:56px}
  #tp-compact-menu .nav{width:43px;height:43px}
}
