/* ════════════════════════════════════════════════════════════════════
   SIDEBAR + DASHBOARD HEROICO — Contratos Pro
   v18 — Análise IA com 31 análises em 7 categorias + busca
   ════════════════════════════════════════════════════════════════════ */

:root{
  --sb-w:280px;
  --sb-w-collapsed:68px;
  --sb-gap:14px;
}

body.cp-sidebar-collapsed{
  --sb-w:var(--sb-w-collapsed);
}

/* ─── 0. ESCONDE SIDEBAR ENQUANTO LOGIN ESTÁ NA TELA ─────────────── */
/* Se #login-screen existe E NÃO tem classe .hide, o user não está logado */
body:has(#login-screen:not(.hide)) .cp-sidebar,
body:has(#login-screen:not(.hide)) .cp-hamburger,
body:has(#login-screen:not(.hide)) .cp-scrim{
  display:none !important;
}

/* Garante que o popup do menu de usuário fique SEMPRE visível, por cima de tudo */
#usr-menu-popup{
  z-index:99999 !important;
}

/* No login, não força margem do conteúdo (login ocupa tela toda) */
body:has(#login-screen:not(.hide)) > .page,
body:has(#login-screen:not(.hide)) > div.page{
  margin-left:0 !important;
  margin-right:0 !important;
  padding-top:0 !important;
}

/* ─── 1. ESCONDE TOPBAR + TABS ANTIGAS ───────────────────────────── */
body > .topbar,
body > .tabs-wrap{
  display:none !important;
}

body > .cp-sidebar:not(:last-of-type){
  display:none !important;
}
body > .cp-hamburger:not(:last-of-type){
  display:none !important;
}

/* ─── 2. AJUSTA O LAYOUT PRINCIPAL ───────────────────────────────── */
body > .page,
body > div.page{
  margin-left:calc(var(--sb-w) + var(--sb-gap) * 2) !important;
  margin-right:var(--sb-gap) !important;
  padding-top:14px !important;
  transition:margin-left .3s ease;
}

/* ─── 3. SIDEBAR (DESKTOP) ───────────────────────────────────────── */
.cp-sidebar{
  position:fixed !important;
  left:var(--sb-gap);
  top:var(--sb-gap);
  bottom:var(--sb-gap);
  width:var(--sb-w);
  background:rgba(19,9,31,.78);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border:1px solid rgba(167,139,250,.18);
  border-radius:14px;
  display:flex !important;
  flex-direction:column;
  z-index:60;
  transition:width .3s ease, transform .3s ease, left .3s ease;
  box-shadow:
    0 20px 60px -12px rgba(0,0,0,.6),
    0 0 0 1px rgba(255,255,255,.02),
    inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
  font-family:var(--fn);
}

[data-theme="light"] .cp-sidebar{
  background:rgba(255,255,255,.85);
  border-color:rgba(124,58,237,.18);
}

.cp-sidebar::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(167,139,250,.6),transparent);
  opacity:.5;
  pointer-events:none;
}

