/**
 * File:          public/css/status_strip.css
 * Version:       0.1.1
 * Last Modified: 2026-11-01 08:48 PM EST
 * Changes:       0.1.1 — Chat 2.0 merge: the jump-to-latest button (#scrollBottomBtn) rises above the strip while the
 *                strip shows (step 5's shorter composer put the button on top of it).
 *                0.1.0 — New. Chat 2.0 step 4 status strip (status_strip.js): one thin glass pill centred just above the
 *                composer. Working = shimmer + working colour cycle (chat2_tokens.css) + round ■ Stop; Waiting for
 *                you = amber; Offline = red, tap shows the reason + Reconnect now. Hidden when idle.
 */
.c2-status-strip { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px;
  width: max-content; max-width: calc(100% - 16px); margin: 0 auto 8px; padding: 3px 4px 3px 12px; box-sizing: border-box;
  border: 1px solid var(--c2-float-line); border-radius: 18px; background: var(--c2-float); box-shadow: var(--c2-float-shadow);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); font-family: var(--c2-font); }
.c2-status-strip[hidden] { display: none; }
.c2-strip-main { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; min-height: 28px; padding: 0 8px 0 0; margin: 0;
  border: 0; background: transparent; color: var(--c2-text-2); font: inherit; font-size: 13px; cursor: default; box-shadow: none; }
.c2-status-strip:is([data-tone="offline"], [data-tone="waiting"]) .c2-strip-main { cursor: pointer; }
.c2-strip-label { flex: none; font-weight: 600; white-space: nowrap; }
.c2-strip-phase { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--c2-muted); }
.c2-strip-stop { display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px; padding: 0; margin: 0; border: 0; border-radius: 50%;
  background: var(--c2-text); color: var(--c2-bg); cursor: pointer; box-shadow: none; }
.c2-strip-stop:hover { background: #fff; }
.c2-strip-stop[hidden] { display: none; }
.c2-status-strip[data-tone="offline"] { padding-right: 12px; }
.c2-status-strip[data-tone="waiting"] { padding-right: 12px; border-color: color-mix(in srgb, var(--c2-waiting) 45%, transparent); }
.c2-strip-details { flex: 0 0 100%; padding: 2px 4px 8px 0; font-size: 12.5px; line-height: 1.45; color: var(--c2-text-2); text-align: left; }
.c2-strip-details[hidden] { display: none; }
.c2-strip-details p { margin: 0 0 8px; max-width: 46ch; }
.c2-strip-reconnect { min-height: 32px; padding: 0 14px; margin: 0; border: 1px solid var(--c2-line-2); border-radius: 16px; background: var(--c2-surface-3);
  color: var(--c2-text); font: inherit; font-weight: 600; cursor: pointer; }
.c2-status-strip[data-tone="offline"]:has(.c2-strip-details:not([hidden])) { border-radius: 16px; width: min(420px, calc(100% - 16px)); justify-content: flex-start; }
@media (hover: none) and (pointer: coarse) { .c2-strip-stop { width: 32px; height: 32px; } .c2-strip-main { min-height: 32px; } }
/* Chat 2.0 merge: keep the jump-to-latest button above the strip, not on it. */
body:has(#c2-status-strip:not([hidden])) #scrollBottomBtn { bottom: 138px !important; }
@media (max-width: 768px) { body:has(#c2-status-strip:not([hidden])) #scrollBottomBtn { bottom: calc(140px + env(safe-area-inset-bottom, 0px)) !important; } }
/* === END OF FILE (FILENAME: /var/www/vhosts/koracouncil.com/app.koracouncil.com/public/css/status_strip.css) === */
