/* ORB Ai Prototype -- all of ORB's own styling (chat answers, tables, "thinking" status, Flash/Pro dropdown,
   expanded-window chat layout). Loaded AFTER style.css so it can build on the app's theme variables.
   Served from /orb/orb.css (nginx maps /orb/ to this folder). See orb/README.md. */
  .chat-bubble.ai p{ margin:0 0 8px; }
  .chat-bubble.ai p:last-child{ margin-bottom:0; }
  .chat-bubble.ai ul, .chat-bubble.ai ol{ margin:2px 0 8px; padding-left:20px; }
  .chat-bubble.ai li{ margin:3px 0; }
  .chat-bubble.ai li.sub{ margin-left:18px; list-style:circle; }
  /* ORB "thinking" state: a small status block under the chat (not a bubble) -- the planet icon (standing still),
     with the rotating word and what ORB is doing written beside it */
  .orb-status{ display:flex; flex-direction:row; align-items:center; gap:10px; margin:4px 0 14px 4px; }
  .orb-mini{ position:relative; flex:0 0 auto; width:26px; height:26px; display:block; color: var(--pd-a855f7); }
  .orb-mini svg{ width:100%; height:100%; display:block; overflow:visible; }
  .orb-status-text{ display:flex; flex-direction:column; line-height:1.3; }
  .orb-think-word{ font-size:12px; font-weight:600; color: var(--text-muted); }
  .orb-think-act{ font-size:11px; color: var(--text-dim); }
  .orb-think-act:empty{ display:none; }
  /* Flash / Pro dropdown */
  .orb-model-btn{
    height:26px; padding:0 8px 0 11px; border-radius:13px; cursor:pointer;
    display:inline-flex; align-items:center; gap:4px;
    font:600 11.5px var(--font-body); letter-spacing:.02em;
    color: var(--text-muted); background: var(--surface-2); border:1px solid var(--border);
    transition: background .12s, color .12s, border-color .12s;
  }
  .orb-model-btn svg{ width:11px; height:11px; stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
  .orb-model-btn:hover{ color: var(--text); border-color: var(--border-strong, var(--border)); }
  .orb-model-btn.is-pro{
    color: var(--lime-text); border-color: var(--lime-dim); background: rgba(var(--lime-rgb),0.12);
  }
  .ai-input-actions .orb-model-btn{ margin-right:6px; }
  .ai-expand-input-row .orb-model-btn{ margin-left:auto; margin-right:10px; }
  .orb-model-menu{
    position:fixed; z-index:100000; min-width:230px; padding:6px;
    background: var(--surface); border:1px solid var(--border); border-radius:12px;
    box-shadow: 0 10px 30px rgba(0,0,0,.28);
  }
  .orb-model-item{
    display:flex; align-items:flex-start; gap:8px; width:100%; padding:8px 10px; border:none; border-radius:8px;
    background:none; cursor:pointer; text-align:left; color: var(--text); font-family: var(--font-body);
  }
  .orb-model-item:hover{ background: var(--surface-2); }
  .orb-model-check{ flex:0 0 16px; width:16px; height:16px; margin-top:1px; color: var(--lime-text); opacity:0; }
  .orb-model-item.selected .orb-model-check{ opacity:1; }
  .orb-model-check svg{ width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
  .orb-model-text{ display:flex; flex-direction:column; gap:2px; }
  .orb-model-text b{ font-size:13px; font-weight:600; }
  .orb-model-text small{ font-size:11.5px; color: var(--text-muted); }
  /* tables in ORB answers */
  .chat-bubble.ai{ min-width:0; }
  .orb-table-wrap{ overflow-x:auto; margin:6px 0 8px; border:1px solid var(--border); border-radius:10px; }
  .orb-table-wrap table{ border-collapse:collapse; width:100%; font-size:12.5px; }
  .orb-table-wrap th, .orb-table-wrap td{ padding:7px 10px; text-align:left; white-space:nowrap; border-bottom:1px solid var(--border-soft); }
  .orb-table-wrap th{ font-weight:600; color: var(--text); background: var(--surface-2); }
  .orb-table-wrap tr:last-child td{ border-bottom:none; }
  .chat-bubble.ai ul:last-child, .chat-bubble.ai ol:last-child{ margin-bottom:0; }

  /* Expanded Orb AI window while a conversation is open: the log fills the middle, the input sits at the bottom */
  .ai-expand-chatlog{ display:none; }
  .ai-expand-main.chatting .ai-expand-center{ justify-content:flex-end; padding-bottom:28px; min-height:0; }
  .ai-expand-main.chatting .ai-expand-mark,
  .ai-expand-main.chatting .ai-expand-claude-badge,
  .ai-expand-main.chatting .ai-expand-title,
  .ai-expand-main.chatting .ai-expand-suggestions-row{ display:none; }
  .ai-expand-main.chatting .ai-expand-chatlog{
    display:block; flex:1; min-height:0; width:100%; max-width:760px; overflow-y:auto; padding:8px 4px 18px;
  }
  .ai-expand-chatlog .ai-chat-log{ display:block; }
  .ai-expand-chatlog .chat-bubble{ font-size:14.5px; }
  .ai-expand-main{ min-height:0; }

  /* chat-length ring: a small circle next to Flash/Pro, filled to the share of the chat used, with the % inside */
  .orb-ring{ position:relative; flex:0 0 auto; width:30px; height:30px; margin-right:8px; display:inline-flex; align-items:center; justify-content:center; color: var(--pd-a855f7); }
  .orb-ring[hidden]{ display:none; }
  .orb-ring svg{ position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); fill:none; stroke-width:3; }
  .orb-ring-track{ stroke: var(--border); }
  .orb-ring-fill{ stroke: currentColor; stroke-linecap:round; transition: stroke-dashoffset .35s ease; }
  .orb-ring-text{ position:relative; font:600 8.5px var(--font-body); letter-spacing:-.02em; color: var(--text-muted); }
  .orb-ring.warn{ color:#f59e0b; }
  .orb-ring.warn .orb-ring-text{ color:#f59e0b; }
  .ai-expand-input-row .orb-ring:not([hidden]){ margin-left:auto; }
  .ai-expand-input-row .orb-ring:not([hidden]) + .orb-model-btn{ margin-left:0; }
  /* the permission chip ("Ask me first" / "Auto") is icon-only: the label stays for screen readers, the menu keeps the full names */
  .chat-mode-slot .chat-mode-chip{ font-size:0; gap:0; width:30px; height:30px; padding:0; justify-content:center; border-radius:50%; }
  .chat-mode-slot .chat-mode-chip svg{ width:15px; height:15px; }
  /* a quiet note inside the chat (the "getting long" hint) and the "chat is full" card with its button */
  .orb-note{ margin:2px 4px 12px; font-size:12px; line-height:1.4; color: var(--text-muted); text-align:center; }
  .orb-full{
    margin:6px 0 14px; padding:14px 14px 12px; border:1px solid var(--border); border-radius:12px;
    background: var(--surface-2); text-align:center;
  }
  .orb-full p{ margin:0 0 10px; font-size:13px; line-height:1.45; color: var(--text); }
  .orb-full-btn{
    height:34px; padding:0 18px; border-radius:17px; border:none; cursor:pointer;
    font:600 13px var(--font-body); color:#fff; background: var(--pd-a855f7);
    transition: opacity .12s;
  }
  .orb-full-btn:hover{ opacity:.9; }
  .orb-full-btn:disabled{ opacity:.6; cursor:default; }
  .orb-full-err{ display:block; margin-top:8px; font-size:12px; color:#ef4444; }
  .orb-full-err:empty{ display:none; }

  /* history sidebar (expanded window): the real saved chats */
  .orb-hist-item{ display:flex; align-items:center; gap:6px; }
  .orb-hist-title{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .orb-hist-item.active{ background: var(--surface-2); color: var(--text); }
  .orb-hist-del{
    flex:0 0 auto; width:20px; height:20px; padding:0; border:none; border-radius:5px; background:none; cursor:pointer;
    display:none; align-items:center; justify-content:center; color: var(--text-dim);
  }
  .orb-hist-del svg{ width:12px; height:12px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; }
  .orb-hist-item:hover .orb-hist-del, .orb-hist-del:focus-visible{ display:inline-flex; }
  .orb-hist-del:hover{ color:#ef4444; background: var(--surface-3, rgba(255,255,255,.06)); }
  .orb-hist-empty{ padding:14px 8px; font-size:12.5px; color: var(--text-dim); }
  .orb-hist-search{
    flex:1; min-width:0; background:none; border:none; outline:none; color: var(--text); font:inherit; font-size:13.5px; padding:0;
  }
  .orb-hist-search::placeholder{ color: var(--text-dim); }

  /* one question at a time: the send buttons grey out while ORB is answering */
  .ai-send-btn.orb-busy, .ai-expand-send.orb-busy{ opacity:.4 !important; filter:grayscale(1) !important; cursor:not-allowed !important; }
  .orb-disabled{ opacity:.5; cursor:not-allowed !important; }