/* ─── 3.0. BOTÃO TOGGLE (só desktop) ─────────────────────────────── */
.cp-sb-toggle{
  position:absolute;
  top:18px;
  right:8px;
  width:28px;height:28px;
  background:linear-gradient(135deg, #a78bfa, #ec4899);
  border:2px solid var(--bg);
  border-radius:50%;
  color:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  z-index:65;
  transition:transform .2s, box-shadow .2s;
  box-shadow:0 4px 12px rgba(167,139,250,.5);
  font-family:system-ui, sans-serif;
  line-height:1;
  font-weight:700;
  user-select:none;
  padding:0;
}
.cp-sb-toggle:hover{
  transform:scale(1.15);
  box-shadow:0 6px 18px rgba(167,139,250,.7);
}

/* ─── 3.1. CABEÇALHO ─────────────────────────────────────────────── */
.cp-sb-head{
  padding:18px 18px 16px;
  border-bottom:1px solid rgba(167,139,250,.12);
  display:flex;
  align-items:center;
  gap:12px;
  position:relative;
  min-height:74px;
  flex-shrink:0;
}
.cp-sb-logo{
  width:42px;height:42px;
  background:linear-gradient(135deg,#a78bfa,#ec4899);
  border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;position:relative;
  box-shadow:
    0 8px 20px -4px rgba(167,139,250,.5),
    inset 0 1px 0 rgba(255,255,255,.3);
  cursor:pointer;
}
.cp-sb-logo::before{
  content:'';
  position:absolute;inset:-2px;
  background:linear-gradient(135deg,#a78bfa,#ec4899);
  border-radius:14px;
  z-index:-1;opacity:.5;
  filter:blur(6px);
}

.cp-sb-brand{
  display:flex;flex-direction:column;min-width:0;
  flex:1;
  overflow:hidden;
}
.cp-sb-brand-name{
  font-family:var(--dp);font-weight:700;
  font-size:17px;
  letter-spacing:-0.01em;
  background:linear-gradient(135deg,#a78bfa,#ec4899);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cp-sb-brand-tag{
  font-family:var(--mo);
  font-size:10.5px;
  color:var(--t3);
  text-transform:uppercase;letter-spacing:.1em;
  margin-top:3px;
  display:flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
.cp-sb-brand-tag .cp-conn-dot{
  display:inline-block;
  width:7px;height:7px;border-radius:50%;
  background:var(--gn);
  box-shadow:0 0 6px var(--gn);
  flex-shrink:0;
}
.cp-sb-brand-tag .cp-conn-dot.off{
  background:var(--rd);
  box-shadow:0 0 6px var(--rd);
}

.cp-sb-greet{
  padding:12px 18px 0;
  font-size:13px;
  color:var(--t2);
  line-height:1.45;
  flex-shrink:0;
  overflow:hidden;
}
.cp-sb-greet b{color:var(--tx);font-weight:600;}

/* ─── 3.2. BUSCA ─────────────────────────────────────────────────── */
.cp-sb-search{
  padding:14px 14px 6px;
  flex-shrink:0;
}
.cp-sb-search-wrap{position:relative;}
.cp-sb-search-input{
  width:100%;
  background:rgba(29,18,50,.6);
  border:1px solid rgba(167,139,250,.15);
  border-radius:9px;
  padding:10px 36px 10px 34px;
  color:var(--tx);font-family:var(--fn);
  font-size:13.5px;
  outline:none;transition:border-color .15s, background .15s, box-shadow .15s;
  box-sizing:border-box;
}
[data-theme="light"] .cp-sb-search-input{
  background:rgba(245,243,255,.8);
  color:var(--tx);
}
.cp-sb-search-input::placeholder{color:var(--t3);}
.cp-sb-search-input:focus{
  border-color:rgba(167,139,250,.45);
  background:rgba(29,18,50,.85);
  box-shadow:0 0 0 3px rgba(167,139,250,.1);
}
.cp-sb-search-icon{
  position:absolute;left:11px;top:50%;
  transform:translateY(-50%);
  color:var(--t3);font-size:14px;pointer-events:none;
}
.cp-sb-search-kbd{
  position:absolute;right:9px;top:50%;
  transform:translateY(-50%);
  font-family:var(--mo);font-size:10px;color:var(--t3);
  background:rgba(167,139,250,.12);
  border:1px solid rgba(167,139,250,.2);
  border-radius:4px;
  padding:2px 5px;
  pointer-events:none;
  white-space:nowrap;
}

/* ─── 3.2.1. DROPDOWN DE RESULTADOS DA BUSCA ─────────────────────── */
.cp-sb-search-results{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  background:rgba(15,7,26,.98);
  backdrop-filter:blur(24px) saturate(180%);
  border:1px solid rgba(167,139,250,.25);
  border-radius:11px;
  box-shadow:
    0 12px 32px -8px rgba(0,0,0,.7),
    0 0 0 1px rgba(255,255,255,.03);
  max-height:60vh;
  overflow-y:auto;
  display:none;
  z-index:9998;
  padding:6px;
}
.cp-sb-search-results.open{
  display:block;
  animation:cpResultsIn .15s ease;
}
@keyframes cpResultsIn{
  from{opacity:0; transform:translateY(-4px);}
  to{opacity:1; transform:translateY(0);}
}
[data-theme="light"] .cp-sb-search-results{
  background:rgba(255,255,255,.98);
  border-color:rgba(124,58,237,.25);
}
.cp-sb-search-results::-webkit-scrollbar{width:6px;}
.cp-sb-search-results::-webkit-scrollbar-thumb{
  background:rgba(167,139,250,.3);
  border-radius:3px;
}

.cp-sb-result-group{
  font-family:var(--mo);
  font-size:9.5px;
  font-weight:600;
  color:var(--t3);
  text-transform:uppercase;
  letter-spacing:.1em;
  padding:8px 10px 4px;
}
.cp-sb-result-group:first-child{padding-top:4px;}

.cp-sb-result-item{
  display:flex;
  align-items:center;
  gap:11px;
  padding:8px 10px;
  border-radius:7px;
  cursor:pointer;
  transition:background .12s, border-color .12s;
  border:1px solid transparent;
  outline:none;
  user-select:none;
}
.cp-sb-result-item:hover,
.cp-sb-result-item:focus{
  background:rgba(167,139,250,.12);
  border-color:rgba(167,139,250,.2);
}
.cp-sb-result-ic{
  font-size:18px;
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(167,139,250,.08);
  border-radius:7px;
  flex-shrink:0;
}
.cp-sb-result-txt{
  flex:1;
  min-width:0;
  overflow:hidden;
}
.cp-sb-result-title{
  font-size:13px;
  font-weight:600;
  color:var(--tx);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.2;
}
.cp-sb-result-sub{
  font-size:11px;
  color:var(--t3);
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  line-height:1.3;
}

.cp-sb-result-empty{
  padding:14px 12px;
  text-align:center;
  font-size:12px;
  color:var(--t3);
}
.cp-sb-result-empty b{color:var(--tx);}

/* Mobile: resultados maiores pra dedo */
@media (max-width:900px){
  .cp-sb-search-results{
    max-height:65vh;
  }
  .cp-sb-result-item{
    padding:11px 12px;
  }
  .cp-sb-result-ic{
    font-size:20px;
    width:32px;
    height:32px;
  }
  .cp-sb-result-title{font-size:14.5px;}
  .cp-sb-result-sub{font-size:12px;}
}

/* ─── 3.3. NAV ───────────────────────────────────────────────────── */
.cp-sb-nav{
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding:8px 10px 12px;
  display:flex;
  flex-direction:column;
  gap:2px;
  min-height:0;
}
.cp-sb-nav::-webkit-scrollbar{width:0;}

.cp-sb-section-h{
  font-family:var(--mo);
  font-size:10.5px;
  font-weight:600;
  color:var(--t3);text-transform:uppercase;letter-spacing:.12em;
  padding:16px 12px 6px;
  white-space:nowrap;
  overflow:hidden;
  flex-shrink:0;
}
.cp-sb-section-h:first-child{padding-top:6px;}

.cp-sb-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:8px;
  font-size:14px;
  color:var(--t2);
  cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
  position:relative;
  user-select:none;
  border:1px solid transparent;
  white-space:nowrap;
  overflow:hidden;
  flex-shrink:0;
}
.cp-sb-item:hover{
  background:rgba(167,139,250,.08);
  color:var(--tx);
}
.cp-sb-item.active{
  background:linear-gradient(135deg,rgba(167,139,250,.18),rgba(236,72,153,.1));
  border-color:rgba(167,139,250,.25);
  color:var(--tx);
  font-weight:600;
  box-shadow:
    0 4px 16px -4px rgba(167,139,250,.3),
    inset 0 1px 0 rgba(255,255,255,.06);
}
.cp-sb-item.active::after{
  content:'';
  position:absolute;
  right:10px;top:50%;
  transform:translateY(-50%);
  width:6px;height:6px;
  background:#a78bfa;border-radius:50%;
  box-shadow:0 0 8px #a78bfa;
}
.cp-sb-item-ic{
  font-size:18px;
  width:22px;
  text-align:center;
  flex-shrink:0;
  line-height:1;
}
.cp-sb-item-lb{
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cp-sb-item-badge{
  font-family:var(--mo);font-size:10.5px;font-weight:700;
  background:linear-gradient(135deg,var(--rd),#dc2626);
  color:#fff;padding:1px 7px;border-radius:10px;
  min-width:20px;text-align:center;
  flex-shrink:0;
}

/* ─── 3.4. AÇÕES SECUNDÁRIAS ─────────────────────────────────────── */
.cp-sb-actions{
  border-top:1px solid rgba(167,139,250,.1);
  padding:12px 12px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  flex-shrink:0;
}
.cp-sb-action{
  height:38px;
  background:rgba(29,18,50,.5);
  border:1px solid rgba(167,139,250,.15);
  border-radius:8px;
  color:var(--t2);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
  transition:background .15s, color .15s, border-color .15s;
  position:relative;
  /* Stack de fontes que SEMPRE renderiza emojis (desktop + mobile) */
  font-family:"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji","Twemoji Mozilla",EmojiOne,sans-serif;
  font-feature-settings:"liga" 0;
}
.cp-sb-action:hover{
  background:rgba(167,139,250,.12);
  color:var(--tx);
  border-color:rgba(167,139,250,.35);
}
.cp-sb-action-badge{
  position:absolute;
  top:-4px;right:-4px;
  background:var(--rd);color:#fff;
  font-size:10px;font-weight:700;
  border-radius:9px;
  padding:1px 5px;line-height:1.2;
  min-width:16px;text-align:center;
  border:2px solid var(--bg);
}

/* ─── 3.5. USUÁRIO (footer) ──────────────────────────────────────── */
.cp-sb-foot{
  border-top:1px solid rgba(167,139,250,.1);
  padding:10px;
  flex-shrink:0;
}
.cp-sb-foot-card{
  display:flex;
  align-items:center;
  gap:11px;
  padding:9px;
  border-radius:10px;
  cursor:pointer;
  transition:background .15s, border-color .15s;
  background:rgba(29,18,50,.4);
  border:1px solid rgba(167,139,250,.08);
}
.cp-sb-foot-card:hover{
  background:rgba(167,139,250,.08);
  border-color:rgba(167,139,250,.2);
}
.cp-sb-avatar{
  width:36px;height:36px;
  border-radius:9px;
  background:linear-gradient(135deg,#a78bfa,#ec4899);
  display:flex;
  align-items:center;justify-content:center;
  font-weight:700;
  font-size:13px;
  color:#fff;
  flex-shrink:0;
}
.cp-sb-user{
  flex:1;min-width:0;
  overflow:hidden;
}
.cp-sb-user-name{
  font-size:13.5px;
  font-weight:600;color:var(--tx);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cp-sb-user-role{
  font-family:var(--mo);
  font-size:10px;
  color:var(--t3);text-transform:uppercase;
  letter-spacing:.06em;margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ─── 3.6. ESTADO COLAPSADO (DESKTOP APENAS) ─────────────────────── */
body.cp-sidebar-collapsed .cp-sb-brand,
body.cp-sidebar-collapsed .cp-sb-greet,
body.cp-sidebar-collapsed .cp-sb-search,
body.cp-sidebar-collapsed .cp-sb-section-h,
body.cp-sidebar-collapsed .cp-sb-item-lb,
body.cp-sidebar-collapsed .cp-sb-item-badge,
body.cp-sidebar-collapsed .cp-sb-user,
body.cp-sidebar-collapsed .cp-sb-search-kbd{
  display:none !important;
}

body.cp-sidebar-collapsed .cp-sb-actions{
  grid-template-columns:1fr;
  padding:8px;
  gap:5px;
}
body.cp-sidebar-collapsed .cp-sb-action:nth-child(n+3){
  display:none;
}
body.cp-sidebar-collapsed .cp-sb-head{
  padding:18px 12px 16px;
  justify-content:center;
  gap:0;
}
body.cp-sidebar-collapsed .cp-sb-foot-card{
  justify-content:center;
  padding:9px 4px;
  gap:0;
}
body.cp-sidebar-collapsed .cp-sb-item{
  justify-content:center;
  padding:10px 4px;
  gap:0;
}
body.cp-sidebar-collapsed .cp-sb-item.active::after{
  display:none;
}

/* ─── 4. HAMBURGER MOBILE ────────────────────────────────────────── */
.cp-hamburger{
  position:fixed !important;
  top:14px !important;
  left:14px !important;
  width:48px !important;
  height:48px !important;
  background:rgba(29,18,50,.95) !important;
  backdrop-filter:blur(12px);
  border:2px solid #a78bfa !important;
  border-radius:10px !important;
  color:#fff !important;
  cursor:pointer;
  font-size:24px !important;
  z-index:9999 !important;
  display:none;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 16px rgba(0,0,0,.5);
}

.cp-scrim{
  position:fixed;
  inset:0;
  background:rgba(10,4,24,.7);
  backdrop-filter:blur(4px);
  z-index:9990;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s;
}
.cp-scrim.cp-scrim-visible{
  opacity:1;
  pointer-events:auto;
}

/* ════════════════════════════════════════════════════════════════════
   5. MOBILE — FORÇA BRUTA com classe única .cp-sb-mobile-aberta
   ════════════════════════════════════════════════════════════════════ */
@media (max-width:900px){

  /* Layout: sem margin */
  body > .page,
  body > div.page{
    margin-left:0 !important;
    margin-right:0 !important;
    padding:74px 14px 14px !important;
  }

  /* SIDEBAR FECHADA NO MOBILE — força bruta */
  .cp-sidebar{
    position:fixed !important;
    left:0 !important;
    right:auto !important;
    top:0 !important;
    bottom:0 !important;
    width:86vw !important;
    max-width:320px !important;
    min-width:280px !important;
    margin:0 !important;
    border-radius:0 14px 14px 0 !important;
    transform:translateX(-105%) !important;
    box-shadow:0 0 60px rgba(0,0,0,.7) !important;
    z-index:9995 !important;
  }

  /* SIDEBAR ABERTA NO MOBILE — classe única .cp-sb-mobile-aberta no body */
  body.cp-sb-mobile-aberta .cp-sidebar{
    transform:translateX(0) !important;
  }

  /* No mobile, IGNORA o estado colapsado */
  body.cp-sidebar-collapsed .cp-sidebar{
    width:86vw !important;
    max-width:320px !important;
  }
  body.cp-sidebar-collapsed .cp-sb-brand,
  body.cp-sidebar-collapsed .cp-sb-greet,
  body.cp-sidebar-collapsed .cp-sb-search,
  body.cp-sidebar-collapsed .cp-sb-section-h,
  body.cp-sidebar-collapsed .cp-sb-item-lb,
  body.cp-sidebar-collapsed .cp-sb-item-badge,
  body.cp-sidebar-collapsed .cp-sb-user,
  body.cp-sidebar-collapsed .cp-sb-search-kbd{
    display:block !important;
  }
  body.cp-sidebar-collapsed .cp-sb-brand,
  body.cp-sidebar-collapsed .cp-sb-foot-card{
    display:flex !important;
  }
  body.cp-sidebar-collapsed .cp-sb-actions{
    grid-template-columns:repeat(4,1fr) !important;
    padding:12px !important;
  }
  body.cp-sidebar-collapsed .cp-sb-action:nth-child(n+3){
    display:flex !important;
  }
  body.cp-sidebar-collapsed .cp-sb-head{
    padding:18px 18px 16px !important;
    justify-content:flex-start !important;
    gap:12px !important;
  }
  body.cp-sidebar-collapsed .cp-sb-foot-card{
    justify-content:flex-start !important;
    padding:9px !important;
    gap:11px !important;
  }
  body.cp-sidebar-collapsed .cp-sb-item{
    justify-content:flex-start !important;
    padding:12px 14px !important;
    gap:12px !important;
  }

  .cp-sb-toggle{display:none !important;}

  .cp-hamburger{display:flex !important;}

  /* Fontes maiores pra mobile */
  .cp-sb-item{font-size:15px !important; padding:12px 14px !important;}
  .cp-sb-item-ic{font-size:19px !important;}
  .cp-sb-section-h{font-size:11px !important; padding:18px 14px 8px !important;}
  .cp-sb-search-input{font-size:14.5px !important; padding:12px 36px 12px 36px !important;}
  .cp-sb-brand-name{font-size:18px !important;}
  .cp-sb-greet{font-size:14px !important;}
  .cp-sb-user-name{font-size:14.5px !important;}
  .cp-sb-user-role{font-size:11px !important;}
  .cp-sb-action{height:42px !important; font-size:18px !important;}
}

/* ════════════════════════════════════════════════════════════════════
   DASHBOARD HEROICO — KPI CARDS
   ════════════════════════════════════════════════════════════════════ */

#view-dashboard .krow{
  display:grid !important;
  gap:14px !important;
  margin:0 !important;
}
#view-dashboard .krow.k6{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important;
}
#view-dashboard .krow.k4{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr)) !important;
}

#view-dashboard .kpi{
  --c1:#a78bfa;
  --c-rgb:167,139,250;
  position:relative !important;
  background:
    radial-gradient(ellipse 100% 80% at 50% -20%, rgba(var(--c-rgb),.10) 0%, transparent 60%),
    linear-gradient(180deg, rgba(19,9,31,.92), rgba(19,9,31,.96)) !important;
  backdrop-filter:blur(14px) !important;
  -webkit-backdrop-filter:blur(14px) !important;
  border:1px solid rgba(var(--c-rgb),.18) !important;
  border-radius:14px !important;
  padding:18px 18px 16px !important;
  overflow:hidden !important;
  cursor:pointer;
  transition:transform .25s, border-color .2s, box-shadow .25s !important;
  box-shadow:
    0 4px 14px -4px rgba(0,0,0,.5),
    inset 0 1px 0 rgba(255,255,255,.04) !important;
  isolation:isolate;
  min-height:140px !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
}

[data-theme="light"] #view-dashboard .kpi{
  background:
    radial-gradient(ellipse 100% 80% at 50% -20%, rgba(var(--c-rgb),.10) 0%, transparent 60%),
    rgba(255,255,255,.85) !important;
  border-color:rgba(var(--c-rgb),.25) !important;
}

#view-dashboard .kpi::before{
  content:'';
  position:absolute;
  top:0;left:20%;right:20%;
  height:1px;
  background:linear-gradient(90deg, transparent, var(--c1), transparent);
  opacity:.55;
}

#view-dashboard .kpi::after{
  content:'';
  position:absolute;
  top:-40px;right:-40px;
  width:140px;height:140px;
  border-radius:50%;
  background:radial-gradient(circle, var(--c1) 0%, transparent 65%);
  filter:blur(40px);
  opacity:.20;
  pointer-events:none;
  z-index:0;
}

#view-dashboard .kpi:hover{
  transform:translateY(-3px);
  border-color:rgba(var(--c-rgb),.4) !important;
  box-shadow:
    0 16px 36px -12px rgba(var(--c-rgb),.3),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#view-dashboard .kpi .k-lb{
  font-family:var(--mo) !important;
  font-size:10px !important;
  color:var(--t3) !important;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-weight:500 !important;
  margin-bottom:10px !important;
  padding-right:42px;
  position:relative;
  z-index:2;
  line-height:1.3;
}

#view-dashboard .kpi .k-vl{
  font-family:var(--dp) !important;
  font-size:clamp(20px, 2.8vw, 26px) !important;
  font-weight:800 !important;
  letter-spacing:-0.02em !important;
  line-height:1.1 !important;
  margin-bottom:8px !important;
  position:relative;
  z-index:3;
  color:var(--c1) !important;
  text-shadow:
    0 0 24px rgba(var(--c-rgb),.35),
    0 2px 8px rgba(0,0,0,.4);
  word-break:break-word;
  overflow-wrap:break-word;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  max-width:100%;
}

