/* Obsidian AI Chat — production component. Themeable; default dark (matches the
   Claude reference). All rules scoped under .oai so it can't leak into the app. */
.oai{
  /* ---- dark (default) ---- */
  --oai-bg:#1f1f1e; --oai-panel:#30302e; --oai-panel2:#2c2b28; --oai-line:#46453f;
  --oai-box-bg:#2c2c2a; --oai-answer-ink:#f5f3ec;
  --oai-bubble:#1a1a18; --oai-ink:#f0eee6; --oai-ink2:#f5f3ec; --oai-muted:#a6a39a;
  --oai-faint:#74726a; --oai-accent:#7aa7e6; --oai-danger:#e0866a;
  --oai-eye-frame:#aeb6d8;  /* eye outline/lid — lightened so it reads on the dark bg */
  --oai-serif:var(--oai-sans);  /* no serif — answers use our defined sans font */
  --oai-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --oai-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  position:absolute;inset:0;display:flex;flex-direction:row;
  background:var(--oai-bg);color:var(--oai-ink);font-family:var(--oai-sans);
}
.oai[data-theme="light"]{
  --oai-bg:#f8f8f6; --oai-panel:#f7f7f5; --oai-panel2:#f0f0ec; --oai-line:#e5e5e0;
  --oai-box-bg:#ffffff; --oai-answer-ink:#0b0b0b;
  --oai-bubble:#eef1f4; --oai-ink:#1c1c1a; --oai-ink2:#111110; --oai-muted:#6b6b65;
  --oai-faint:#9a9a93; --oai-accent:#2b7ae4; --oai-danger:#c2552f;
  --oai-eye-frame:#283164;  /* navy reads well on the light bg */
}
.oai *{box-sizing:border-box}
.oai button{font-family:inherit}

/* scroll region + centered column */
.oai-scroll{flex:1;overflow-y:auto;overflow-anchor:none}
.oai-col{max-width:760px;margin:0 auto;padding:24px 20px 10px;width:100%}

/* empty / welcome state */
.oai-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:20px;padding:0 20px}
.oai-empty h1{font-family:var(--oai-serif);font-weight:500;font-size:clamp(26px,4vw,36px);
  margin:0;color:var(--oai-ink2);display:flex;align-items:center;gap:14px;text-align:center}

/* turns */
.oai-turn{margin:26px 0}
.oai-user{display:flex;justify-content:flex-end}
.oai-user .oai-bub{background:var(--oai-bubble);border-radius:18px;padding:10px 16px;max-width:76%;
  white-space:pre-wrap;word-wrap:break-word;line-height:1.5}
.oai-asst .oai-body{font-family:var(--oai-serif);font-size:16px;line-height:1.7;color:var(--oai-answer-ink)}
/* the streaming tail wrapper is layout-transparent so finalized blocks + the
   in-progress block share one flow (correct margins, no flicker) */
.oai-active{display:contents}
.oai-asst .oai-body>*:first-child{margin-top:0}
.oai-asst .oai-body>*:last-child{margin-bottom:0}
.oai-body p{margin:0 0 14px}
.oai-body h1,.oai-body h2,.oai-body h3{font-family:var(--oai-serif);line-height:1.3;margin:18px 0 10px}
.oai-body h1{font-size:24px}.oai-body h2{font-size:21px}.oai-body h3{font-size:19px}
.oai-body strong{font-weight:600}.oai-body em{font-style:italic}
.oai-body ul,.oai-body ol{margin:0 0 14px;padding-left:22px}
.oai-body li{margin:3px 0}
.oai-body a{color:var(--oai-accent);text-decoration:underline;text-underline-offset:2px}
.oai-body code{font-family:var(--oai-mono);font-size:.85em;background:var(--oai-panel2);
  padding:1px 5px;border-radius:5px}
.oai-body pre{background:var(--oai-panel2);border:1px solid var(--oai-line);border-radius:10px;
  padding:12px 14px;overflow:auto;margin:0 0 14px;position:relative}
.oai-body pre code{background:none;padding:0;font-size:13px;line-height:1.55}
.oai-body blockquote{border-left:3px solid var(--oai-line);margin:0 0 14px;padding:2px 0 2px 14px;color:var(--oai-muted)}
.oai-body table{border-collapse:collapse;margin:0 0 14px;font-family:var(--oai-sans);font-size:14px}
.oai-body th,.oai-body td{border:1px solid var(--oai-line);padding:6px 10px;text-align:left}
.oai-cursor{display:inline-block;width:7px;height:1.05em;background:var(--oai-accent);
  vertical-align:-2px;margin-left:1px;border-radius:1px;animation:oai-blink 1s steps(2) infinite}
