/* RoamTale — Bootstrap 5 theme + modern app shell.
   Loaded AFTER Bootstrap and site.css. Themes Bootstrap to the RoamTale dark/coral
   brand and provides a responsive sidebar shell (rt- prefixed; no legacy collisions). */

:root,
[data-bs-theme="dark"] {
  --rt-coral: #FF6B4A;
  --rt-violet: #A875FF;
  --rt-bg: #0E0D12;
  --rt-surface: #1A1822;
  --rt-surface-2: #211e2b;
  --rt-text: #F5F3F0;
  --rt-muted: #9B96A8;
  --rt-grad: linear-gradient(135deg, #FF6B4A 0%, #A875FF 100%);

  --bs-primary: #FF6B4A;
  --bs-primary-rgb: 255, 107, 74;
  --bs-body-bg: #0E0D12;
  --bs-body-color: #F5F3F0;
  --bs-border-color: #2a2636;
  --bs-emphasis-color: #ffffff;
  --bs-secondary-color: #9B96A8;
  --bs-link-color: #FF8A6F;
  --bs-link-hover-color: #FFB29E;
  --bs-font-sans-serif: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body { background: var(--rt-bg); color: var(--rt-text); }
h1,h2,h3,h4,.rt-display { font-family: "Space Grotesk", Inter, sans-serif; letter-spacing: -.02em; }

/* Buttons / cards themed to brand (covers Bootstrap + legacy usage consistently) */
.btn-primary { --bs-btn-bg: var(--rt-coral); --bs-btn-border-color: var(--rt-coral);
  --bs-btn-hover-bg:#ff7d60; --bs-btn-hover-border-color:#ff7d60; --bs-btn-active-bg:#e85d3f; color:#fff; font-weight:600; }
.btn-gradient { background: var(--rt-grad); color:#fff; border:0; font-weight:600; }
.btn-gradient:hover { color:#fff; opacity:.94; }
.card { background: var(--rt-surface); border:1px solid var(--rt-surface-2); border-radius:16px; }
.text-grad { background: var(--rt-grad); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.form-control, .form-select { background:#15131c; border-color:#2a2636; color:var(--rt-text); }
.form-control:focus, .form-select:focus { background:#15131c; color:var(--rt-text); border-color:var(--rt-coral); box-shadow:0 0 0 .2rem rgba(255,107,74,.2); }
.badge.text-bg-primary { background: var(--rt-coral) !important; }

/* ── App shell ─────────────────────────────────────────────────────────── */
.rt-shell { min-height:100vh; }
.rt-sidebar {
  width:248px; background:#131019; border-right:1px solid var(--rt-surface-2);
  display:flex; flex-direction:column; padding:18px 14px; gap:6px;
  position:fixed; inset:0 auto 0 0; overflow-y:auto;
}
.rt-main { margin-left:248px; padding:0; min-height:100vh; }
.rt-topbar {
  height:60px; display:flex; align-items:center; gap:12px; padding:0 22px;
  border-bottom:1px solid var(--rt-surface-2); position:sticky; top:0;
  background:rgba(14,13,18,.82); backdrop-filter:blur(10px); z-index:20;
}
.rt-content { padding:24px 22px 60px; max-width:1180px; }
.rt-brand { font-family:"Space Grotesk"; font-weight:700; font-size:22px; padding:6px 10px 14px; }
.rt-brand span { color:var(--rt-coral); }
.rt-nav { display:flex; flex-direction:column; gap:2px; }
.rt-nav a {
  display:flex; align-items:center; gap:10px; color:var(--rt-muted); text-decoration:none;
  padding:9px 12px; border-radius:10px; font-size:14.5px; font-weight:500;
}
.rt-nav a:hover { background:var(--rt-surface); color:var(--rt-text); }
.rt-nav a.active { background:rgba(255,107,74,.14); color:var(--rt-text); }
.rt-nav a.active i { color:var(--rt-coral); }
.rt-group { color:#6b6577; font-size:11px; font-weight:700; text-transform:uppercase;
  letter-spacing:.1em; padding:14px 12px 4px; }
.rt-badge { background:var(--rt-coral); color:#fff; font-size:11px; border-radius:999px; padding:1px 7px; margin-left:auto; }
.rt-logout { margin-top:auto; padding-top:12px; }
.rt-logout button { width:100%; background:transparent; border:1px solid var(--rt-surface-2);
  color:var(--rt-muted); border-radius:10px; padding:9px; cursor:pointer; font-size:13px; }
.rt-logout button:hover { color:var(--rt-text); border-color:var(--rt-coral); }
.rt-pill { font-size:12px; color:var(--rt-violet); border:1px solid var(--rt-surface-2);
  border-radius:999px; padding:5px 10px; margin:4px 6px 8px; text-align:center; }
.rt-burger { display:none; background:none; border:0; color:var(--rt-text); font-size:22px; }

/* Mobile: sidebar slides in */
@media (max-width: 991.98px) {
  .rt-sidebar { transform:translateX(-100%); transition:transform .2s ease; z-index:1050; box-shadow:0 0 40px rgba(0,0,0,.5); }
  .rt-shell.rt-open .rt-sidebar { transform:translateX(0); }
  .rt-main { margin-left:0; }
  .rt-burger { display:inline-block; }
  .rt-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1040; }
  .rt-shell.rt-open .rt-backdrop { display:block; }
}

/* Page header helper */
.rt-page-title { font-size:24px; font-weight:700; margin:0; }
.rt-page-sub { color:var(--rt-muted); margin:4px 0 0; font-size:14px; }

/* ── Copilot chat widget ───────────────────────────────────────────────── */
.rt-fab { position:fixed; right:22px; bottom:22px; z-index:1060; width:56px; height:56px;
  border-radius:50%; border:0; background:var(--rt-grad); color:#fff; font-size:22px;
  box-shadow:0 8px 30px rgba(255,107,74,.4); cursor:pointer; }
.rt-fab:hover { transform:translateY(-2px); }
.rt-chat { position:fixed; right:22px; bottom:88px; z-index:1060; width:min(380px,calc(100vw - 32px));
  height:min(540px,70vh); background:var(--rt-surface); border:1px solid var(--rt-surface-2);
  border-radius:16px; box-shadow:0 16px 50px rgba(0,0,0,.5); display:flex; flex-direction:column; overflow:hidden; }
.rt-chat-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px;
  background:var(--rt-grad); color:#fff; font-weight:600; font-family:"Space Grotesk"; }
.rt-chat-head button { background:none; border:0; color:#fff; cursor:pointer; }
.rt-chat-body { flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px; }
.rt-msg { max-width:85%; padding:9px 12px; border-radius:12px; font-size:14px; line-height:1.45; white-space:pre-wrap; }
.rt-msg.bot { background:var(--rt-surface-2); color:var(--rt-text); align-self:flex-start; border-bottom-left-radius:3px; }
.rt-msg.user { background:var(--rt-coral); color:#fff; align-self:flex-end; border-bottom-right-radius:3px; }
.rt-chat-input { display:flex; gap:6px; padding:10px; border-top:1px solid var(--rt-surface-2); }
.rt-chat-input input { flex:1; background:#15131c; border:1px solid #2a2636; color:var(--rt-text); border-radius:10px; padding:9px 12px; }
.rt-chat-input button { background:var(--rt-coral); border:0; color:#fff; border-radius:10px; padding:0 14px; cursor:pointer; }