/* slim.css -- fouten uitgelegd, quick fixes, fix met agent.
   Alleen de tokens uit core.css (var(--...)), geen eigen hex -- VS Code is de visuele lat. */

/* het gloeilampje in de gutter naast een foutregel: VOORAAN in de rij (order: -2), en
 * verticaal op het midden van het cijfer, net als de breekpuntstip. Het is
 * een flexitem van de .g-rij (e1a.css), dus het emoji staat op de basislijn van het
 * cijfer; een emoji heeft zijn inktmidden zo'n .38em boven zijn basislijn, het cijfer een
 * halve kapitaalhoogte (--gcap) -- het verschil schuift het er precies naast. Eerder stond
 * het met float: left bovenaan de regel, een paar px boven het cijfer. Het eigen emojifont
 * houdt dat .38em gelijk, welk codefont er ook om heen staat. */
.slim-bulb {
  flex: none; order: -2;
  cursor: pointer;
  font: calc(var(--code-fs) * 11 / 14)/1 "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
  transform: translateY(calc(.38em - var(--gcap) / 2));
}
.slim-bulb:hover { filter: brightness(1.3); }

/* de knoppen die dit bestand in e4b's problemenrijen hangt (additief, geen eigen rij) */
.slim-prob-actions {
  margin-left: auto;
  display: flex;
  gap: 4px;
  flex: 0 0 auto;
}
.slim-prob-btn {
  background: var(--surface2);
  color: var(--text);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: 1px 6px;
  font: var(--ui-fs) var(--font-ui);
  cursor: pointer;
}
.slim-prob-btn:hover { background: var(--hover); }

/* de popover: uitleg + quick fixes + fix-met-agent, op klik/hover/Ctrl+. */
.slim-pop {
  position: fixed;
  z-index: 500;
  max-width: 480px;
  max-height: 60vh;
  overflow: auto;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--rule);
  border-radius: 4px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
  padding: 10px 12px;
  font: var(--ui-fs) var(--font-ui);
}

.slim-pop-loading { color: var(--text-dim); font-style: italic; }

.slim-pop-msg {
  font-family: var(--font-code);
  font-size: calc(var(--ui-fs) * 12 / 13);
  color: var(--danger-tx);
  white-space: pre-wrap;
  word-break: break-word;
  margin-bottom: 6px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--rule);
}

.slim-pop-secs { margin-bottom: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.slim-pop-sec {
  background: var(--surface2);
  color: var(--text-dim);
  border-radius: 3px;
  padding: 1px 6px;
  font-size: calc(var(--ui-fs) * 11 / 13);
}

.slim-pop-expl {
  white-space: pre-wrap;
  line-height: 1.5;
  margin-bottom: 8px;
}

.slim-pop-empty { color: var(--text-dim); font-style: italic; margin-bottom: 8px; }
.slim-pop-actions { display: flex; justify-content: flex-end; }