[data-theme="light"] #view-dashboard .kpi .k-vl{
  text-shadow:0 1px 4px rgba(0,0,0,.05);
}

#view-dashboard .kpi .k-vl.kpi-vl-short{
  font-size:clamp(28px, 4vw, 36px) !important;
}

#view-dashboard .kpi .k-sb{
  font-size:10.5px !important;
  color:var(--t3) !important;
  font-family:var(--mo) !important;
  position:relative;
  z-index:2;
  margin-top:auto;
  line-height:1.4;
  word-break:break-word;
}

#view-dashboard .kpi [id$="Var"]{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-family:var(--mo) !important;
  font-size:10.5px !important;
  font-weight:600 !important;
  padding:2px 8px !important;
  border-radius:6px;
  background:rgba(16,185,129,.12);
  color:var(--gn) !important;
  border:1px solid rgba(16,185,129,.25);
  margin-top:6px !important;
  width:fit-content;
}
#view-dashboard .kpi [id$="Var"].kpi-var-down{
  background:rgba(244,63,94,.12);
  color:var(--rd) !important;
  border-color:rgba(244,63,94,.25);
}

#view-dashboard .kpi .k-ic{
  position:absolute !important;
  top:14px;
  right:14px;
  width:30px !important;
  height:30px !important;
  border-radius:8px;
  background:rgba(var(--c-rgb),.12) !important;
  border:1px solid rgba(var(--c-rgb),.25);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px !important;
  z-index:2;
  opacity:1 !important;
}

