/* ══════════════════════════════════════════════════════════════════════════
   ambient-fergi-mobile.css — the Ambient Fergi entry affordance, in the pocket.

   Train: porting-pocket-instrument S2.
   Component: app/js/mobile/ambient-fergi-mobile.js
   Desktop counterpart (ported, not copied): app/css/ambient-fergi-rail.css

   THE POPUP CHROME IS NOT THIS FILE'S. `.mcp-popup` and `.mcp-popup-backdrop`
   are owned by `mobile-tab-bar.css` — they already carry the surface, the
   radius, the elevation, the safe-area offset, the focus behaviour and the
   `prefers-reduced-motion` opt-out. This file styles only what it renders
   INSIDE that container, so the affordance reads as one of the phone's own
   popups rather than as a second window someone bolted into the bar.

   TOUCH, NOT HOVER. The contract asks for ≥44px targets and no hover
   dependency: every control below is 44px and every hover rule is paired with
   `:focus-visible`, which is what a keyboard and a switch control actually
   reach. Nothing here depends on a pointer that a phone does not have.
   ══════════════════════════════════════════════════════════════════════════ */

.mcp-popup .afm-panel {
    display: block;
}

/* The title the MCP promotes to the dialog's `aria-labelledby`. It inherits
   `.mcp-popup-title` from the tab-bar sheet; this only tightens the gap, since
   a composer sits closer to its own label than a list of choices does. */
.mcp-popup .afm-panel .afm-title {
    margin-bottom: 10px;
}

/* ── the shared control board ───────────────────────────────────────────────
   One row: the field, then the controls. The board is the vault's shipped
   component and keeps its own DOM contract (`data-fic-role` on all four
   controls) — this restyles, it does not re-implement. */
.mcp-popup .afm-panel .fic-board.afm-fic {
    display: flex;
    align-items: flex-end;
    gap: 6px;
    padding: 6px 8px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 12px;
    background: #f7f7f8;
}

.mcp-popup .afm-panel .fic-board.afm-fic .fic-text {
    flex: 1 1 auto;
    min-width: 0;
    resize: none;
    border: 0;
    outline: none;
    background: transparent;
    color: #1f2937;
    font: inherit;
    /* 16px is the iOS threshold below which Safari zooms the viewport on
       focus. A zoom here would push the room the member is scoping off screen
       — the one thing an ambient control must never do. */
    font-size: 16px;
    line-height: 1.4;
    padding: 10px 4px;
    max-height: 5.6em;
}

.mcp-popup .afm-panel .fic-board.afm-fic .fic-text::placeholder {
    color: #6b7280;
    opacity: 1;
}

/* ≥44px, per the contract. The glyphs inside stay at their component size; the
   TARGET is what grows. */
.mcp-popup .afm-panel .fic-board.afm-fic button {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #374151;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.mcp-popup .afm-panel .fic-board.afm-fic button:focus-visible,
.mcp-popup .afm-panel .fic-board.afm-fic button:active {
    background: rgba(0, 0, 0, 0.07);
    color: #111827;
}

/* The inert conversation control is honestly inert, and looks it. Joe I.2 put
   it on every manifestation; `aria-disabled` already says so to a screen
   reader, and this says the same thing to an eye. */
.mcp-popup .afm-panel .fic-board.afm-fic [data-fic-inert="true"] {
    opacity: 0.42;
    cursor: default;
}

.mcp-popup .afm-panel .fic-board.afm-fic [data-fic-role="mic"].active {
    color: #c2410c;
}

/* The board's polite live region: announced, never seen. */
.mcp-popup .afm-panel .fic-live {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* ── the standing answer ────────────────────────────────────────────────────
   NOT a transcript entry. One line, written once per submit and left there —
   and on this surface it outlives the popup itself, because the panel is moved
   out to a detached holder on dismiss rather than destroyed. So "a local result
   must remain usable after the compact transcript collapses" is true here for
   the strongest possible reason: the collapse does not touch it.

   Empty until there is something to say. An empty answer line must not reserve
   a row of a popup that is already competing with a software keyboard. */
.mcp-popup .afm-panel .afm-result {
    margin: 10px 2px 0 2px;
    font-size: 0.9rem;
    line-height: 1.4;
    color: #4b5563;
}

.mcp-popup .afm-panel .afm-result:empty {
    display: none;
}

.mcp-popup .afm-panel .afm-result.afm-ok {
    color: #15803d;
}

.mcp-popup .afm-panel .afm-result.afm-warn {
    color: #b45309;
}

/* The canonical "Did this help?" control, offered on the routed path only. It
   ships its own markup from `utils.js`; this only gives it room to breathe and
   a target a thumb can hit. */
.mcp-popup .afm-panel .afm-result .ffa-helpful-btn {
    min-width: 44px;
    min-height: 44px;
}

/* ── stripped mode ──────────────────────────────────────────────────────────
   Stripped mode stands the decoration down; the affordance is a CONTROL, so it
   stays — it simply drops the plate and reads as plain furniture on a plain
   surface. Same ruling as the desktop rail, and the same one line of CSS. */
.ffrw-stripped .mcp-popup .afm-panel .fic-board.afm-fic,
body.ffa-stripped .mcp-popup .afm-panel .fic-board.afm-fic {
    background: transparent;
}

/* Reduced motion: the popup's own rise/fade is already opted out by
   `mobile-tab-bar.css`. This file animates nothing, and says so rather than
   leaving a later author to wonder whether it was forgotten. */
@media (prefers-reduced-motion: reduce) {
    .mcp-popup .afm-panel .fic-board.afm-fic button {
        transition: none;
    }
}

/* ── the degradation line (truly-ambient-fergiai S1, W1.3) ──────────────────
   The pocket twin of `.afr-degraded`. Same rule, same restraint: it qualifies
   the answer, it does not replace it. See ambient-fergi-rail.css for the why. */
.mcp-popup .afm-panel .afm-result .afm-degraded {
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px solid var(--border-subtle, rgba(255, 255, 255, 0.12));
    font-size: 0.8rem;
    font-style: italic;
    opacity: 0.85;
}
