/* Free.ai Docs editor (templates/tools/docs_editor/editor.html). Same frame
 * as static/css/sheets.css. Text uses --brand-ink, fills use --primary
 * (templates/CLAUDE.md: two greens). */
.docs-root { --docs-border: #e5e7eb; --docs-panel: #ffffff; --docs-muted: #4b5563; background: var(--docs-panel); }
html.dark .docs-root { --docs-border: #2a2a2a; --docs-panel: #111111; --docs-muted: #b5b5b5; }

.docs-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--docs-border); }
.docs-brand { font-weight: 700; color: var(--brand-ink, #15803D); white-space: nowrap; }
.docs-title { max-width: 280px; min-width: 140px; flex: 1 1 180px; }
.docs-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.docs-status { color: var(--docs-muted); min-height: 1.2em; }
.docs-status a { color: var(--brand-ink, #15803D); }

.docs-main { display: flex; min-height: 560px; height: calc(100vh - 140px); }
.docs-app { flex: 1 1 auto; min-width: 0; position: relative; }
.docs-loading { padding: 24px; color: var(--docs-muted); }

.docs-ai { flex: 0 0 340px; display: flex; flex-direction: column; border-left: 1px solid var(--docs-border); background: var(--docs-panel); min-height: 0; }
.docs-ai-head { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--docs-border); }
.docs-ai-log { flex: 1 1 auto; overflow-y: auto; padding: 12px; font-size: .9rem; }
.docs-ai-form { padding: 10px 12px; border-top: 1px solid var(--docs-border); }
.docs-ai-form .text-muted, .docs-ai-log .text-muted { color: var(--docs-muted) !important; }

.docs-quick { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.docs-quick-row { display: flex; gap: 6px; margin-bottom: 8px; }
.docs-quick-row .form-select { flex: 1 1 auto; min-width: 0; }
.docs-quick-row .btn { white-space: nowrap; }

.docs-msg { margin: 8px 0; padding: 8px 10px; border-radius: 8px; white-space: pre-wrap; word-break: break-word; }
.docs-msg-user { background: rgba(21, 128, 61, .08); }
.docs-msg-ai { border: 1px solid var(--docs-border); }
.docs-msg-err { border: 1px solid #b91c1c; color: #b91c1c; }
html.dark .docs-msg-err { border-color: #f87171; color: #fca5a5; }
.docs-msg ul { margin: 4px 0 0; padding-left: 1.1em; font-size: .82rem; color: var(--docs-muted); }

/* WCAG 2.5.8 target size on Univer's smallest controls (as in sheets.css). */
#docs-app button[role="slider"] { box-sizing: content-box; padding: 5px; background-clip: content-box; }
#docs-app button.univer-w-4 { min-width: 24px; }

@media (max-width: 991.98px) {
    .docs-main { flex-direction: column; height: auto; }
    .docs-app { height: 75vh; min-height: 440px; }
    .docs-ai { flex: 0 0 auto; border-left: 0; border-top: 1px solid var(--docs-border); max-height: 75vh; display: none; }
    .docs-ai.is-open { display: flex; }
    .docs-title { max-width: none; }
}