/* AI Toolbox chat studio: conversation on the left with one input at the bottom, the document
   filling the right. Same look as the rest of the app. */
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.hw-toolbox .hw-workspace-content>main{max-width:1440px!important}
body.hw-toolbox .ai-head{margin:6px 2px 16px}
body.hw-toolbox .ai-head h1{font:850 clamp(26px,2.2vw,34px)/1 Inter,system-ui,sans-serif;letter-spacing:-.05em;color:#101727}
body.hw-toolbox .ai-head p{margin-top:8px;font-size:14px;color:#596174}

.ai-studio{
 display:grid;grid-template-columns:minmax(320px,400px) minmax(0,1fr);gap:18px;
 height:calc(100vh - 84px - 120px);min-height:520px
}
html.hw-embedded .ai-studio{height:calc(100vh - 6px - 120px)}
.ai-chat,.ai-doc{background:#fffefa;border:1px solid #eee5d7;border-radius:22px;box-shadow:0 1px 2px rgba(80,55,30,.04),0 12px 32px rgba(100,65,39,.05);min-height:0;display:flex;flex-direction:column}

/* Conversation */
.ai-thread{flex:1;min-height:0;overflow-y:auto;padding:20px 18px 8px;display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}
.ai-empty{margin:auto 0;padding:8px 4px}
.ai-empty[hidden]{display:none}
.ai-empty h2{font:850 28px/1 Inter,system-ui,sans-serif;letter-spacing:-.05em;color:#101727}
.ai-empty p{margin:12px 0 16px;font-size:14px;line-height:1.55;color:#596174}
.ai-examples{display:flex;flex-direction:column;gap:8px}
.ai-examples button{text-align:left;border:1px solid #eee5d7;background:#fffcf5;border-radius:14px;padding:10px 12px;font:500 13px/1.35 Inter,system-ui,sans-serif;color:#253039;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.ai-examples button:hover{background:#fff6e8;border-color:#e4d4bd}
.ai-msg{display:flex;animation:aiIn .32s cubic-bezier(.2,.8,.2,1) both}
.ai-user{justify-content:flex-end}
.ai-bubble{max-width:88%;background:#f3ece2;color:#101727;border-radius:18px 18px 6px 18px;padding:10px 13px;font-size:14px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.ai-note{display:flex;gap:9px;align-items:flex-start;font-size:14px;line-height:1.55;color:#253039;max-width:96%}
.ai-mark{flex:0 0 24px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#fde7dc;color:#e9461c;font-size:12px;margin-top:1px}
.ai-dots{display:flex;gap:4px;padding:8px 2px}
.ai-dots i{width:6px;height:6px;border-radius:50%;background:#c9b8a4;animation:aiDot 1s infinite ease-in-out}
.ai-dots i:nth-child(2){animation-delay:.15s}.ai-dots i:nth-child(3){animation-delay:.3s}
@keyframes aiDot{0%,80%,100%{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes aiIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* The one input */
.ai-composer{display:flex;align-items:flex-end;gap:8px;margin:8px 12px 12px;border:1px solid #e4d9cb;border-radius:26px;background:#fff;padding:8px 8px 8px 18px;box-shadow:0 4px 14px rgba(100,65,39,.06);transition:border-color .15s ease,box-shadow .15s ease}
.ai-composer:focus-within{border-color:#c9b8a4;box-shadow:0 0 0 4px rgba(233,70,28,.07),0 4px 14px rgba(100,65,39,.06)}
body.hw-theme.ml-workspace .hw-workspace-content .ai-composer textarea#prompt{width:100%;border:0!important;outline:none!important;box-shadow:none!important;background:transparent!important;resize:none;min-height:24px!important;max-height:200px;padding:7px 0!important;font:400 15px/1.5 Inter,system-ui,sans-serif!important;color:#101727;border-radius:0!important}
.ai-state:empty{display:none}
.ai-send{flex:0 0 36px;width:36px;height:36px;border-radius:50%;border:0;background:#e9461c;color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .15s ease,transform .15s ease}
.ai-send svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ai-send:hover:not(:disabled){background:#d93d15}
.ai-send:active:not(:disabled){transform:scale(.92)}
.ai-send:disabled{background:#e9e1d6;cursor:not-allowed}

/* The document */
.ai-doc-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px 12px 20px;border-bottom:1px solid #eee5d7;flex-wrap:wrap}
.ai-doc-name{display:flex;align-items:baseline;gap:10px;min-width:0;flex:1 1 auto}
.ai-doc-name strong{font:800 16px/1.2 Inter,system-ui,sans-serif;letter-spacing:-.02em;color:#101727;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46ch}
.ai-doc-name span{font-size:12px;color:#8a8f99;white-space:nowrap}
.ai-doc-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
body.hw-theme .ai-doc-actions .ml-btn{min-height:34px!important;padding:0 14px!important;font-size:13px!important}
.ai-icon{width:34px;height:34px;border-radius:50%;border:1px solid transparent;background:transparent;color:#4a5262;display:grid;place-items:center;cursor:pointer;transition:background .15s ease}
.ai-icon:hover:not(:disabled){background:#f3ece2}
.ai-icon:disabled{opacity:.4;cursor:not-allowed}
body.hw-theme.ml-workspace .hw-workspace-content .ai-doc textarea.ai-paper{flex:1;min-height:0;width:100%;resize:none;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fffefa!important;padding:28px clamp(22px,4vw,56px)!important;font:400 15px/1.75 Inter,system-ui,sans-serif!important;color:#1b2230!important;outline:none!important}
.ai-doc-foot{padding:10px 20px 14px;border-top:1px solid #eee5d7;font-size:12px;color:#8a8f99}

/* PDF preview */
.ai-preview{position:fixed;inset:0;z-index:2000;background:rgba(16,23,39,.42);display:grid;place-items:center;padding:24px;animation:aiIn .2s ease both}
.ai-preview[hidden]{display:none}
.ai-preview-card{width:min(900px,100%);height:min(90vh,1100px);background:#fffefa;border-radius:22px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 30px 80px rgba(16,23,39,.25)}
.ai-preview-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 20px;border-bottom:1px solid #eee5d7}
.ai-preview iframe{flex:1;border:0;width:100%;background:#f3ece2}

/* Phones and small tablets: the document first, the conversation and input beneath. */
@media(max-width:900px){
 .ai-studio{grid-template-columns:minmax(0,1fr);height:auto}
 .ai-doc-name{flex:1 1 100%}
 .ai-doc-name strong{max-width:100%}
 .ai-doc{order:-1;height:62vh}
 .ai-chat{height:auto;min-height:0}
 .ai-thread{max-height:40vh}
 .ai-doc-actions .ml-btn{flex:1 1 auto}
  body.hw-theme.ml-workspace .hw-workspace-content .ai-doc textarea.ai-paper{padding:18px!important;font-size:14px!important}
}
@media(prefers-reduced-motion:reduce){.ai-msg,.ai-preview{animation:none}.ai-dots i{animation:none}}
html body.hw-theme.ml-workspace .hw-workspace-content .ai-doc textarea.ai-paper,html body.hw-theme.ml-workspace .hw-workspace-content .ai-doc textarea.ai-paper:focus{border:0!important;box-shadow:none!important;border-radius:0!important}
/* Desktop: the studio fits the screen exactly, so the page itself never scrolls. */
@media(min-width:901px){
 body.hw-theme.ml-workspace.hw-toolbox .hw-workspace-content>.ml-app-legal{display:none!important}
 body.hw-toolbox .ai-studio{height:calc(100vh - 84px - 136px)}
 html.hw-embedded body.hw-toolbox .ai-studio{height:calc(100vh - 6px - 136px)}
}
@media(min-width:901px){html body.hw-theme.ml-workspace.hw-toolbox .hw-workspace-content>main{min-height:0!important}body.hw-toolbox .ml-page{padding-bottom:0!important}}
body.hw-theme #draft.ai-paper,body.hw-theme #draft.ai-paper:focus{border:0!important;box-shadow:none!important;outline:none!important;border-radius:0!important}
body.hw-theme #prompt,body.hw-theme #prompt:focus{border:0!important;box-shadow:none!important;outline:none!important}

/* ── v2: + attachments, formatted page, Edit / Done ─────────────────────────────── */
.ai-composer{display:block!important;padding:8px 8px 8px 8px!important}
.ai-composer-line{display:flex;align-items:flex-end;gap:6px}
.ai-composer-line textarea#prompt{flex:1}
.ai-plus{flex:0 0 36px;width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:#4a5262;display:grid;place-items:center;cursor:pointer;transition:background .15s ease}
.ai-plus svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ai-plus:hover:not(:disabled){background:#f3ece2}
.ai-attachments{display:flex;flex-wrap:wrap;gap:6px;padding:2px 4px 8px}
.ai-attachments[hidden]{display:none}
.ai-chip{display:inline-flex;align-items:center;gap:6px;max-width:220px;padding:4px 6px 4px 4px;border:1px solid #eee5d7;border-radius:12px;background:#fffcf5;font-size:12px;color:#3b4452}
.ai-chip img{width:28px;height:28px;border-radius:8px;object-fit:cover}
.ai-chip i{width:28px;text-align:center;color:#8a8f99}
.ai-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ai-chip button{border:0;background:#efe7dc;color:#4a5262;width:18px;height:18px;border-radius:50%;line-height:1;cursor:pointer;flex:0 0 18px}
.ai-files{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.ai-files span{font-size:12px;color:#596174}

.ai-doc-bar{padding:10px 14px 10px 20px}
body.hw-theme .ai-doc-actions .ml-btn.ai-edit{background:#101727!important;border-color:#101727!important;color:#fff!important}
.ai-page-wrap{flex:1;min-height:0;overflow-y:auto;background:#f5efe6;padding:22px clamp(12px,3vw,36px)}
.ai-page{position:relative;max-width:794px;min-height:100%;margin:0 auto;background:#fff;border-radius:6px;box-shadow:0 1px 2px rgba(60,40,20,.08),0 10px 30px rgba(60,40,20,.08);padding:clamp(28px,5vw,64px) clamp(22px,5vw,64px);color:#1a1f29;font:400 14.5px/1.65 Inter,system-ui,sans-serif;transition:box-shadow .2s ease}
.ai-page.is-editing{box-shadow:0 0 0 2px #e9461c,0 10px 30px rgba(60,40,20,.08)}
.ai-doc-body{outline:none;min-height:200px}
.ai-doc-body:empty{min-height:0}
.ai-doc-empty{color:#9a9fa8;font-size:14px;text-align:center;padding:80px 10px}
.ai-doc-empty[hidden]{display:none}
.ai-letterhead{position:relative;display:flex;align-items:center;padding-bottom:14px;margin-bottom:22px;border-bottom:1px solid #e5ded3}
.ai-letterhead[hidden]{display:none}
.ai-letterhead img{max-height:48px;max-width:200px;object-fit:contain}
.ai-logo-x{position:absolute;right:0;top:0;border:0;background:#f3ece2;color:#4a5262;width:22px;height:22px;border-radius:50%;cursor:pointer;opacity:0;transition:opacity .15s ease}
.ai-letterhead:hover .ai-logo-x{opacity:1}
.ai-doc-body h1{font-size:24px;line-height:1.2;font-weight:800;letter-spacing:-.02em;margin:0 0 14px;color:#101727}
.ai-doc-body h2{font-size:17px;line-height:1.3;font-weight:750;margin:22px 0 8px;color:#101727}
.ai-doc-body h3{font-size:15px;line-height:1.35;font-weight:700;margin:16px 0 6px;color:#101727}
.ai-doc-body p{margin:0 0 10px}
.ai-doc-body ul,.ai-doc-body ol{margin:0 0 12px;padding-left:22px}
.ai-doc-body li{margin:3px 0}
.ai-doc-body li>p{margin:0}
.ai-doc-body strong{font-weight:700;color:#101727}
.ai-doc-body hr{border:0;border-top:1px solid #e5ded3;margin:18px 0}
.ai-doc-body blockquote{margin:0 0 12px;padding-left:12px;border-left:3px solid #e5ded3;color:#596174;font-style:italic}
.ai-doc-body table{width:100%;border-collapse:collapse;margin:6px 0 16px;font-size:13.5px}
.ai-doc-body th,.ai-doc-body td{border:1px solid #ddd5c9;padding:6px 8px;text-align:left;vertical-align:top}
.ai-doc-body th{background:#f6f1e9;font-weight:700}
.ai-doc-body input[type=checkbox]{margin-right:6px}
.ai-doc-foot{display:flex;gap:6px;flex-wrap:wrap}
#editHint[hidden]{display:none}
@media(max-width:900px){.ai-page-wrap{padding:12px}.ai-page{padding:22px 18px;font-size:14px}.ai-doc{height:70vh}}

/* Keep the review reminder visible without competing with the composer. */
.ai-chat .ai-disclaimer{flex:0 0 auto;margin:0 18px 12px;color:#596174;font:400 11px/1.5 Inter,system-ui,sans-serif;overflow-wrap:anywhere}
.ai-chat .ai-disclaimer a{color:#913514;text-decoration:underline;text-underline-offset:2px;white-space:normal}
.ai-chat .ai-disclaimer a:focus-visible{outline:2px solid #e9461c;outline-offset:3px;border-radius:2px}
