/*
 * Fairgleichen KI inside Kyusu's <k:assistant>: window, bubbles, chips, composer and typing dots
 * are Kyusu's (css/assistant.css). Here only what fg_ki's answers and FG's own tools need.
 */

/* answers come with tables: a wider window than the prototype's 380px */
#fgai-root
{
    --kyusu-assistant-width: 440px;
}

/* stay above the sticky action bar of the workflow pages (75px) */
body:has(.bottom-bar) #fgai-root
{
    --kyusu-assistant-offset: 99px;
}

/* ---------- Title extras ---------- */
.fgai-badge-beta,
.fgai-version
{
    margin-left: 7px;
    padding: 1px 6px;
    border-radius: 999px;
    background: var(--kyusu-primary-50);
    color: var(--kyusu-primary);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    vertical-align: middle;
    white-space: nowrap;
}

.fgai-badge-beta { text-transform: uppercase; }
.fgai-version { font-weight: 600; }
.fgai-version:empty { display: none; }

/* ---------- Context line + search bar (the `top` facet) ---------- */
.fgai-context-bar
{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-bottom: 1px solid var(--kyusu-line);
    font-size: 12px;
    color: var(--kyusu-secondary);
}

.fgai-context-bar .k-icon { color: var(--kyusu-primary); }
.fgai-context-bar strong { color: var(--kyusu-ink); font-weight: 600; }

.fgai-search
{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px 4px 14px;
    border-bottom: 1px solid var(--kyusu-line);
    color: var(--kyusu-secondary);
}

.fgai-search.fgai-hidden { display: none; }

.fgai-search input
{
    flex: 1 1 auto;
    min-width: 0;
    border: none;
    outline: none;
    font-size: 13px;
    font-family: inherit;
    color: var(--kyusu-ink);
    background: transparent;
}

.fgai-search-count
{
    font-size: 11px;
    white-space: nowrap;
}

mark.fgai-hl
{
    background: #ffe08a;
    color: inherit;
    border-radius: 2px;
    padding: 0 1px;
}

/* ---------- Greeting ---------- */
.fgai-greeting-title
{
    margin: 0 0 6px;
    font-weight: 700;
}

/* ---------- Markdown inside a bubble ---------- */
.k-assistant__msg p { margin: 0 0 8px; }
.k-assistant__msg p:last-child { margin-bottom: 0; }
.k-assistant__msg strong { font-weight: 700; }
.k-assistant__msg code
{
    background: rgba(16, 24, 40, 0.06);
    padding: 1px 5px;
    border-radius: 4px;
    font-size: 12px;
}

/* a table wider than the bubble scrolls inside it instead of widening the window */
.k-assistant__msg table
{
    display: block;
    overflow-x: auto;
    border-collapse: collapse;
    margin: 6px 0;
    font-size: 12px;
    overflow-wrap: normal; /* the bubble's `anywhere` would split "364,17" across lines */
}

.k-assistant__msg th,
.k-assistant__msg td
{
    border: 1px solid var(--kyusu-line);
    padding: 4px 8px;
    text-align: left;
}

.k-assistant__msg th { background: var(--kyusu-canvas); }
.k-assistant__msg tbody tr:nth-child(even) td { background: rgba(16, 24, 40, 0.025); }

.k-assistant__msg h1, .k-assistant__msg h2, .k-assistant__msg h3,
.k-assistant__msg h4, .k-assistant__msg h5, .k-assistant__msg h6
{
    margin: 12px 0 6px;
    line-height: 1.25;
    font-weight: 700;
}

.k-assistant__msg h1:first-child, .k-assistant__msg h2:first-child, .k-assistant__msg h3:first-child,
.k-assistant__msg h4:first-child, .k-assistant__msg h5:first-child, .k-assistant__msg h6:first-child { margin-top: 0; }
.k-assistant__msg h1 { font-size: 16px; }
.k-assistant__msg h2 { font-size: 15px; }
.k-assistant__msg h3 { font-size: 14px; }
.k-assistant__msg h4, .k-assistant__msg h5, .k-assistant__msg h6 { font-size: 13px; }

