/* Spørg panelet (web/js/assistant.js): the corner button and the panel beside the page. */
.as-fab{ position:fixed; right:20px; bottom:20px; z-index:40; display:inline-flex; gap:8px; align-items:center;
  padding:11px 16px; border-radius:999px; border:0; cursor:pointer; font:inherit; font-weight:650; font-size:14px;
  color:#fff; background:var(--accent); box-shadow:0 6px 20px rgba(29,27,63,.22) }
.as-fab:hover{ filter:brightness(1.06) }
.as-fab:focus-visible{ outline:3px solid var(--wash-2); outline-offset:2px }
.as-panel{ position:fixed; top:0; right:0; bottom:0; width:min(480px, 100vw); z-index:45; display:flex; flex-direction:column;
  background:var(--surface); border-left:1px solid var(--hair-2); box-shadow:-10px 0 30px rgba(29,27,63,.14) }
.as-head{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:14px 16px 12px; border-bottom:1px solid var(--hair) }
.as-head b{ display:block; font-size:15px }
.as-head small{ color:var(--ink-3); font-size:12px }
.as-tools{ display:flex; gap:6px; align-items:center }
.as-tools .btn{ white-space:nowrap }
.as-list{ flex:1; overflow-y:auto; padding:14px 16px; display:flex; flex-direction:column; gap:16px }
.as-empty p{ margin:0 0 10px; color:var(--ink-2); font-size:13.5px; line-height:1.5 }
.as-examples{ display:flex; flex-direction:column; gap:6px }
.as-ex{ text-align:left; font:inherit; font-size:13px; line-height:1.4; padding:8px 11px; border-radius:10px; cursor:pointer;
  border:1px solid var(--hair-2); background:var(--sunk); color:var(--ink) }
.as-ex:hover{ background:var(--wash) }
.as-turn{ display:flex; flex-direction:column; gap:8px }
.as-q{ align-self:flex-end; max-width:88%; background:var(--wash-2); color:var(--ink); padding:9px 12px; border-radius:14px 14px 4px 14px;
  font-size:13.5px; line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere }
.as-a{ font-size:13.5px; line-height:1.55; color:var(--ink); overflow-wrap:anywhere }
.as-a p{ margin:0 0 8px }
.as-a h4{ margin:10px 0 4px; font-size:13.5px }
.as-a ul, .as-a ol{ margin:0 0 8px; padding-left:20px }
.as-a li{ margin:2px 0 }
.as-a code{ font-family:"DM Mono", ui-monospace, monospace; font-size:12px; background:var(--sunk); padding:1px 5px; border-radius:5px }
.as-a a{ color:var(--accent); font-weight:600 }
.as-table{ overflow-x:auto; margin:0 0 8px; border:1px solid var(--hair); border-radius:8px }
.as-table table.t{ font-size:12.5px; margin:0 }
.as-table td.num{ text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums }
.as-src{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:4px; font-size:12px }
.as-src span{ color:var(--ink-3) }
.as-src a{ padding:2px 8px; border-radius:999px; background:var(--sunk); color:var(--ink-2); font-weight:500; text-decoration:none }
.as-src a:hover{ background:var(--wash) }
.as-err p{ color:var(--neg); margin:0 0 6px }
.as-wait{ display:flex; gap:10px; align-items:flex-start; color:var(--ink-2) }
.as-steps{ margin:0; padding:0; list-style:none; font-size:12.5px; display:flex; flex-direction:column; gap:3px }
.as-steps li::before{ content:"· "; color:var(--ink-3) }
.as-steps li.bad{ color:var(--warn) }
.as-dots{ display:flex; gap:4px; padding-top:6px }
.as-dots i{ width:6px; height:6px; border-radius:50%; background:var(--accent); opacity:.3; animation:as-blink 1.2s infinite ease-in-out }
.as-dots i:nth-child(2){ animation-delay:.2s }
.as-dots i:nth-child(3){ animation-delay:.4s }
@keyframes as-blink{ 0%, 80%, 100%{ opacity:.25 } 40%{ opacity:1 } }
@media (prefers-reduced-motion: reduce){ .as-dots i{ animation:none; opacity:.6 } }
.as-form{ display:flex; gap:8px; align-items:flex-end; padding:10px 16px 6px; border-top:1px solid var(--hair) }
.as-form textarea{ flex:1; resize:none; font-size:13.5px; line-height:1.45; padding:9px 11px; min-height:44px; max-height:160px }
.as-form .btn{ height:44px; min-width:44px; justify-content:center }
.as-errline{ margin:0; padding:0 16px 4px; color:var(--neg); font-size:12.5px }
.as-foot{ margin:0; padding:4px 16px 12px; color:var(--ink-3); font-size:11.5px; line-height:1.4 }
/* the admin card */
.as-admin{ display:flex; flex-direction:column; gap:14px }
.as-admin-row{ display:flex; justify-content:space-between; gap:14px; align-items:flex-start; flex-wrap:wrap }
.as-keyform{ display:flex; gap:8px; align-items:center; flex-wrap:wrap }
.as-keyform .input{ width:300px; max-width:100% }
.as-admin-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px }
.as-log summary{ cursor:pointer; font-size:13px; color:var(--ink-2); margin-bottom:8px }
@media (max-width: 560px){
  .as-fab{ right:14px; bottom:14px }
  .as-panel{ width:100vw; border-left:0 }
}
@media print{ .as-root{ display:none !important } }