#view-dashboard .kpi[data-cor="green"]{ --c1:#10b981; --c-rgb:16,185,129; }
#view-dashboard .kpi[data-cor="purple"]{ --c1:#a78bfa; --c-rgb:167,139,250; }
#view-dashboard .kpi[data-cor="red"]{ --c1:#f87171; --c-rgb:248,113,113; }
#view-dashboard .kpi[data-cor="yellow"]{ --c1:#fbbf24; --c-rgb:251,191,36; }
#view-dashboard .kpi[data-cor="cyan"]{ --c1:#22d3ee; --c-rgb:34,211,238; }
#view-dashboard .kpi[data-cor="orange"]{ --c1:#fb923c; --c-rgb:251,146,60; }
#view-dashboard .kpi[data-cor="pink"]{ --c1:#f472b6; --c-rgb:244,114,182; }
#view-dashboard .kpi[data-cor="indigo"]{ --c1:#818cf8; --c-rgb:129,140,248; }

@media (max-width:900px){
  #view-dashboard .kpi{
    padding:14px 14px 12px !important;
    min-height:120px !important;
  }
  #view-dashboard .kpi .k-vl{
    font-size:clamp(18px, 5vw, 22px) !important;
  }
  #view-dashboard .kpi .k-vl.kpi-vl-short{
    font-size:clamp(22px, 7vw, 30px) !important;
  }
}

