/* ── Tool cards (stage 2 / v1.1.35) — extend .dp-focus-card vocabulary
   for visual cohesion with Plan My Day. Pending writes get the full
   card with Accept/Edit/Reject; reads use the slim trace line. ── */
.cadeo-chat-tool-trace {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-xs);
    color: var(--text-tertiary);
    padding: 2px 0;
}
.cadeo-chat-tool-trace svg { width: 11px; height: 11px; color: var(--accent-blue); flex-shrink: 0; }
.cadeo-chat-tool-trace-name { font-weight: 600; color: var(--text-secondary); }

.cadeo-chat-tool-card {
    border: 1px solid var(--border-light);
    border-radius: var(--radius-md);
    background: var(--bg-primary);
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.cadeo-chat-tool-head {
    display: flex;
    align-items: center;
    gap: 8px;
}
.cadeo-chat-tool-head svg {
    width: 14px;
    height: 14px;
    color: var(--accent-blue);
    flex-shrink: 0;
}
.cadeo-chat-tool-name {
    font-size: var(--font-size-sm);
    font-weight: 700;
    color: var(--text-primary);
}
.cadeo-chat-tool-kind {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--accent-blue);
    padding: 1px 6px;
    border-radius: var(--radius-sm);
    background: rgba(74,144,217,0.12);
    margin-left: auto;
}
.cadeo-chat-tool-summary {
    font-size: var(--font-size-xs);
    color: var(--text-secondary);
    line-height: 1.4;
}
/* v1.1.74 — model-supplied "why this write" line. Slightly heavier than
 * the summary; sits above the raw args/checklist so the user reads the
 * intent first, then verifies mechanics below. */
.cadeo-chat-tool-confirm {
    font-size: var(--font-size-xs);
    color: var(--text-primary);
    line-height: 1.4;
    font-style: italic;
    padding: 6px 10px;
    border-left: 2px solid var(--accent-blue);
    background: rgba(74, 144, 217, 0.04);
    border-radius: var(--radius-sm);
}
.cadeo-chat-tool-args {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 8px 10px;
    background: var(--bg-secondary);
    border-radius: var(--radius-sm);
    font-size: var(--font-size-xs);
    font-family: -apple-system, BlinkMacSystemFont, 'Avenir Next', monospace;
}
.cadeo-chat-tool-arg {
    display: flex;
    gap: 8px;
    line-height: 1.5;
}
.cadeo-chat-tool-arg-k {
    color: var(--text-tertiary);
    flex-shrink: 0;
    min-width: 70px;
    font-weight: 600;
}
.cadeo-chat-tool-arg-v {
    color: var(--text-primary);
    flex: 1;
    overflow-wrap: anywhere;
}

/* v1.1.44 — Inline JSON editor for pending tool args. Replaces the
   v1.1.35 window.prompt() stopgap, which was a silent no-op in Tauri
   webviews. Sits in place of the args list when the card is in
   editing mode (Edit → renders Cancel / Save). */
.cadeo-chat-tool-args-edit-wrap {
    background: var(--bg-secondary);
    border-radius: var(--radius-sm);
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.cadeo-chat-tool-args-edit {
    width: 100%;
    box-sizing: border-box;
    background: var(--bg-primary);
    color: var(--text-primary);
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    padding: 8px 10px;
    font-family: 'SF Mono', Menlo, Monaco, Consolas, monospace;
    font-size: var(--font-size-12);
    line-height: 1.5;
    resize: vertical;
    transition: border-color var(--duration-fast) var(--ease-in-out), box-shadow var(--duration-fast) var(--ease-in-out);
}
.cadeo-chat-tool-args-edit:focus {
    outline: none;
    border-color: #4A90D9;
    box-shadow: 0 0 0 3px rgba(74, 144, 217, 0.15);
}
.cadeo-chat-tool-args-edit-hint {
    color: var(--text-tertiary);
    font-size: var(--font-size-xs);
    font-style: italic;
}

.cadeo-chat-tool-allow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--font-size-xs);
    color: var(--text-tertiary);
    cursor: pointer;
}
.cadeo-chat-tool-allow input { margin: 0; }
.cadeo-chat-tool-actions {
    display: flex;
    gap: 6px;
    justify-content: flex-end;
}

/* v1.1.48 — Batch-approval card. A checklist of independently-toggleable
   proposed writes. Rows are 44px tall (touch target), the destructive
   variant is tinted and arrives unchecked. */
