/* ===== Sidebar spacing / gaps ===== */
:root{
  /* tweak these two numbers to make the sidebar tighter/looser */
  --sb-row-gap: 10px;      /* space between menu rows */
  --sb-pad-y:   12px;      /* vertical padding inside each row */
}

.sidebar .nav .nav-item{
  margin-bottom: var(--sb-row-gap);
}

.sidebar .nav .nav-item .nav-link{
  display:flex;
  align-items:center;
  gap:14px;                /* icon ↔ text spacing */
  padding: var(--sb-pad-y) 16px;
  border-radius: 12px;     /* the rounded active bubble */
  line-height: 1.25;
}

/* keep icons aligned in a fixed box so labels line up nicely */
.sidebar .nav .nav-item .menu-icon{
  width:24px;              /* wider icon box makes it feel less cramped */
  min-width:24px;
  text-align:center;
  font-size:18px;
  opacity:.9;
}

/* prevent wrapping / wobble */
.sidebar .nav .nav-item .menu-title{
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  letter-spacing:.1px;
}

/* arrow pinned to the far right (for collapsible items) */
.sidebar .nav .nav-item .menu-arrow{
  margin-left:auto;
}

/* subtle states */
.sidebar .nav .nav-item .nav-link:hover,
.sidebar .nav .nav-item.active > .nav-link{
  background:#f3f1ff;
  color:#2e266f;
}

/* profile block spacing (optional) */
.sidebar .nav-profile{
  margin-bottom: 8px;
}
.sidebar .nav-profile .profile-name .name{ font-weight:600; }

/* mobile keeps it neat */
@media (max-width: 991.98px){
  :root{
    --sb-row-gap: 8px;
    --sb-pad-y:   10px;
  }
}

/* Dashboard chart sizing */
.chart-card { height: 360px; }                 /* pick 300–420px if you prefer */
.chart-card .card-body { height: 100%; }
.chart-card canvas {
  width: 100% !important;
  height: 100% !important;                     /* canvas fills the card height */
  display: block;
}
