:root { --sidebar-width: 260px; }

body { margin: 0; }

.sidebar {
  position: fixed;
  top: 0; left: 0; bottom: 0;
  width: var(--sidebar-width);
  background: #1f2937;
  color: white;
  padding: .5rem;
}

.sidebar a { color: #e5e7eb; text-decoration:none; }
.sidebar a:hover { color: white; }

.content {
  margin-left: var(--sidebar-width);
  padding: 1.5rem;
}

.menu-title {
  font-size: .75rem;
  letter-spacing: .05em;
  opacity:.75;
  margin-top:.5rem;
}

.nav-link { padding: .2rem 0; display:block; }

.sidebar .mb-3 {
  margin-bottom: .5rem !important;
}

.disabled-link { opacity:.5; pointer-events:none; }

.role-badge {
  font-size:.75rem;
  background:#374151;
  padding:.2rem .4rem;
  border-radius:.25rem;
}

.percent-box { max-width: 120px; }
.max-box { max-width: 180px; }

.stat-blink { animation: flash 0.7s ease; }
@keyframes flash {
  0% { transform: scale(1); box-shadow: 0 0 0 rgba(0,0,0,0); }
  50% { transform: scale(1.08); box-shadow: 0 0 15px rgba(0,123,255,.6); }
  100% { transform: scale(1); box-shadow: 0 0 0 rgba(0,0,0,0); }
}

.hover-card:hover {
  transform: translateY(-2px);
  transition: .15s ease;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

/* Kommentarfeld */
.comment-box{
  font-size:.85rem;
  height:34px;
  min-height:34px;
  resize:vertical;
  color:#212529;
}

.comment-box::placeholder{
  color:#6c757d;
  opacity:1;
}