/* gogridgo column chooser — the ⚙ "Kolumny" group (see columns.js).

   A report can have 60 columns, so the list scrolls inside the panel instead
   of growing it past the viewport; everything else stays as compact as the
   other settings groups. */

.gg-cols-list {
  max-height: 9rem;
  overflow-y: auto;
  margin: 0.25rem 0;
  border: 1px solid #e5e7eb;
  border-radius: 0.25rem;
  background: #fff;
}

.gg-cols-row {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.125rem 0.25rem;
  font-size: 0.8125rem;
  line-height: 1.4;
}

.gg-cols-row + .gg-cols-row {
  border-top: 1px solid #f3f4f6;
}

.gg-cols-row:hover {
  background: #f9fafb;
}

/* The label takes the slack so the two buttons stay pinned right, and a long
   caption is cut rather than wrapping into a two-line row. */
.gg-cols-name {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  flex: 1 1 auto;
  min-width: 0;
  cursor: pointer;
}

.gg-cols-name > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* An unchecked row is still readable — it is coming back sooner or later. */
.gg-cols-row:has(.gg-cols-vis:not(:checked)) .gg-cols-name > span {
  color: #9ca3af;
}

.gg-cols-move {
  flex: none;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 0.1875rem;
  background: transparent;
  color: #6b7280;
  font-size: 0.625rem;
  line-height: 1;
  cursor: pointer;
}

.gg-cols-move:hover:not(:disabled) {
  background: #e5e7eb;
  border-color: #d1d5db;
  color: #111827;
}

.gg-cols-move:disabled {
  opacity: 0.25;
  cursor: default;
}

/* Brief tint on the row that just moved: with 24 near-identical rows the eye
   needs help finding where the one you clicked landed. */
.gg-cols-moved {
  background: #eef2ff;
}

/* Sticky, because a 60-column list turns the panel into a scroller and an
   "Apply" you have to scroll to find is an "Apply" that gets missed. */
.gg-cols-actions {
  position: sticky;
  bottom: 0;
  display: flex;
  gap: 0.375rem;
  padding-top: 0.25rem;
  background: #fff;
}

.gg-cols-actions button {
  flex: 1 1 auto;
  padding: 0.25rem 0.5rem;
  border: 1px solid #d1d5db;
  border-radius: 0.25rem;
  background: #f9fafb;
  color: #374151;
  font-size: 0.75rem;
  cursor: pointer;
}

.gg-cols-actions button:hover {
  background: #e5e7eb;
}

.gg-cols-apply {
  font-weight: 600;
}

@media (prefers-color-scheme: dark) {
  .gg-cols-list {
    border-color: #374151;
    background: #1f2937;
  }
  .gg-cols-row + .gg-cols-row { border-top-color: #374151; }
  .gg-cols-row:hover { background: #374151; }
  .gg-cols-moved { background: #312e81; }
  .gg-cols-move:hover:not(:disabled) {
    background: #374151;
    border-color: #4b5563;
    color: #f9fafb;
  }
  .gg-cols-actions { background: #1f2937; }
  .gg-cols-actions button {
    border-color: #4b5563;
    background: #374151;
    color: #e5e7eb;
  }
  .gg-cols-actions button:hover { background: #4b5563; }
}