/* /styles/sam-sidebar.css — SAM copilot drawer (right-side mirror of the tool
   rail). Light default; dark variant off html[data-nerve-theme="dark"]. All
   colors via component-scoped vars so both palettes live in one place. */

.samb-burger, .samb-drawer, .samb-overlay {
  --sb-bg: #ffffff; --sb-panel: #f8fafc; --sb-line: #e2e8f0;
  --sb-text: #0f172a; --sb-mute: #64748b; --sb-faint: #94a3b8;
  --sb-sel: #6d28d9; --sb-sel-weak: #f3eefe; --sb-bad: #b91c1c; --sb-good: #0f766e;
}
html[data-nerve-theme="dark"] .samb-burger, html[data-nerve-theme="dark"] .samb-drawer {
  --sb-bg: #0f172a; --sb-panel: #131f36; --sb-line: #23304d;
  --sb-text: #e2e8f0; --sb-mute: #94a3b8; --sb-faint: #64748b;
  --sb-sel: #a78bfa; --sb-sel-weak: #241d3f; --sb-bad: #f87171; --sb-good: #5eead4;
}

.samb-burger {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; flex: 0 0 auto;
  border: 1px solid rgba(148, 163, 184, .38); border-radius: 6px;
  background: transparent; color: #64748b; cursor: pointer; padding: 0;
  font-size: 14px; line-height: 1;
}
.samb-burger:hover { color: #0f172a; border-color: #94a3b8; }
#spd-toprail .samb-burger, #rca-toprail .samb-burger { color: var(--rail-mute, #94a3b8); border-color: var(--border-2, rgba(148,163,184,.38)); border-radius: 2px; }
#spd-toprail .samb-burger:hover, #rca-toprail .samb-burger:hover { color: var(--rail-ink, #e2e8f0); }
.samb-burger--fixed { position: fixed; top: 12px; right: 12px; z-index: 10990; background: var(--sb-bg); }

.samb-overlay {
  position: fixed; inset: 0; background: rgba(15, 23, 42, .32);
  opacity: 0; pointer-events: none; transition: opacity .18s; z-index: 11000;
}
.samb-overlay.open { opacity: 1; pointer-events: auto; }

.samb-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 400px; max-width: 92vw;
  background: var(--sb-bg); border-left: 1px solid var(--sb-line);
  box-shadow: 0 10px 40px rgba(15, 23, 42, .18);
  transform: translateX(102%); transition: transform .2s ease; z-index: 11001;
  display: flex; flex-direction: column; color: var(--sb-text);
  font-family: 'Instrument Sans', Inter, system-ui, sans-serif;
}
.samb-drawer.open { transform: translateX(0); }

.samb-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 10px; border-bottom: 1px solid var(--sb-line); }
.samb-title { font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.samb-x { border: 0; background: transparent; color: var(--sb-faint); cursor: pointer; font-size: 16px; line-height: 1; padding: 4px 6px; border-radius: 6px; }
.samb-x:hover { color: var(--sb-text); background: var(--sb-panel); }

.samb-body { flex: 1; overflow-y: auto; padding: 12px 16px; display: flex; flex-direction: column; gap: 10px; }
.samb-focus { border-bottom: 1px dashed var(--sb-line); padding-bottom: 10px; }
.samb-caps { font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--sb-mute); margin: 0 0 6px; }
.samb-note { font-size: 11.5px; color: var(--sb-mute); line-height: 1.5; }
.samb-note.bad { color: var(--sb-bad); }

.samb-card {
  display: flex; gap: 8px; align-items: baseline; width: 100%; text-align: left;
  border: 1px solid var(--sb-line); background: var(--sb-panel); border-radius: 9px;
  padding: 7px 10px; margin: 3px 0; cursor: pointer; color: var(--sb-text);
  font: 500 11.5px/1.45 'IBM Plex Mono', ui-monospace, monospace;
}
.samb-card:hover { border-color: var(--sb-sel); }
.samb-card .nm { flex: 1; min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.samb-card .idx { color: var(--sb-faint); flex: none; }
.samb-card .val { white-space: nowrap; flex: none; }
.samb-card .val.bad { color: var(--sb-bad); }
.samb-card .val.good { color: var(--sb-good); }
.samb-card .sub { display: block; font-size: 10.5px; color: var(--sb-mute); font-weight: 400; margin-top: 2px; }

.samb-log { display: flex; flex-direction: column; gap: 8px; }
.samb-msg { max-width: 88%; padding: 8px 11px; border-radius: 11px; font-size: 12.5px; line-height: 1.55; overflow-wrap: anywhere; }
.samb-msg[data-role="user"] { align-self: flex-end; background: var(--sb-sel-weak); border: 1px solid var(--sb-sel); }
.samb-msg[data-role="model"] { align-self: flex-start; background: var(--sb-panel); border: 1px solid var(--sb-line); }
.samb-dots { letter-spacing: 3px; color: var(--sb-mute); animation: sambPulse 1.1s ease-in-out infinite; }
@keyframes sambPulse { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }

.samb-inp { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--sb-line); }
.samb-inp input { flex: 1; min-width: 0; border: 1px solid var(--sb-line); background: var(--sb-panel); color: var(--sb-text); border-radius: 9px; padding: 9px 11px; font: 500 13px inherit; outline: none; }
.samb-inp input:focus { border-color: var(--sb-sel); }
.samb-inp button { border: 1px solid var(--sb-sel); background: var(--sb-sel); color: #fff; border-radius: 9px; padding: 0 14px; font: 700 15px inherit; cursor: pointer; }
.samb-inp button:disabled { opacity: .5; cursor: default; }