/* chat.css — chatpagina-specifieke styles */
.chat{border:1px solid var(--border);background:#fffcf8;padding:1rem;min-height:50vh;max-height:62vh;overflow:auto;border-radius:6px;display:flex;flex-direction:column;gap:.6rem;margin:0}

.msg{max-width:85%;padding:.62rem .72rem;border-radius:8px;line-height:1.35;font-size:.82rem;white-space:pre-wrap}
.msg.user{align-self:flex-end;background:#151516;color:#f7f3ec;border-bottom-right-radius:2px}
.msg.assistant{align-self:flex-start;background:#efe9de;color:#101012;border-bottom-left-radius:2px}
.msg.assistant p{margin:.2rem 0 .35rem 0}
.msg.assistant ul{margin:.2rem 0 .45rem 0;padding:0;list-style:none}
.msg.assistant li{margin:.15rem 0;position:relative;padding-left:1.1rem}
.msg.assistant > ul > li::before{content:➤;position:absolute;left:0;top:.02rem;color:#5a4a37;font-size:.82rem}
.msg.assistant ul ul > li::before{content:▸;color:#7a6a55;font-size:.78rem}
.msg.assistant ul ul ul > li::before{content:•;color:#8f8270;font-size:.78rem}
.msg.assistant strong{font-weight:700}

.typing{display:inline-flex;align-items:flex-end;gap:4px;min-height:18px}
.typing i{width:6px;height:6px;border-radius:999px;background:#7e7569;display:inline-block;animation:typingPulse 1s infinite ease-in-out}
.typing i:nth-child(2){animation-delay:.14s}
.typing i:nth-child(3){animation-delay:.28s}
@keyframes typingPulse{0%,80%,100%{transform:scale(.85);opacity:.45}40%{transform:scale(1.2);opacity:1}}

.send-round{width:40px;height:40px;border-radius:999px;border:none;background:var(--ink);color:#fff;cursor:pointer;font-size:1rem;display:inline-flex;align-items:center;justify-content:center}
.chat-input{resize:none;min-height:40px;max-height:120px;line-height:1.35;overflow:auto}

body.keyboard-open #page-ai .composer{z-index:25}
body.keyboard-open #page-ai, body.keyboard-open #page-ai .card{overflow:hidden}
body.keyboard-open{overflow:hidden}

.ai-chat-shell{border:none !important;background:transparent !important;box-shadow:none !important}
#page-ai .chat{border:none;background:transparent;border-radius:0}
#page-ai .composer{border-top:none;background:transparent;padding:.55rem 0;margin-top:auto}
#page-ai .ai-chat-shell{display:flex;flex-direction:column;height:100%}
#page-ai .chat{flex:1;min-height:0}
.composer{display:grid;grid-template-columns:1fr auto;gap:.55rem;padding:.75rem;border-top:1px solid var(--border);background:#fff;align-items:center}

@media (max-width:900px){
  #page-ai{padding:0}
  #page-ai .card{height:100%;display:flex;flex-direction:column}
  #page-ai .chat{flex:1;max-height:none;min-height:0;padding:.7rem;overflow:auto}
  #page-ai .composer{padding:.55rem;background:#fff;position:fixed;left:.4rem;right:.4rem;bottom:.4rem;z-index:20;border-top:1px solid var(--border)}
  #page-ai .card{padding-bottom:72px !important}
}