/* ===== Sokodo テーマシステム ===== */
:root {
  --accent: #6366f1;
  --font-size-base: 14px;
  --app-font: 'Segoe UI', 'Hiragino Sans', 'Meiryo', sans-serif;
}
html { font-size: var(--font-size-base); }
body { font-family: var(--app-font); }

/* ダークテーマ */
.dark body, body.dark { background: #0f1117; color: #e2e5ec; }
.dark .act-bar { background: #0a0c10; border-color: #23262f; }
.dark .side-bar { background: #14161d; border-color: #23262f; }
.dark .panel-border { border-color: #23262f; }
.dark .input-field { background: #1c1f28; border: 1px solid #2c3040; color: #e2e5ec; }
.dark .chat-input-box { background: #1a1d26; border: 1px solid #2c3040; }
.dark .modal-bg { background: #1a1d26; border: 1px solid #2c3040; }
.dark .msg-assistant { background: #171a22; }
.dark .card-bg { background: #1a1d26; border: 1px solid #2c3040; }
.dark .muted-text { color: #8b90a0; }
.dark .hover-item:hover { background: #1f232e; }
.dark .code-header { background: #23262f; }

/* ライトテーマ */
body:not(.dark) { background: #f7f8fa; color: #1a1d26; }
body:not(.dark) .act-bar { background: #eceef2; border-color: #d8dbe2; }
body:not(.dark) .side-bar { background: #f0f1f5; border-color: #d8dbe2; }
body:not(.dark) .panel-border { border-color: #d8dbe2; }
body:not(.dark) .input-field { background: #fff; border: 1px solid #cfd3dc; color: #1a1d26; }
body:not(.dark) .chat-input-box { background: #fff; border: 1px solid #cfd3dc; }
body:not(.dark) .modal-bg { background: #fff; border: 1px solid #d8dbe2; }
body:not(.dark) .msg-assistant { background: #eef0f4; }
body:not(.dark) .card-bg { background: #fff; border: 1px solid #d8dbe2; }
body:not(.dark) .muted-text { color: #6b7080; }
body:not(.dark) .hover-item:hover { background: #e4e7ed; }
body:not(.dark) .code-header { background: #d8dbe2; }

.accent-bg { background: var(--accent); }
.accent-text { color: var(--accent); }
.accent-border { border-color: var(--accent); }

/* アクティビティバー */
.act-btn { width: 40px; height: 40px; border-radius: 10px; color: #8b90a0; font-size: 16px; transition: all .15s; }
.act-btn:hover { color: var(--accent); background: rgba(99,102,241,.12); }
.act-btn.active { color: var(--accent); background: rgba(99,102,241,.18); }

/* アイコンボタン */
.icon-btn { padding: 4px 8px; border-radius: 6px; color: #8b90a0; font-size: 12px; transition: all .15s; }
.icon-btn:hover { color: var(--accent); background: rgba(99,102,241,.12); }

/* 会話リスト */
.conv-item { padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 13px; display: flex; align-items: center; gap: 8px; }
.conv-item.active { background: rgba(99,102,241,.18); color: var(--accent); }
.conv-item .conv-actions { opacity: 0; display: flex; gap: 2px; }
.conv-item:hover .conv-actions { opacity: 1; }

/* メッセージ */
.msg { max-width: 900px; margin: 0 auto 16px; }
.msg-user .msg-bubble { background: var(--accent); color: #fff; border-radius: 14px 14px 4px 14px; padding: 10px 14px; margin-left: auto; max-width: 80%; width: fit-content; white-space: pre-wrap; word-break: break-word; }
.msg-assistant { border-radius: 14px; padding: 14px 16px; }
.msg-actions { display: flex; gap: 4px; margin-top: 6px; opacity: 0; transition: opacity .15s; }
.msg:hover .msg-actions { opacity: 1; }
.msg-action-btn { font-size: 11px; padding: 3px 8px; border-radius: 5px; color: #8b90a0; }
.msg-action-btn:hover { color: var(--accent); background: rgba(99,102,241,.12); }
.msg.pinned .msg-bubble, .msg.pinned .msg-assistant { box-shadow: 0 0 0 2px rgba(245,158,11,.5); }

/* Markdown */
.md-body { font-size: 14px; line-height: 1.7; word-break: break-word; }
.md-body h1,.md-body h2,.md-body h3 { font-weight: 700; margin: 14px 0 8px; }
.md-body h1 { font-size: 1.4em; } .md-body h2 { font-size: 1.25em; } .md-body h3 { font-size: 1.1em; }
.md-body p { margin: 8px 0; }
.md-body ul,.md-body ol { margin: 8px 0; padding-left: 22px; }
.md-body ul { list-style: disc; } .md-body ol { list-style: decimal; }
.md-body li { margin: 3px 0; }
.md-body code:not(.hljs) { background: rgba(99,102,241,.15); color: #a5b4fc; padding: 1px 5px; border-radius: 4px; font-size: .9em; font-family: 'Consolas', monospace; }
body:not(.dark) .md-body code:not(.hljs) { color: #4f46e5; }
.md-body blockquote { border-left: 3px solid var(--accent); padding-left: 12px; margin: 8px 0; opacity: .85; }
.md-body table { border-collapse: collapse; margin: 10px 0; font-size: .92em; }
.md-body th,.md-body td { border: 1px solid #3a3f4e; padding: 5px 10px; }
.md-body a { color: var(--accent); text-decoration: underline; }
.code-block { border-radius: 10px; overflow: hidden; margin: 10px 0; border: 1px solid #2c3040; }
.code-header { display: flex; align-items: center; padding: 5px 12px; font-size: 11px; }
.code-block pre { margin: 0; }
.code-block pre code { padding: 12px 14px; font-size: 13px; font-family: 'Consolas','Menlo',monospace; display:block; overflow-x:auto; }

/* エディタタブ */
.ed-tab { display: flex; align-items: center; gap: 6px; padding: 0 12px; height: 100%; font-size: 12px; cursor: pointer; border-right: 1px solid #23262f; white-space: nowrap; color: #8b90a0; }
.ed-tab.active { color: var(--accent); background: rgba(99,102,241,.1); border-bottom: 2px solid var(--accent); }
.ed-tab .close-tab { opacity: .5; } .ed-tab .close-tab:hover { opacity: 1; color: #ef4444; }
.ed-tool-btn { padding: 3px 8px; border-radius: 5px; color: #8b90a0; }
.ed-tool-btn:hover { color: var(--accent); background: rgba(99,102,241,.12); }

/* ファイルツリー */
.tree-item { display: flex; align-items: center; gap: 6px; padding: 3px 6px; border-radius: 6px; cursor: pointer; }
.tree-item .tree-actions { opacity: 0; display: flex; gap: 2px; margin-left: auto; }
.tree-item:hover .tree-actions { opacity: 1; }
.tree-item.active { background: rgba(99,102,241,.18); color: var(--accent); }
.tree-item.drag-over { outline: 2px dashed var(--accent); }

/* クイックアクション */
.quick-action-chip { font-size: 11px; padding: 4px 10px; border-radius: 999px; border: 1px solid #2c3040; color: #8b90a0; cursor: pointer; transition: all .15s; }
.quick-action-chip:hover { border-color: var(--accent); color: var(--accent); }
body:not(.dark) .quick-action-chip { border-color: #cfd3dc; }

/* 設定 */
.settings-nav-btn { color: #8b90a0; }
.settings-nav-btn:hover { background: rgba(99,102,241,.1); }
.settings-nav-btn.active { background: rgba(99,102,241,.18); color: var(--accent); }
.setting-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; }
.setting-label { font-size: 13px; }
.setting-desc { font-size: 11px; margin-top: 2px; }

/* トグルスイッチ */
.toggle { position: relative; width: 40px; height: 22px; border-radius: 999px; background: #3a3f4e; cursor: pointer; transition: background .2s; flex-shrink: 0; }
.toggle.on { background: var(--accent); }
.toggle::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: left .2s; }
.toggle.on::after { left: 20px; }

/* トースト */
.toast { padding: 10px 16px; border-radius: 10px; font-size: 13px; color: #fff; box-shadow: 0 4px 16px rgba(0,0,0,.3); animation: slideIn .25s ease; display: flex; align-items: center; gap: 8px; }
.toast-success { background: #16a34a; } .toast-error { background: #dc2626; } .toast-info { background: #4f46e5; }
@keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: none; opacity: 1; } }

/* スクロールバー */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #3a3f4e; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #4a4f5e; }
body:not(.dark) ::-webkit-scrollbar-thumb { background: #c5c9d4; }

/* ストリーミングカーソル */
.stream-cursor::after { content: '▌'; animation: blink 1s infinite; color: var(--accent); }
@keyframes blink { 50% { opacity: 0; } }

/* 検索結果ハイライト */
.search-hit { background: rgba(245,158,11,.35); border-radius: 2px; }

/* チャット幅レイアウト (設定で変更可) */
:root { --chat-width: 900px; }
.msg, .msg-assistant-live > .msg-assistant { max-width: var(--chat-width); }

/* ===== モバイルレスポンシブ ===== */
@media (max-width: 640px) {
  #activity-bar { width: 48px; }
  #sidebar {
    position: fixed; left: 48px; top: 0; bottom: 0; z-index: 40;
    width: min(85vw, 320px) !important;
    transform: translateX(-110%);
    transition: transform .25s ease;
    box-shadow: 4px 0 24px rgba(0,0,0,.4);
  }
  #sidebar.mobile-open { transform: translateX(0); }
  #sidebar-resizer { display: none; }
  #quick-model { max-width: 130px; }
  .msg-user .msg-bubble { max-width: 92%; }
  #quick-actions { overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }
  .quick-action-chip { white-space: nowrap; flex-shrink: 0; }
  #view-editor .flex.items-center.gap-2.px-3 { overflow-x: auto; }
}
#mobile-backdrop {
  position: fixed; inset: 0; z-index: 39; background: rgba(0,0,0,.5); display: none;
}
#mobile-backdrop.show { display: block; }

/* 印刷 */
@media print {
  #activity-bar, #sidebar, #sidebar-resizer, #chat-input-area, .msg-actions { display: none !important; }
}