/* CoachPulse v2 — Coach screen (conversation feed + chat bar) */

/* Filter row: chips + mark-all-read */
.cc-filter-row { display: flex; align-items: center; gap: 12px; }
.cc-filter-row .cc-chips { flex: 1; min-width: 0; margin-bottom: 0; }
.cc-markall {
    flex-shrink: 0; background: none; border: none;
    color: var(--accent); font-size: 12px; font-weight: 700; padding: 6px 2px 10px;
}

/* extra bottom room so the docked chat bar never covers the last bubble */
#scr-coach { padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 140px); }
.cc-quick { display:flex; gap:6px; max-width:var(--maxw); margin:0 auto 8px; overflow-x:auto; scrollbar-width:none; pointer-events:auto; }
.cc-quick::-webkit-scrollbar { display:none; }
.cc-qchip {
    flex-shrink:0; font-size:11.5px; font-weight:600; color:var(--txt-2);
    background:var(--card); border:1px solid var(--line-2); border-radius:999px; padding:5px 12px;
}
.cc-qchip:active { background:var(--card-2); }

/* ── Day dividers ──────────────────────────── */
.cc-day { text-align:center; font-size:10.5px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--txt-3); margin:16px 0 12px; }

/* ── Messages / bubbles ────────────────────── */
.cc-msg { display:flex; margin-bottom:10px; }
.cc-msg .cc-bubble { max-width:88%; border-radius:16px; padding:12px 14px; font-size:13.5px; line-height:1.55; }

.cc-coach { justify-content:flex-start; }
.cc-coach .cc-bubble {
    background:var(--card); border:1px solid var(--line); border-top-left-radius:6px;
    color:var(--txt-2); cursor:pointer; width:100%;
}
.cc-me { justify-content:flex-end; }
.cc-me .cc-bubble {
    background:rgba(200,164,85,0.10); border:1px solid rgba(200,164,85,0.22);
    border-top-right-radius:6px; color:var(--txt);
}
.cc-me-text { white-space:pre-wrap; word-break:break-word; }

.cc-hdr { display:flex; align-items:center; gap:8px; }
.cc-hdr-sp { flex:1; }
.cc-tag { display:inline-flex; align-items:center; font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; padding:3px 8px; border-radius:6px; white-space:nowrap; }
.cc-ts { font-size:10.5px; color:var(--txt-3); white-space:nowrap; }
.cc-me .cc-hdr { margin-bottom:6px; }
.cc-me .cc-hdr .cc-ts { margin-left:auto; }
.cc-arrow { font-size:11px; color:var(--txt-3); transition:transform 0.18s ease; flex-shrink:0; }
.cc-arrow.open { transform:rotate(180deg); }

.cc-title { font-size:13.5px; font-weight:600; color:var(--txt); margin-top:8px; }
.cc-snip { font-size:12.5px; color:var(--txt-2); margin-top:3px; }

/* unread dot */
.cc-dot { width:8px; height:8px; border-radius:50%; background:var(--accent); flex-shrink:0; }
.cc-unread .cc-bubble { border-color:rgba(0,212,170,0.35); }

/* expandable body */
.cc-body { display:none; margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }
.cc-body.open { display:block; }

/* ── Load earlier ──────────────────────────── */
.cc-more { text-align:center; margin:4px 0 14px; }

/* ── Pending (3-dot) indicator ─────────────── */
.cc-pending .cc-bubble { cursor:default; display:flex; align-items:center; gap:10px; width:auto; }
.cc-pend-text { font-size:12px; color:var(--txt-3); }
.cc-pend-dots { display:flex; gap:4px; }
.cc-pend-dots span { width:6px; height:6px; border-radius:50%; background:var(--txt-3); animation:cc-blink 1.2s infinite ease-in-out; }
.cc-pend-dots span:nth-child(2) { animation-delay:0.18s; }
.cc-pend-dots span:nth-child(3) { animation-delay:0.36s; }
@keyframes cc-blink { 0%, 70%, 100% { opacity:0.25; transform:translateY(0); } 35% { opacity:1; transform:translateY(-2px); } }

/* ── Review caption strip (reviewBody) ─────── */
.review-caption { background:var(--card-2); border:1px solid var(--line); border-radius:10px; padding:8px 11px; margin-bottom:10px; display:flex; flex-direction:column; gap:5px; }
.review-cap-row { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; font-size:12.5px; }
.rc-label { font-size:9.5px; font-weight:800; letter-spacing:0.1em; text-transform:uppercase; color:var(--txt-3); min-width:52px; }
.rc-val { color:var(--txt); font-weight:600; }
.rc-extra { color:var(--txt-3); font-size:11.5px; }