/* ════════════════════════════════════════════════════════════════════
   v18 — Fix de emojis no DESKTOP
   Problema: --fn (fonte do sistema) não tem suporte a emoji em alguns
   navegadores desktop. Solução: stack de fontes que SEMPRE renderiza.
   ════════════════════════════════════════════════════════════════════ */

/* Aplica stack de emoji em qualquer elemento que mostra emojis */
.cp-sb-action,
.cp-sb-item-ic,
.cp-sb-search-icon,
.cp-sb-logo,
.cp-fab-toggle,
.cp-sb-foot-action,
.cp-sb-section-h,
.cp-hamburger,
.cp-analise-btn-ia,
.cp-analise-mini,
.cp-gemini-ctx-btn,
.cp-gemini-ctx-mini,
.cp-ia-gemini-ic,
.cp-ia-btn-ic,
.cp-ia-tab,
.cp-sug-btn,
.cp-ia-sug-btn,
.cp-fiscal-btn-buscar {
  font-family:"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji","Twemoji Mozilla",EmojiOne,system-ui,-apple-system,sans-serif !important;
  font-feature-settings:"liga" 0;
}

/* Garante que botões de ação tenham tamanho de ícone confortável */
.cp-sb-action{
  font-size:18px !important;
  line-height:1 !important;
}

/* Quando sidebar está colapsada, esconde o botão de colapsar pra não confundir */
@media (min-width:901px){
  body.cp-sidebar-collapsed .cp-sb-toggle{
    transform:rotate(180deg);
  }
  body.cp-sidebar-collapsed .cp-sb-toggle:hover{
    transform:rotate(180deg) scale(1.15);
  }
}

/* ════════════════════════════════════════════════════════════════════
   v18.1 — Fix desktop: ícones, botão recolher, transições suaves
   ════════════════════════════════════════════════════════════════════ */

/* Stack de fontes que SEMPRE renderiza emoji */
.cp-sb-action,
.cp-sb-item-ic,
.cp-sb-search-icon,
.cp-sb-logo,
.cp-fab-toggle,
.cp-sb-foot-action,
.cp-sb-section-h,
.cp-hamburger,
.cp-analise-btn-ia,
.cp-analise-mini,
.cp-gemini-ctx-btn,
.cp-gemini-ctx-mini,
.cp-ia-gemini-ic,
.cp-ia-btn-ic,
.cp-ia-tab,
.cp-ia-sug-btn,
.cp-fiscal-btn-buscar {
  font-family:"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji","Twemoji Mozilla",EmojiOne,system-ui,-apple-system,sans-serif !important;
}

.cp-sb-action{
  font-size:18px !important;
  line-height:1 !important;
}

