/**
 * Forming-question strip — one dim line above the transcript showing a question the
 * app thinks is being asked RIGHT NOW, before the speaker has finished the sentence.
 * Experimental detection speed only.
 *
 * It is deliberately quieter than the question toast: what it shows is a guess that
 * can still change, and it carries no action, so it must never compete with a
 * confirmed question for attention. Nothing here is clickable.
 *
 * Themed only through tokens the base sheet defines and every theme redefines
 * (`--input-bg`, `--border`, `--text-primary`, `--accent-cta`), so it follows every
 * theme with no per-theme block — the same rule the Up-next strip documents.
 *
 * Only `opacity` is animated (GPU-composited), per the performance rules.
 */

.forming-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    margin: 0 0 8px 0;
    border-radius: 10px;
    background: var(--input-bg);
    /* Dashed: the visual language of "not settled yet". */
    border: 1px dashed var(--border);
    font-size: 0.78rem;
    line-height: 1.3;
    overflow: hidden;
    opacity: 0.85;
    animation: forming-strip-in 0.18s ease-out;
}

.forming-strip[hidden] {
    display: none !important;
}

@keyframes forming-strip-in {
    from { opacity: 0; }
    to   { opacity: 0.85; }
}

.forming-strip-icon {
    flex: 0 0 auto;
    color: var(--accent-cta);
    font-size: 0.72rem;
    /* A slow pulse says "still listening" without pulling the eye off the transcript — a few beats,
       then steady (an endless loop redraws the window every frame while the strip is up). */
    animation: forming-strip-pulse 1.6s ease-in-out 4;
}

@keyframes forming-strip-pulse {
    0%, 100% { opacity: 0.45; }
    50%      { opacity: 1; }
}

.forming-strip-label {
    flex: 0 0 auto;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.62rem;
    font-weight: 600;
    color: var(--text-primary);
    opacity: 0.66;
}

.forming-strip-text {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--text-primary);
    opacity: 0.8;
    font-style: italic;
    /* One line: a growing sentence must never reflow the transcript below it. */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Someone who prefers less motion gets the strip without the pulse or the fade. */
@media (prefers-reduced-motion: reduce) {
    .forming-strip,
    .forming-strip-icon {
        animation: none;
    }
}

/* Three options only fit the narrow settings row when the labels tighten, and only an
 * admin ever sees three. Keyed off `.is-admin`, which _syncDetectionSpeedUI adds, so a
 * non-admin's two-option row keeps its shipped spacing exactly. */
.overflow-segment.is-admin label {
    padding: 0 7px;
    font-size: 0.72rem;
}

/* The rule that makes the `hidden` attribute stick on the segment's controls lives in
 * css/style.css, which is always loaded: keeping it here would leave the admin-only
 * option visible until this fragment arrived. */