/* Общие стили платформы. Модули добавляют свои стили в {% block head %}, эти не переопределяют. */
:root {
  --bg: #f6f6f7;
  --surface: #fff;
  --text: #1d1d1f;
  --muted: #6e6e73;
  --line: #e3e3e6;
  --accent: #2f5bea;
  --topbar-h: 48px;
  --assistant-w: 340px;
  --assistant-rail: 44px;
}

* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.5 system-ui, sans-serif; color: var(--text); background: var(--bg); }

.topbar {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; gap: 16px;
  height: var(--topbar-h); padding: 0 20px;
  background: var(--surface); border-bottom: 1px solid var(--line);
}
.topbar .brand { display: flex; align-items: center; gap: 8px; font-weight: 600; color: inherit; text-decoration: none; }
/* Знак — по высоте, ширина по пропорциям файла */
.topbar .brand img { height: 24px; width: auto; }
.topbar .modules { display: flex; gap: 4px; }
.topbar .modules a { padding: 4px 10px; border-radius: 6px; color: inherit; text-decoration: none; }
.topbar .modules a:hover { background: var(--bg); }
.topbar .modules a[aria-current] { color: var(--accent); font-weight: 600; }
.topbar .user { margin-left: auto; }
.topbar form { margin: 0; }

.layout { display: flex; min-height: calc(100vh - var(--topbar-h)); }
main { flex: 1 1 auto; min-width: 0; padding: 24px 20px; }

/* Панель ассистента справа: место под контекстный чат, пока пустое */
.assistant {
  position: sticky; top: var(--topbar-h);
  display: flex; flex-direction: column;
  flex: 0 0 var(--assistant-w); width: var(--assistant-w);
  height: calc(100vh - var(--topbar-h));
  background: var(--surface); border-left: 1px solid var(--line);
  transition: flex-basis .15s ease, width .15s ease;
}
/* Ручка у левого края: ширина панели меняется перетаскиванием */
.assistant-resize {
  position: absolute; top: 0; bottom: 0; left: -4px; z-index: 1;
  width: 8px; cursor: col-resize; touch-action: none; outline: none;
}
.assistant-resize:hover,
.assistant-resize:focus-visible,
html.assistant-resizing .assistant-resize {
  background: linear-gradient(to right, transparent 3px, var(--accent) 3px, var(--accent) 5px, transparent 5px);
}
html.assistant-resizing, html.assistant-resizing * { cursor: col-resize !important; user-select: none; }
html.assistant-resizing .assistant { transition: none; }
.assistant-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.assistant-title { font-weight: 600; }
.assistant-toggle {
  width: 28px; height: 28px; padding: 0;
  font-size: 18px; line-height: 1; color: var(--muted);
  background: var(--surface); border: 1px solid var(--line); border-radius: 6px; cursor: pointer;
}
.assistant-body { flex: 1 1 auto; overflow: auto; padding: 12px; }

html[data-assistant="collapsed"] .assistant { flex-basis: var(--assistant-rail); width: var(--assistant-rail); }
html[data-assistant="collapsed"] .assistant-title,
html[data-assistant="collapsed"] .assistant-body { display: none; }
html[data-assistant="collapsed"] .assistant-head { justify-content: center; padding: 10px 0; border-bottom: 0; }
html[data-assistant="collapsed"] .assistant-toggle { transform: rotate(180deg); }
html[data-assistant="collapsed"] .assistant-resize { display: none; }

@media (max-width: 900px) {
  .assistant { display: none; }
}