.cadeo-chat-batch-list {
    display: flex;
    flex-direction: column;
    margin: 6px 0 4px;
    border: 1px solid var(--border-light);
    border-radius: var(--radius-sm);
    overflow: hidden;
}
.cadeo-chat-batch-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 8px 12px;
    cursor: pointer;
    border-bottom: 1px solid var(--border-light);
    transition: background var(--duration-fast) var(--ease-in-out);
}
.cadeo-chat-batch-row:last-child { border-bottom: 0; }
.cadeo-chat-batch-row:hover { background: var(--bg-secondary); }
.cadeo-chat-batch-row input { margin: 0; flex-shrink: 0; }
.cadeo-chat-batch-row-label {
    font-size: var(--font-size-sm);
    color: var(--text-primary);
    overflow-wrap: anywhere;
}
/* Destructive rows — tinted, and the label carries a quiet warning hue.
   Not exercised until v1.1.50 (task.delete) but the styling ships now. */
.cadeo-chat-batch-row-destructive {
    background: rgba(239, 68, 68, 0.06);
}
.cadeo-chat-batch-row-destructive:hover {
    background: rgba(239, 68, 68, 0.10);
}
.cadeo-chat-batch-row-destructive .cadeo-chat-batch-row-label {
    color: var(--color-red-text);
}
.cadeo-chat-tool-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.cadeo-chat-tool-btn {
    border: 1px solid var(--border-light);
    background: var(--bg-primary);
    color: var(--text-secondary);
    font-size: var(--font-size-12);
    font-weight: 600;
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: border-color var(--duration-fast) var(--ease-in-out),
                background var(--duration-fast) var(--ease-in-out),
                color var(--duration-fast) var(--ease-in-out);
}
.cadeo-chat-tool-btn:hover { border-color: var(--accent-blue); color: var(--accent-blue); }
.cadeo-chat-tool-btn:focus-visible { outline: var(--focus-outline); outline-offset: var(--focus-outline-offset); }
.cadeo-chat-tool-accept {
    background: var(--accent-fill);
    border-color: var(--accent-fill);
    color: #fff;
}
.cadeo-chat-tool-accept:hover {
    background: var(--accent-fill-hover);
    border-color: var(--accent-fill-hover);
    color: #fff;
}

/* v1.1.50 — destructive pending card (task.delete). Quiet red border +
   tint so it reads as "this removes something" without shouting; the
   confirm button is a solid red "Delete". */
.cadeo-chat-tool-card-destructive {
    border-color: rgba(239, 68, 68, 0.45);
    background: rgba(239, 68, 68, 0.05);
}
.cadeo-chat-tool-btn-destructive,
.cadeo-chat-tool-btn-destructive:hover {
    background: var(--color-red-fill);
    border-color: var(--color-red-fill);
    color: #fff;
}
.cadeo-chat-tool-btn-destructive:hover {
    background: var(--color-red-fill-hover);
    border-color: var(--color-red-fill-hover);
}
.cadeo-chat-tool-btn-destructive:focus-visible {
    outline: var(--focus-outline);
    outline-offset: var(--focus-outline-offset);
}

/* Accepted (success) — compact green pill with Undo */
.cadeo-chat-tool-card.cadeo-chat-tool-accepted {
    background: rgba(16,185,129,0.08);
    border-color: rgba(16,185,129,0.35);
    padding: 8px 12px;
    flex-direction: row;
    align-items: center;
}
.cadeo-chat-tool-accepted .cadeo-chat-tool-head svg { color: var(--color-green-text); }
.cadeo-chat-tool-undo {
    margin-left: auto;
    border: none;
    background: transparent;
    color: var(--accent-blue);
    font-size: var(--font-size-12);
    font-weight: 600;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: var(--radius-sm);
}
.cadeo-chat-tool-undo:hover { background: rgba(74,144,217,0.10); }
.cadeo-chat-tool-undo:focus-visible { outline: var(--focus-outline); outline-offset: var(--focus-outline-offset); }

/* Rejected — quiet muted pill */
.cadeo-chat-tool-card.cadeo-chat-tool-rejected {
    background: var(--bg-secondary);
    border-color: var(--border-light);
    padding: 6px 12px;
    color: var(--text-tertiary);
}
.cadeo-chat-tool-rejected .cadeo-chat-tool-name {
    font-weight: 500;
    color: var(--text-tertiary);
    font-size: var(--font-size-12);
}

/* Error — amber warning */
.cadeo-chat-tool-card.cadeo-chat-tool-failed {
    background: rgba(245,158,11,0.06);
    border-color: rgba(245,158,11,0.4);
}

@media (prefers-reduced-motion: reduce) {
    .cadeo-chat-tool-btn,
    .cadeo-chat-tool-undo { transition: none; }
}