/* Редактор BPMN (T-030). Отдельный файл, а не styles.css: правила печатного листа
   и перекраска холста библиотеки нужны одной странице, грузить их всем незачем.
   Токены и базовые классы (btn, container, field, eyebrow) берём из styles.css. */

.bpmn-head { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; padding-top: 48px; }
.bpmn-editor { display: flex; flex-direction: column; gap: 16px; padding-top: 32px; }

/* Холст. Высоту задаём явно: bpmn-js растягивается на контейнер и сам её не держит. */
.bpmn-canvas {
  height: max(520px, calc(100vh - 240px));
  border: 1px solid var(--color-frost);
  border-radius: var(--radius);
  background: var(--color-paper);
  overflow: hidden;
}

/* Перекраска библиотеки под дизайн-систему. Синий акцент bpmn-js заменён нейтральным:
   единственный акцент сайта (#e42b0c) по DESIGN.md не декор, на холст его не выносим.
   Селектор с .djs-parent — переменные объявлены на нём, наследованием их не перебить.
   Водяной знак bpmn.io (.bjs-powered-by) не трогаем и не перекрываем: условие лицензии. */
.bpmn-canvas .djs-parent {
  --bio-primary: var(--color-slate-900);
  --bio-primary-surface: var(--color-vellum);
  --bio-focus: var(--color-slate-900);
  --bio-focus-surface: var(--color-vellum);
  --bio-canvas-accent: var(--color-slate-900);
  --bio-canvas-accent-subtle: var(--color-cloud);
  --bio-radius-sm: var(--radius);
  --bio-radius-md: var(--radius);
  --bio-radius-lg: var(--radius);
  font-family: var(--font-sans);
}

/* Поля и панель действий */
.bpmn-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.bpmn-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.bpmn-toolbar .btn { background: var(--color-paper); }
.bpmn-toolbar .btn:focus-visible { outline: 2px solid var(--color-slate-900); outline-offset: 2px; }
.bpmn-select {
  font: inherit; font-size: 12px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.3px;
  color: var(--color-slate-600); background: var(--color-paper);
  border: 1px solid var(--color-cloud); border-radius: var(--radius); padding: 8px 14px; cursor: pointer;
}
.bpmn-select:focus-visible { outline: 2px solid var(--color-slate-900); outline-offset: 2px; }
.bpmn-canvas.is-drop { border-color: var(--color-slate-900); }

/* На весь экран: разворачиваем секцию целиком, чтобы панель действий осталась под рукой.
   Поля названия и пояснения прячем — всё место отдаём холсту. */
.bpmn-full { margin-left: auto; }
.bpmn-editor:fullscreen { padding: 16px; background: var(--color-paper); }
.bpmn-editor:fullscreen .bpmn-canvas { flex: 1; height: auto; min-height: 0; }
.bpmn-editor:fullscreen .bpmn-meta,
.bpmn-editor:fullscreen .bpmn-narrow,
.bpmn-editor:fullscreen .bpmn-note { display: none; }

/* Сообщения редактора */
.bpmn-msg { font-size: 14px; line-height: 1.5; padding: 12px 16px; border: 1px solid var(--color-frost); border-radius: var(--radius); color: var(--color-slate-700); }
.bpmn-msg--err { border-color: var(--color-vermillion); color: var(--color-slate-900); }
.bpmn-msg--warn { background: var(--color-vellum); }
.bpmn-draft { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.bpmn-draft[hidden] { display: none; }
.bpmn-draft .btn { background: var(--color-paper); }

/* ---------- Фирменный лист PDF ----------
   ponytail: PDF делает печать браузера («Сохранить как PDF»). Потолок — лишний клик
   и поля/масштаб, которые человек может поменять в диалоге. Апгрейд — jsPDF + svg2pdf.js
   со встроенным шрифтом для кириллицы (+~700 КБ). */
.print-sheet { display: none; }

@page { size: A4 landscape; margin: 12mm; }

@media print {
  body > *:not(.print-sheet) { display: none !important; }
  body { background: var(--color-paper); }
  .print-sheet { display: flex; flex-direction: column; gap: 4mm; height: 184mm; color: var(--color-slate-900); }
  .print-sheet__head { display: flex; justify-content: space-between; align-items: baseline; gap: 8mm; padding-bottom: 3mm; border-bottom: 1px solid var(--color-cloud); }
  .print-sheet__brand { font-size: 14pt; font-weight: 500; }
  .print-sheet__contacts { font-size: 8pt; color: var(--color-slate-600); }
  .print-sheet__title { font-size: 18pt; font-weight: 300; line-height: 1.2; }
  .print-sheet__meta { font-size: 9pt; color: var(--color-slate-600); }
  .print-sheet__diagram { flex: 1; min-height: 0; }
  /* Схема вписывается в остаток листа целиком, без обрезки. */
  .print-sheet__diagram img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center top; }
}

.bpmn-narrow { display: none; }

@media (max-width: 900px) {
  .bpmn-narrow { display: block; }
  .bpmn-canvas { height: 70vh; }
  .bpmn-head { padding-top: 32px; }
  .bpmn-head .h-section { font-size: 32px; letter-spacing: -0.8px; }
}