/* review-grid status cells (mdCoach tables) */
.md table.review-grid td.status-cell { font-weight:700; white-space:nowrap; }

/* ── Decision trace ("Why") ────────────────── */
.cc-why { margin-top:10px; border-top:1px dashed var(--line-2); padding-top:8px; }
.cc-why-hd { background:none; border:none; color:var(--txt-3); font-size:11px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; display:flex; align-items:center; gap:6px; padding:2px 0; }
.cc-why-arrow { display:inline-block; transition:transform 0.18s ease; }
.cc-why.open .cc-why-arrow { transform:rotate(90deg); }
.cc-why-body { display:none; margin-top:8px; font-size:12.5px; color:var(--txt-2); }
.cc-why.open .cc-why-body { display:block; }
.cc-why-ready { display:flex; flex-wrap:wrap; gap:6px 14px; margin-bottom:8px; }
.cc-rd { display:inline-flex; align-items:center; gap:6px; font-size:11.5px; }
.cc-rd-all { width:100%; font-weight:600; color:var(--txt); }
.cc-rdot { width:8px; height:8px; border-radius:50%; background:var(--txt-3); flex-shrink:0; }
.cc-rdot.green, .cc-rdot.good, .cc-rdot.ok { background:var(--green); }
.cc-rdot.yellow, .cc-rdot.amber, .cc-rdot.warn, .cc-rdot.caution { background:var(--orange); }
.cc-rdot.red, .cc-rdot.bad, .cc-rdot.poor { background:var(--red); }
.cc-why-load { margin:6px 0; }
.cc-why-load strong { color:var(--txt); }
.cc-why-sub { margin:8px 0 2px; font-weight:700; color:var(--txt); font-size:12px; }
.cc-why-list { margin:4px 0 4px 16px; padding:0; }
.cc-why-list li { margin-bottom:4px; }
.cc-why-list strong { color:var(--txt); }
.cc-factors { width:100%; border-collapse:collapse; margin:8px 0; font-size:11.5px; }
.cc-factors th { text-align:left; font-size:9.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--txt-3); padding:5px 7px; border-bottom:1px solid var(--line-2); }
.cc-factors td { padding:5px 7px; border-bottom:1px solid var(--line); }

/* ── Garmin sync footer ────────────────────── */
.cc-sync { margin-top:10px; }
.cc-sync-pill { display:inline-block; font-size:10.5px; font-weight:700; padding:4px 10px; border-radius:999px; background:var(--card-2); color:var(--txt-3); }
.cc-sync-pill.syncing { color:var(--blue); }
.cc-sync-pill.synced { background:rgba(52,211,153,0.12); color:var(--green); }
.cc-sync-pill.partial { background:rgba(251,146,60,0.12); color:var(--orange); }
.cc-sync-pill.failed { background:rgba(248,113,113,0.12); color:var(--red); }

/* ── Docked chat bar ───────────────────────── */
/* Lives inside #scr-coach: hidden automatically when the screen isn't .on */
.cc-chatbar {
    position:fixed; left:0; right:0; bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px)); z-index:65;
    padding:10px 14px 12px;
    background:linear-gradient(180deg, transparent, var(--bg) 38%);
    pointer-events:none;
}
.cc-chatbar-in { display:flex; align-items:flex-end; gap:8px; max-width:var(--maxw); margin:0 auto; pointer-events:auto; }
.cc-input {
    flex:1; background:var(--card); border:1px solid var(--line-2); border-radius:22px;
    color:var(--txt); font-family:var(--ui); font-size:15px; padding:11px 16px;
    resize:none; height:44px; max-height:100px; outline:none; line-height:1.4;
}
.cc-input::placeholder { color:var(--txt-3); }
.cc-input:focus-visible { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-dim); }
.cc-send {
    width:44px; height:44px; border-radius:50%; flex-shrink:0; border:none;
    background:var(--accent); color:#00251d;
    display:flex; align-items:center; justify-content:center;
}
.cc-send:active { transform:scale(0.94); }

@media (min-width:1024px) {
    #scr-coach { padding-bottom:168px; }
    .cc-chatbar { left:0; bottom:0; padding:14px 32px 18px; }
    .cc-chatbar-in { padding:0; }
    .cc-msg .cc-bubble { max-width:72%; }
    .cc-coach .cc-bubble { max-width:100%; width:auto; min-width:56%; }
}