/* ─── DESKTOP: COLAPSAR — força largura, evita tremor ─────────────── */
@media (min-width:901px){
  /* Sidebar sempre tem transição suave */
  .cp-sidebar{
    transition:width .25s ease !important;
  }

  /* Quando colapsada, FORÇA largura compacta */
  body.cp-sidebar-collapsed .cp-sidebar{
    width:68px !important;
  }

  /* Conteúdo principal acompanha a mudança */
  body.cp-sidebar-collapsed > .page,
  body.cp-sidebar-collapsed > div.page{
    margin-left:calc(68px + var(--sb-gap) * 2) !important;
  }

  /* Inverte chevron quando colapsada */
  body.cp-sidebar-collapsed .cp-sb-toggle{
    transform:rotate(180deg);
  }
  body.cp-sidebar-collapsed .cp-sb-toggle:hover{
    transform:rotate(180deg) scale(1.15);
  }

  /* Esconde elementos textuais quando colapsada (já tinha, reforço) */
  body.cp-sidebar-collapsed .cp-sb-brand,
  body.cp-sidebar-collapsed .cp-sb-greet,
  body.cp-sidebar-collapsed .cp-sb-search,
  body.cp-sidebar-collapsed .cp-sb-section-h,
  body.cp-sidebar-collapsed .cp-sb-item-lb,
  body.cp-sidebar-collapsed .cp-sb-item-badge,
  body.cp-sidebar-collapsed .cp-sb-foot-info,
  body.cp-sidebar-collapsed .cp-sb-foot-actions,
  body.cp-sidebar-collapsed .cp-sb-search-kbd{
    display:none !important;
  }

  /* Centraliza ícones quando colapsada */
  body.cp-sidebar-collapsed .cp-sb-item{
    justify-content:center !important;
    padding:10px 4px !important;
    gap:0 !important;
  }
  body.cp-sidebar-collapsed .cp-sb-foot-card{
    justify-content:center !important;
    padding:9px 4px !important;
    gap:0 !important;
  }
  body.cp-sidebar-collapsed .cp-sb-actions{
    grid-template-columns:1fr !important;
    padding:8px !important;
  }
  body.cp-sidebar-collapsed .cp-sb-action:nth-child(n+3){
    display:none !important;
  }
}

/* ════════════════════════════════════════════════════════════════════
   v19 — MODO HAMBURGER UNIFICADO (mobile + desktop)
   • Sidebar escondida por padrão em qualquer tela
   • Botão ☰ sempre visível no canto superior esquerdo
   • Conteúdo ocupa tela inteira
   • Ao tocar ☰, sidebar desliza por cima
   ════════════════════════════════════════════════════════════════════ */

/* Hamburger SEMPRE visível (desktop e mobile) */
.cp-hamburger{
  display:flex !important;
  position:fixed !important;
  top:14px !important;
  left:14px !important;
  width:46px !important;
  height:46px !important;
  background:linear-gradient(135deg, rgba(167,139,250,.95), rgba(236,72,153,.85)) !important;
  border:2px solid rgba(255,255,255,.2) !important;
  border-radius:11px !important;
  color:#fff !important;
  cursor:pointer;
  font-size:22px !important;
  z-index:9999 !important;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 14px rgba(167,139,250,.4), 0 8px 28px rgba(0,0,0,.3);
  transition:transform .15s, box-shadow .15s;
  font-family:system-ui, sans-serif;
  line-height:1;
  padding:0;
}
.cp-hamburger:hover{
  transform:scale(1.05);
  box-shadow:0 6px 20px rgba(167,139,250,.6), 0 10px 32px rgba(0,0,0,.35);
}

/* Conteúdo ocupa tela inteira (sem margin pra sidebar) */
body > .page,
body > div.page{
  margin-left:0 !important;
  margin-right:0 !important;
  padding-top:14px !important;
  padding-left:14px !important;
  padding-right:14px !important;
}

/* Sidebar ESCONDIDA por padrão */
.cp-sidebar{
  position:fixed !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:280px !important;
  height:100vh !important;
  border-radius:0 !important;
  z-index:9995 !important;
  transform:translateX(-100%);
  transition:transform .3s cubic-bezier(.4, 0, .2, 1) !important;
}

/* Sidebar ABERTA (classe no body) */
body.cp-sb-mobile-aberta .cp-sidebar{
  transform:translateX(0) !important;
}

/* Esconde botão de toggle interno (chevron) — não precisa mais */
.cp-sb-toggle{display:none !important;}

/* Esconde primeira linha do espaço onde o toggle ficava */
body.cp-sb-mobile-aberta .cp-hamburger{
  background:linear-gradient(135deg, rgba(244,63,94,.95), rgba(236,72,153,.85)) !important;
}

/* Scrim atrás da sidebar quando aberta */
.cp-scrim{
  position:fixed;
  inset:0;
  background:rgba(10,4,24,.65);
  backdrop-filter:blur(4px);
  z-index:9990;
  opacity:0;
  pointer-events:none;
  transition:opacity .25s;
}
body.cp-sb-mobile-aberta .cp-scrim,
.cp-scrim.cp-scrim-visible{
  opacity:1;
  pointer-events:auto;
}

/* ═══════════════════════════════════════════════════════════════════
   ÍCONES — fix de emoji + tamanhos confortáveis
   ═══════════════════════════════════════════════════════════════════ */
.cp-sb-action,
.cp-sb-item-ic,
.cp-sb-search-icon,
.cp-sb-logo,
.cp-fab-toggle,
.cp-sb-foot-action,
.cp-sb-section-h,
.cp-hamburger,
.cp-analise-btn-ia,
.cp-analise-mini,
.cp-gemini-ctx-btn,
.cp-gemini-ctx-mini,
.cp-ia-gemini-ic,
.cp-ia-btn-ic,
.cp-ia-tab,
.cp-ia-sug-btn,
.cp-fiscal-btn-buscar {
  font-family:"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji","Twemoji Mozilla",EmojiOne,system-ui,-apple-system,sans-serif !important;
}

.cp-sb-action{
  font-size:18px !important;
  line-height:1 !important;
}

/* ════════════════════════════════════════════════════════════════════
   v19.1 — Garante sidebar sempre full size no modo hamburger
   ════════════════════════════════════════════════════════════════════ */

