/* public/portal/soeg.css — appen Søg (public/portal/soeg.js). Søgefeltet er siden, og træffene er en
   rolig liste; ingen tal-kort eller tabeller (Jakob 2026-11-02: kopiér ikke rapport-siderne). */
#sg { max-width: 1040px; margin: 0 auto; }
.sg-hoved { padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.sg-titel { display: flex; gap: 16px; align-items: center; }
.sg-titel .gt-appikon { width: 56px; height: 56px; flex: none; }
.sg-overtitel { font-family: Georgia, serif; font-style: italic; font-size: 14px; color: var(--gt-tekst2); }
.sg-titel h1 { font-family: Georgia, serif; font-weight: 600; font-size: 26px; line-height: 1.2; }
.sg-titel h1 span { font-style: italic; font-weight: 400; font-size: 16px; color: var(--gt-tekst2); }
.sg-meta { font-size: 13px; color: var(--gt-tekst2); }
.sg-felt { display: flex; gap: 8px; }
.sg-input { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; height: 48px; padding: 0 16px;
  background: var(--gt-flade2); border: 1px solid var(--gt-kant); border-radius: 8px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .08); color: var(--gt-tekst2); }
.sg-input:focus-within { border-color: var(--gt-accent); box-shadow: inset 0 1px 2px rgba(0, 0, 0, .08), 0 0 0 3px var(--gt-accent-svag); }
.sg-input svg { width: 20px; height: 20px; flex: none; }
.sg-input input { flex: 1; min-width: 0; border: 0; background: none; outline: none; font: inherit; font-size: 16px; color: var(--gt-tekst); }
.sg-knap { height: 48px; padding: 0 24px; font-size: 16px; }
.sg-valg { display: flex; flex-direction: column; gap: 8px; }
.sg-valg-rk { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sg-etiket { width: 80px; font-size: 12px; text-transform: uppercase; letter-spacing: 1.2px; color: var(--gt-tekst2); }
.sg-chips { display: flex; gap: 8px; flex-wrap: wrap; flex: 1; min-width: 0; }
.sg-chip { height: 32px; padding: 0 12px; border-radius: 99px; border: 1px solid var(--gt-kant); background: var(--gt-flade);
  color: var(--gt-tekst); font: inherit; font-size: 13px; cursor: pointer; transition: background 150ms, border-color 150ms; }
.sg-chip:hover { border-color: var(--gt-tekst2); }
.sg-chip[aria-pressed="true"] { background: var(--gt-tekst); border-color: var(--gt-tekst); color: var(--gt-flade); }
.sg-chip-skelet { display: inline-block; width: 180px; height: 32px; border-radius: 99px; }

.sg-start { margin-top: 24px; }
.sg-start-tx { font-size: 12px; text-transform: uppercase; letter-spacing: 1.2px; color: var(--gt-tekst2); margin-bottom: 8px; }
.sg-forslag { display: flex; gap: 8px; flex-wrap: wrap; }
.sg-forslag button { height: 36px; padding: 0 16px; border-radius: 99px; border: 1px dashed var(--gt-kant); background: none;
  font: inherit; font-size: 14px; color: var(--gt-tekst); cursor: pointer; }
.sg-forslag button:hover { border-style: solid; background: var(--gt-flade); }

.sg-antal { font-size: 14px; color: var(--gt-tekst2); margin: 24px 0 12px; }
.sg-antal b { color: var(--gt-tekst); }
.sg-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.sg-traef { background: var(--gt-flade); border: 1px solid var(--gt-kant); border-top-color: var(--gt-kant-lys); border-left-color: var(--gt-kant-lys);
  border-radius: 12px; padding: 16px; box-shadow: inset 0 1px 0 var(--gt-kant-lys), 0 1px 2px rgba(51, 50, 44, .12);
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; }
.sg-traef-top { grid-column: 1 / -1; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 12px; color: var(--gt-tekst2); }
.sg-type { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 2px 8px; border-radius: 99px;
  background: var(--gt-flade2); border: 1px solid var(--gt-kant); color: var(--gt-tekst); }
.sg-aaben::before, .sg-lukket::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }
.sg-aaben::before { background: #e3a92a; }
.sg-lukket::before { background: var(--gt-ok); }
.sg-titel-tx { grid-column: 1; font-size: 16px; font-weight: 600; overflow-wrap: anywhere; }
.sg-dalux { grid-column: 2; grid-row: 2 / span 2; align-self: start; height: 32px; font-size: 13px; white-space: nowrap; display: inline-flex; align-items: center; text-decoration: none; }
.sg-sti { grid-column: 1; font-size: 12px; color: var(--gt-tekst2); overflow-wrap: anywhere; }
.sg-uddrag { grid-column: 1; font-size: 14px; line-height: 1.5; margin-top: 4px; overflow-wrap: anywhere; }
.sg-uddrag mark { background: var(--gt-accent-svag); box-shadow: inset 0 -2px 0 rgba(232, 89, 12, .35); color: inherit; border-radius: 2px; padding: 0 1px; }
.sg-flere { margin: 16px auto 0; display: block; }
.sg-skelet { height: 116px; border-radius: 12px; }
.sg-tom { margin-top: 24px; }
.sg-fejl { margin-top: 24px; }

@media (max-width: 700px) {
  .sg-hoved { padding: 16px; }
  .sg-titel { align-items: flex-start; }
  .sg-titel h1 { font-size: 22px; }
  .sg-knap { padding: 0 16px; }
  .sg-etiket { width: 100%; }
  .sg-valg-rk { gap: 4px; }
  .sg-chips { flex-wrap: nowrap; overflow-x: auto; width: 100%; padding-bottom: 4px; }
  .sg-chip { flex: none; }
  .sg-traef { grid-template-columns: minmax(0, 1fr); padding: 12px; }
  .sg-dalux { grid-column: 1; grid-row: auto; order: 5; justify-self: start; margin-top: 8px; }
}

/* Svaret øverst: Claude læser de bedste træf og svarer med kildenumre. Lys flade, ikke et mørkt panel
   (Jakob 2026-11-10: GT AI-knap og sidepanel er fravalgt). */
.sg-svar { margin-top: 24px; padding: 20px 24px; border-left: 3px solid var(--gt-accent); }
.sg-svar-top { font-size: 12px; color: var(--gt-tekst2); display: flex; align-items: center; gap: 0; flex-wrap: wrap; margin-bottom: 8px; }
.sg-svar-top b { font-size: 12px; text-transform: uppercase; letter-spacing: 1.2px; color: var(--gt-tekst); }
.sg-svar-prik { width: 8px; height: 8px; border-radius: 50%; background: var(--gt-accent); margin-right: 8px; flex: none; }
.sg-svar-henter .sg-svar-prik { animation: sg-puls 1.2s ease-in-out infinite; }
@keyframes sg-puls { 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .sg-svar-henter .sg-svar-prik { animation: none; } }
.sg-svar-tekst { font-size: 15px; line-height: 1.6; overflow-wrap: anywhere; }
.sg-svar-tekst p + p, .sg-svar-tekst p + ul, .sg-svar-tekst ul + p { margin-top: 8px; }
.sg-svar-tekst ul { margin: 4px 0 0; padding-left: 20px; }
.sg-svar-tekst li + li { margin-top: 2px; }
.sg-svar-skelet { display: block; height: 14px; border-radius: 4px; margin: 6px 0; }
.sg-svar-fejl { font-size: 14px; color: var(--gt-tekst2); }
.sg-ref { display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 18px; padding: 0 4px; margin: 0 1px;
  border-radius: 4px; border: 1px solid var(--gt-kant); background: var(--gt-flade2); color: var(--gt-tekst);
  font: inherit; font-size: 11px; font-weight: 600; line-height: 1; vertical-align: 2px; cursor: pointer; }
.sg-ref:hover { border-color: var(--gt-accent); color: var(--gt-accent); }
.sg-kilder { list-style: none; margin: 16px 0 0; padding: 12px 0 0; border-top: 1px solid var(--gt-kant); display: flex; flex-direction: column; gap: 8px; }
.sg-kilder:empty, .sg-kilder[hidden] { display: none; }
.sg-kilde { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 4px 6px; border-radius: 6px; }
.sg-kilde-vist { animation: sg-vist 1.6s ease-out; }
@keyframes sg-vist { from { background: var(--gt-accent-svag); } to { background: transparent; } }
.sg-kilde-nr { min-width: 22px; height: 22px; border-radius: 4px; background: var(--gt-tekst); color: var(--gt-flade);
  font-size: 12px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.sg-kilde-titel { font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.sg-kilde-link { font-size: 13px; white-space: nowrap; }
@media (max-width: 700px) {
  .sg-svar { padding: 16px; }
  .sg-kilde { grid-template-columns: auto minmax(0, 1fr); }
  .sg-kilde-link { grid-column: 2; }
}