.k-assistant__msg hr
{
    border: 0;
    border-top: 1px solid var(--kyusu-line);
    margin: 12px 0;
}

.k-assistant__msg blockquote
{
    margin: 8px 0;
    padding: 6px 12px;
    border-left: 3px solid var(--kyusu-primary);
    background: var(--kyusu-canvas);
    border-radius: 0 6px 6px 0;
    color: var(--kyusu-secondary);
}

.k-assistant__msg blockquote > :last-child { margin-bottom: 0; }

.k-assistant__msg[data-from="bot"] a { color: var(--kyusu-primary); font-weight: 600; }

.fgai-content.fgai-streaming::after
{
    content: "▋";
    display: inline-block;
    margin-left: 1px;
    color: var(--kyusu-primary);
    font-size: 0.85em;
    vertical-align: text-bottom;
    animation: fgai-streaming-blink 0.9s step-start infinite;
}

@keyframes fgai-streaming-blink
{
    50% { opacity: 0; }
}

/* ---------- Status lines of fg_ki's tools (NDJSON `status`) ---------- */
.fgai-status
{
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12.5px;
    color: var(--kyusu-secondary);
}

.fgai-status .k-assistant__typing { margin-top: 7px; }

.fgai-status-content
{
    flex: 1;
    min-width: 0;
    line-height: 1.45;
}

.fgai-status-content > :first-child { margin-top: 0; }
.fgai-status-content > :last-child { margin-bottom: 0; }
.fgai-status-content p { margin-bottom: 6px; }
.fgai-status-content ul, .fgai-status-content ol { margin: 4px 0 0; padding-left: 18px; }

.fgai-status-icon
{
    flex: 0 0 auto;
    width: 14px;
    margin-top: 2px;
    text-align: center;
}

.fgai-status-success .fgai-status-icon { color: var(--kyusu-positive); }
.fgai-status-warning .fgai-status-icon { color: #9a6700; }
.fgai-status-error .fgai-status-icon,
.fgai-status-error .fa { color: var(--kyusu-danger); }

/* ---------- Feedback ---------- */
.fgai-feedback
{
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: -4px;
    font-size: 12px;
    color: var(--kyusu-secondary);
}

.fgai-feedback button
{
    border: none;
    background: transparent;
    color: var(--kyusu-secondary);
    cursor: pointer;
    font-size: 13px;
    padding: 4px 6px;
    border-radius: 6px;
}

.fgai-feedback button:hover:not(:disabled) { background: var(--kyusu-line); color: var(--kyusu-ink); }
.fgai-feedback button.fgai-active-up   { color: var(--kyusu-positive); }
.fgai-feedback button.fgai-active-down { color: var(--kyusu-danger); }

.fgai-feedback-comment
{
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.fgai-feedback-comment textarea
{
    width: 100%;
    box-sizing: border-box;
    resize: vertical;
    min-height: 44px;
    padding: 8px 10px;
    font: inherit;
    font-size: 12.5px;
    color: var(--kyusu-ink);
    border: 1px solid var(--kyusu-line);
    border-radius: 10px;
    outline: none;
}

.fgai-feedback-comment textarea:focus { border-color: var(--kyusu-primary); }

.fgai-feedback-comment-actions
{
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.fgai-feedback-skip,
.fgai-feedback-send
{
    border-radius: 999px;
    font: inherit;
    font-size: 12.5px;
    padding: 5px 14px;
    cursor: pointer;
}

.fgai-feedback-skip
{
    border: none;
    background: transparent;
    color: var(--kyusu-secondary);
}

.fgai-feedback-skip:hover { color: var(--kyusu-ink); }

.fgai-feedback-send
{
    border: 1px solid var(--kyusu-primary);
    background: var(--kyusu-primary);
    color: var(--kyusu-primary-contrast);
}

.fgai-feedback-send:hover { background: var(--kyusu-primary-dark); }

.fgai-feedback-thanks
{
    font-size: 12px;
    color: var(--kyusu-secondary);
}