/* Quando aberta, FORÇA largura completa - independente de outras classes */
body.cp-sb-mobile-aberta .cp-sidebar{
  width:280px !important;
  max-width:90vw !important;
}

/* Garante todos os elementos visíveis quando aberta */
body.cp-sb-mobile-aberta .cp-sb-brand,
body.cp-sb-mobile-aberta .cp-sb-greet,
body.cp-sb-mobile-aberta .cp-sb-search,
body.cp-sb-mobile-aberta .cp-sb-section-h,
body.cp-sb-mobile-aberta .cp-sb-item-lb,
body.cp-sb-mobile-aberta .cp-sb-item-badge,
body.cp-sb-mobile-aberta .cp-sb-foot-info,
body.cp-sb-mobile-aberta .cp-sb-foot-actions,
body.cp-sb-mobile-aberta .cp-sb-search-kbd{
  display:block !important;
}
body.cp-sb-mobile-aberta .cp-sb-brand{
  display:flex !important;
}
body.cp-sb-mobile-aberta .cp-sb-foot-card{
  display:flex !important;
  justify-content:flex-start !important;
  padding:10px 14px !important;
  gap:10px !important;
}
body.cp-sb-mobile-aberta .cp-sb-actions{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  padding:12px !important;
  gap:6px !important;
}
body.cp-sb-mobile-aberta .cp-sb-action{
  display:flex !important;
}
body.cp-sb-mobile-aberta .cp-sb-item{
  justify-content:flex-start !important;
  padding:11px 14px !important;
  gap:12px !important;
}
body.cp-sb-mobile-aberta .cp-sb-head{
  padding:18px 18px 16px !important;
  justify-content:flex-start !important;
  gap:12px !important;
}

/* ════════════════════════════════════════════════════════════════════
   v19.2 — BARRA SUPERIOR FIXA (modo hamburger)
   Topo de 50px reservado pro ☰ + nome do app
   Conteúdo começa abaixo, sem sobreposição
   ════════════════════════════════════════════════════════════════════ */

/* Barra superior fixa */
.cp-topbar-hamb{
  position:fixed;
  top:0;
  left:0;
  right:0;
  height:50px;
  background:rgba(15,7,26,.85);
  backdrop-filter:blur(18px) saturate(180%);
  -webkit-backdrop-filter:blur(18px) saturate(180%);
  border-bottom:1px solid rgba(167,139,250,.15);
  z-index:9998;
  display:flex;
  align-items:center;
  padding:0 14px;
  gap:12px;
  pointer-events:none;
}
.cp-topbar-hamb > *{
  pointer-events:auto;
}

[data-theme="light"] .cp-topbar-hamb{
  background:rgba(255,255,255,.85);
  border-bottom-color:rgba(124,58,237,.15);
}

/* Ajusta hamburger pra caber dentro da barra */
.cp-hamburger{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  width:38px !important;
  height:38px !important;
  font-size:18px !important;
  border-radius:9px !important;
  flex-shrink:0;
}

