/* =========================================================
   SIDEBAR (token-driven) + SINGLE SCROLL
   Scroll verticale sull'intera sidebar (non sulla ul)
   ========================================================= */

/* ===== Sidebar ===== */
.sidebar{
  width: var(--sidebarWidth);
  min-width: var(--sidebarMinWidth);
  background: var(--panel);
  padding: var(--sidebarPadding);

  display:flex;
  flex-direction:column;
  gap:10px;

  border-right: 1px solid var(--borderSoft);

  /* ✅ single scroll */
  overflow-y: auto;
  height: 100%;
  max-height: 100vh;
  max-height: 100svh;

  /* keep scrollbar space stable (nice UX) */
  scrollbar-gutter: stable;
}

/* Brand title */
.sidebar h1{
  margin:0;
  color: var(--accent);
  font-size: calc(var(--fontSize) + 4px);
  line-height: 1.15;
}

/* Primary buttons */
.sidebar button{
  padding:10px;
  background: var(--accent);
  border: none;
  border-radius: var(--buttonRadius);
  cursor: pointer;
  font-weight: 700;
  color: #0b0f1a; /* readable on bright accent */
}

.sidebar button:hover{ filter:brightness(1.05); }
.sidebar button:active{ transform: translateY(1px); }
.sidebar button:focus{
  box-shadow: var(--focusRing);
}

/* Secondary button */
.btn-secondary{
  padding:10px;
  border:none;
  border-radius: var(--buttonRadius);
  background: var(--btnSecondary);
  color: var(--text);
  cursor:pointer;
}

.btn-secondary:hover{ filter:brightness(1.08); }
.btn-secondary:active{ transform: translateY(1px); }
.btn-secondary:focus{
  box-shadow: var(--focusRing);
}

/* Me box */
.me{
  padding:10px;
  border-radius: var(--radius);
  background: var(--mutedPanel);
  border:1px solid var(--border);
  font-size: calc(var(--fontSize) - 1px);
  opacity:.9;
}

/* Card blocks inside sidebar (settings panels) */
.sidebar .card{
  width: 100%;
  border-radius: var(--radius);
}

/* Make selects match theme */
.sidebar select{
  width:100%;
  padding:10px 10px;
  border-radius: var(--buttonRadius);
  border:1px solid var(--border);
  background: var(--mutedPanel);
  color: var(--text);
  outline:none;
}

.sidebar select:focus{
  border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
  box-shadow: var(--focusRing);
}

/* Conversations list (no internal scroll; it scrolls with the sidebar) */
.sidebar ul{
  list-style:none;
  padding:0;
  margin:0;

  /* ✅ no double scroll */
  overflow: visible;
  flex: 0;

  border-top:1px solid color-mix(in srgb, var(--borderSoft) 70%, transparent);
  padding-top:10px;
}

.sidebar li{
  padding:10px;
  border-radius: var(--buttonRadius);
  cursor:pointer;
}

.sidebar li:hover{
  background: var(--btnSecondary);
}

/* Optional: scrollbar theme (WebKit) — on sidebar */
.sidebar::-webkit-scrollbar{
  width:10px;
}
.sidebar::-webkit-scrollbar-thumb{
  background: color-mix(in srgb, var(--accent) 18%, transparent);
  border-radius: 999px;
}
.sidebar::-webkit-scrollbar-track{
  background: transparent;
}