@keyframes oai-blink{50%{opacity:0}}

/* thinking panel */
.oai-think{border:none;border-radius:0;margin:0 0 14px;background:none;overflow:hidden}
.oai-think summary{cursor:pointer;list-style:none;padding:0;color:var(--oai-muted);
  font-size:13px;display:flex;align-items:center;gap:9px}
.oai-think summary::-webkit-details-marker{display:none}
.oai-think .oai-think-txt{padding:2px 14px 12px 36px;color:var(--oai-muted);font-size:13.5px;
  line-height:1.6;white-space:pre-wrap}

/* tool status + citations */
.oai-tool{color:var(--oai-muted);font-size:13px;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.oai-cites{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.oai-cite{display:block;text-decoration:none;color:var(--oai-ink);background:var(--oai-panel2);
  border:1px solid var(--oai-line);border-radius:10px;padding:8px 11px;font-size:12.5px;max-width:340px}
.oai-cite:hover{border-color:var(--oai-accent)}
.oai-cite .t{font-weight:600;display:block;margin-bottom:3px;line-height:1.3}
.oai-cite .m{color:var(--oai-muted);font-size:11px}

/* action row + usage */
.oai-acts{display:flex;gap:6px;margin-top:6px}
.oai-acts button{background:none;border:none;color:var(--oai-faint);cursor:pointer;
  padding:5px;border-radius:6px;display:inline-flex;line-height:0}
.oai-acts button:hover{color:var(--oai-ink);background:var(--oai-panel2)}
.oai-acts svg{width:16px;height:16px}
.oai-usage{color:var(--oai-faint);font-size:12px;margin-top:8px}

/* eye */
.oai-eye{flex:none}
.oai-eye.pulse{animation:oai-pulse 1.1s ease-in-out infinite;transform-origin:center}
@keyframes oai-pulse{0%,100%{opacity:.5;transform:scale(.9)}50%{opacity:1;transform:scale(1.06)}}
.oai-eye-anim{flex:none;line-height:0;display:inline-block;vertical-align:middle}

/* composer */
.oai-composer{max-width:760px;margin:0 auto;width:100%;padding:6px 20px 20px}
.oai-box{background:var(--oai-box-bg);border:1px solid var(--oai-line);border-radius:24px;
  padding:14px 16px 10px;transition:border-color .15s;box-shadow:0 1px 2px #0000000a}
.oai-box:focus-within{border-color:var(--oai-faint)}
.oai-modelwrap{display:inline-flex;align-items:center;gap:6px}
.oai-model-logo{width:16px;height:16px;flex:none}
.oai-model-logo[hidden]{display:none}
/* OpenAI mark is black by default → invert to white on the dark theme */
.oai[data-theme="dark"] .oai-model-logo[data-provider="openai"]{filter:invert(1)}
.oai-ta{width:100%;background:none;border:none;color:var(--oai-ink);font-size:16px;
  line-height:1.5;resize:none;outline:none;max-height:240px;font-family:var(--oai-sans)}
.oai-ta::placeholder{color:var(--oai-muted)}
.oai-row{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.oai-row .right{display:flex;align-items:center;gap:10px}
.oai-plus{width:32px;height:32px;border-radius:50%;border:1px solid var(--oai-line);
  background:none;color:var(--oai-muted);font-size:18px;cursor:pointer;line-height:0}
.oai-plus:hover{color:var(--oai-ink);border-color:var(--oai-faint)}
.oai-model{background:none;border:none;color:var(--oai-muted);font-size:13px;cursor:pointer;padding:4px}
.oai-model option{background:var(--oai-panel);color:var(--oai-ink)}
.oai-send{width:32px;height:32px;border-radius:50%;border:none;background:var(--oai-ink);
  color:var(--oai-bg);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.oai-send:disabled{opacity:.35;cursor:default}
.oai-send svg{width:16px;height:16px}
.oai-stop{border:1px solid var(--oai-line);background:none;color:var(--oai-ink);border-radius:9px;
  padding:5px 11px;font-size:12.5px;cursor:pointer;display:none;align-items:center;gap:6px}
.oai-foot{text-align:center;color:var(--oai-faint);font-size:11px;padding:0 0 10px}

/* jump-to-latest */
.oai-jump{position:absolute;left:50%;transform:translateX(-50%);bottom:104px;display:none;
  background:var(--oai-panel);border:1px solid var(--oai-line);color:var(--oai-ink);
  border-radius:18px;padding:6px 13px;font-size:12.5px;cursor:pointer;box-shadow:0 4px 14px #0004}

@media (prefers-reduced-motion:reduce){.oai-eye.pulse,.oai-cursor{animation:none}}

/* ---- sidebar (chat history) + main split ---- */
.oai-sidebar{width:260px;flex:none;display:flex;flex-direction:column;background:var(--oai-bg);
  border-right:1px solid var(--oai-line);transition:width .18s ease}
.oai[data-collapsed="1"] .oai-sidebar{width:0;overflow:hidden;border-right:none}

/* brand header (theme-swapped mark + wordmark) + collapse */
.oai-brandrow{display:flex;align-items:center;gap:8px;padding:12px 8px 4px 12px}
.oai-brand{flex:1;min-width:0;display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--oai-ink);border-radius:8px}
.oai-brand-logo{width:30px;height:30px;flex:none;border-radius:7px;object-fit:contain}
.oai-brand-text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.oai-brand-text .b1{font-weight:800;font-size:15px;letter-spacing:.3px;color:var(--oai-ink2)}
.oai-brand-text .b2{font-weight:300;font-size:10px;letter-spacing:.2px;color:var(--oai-muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oai[data-theme="dark"] .oai-brand-logo--light{display:none}
.oai[data-theme="light"] .oai-brand-logo--dark{display:none}

/* search the chat history */
.oai-search{display:flex;align-items:center;gap:8px;margin:6px 10px 2px;padding:7px 10px;
  background:var(--oai-panel2);border:1px solid transparent;border-radius:10px}
.oai-search:focus-within{border-color:var(--oai-line);background:var(--oai-box-bg)}
.oai-search-ic{color:var(--oai-faint);line-height:0;flex:none}
.oai-search-ic svg{width:15px;height:15px}
.oai-search-in{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--oai-ink);
  font-size:13px;font-family:var(--oai-sans)}
.oai-search-in::placeholder{color:var(--oai-faint)}

.oai-sb-head{display:flex;align-items:center;gap:8px;padding:6px 10px 6px}
.oai-newchat{flex:1;display:flex;align-items:center;gap:9px;background:none;border:1px solid var(--oai-line);
  border-radius:10px;padding:9px 12px;color:var(--oai-ink);cursor:pointer;font-size:14px;font-family:var(--oai-sans)}
.oai-newchat:hover{background:var(--oai-panel2)}
.oai-newchat svg{width:16px;height:16px}
.oai-icbtn{background:none;border:none;color:var(--oai-muted);cursor:pointer;padding:7px;border-radius:8px;line-height:0}
.oai-icbtn:hover{background:var(--oai-panel2);color:var(--oai-ink)}
.oai-icbtn svg{width:18px;height:18px}
.oai-convs{flex:1;overflow-y:auto;padding:6px 8px}
.oai-convs .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--oai-faint);padding:12px 8px 4px}
.oai-conv{display:flex;align-items:center;gap:2px;width:100%;border-radius:8px}
.oai-conv:hover{background:var(--oai-panel2)}
.oai-conv.active{background:var(--oai-panel)}
.oai-conv-open{flex:1;min-width:0;text-align:left;background:none;border:none;color:var(--oai-ink);
  padding:8px 4px 8px 10px;cursor:pointer;font-size:13.5px;font-family:var(--oai-sans)}
.oai-conv-open .t{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oai-conv-more{opacity:0;flex:none;background:none;border:none;color:var(--oai-faint);cursor:pointer;
  padding:6px 7px;margin-right:2px;border-radius:6px;line-height:0}
.oai-conv-more svg{width:16px;height:16px}
.oai-conv:hover .oai-conv-more,.oai-conv.active .oai-conv-more{opacity:1}
.oai-conv-more:hover{color:var(--oai-ink);background:#0000000f}
.oai-conv-menu{position:absolute;z-index:40;width:150px;background:var(--oai-panel);border:1px solid var(--oai-line);
  border-radius:10px;padding:5px;box-shadow:0 10px 28px #00000038}
.oai-conv-menu button{display:flex;align-items:center;gap:9px;width:100%;background:none;border:none;color:var(--oai-ink);
  padding:8px 9px;border-radius:7px;cursor:pointer;font-size:13px;font-family:var(--oai-sans);text-align:left}
.oai-conv-menu button:hover{background:var(--oai-panel2)}
.oai-conv-menu svg{width:15px;height:15px;flex:none}
.oai-conv-menu [data-act="del"]{color:var(--oai-danger)}
.oai-empty-convs{color:var(--oai-faint);font-size:12.5px;padding:10px;text-align:center}
.oai-account{border-top:1px solid var(--oai-line);padding:8px}
.oai-account a{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--oai-ink);padding:7px;border-radius:10px}
.oai-account a:hover{background:var(--oai-panel2)}
.oai-avatar{width:30px;height:30px;border-radius:50%;background:var(--oai-accent);color:#fff;flex:none;
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
.oai-account .meta{min-width:0;flex:1;display:flex;flex-direction:column;overflow:hidden}
.oai-account .nm{display:block;max-width:100%;font-size:13px;font-weight:600;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oai-account .tier{display:block;max-width:100%;font-size:11px;color:var(--oai-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oai-main{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}

/* collapsed rail (desktop): keeps new-chat + history + account reachable */
.oai-rail{display:none}
.oai[data-collapsed="1"] .oai-rail{display:flex;flex-direction:column;align-items:center;gap:6px;
  width:56px;flex:none;background:var(--oai-bg);border-right:1px solid var(--oai-line);padding:12px 0 14px}
.oai-rail-sp{flex:1}
.oai-rail-acct{margin-top:auto;text-decoration:none;display:inline-flex;border-radius:50%}
.oai-rail .oai-avatar{width:32px;height:32px}
.oai-rail-acct:hover .oai-avatar{box-shadow:0 0 0 2px var(--oai-line)}

.oai-open{display:none;position:absolute;top:12px;left:12px;z-index:6;background:var(--oai-panel);
  border:1px solid var(--oai-line);color:var(--oai-ink);border-radius:8px;padding:7px;cursor:pointer;line-height:0}
.oai-open svg{width:18px;height:18px}
.oai-scrim{display:none}
@media (max-width:760px){
  .oai-sidebar{position:absolute;z-index:20;height:100%;box-shadow:2px 0 22px #0007}
  .oai[data-collapsed="1"] .oai-sidebar{width:0;box-shadow:none}
  .oai[data-collapsed="1"] .oai-rail{display:none}      /* no rail on phones — use the floating button */
  .oai[data-collapsed="1"] .oai-open{display:inline-flex}
  .oai:not([data-collapsed="1"]) .oai-scrim{display:block;position:absolute;inset:0;z-index:15;background:#0006}
}

/* ---- smooth fade-in for streamed content (text, cards, panels) ---- */
@keyframes oai-fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.oai-fx{animation:oai-fade .42s cubic-bezier(.22,.61,.36,1) both}
.oai-stream-body{opacity:0;transition:opacity .4s ease}
.oai-stream-body.in{opacity:1}

/* ---- capped citation display + "show more" ---- */
.oai-morebtn{background:none;border:none;color:var(--oai-muted);font-size:12.5px;cursor:pointer;
  padding:2px 2px 0;margin:0 0 16px;text-decoration:underline;text-underline-offset:2px}
.oai-morebtn:hover{color:var(--oai-ink)}
.oai-cites-more{margin-top:-8px}
/* .oai-cites sets display:flex, which beats the UA [hidden] rule — re-assert it */
.oai-cites-more[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.oai-fx{animation:none}.oai-stream-body{transition:none;opacity:1}.oai-sidebar{transition:none}}

/* ---- new-chat empty state: centre the greeting + composer together ---- */
.oai[data-empty="1"] .oai-main{justify-content:center}
.oai[data-empty="1"] .oai-scroll{flex:0 1 auto;overflow:visible}
.oai[data-empty="1"] .oai-empty{height:auto;padding:8px 20px 18px}
.oai[data-empty="1"] .oai-ta{min-height:52px}  /* taller, roomier input on a fresh chat */

/* permanent brand mark (fixed eye) below each answer */
.oai-sig{margin:18px 0 2px 2px;line-height:0}

/* thumb up/down pressed state */
.oai-acts button.on{color:var(--oai-accent)}
.oai-acts button.on:hover{color:var(--oai-accent)}