/* Nome do app na barra */
.cp-topbar-hamb-brand{
  font-family:var(--dp);
  font-weight:800;
  font-size:15px;
  color:var(--tx);
  background:linear-gradient(135deg, #a78bfa, #ec4899);
  background-clip:text;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  letter-spacing:-.01em;
}

.cp-topbar-hamb-version{
  font-family:var(--mo);
  font-size:10px;
  font-weight:600;
  color:var(--t3);
  letter-spacing:.04em;
  margin-left:auto;
}

/* Empurra conteúdo principal pra baixo da barra */
body > .page,
body > div.page{
  padding-top:64px !important;  /* 50px barra + 14px respiro */
}

/* Sidebar começa ABAIXO da topbar (50px) e tem altura limitada */
.cp-sidebar{
  top:50px !important;
  height:calc(100dvh - 50px) !important;
  max-height:calc(100dvh - 50px) !important;
  padding-top:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}

/* Card de usuário FIXO no rodapé (flexbox em vez de sticky) */
.cp-sb-foot{
  flex-shrink:0 !important;
  flex-grow:0 !important;
  margin-top:auto;
  background:rgba(15,7,26,.95) !important;
  border-top:1px solid rgba(167,139,250,.2);
  z-index:5;
}

[data-theme="light"] .cp-sb-foot{
  background:rgba(255,255,255,.95) !important;
}

/* Nav (lista de itens) faz scroll se preciso, NÃO empurra o footer */
.cp-sb-nav{
  flex:1 1 auto !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
  min-height:0 !important;
}

/* Botões de ação NÃO crescem */
.cp-sb-actions{
  flex-shrink:0 !important;
  flex-grow:0 !important;
}

/* Cabeçalho, greet e search NÃO crescem */
.cp-sb-head,
.cp-sb-greet,
.cp-sb-search{
  flex-shrink:0 !important;
  flex-grow:0 !important;
}

/* Quando login está na tela, esconde a barra */
body:has(#login-screen:not(.hide)) .cp-topbar-hamb{
  display:none !important;
}
body:has(#login-screen:not(.hide)) > .page,
body:has(#login-screen:not(.hide)) > div.page{
  padding-top:0 !important;
}

/* ════════════════════════════════════════════════════════════════════
   v20 — CARD DE USUÁRIO NA TOPBAR
   ════════════════════════════════════════════════════════════════════ */

/* Esconde footer da sidebar (não usa mais) */
.cp-sb-foot{
  display:none !important;
}

/* Card de usuário na topbar (todas as telas) */
.cp-topbar-user{
  display:flex;
  align-items:center;
  gap:9px;
  padding:5px 8px 5px 5px;
  background:rgba(167,139,250,.08);
  border:1px solid rgba(167,139,250,.18);
  border-radius:9px;
  cursor:pointer;
  transition:background .15s, border-color .15s, transform .12s;
  flex-shrink:0;
  margin-left:8px;
  user-select:none;
}
.cp-topbar-user:hover{
  background:rgba(167,139,250,.18);
  border-color:rgba(167,139,250,.4);
}
.cp-topbar-user:active{
  transform:scale(0.97);
}

[data-theme="light"] .cp-topbar-user{
  background:rgba(124,58,237,.06);
  border-color:rgba(124,58,237,.18);
}

/* Avatar circular */
.cp-topbar-avatar{
  width:32px;
  height:32px;
  border-radius:50%;
  background:linear-gradient(135deg, #a78bfa, #ec4899);
  color:#fff;
  font-size:13px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 2px 8px rgba(167,139,250,.35);
  font-family:var(--fn);
  letter-spacing:.02em;
  text-transform:uppercase;
}

.cp-topbar-user-info{
  display:flex;
  flex-direction:column;
  line-height:1.2;
  min-width:0;
}
.cp-topbar-user-name{
  font-family:var(--fn);
  font-size:12.5px;
  font-weight:700;
  color:var(--tx);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:140px;
}
.cp-topbar-user-role{
  font-family:var(--mo);
  font-size:9px;
  color:var(--t3);
  text-transform:uppercase;
  letter-spacing:.06em;
}

/* Mobile: só avatar (esconde nome/role) */
@media (max-width:600px){
  .cp-topbar-user{
    padding:3px;
    background:transparent;
    border-color:transparent;
  }
  .cp-topbar-user-info{
    display:none;
  }
  .cp-topbar-avatar{
    width:36px;
    height:36px;
    font-size:14px;
  }
}

/* Em telas mais estreitas, esconde a versão pra dar espaço */
@media (max-width:480px){
  .cp-topbar-hamb-version{
    display:none;
  }
}

/* Garante topbar com gap correto */
.cp-topbar-hamb{
  gap:10px;
  padding:0 10px;
}
.cp-topbar-hamb-version{
  margin-left:auto;
  margin-right:0;
}

/* ════════════════════════════════════════════════════════════════════
   v20.1 — Garantir todos os botões de ação visíveis (mobile)
   ════════════════════════════════════════════════════════════════════ */

/* Sempre grid 4 colunas pros botões de ação (todas as telas) */
.cp-sb-actions{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  gap:6px !important;
  padding:12px !important;
  padding-bottom:18px !important;  /* respiro extra no rodapé */
}

/* Cada botão com altura mínima garantida */
.cp-sb-action{
  min-height:42px !important;
  display:flex !important;
}

/* ════════════════════════════════════════════════════════════════════
   v20.2 — Fix definitivo dos botões no mobile (caber em qualquer altura)
   ════════════════════════════════════════════════════════════════════ */

@media (max-width:900px){
  /* Sidebar usa altura dinâmica (descontando barras do sistema) */
  .cp-sidebar{
    height:calc(100dvh - 50px) !important;
    max-height:calc(100dvh - 50px) !important;
  }

  /* Botões um pouco menores no mobile pra caber as 2 fileiras */
  .cp-sb-actions{
    padding:8px 10px 14px !important;
    gap:5px !important;
  }
  .cp-sb-action{
    min-height:38px !important;
    height:38px !important;
    font-size:17px !important;
  }
}

/* iOS Safari fallback (tem suporte a dvh desde Sept 2022) */
@supports not (height: 100dvh){
  @media (max-width:900px){
    .cp-sidebar{
      height:calc(100vh - 100px) !important;
      max-height:calc(100vh - 100px) !important;
    }
  }
}

/* ════════════════════════════════════════════════════════════════════
   v20.3 — SCROLL NO SIDEBAR INTEIRO
   Cabeçalho fica fixo no topo, resto rola junto (nav + actions)
   ════════════════════════════════════════════════════════════════════ */

/* Sidebar: layout flex column com scroll interno NO CONTAINER ROLÁVEL */
.cp-sidebar{
  overflow:hidden !important;
}

/* Cabeçalho (logo + saudação + busca) FIXO no topo */
.cp-sb-head,
.cp-sb-greet,
.cp-sb-search{
  flex-shrink:0 !important;
  flex-grow:0 !important;
}

/* Container rolável: nav + actions + qualquer outra seção */
.cp-sidebar > .cp-sb-nav{
  flex:1 1 auto !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  min-height:0 !important;
}

/* Actions (botões de ação) JUNTO com o nav (rolam juntos) */
.cp-sb-actions{
  flex-shrink:0 !important;
  overflow:visible !important;
}

/* Garante que actions seja parte do scroll, não fixo */
@media (max-width:900px){
  .cp-sidebar{
    display:flex !important;
    flex-direction:column !important;
  }
}

/* Scrollbar bonita (visível ao hover) */
.cp-sb-nav::-webkit-scrollbar{
  width:6px !important;
}
.cp-sb-nav:hover::-webkit-scrollbar{
  width:6px !important;
}
.cp-sb-nav::-webkit-scrollbar-track{
  background:transparent;
}
.cp-sb-nav::-webkit-scrollbar-thumb{
  background:rgba(167,139,250,.3);
  border-radius:3px;
}
.cp-sb-nav::-webkit-scrollbar-thumb:hover{
  background:rgba(167,139,250,.5);
}

/* ════════════════════════════════════════════════════════════════════
   v20.3.1 — Actions dentro do nav agora (scroll junto)
   ════════════════════════════════════════════════════════════════════ */

/* Actions dentro do nav (não mais sibling) */
.cp-sb-nav > .cp-sb-actions{
  position:relative !important;
  bottom:auto !important;
  margin-top:auto !important;  /* empurra pro fim do nav */
  padding-top:14px !important;
  padding-bottom:18px !important;
  border-top:1px solid rgba(167,139,250,.15) !important;
  background:transparent !important;  /* sem background fixo */
}

/* Faz o nav ser flex column pra "margin-top:auto" funcionar nos actions */
.cp-sb-nav{
  display:flex !important;
  flex-direction:column !important;
}

/* Container interno onde ficam os items de menu - flex-grow pra empurrar actions */
.cp-sb-nav > section,
.cp-sb-nav > div:not(.cp-sb-actions){
  flex-shrink:0;
}

/* Bonus: indicador visual de scroll (sutil) */
.cp-sb-nav{
  scroll-behavior:smooth;
}