/* Штаб — закрытый экран владельцев: доска работы над сервисом.

   Экран читается слева направо: «Новое» → «В работе» → «Сделано». Вся работа
   стиля здесь — дать колонкам видимые границы, а карточке спокойный вид, при
   котором подряд читается два десятка штук. Токены общие (`osnovy.css`),
   своих цветов файл не заводит.

   Перетаскивание — украшение: классы `shtab-tyanut` и `shtab-kolonka-cel`
   ставит `static/shtab.js`, и без скрипта они просто не появляются. */

/* --- дорожки и сообщение -------------------------------------------------- */

.shtab-itog {
  margin: 0 0 14px;
  padding: 10px 14px;
  border: 1px solid var(--accent-ring);
  border-radius: var(--r-md);
  background: var(--accent-wash);
  color: var(--fg-1);
}

.shtab-dorozhki {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
}
.shtab-dorozhka {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--bd);
  border-radius: 999px;
  background: var(--paper);
  color: var(--fg-2);
  font-size: 14px;
  text-decoration: none;
}
.shtab-dorozhka:hover { background: var(--hover); }
.shtab-dorozhka-vybrana {
  border-color: var(--accent-ring);
  color: var(--accent-ink);
  font-weight: 600;
}
.shtab-schyot {
  font-size: 12px;
  color: var(--fg-3);
  font-weight: 400;
}

/* --- доска ---------------------------------------------------------------- */

.shtab-doska {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 34px;
  align-items: start;
}
.shtab-kolonka {
  background: var(--sunken);
  border: 1px solid var(--bd);
  border-radius: var(--r-md);
  padding: 12px;
  min-height: 120px;
}
/* Колонка, над которой держат карточку. Рамка, а не заливка: заливка увела бы
   вид карточек, а понять надо ровно одно — куда сейчас упадёт. */
.shtab-kolonka-cel {
  border-color: var(--accent-ring);
  box-shadow: inset 0 0 0 1px var(--accent-ring);
}
.shtab-kolonka-shapka { margin: 0 0 10px; }
.shtab-kolonka-shapka > h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.shtab-kolonka-shapka > .tech { margin: 2px 0 0; font-size: 12px; }
.shtab-stopka { display: flex; flex-direction: column; gap: 10px; }

/* --- карточка ------------------------------------------------------------- */

.shtab-karta {
  background: var(--paper);
  border: 1px solid var(--bd);
  border-radius: var(--r-md);
  padding: 12px 14px;
  box-shadow: var(--sh-1);
  cursor: grab;
}
.shtab-karta:active { cursor: grabbing; }
/* Карточка, которую тянут: остаётся на месте полупрозрачной, чтобы человек
   видел, откуда взял. */
.shtab-tyanut { opacity: .45; }

.shtab-shapka {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 6px;
}
.shtab-otkuda {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--fg-3);
  border: 1px solid var(--bd-2);
  border-radius: 999px;
  padding: 1px 8px;
}
/* Вопросы к Насте сохраняют свой акцент на отдельной вкладке. */
.shtab-karta-vopros { border-left: 3px solid var(--accent-ring); }
.shtab-karta-vopros .shtab-otkuda {
  border-color: var(--accent-ring);
  color: var(--accent-ink);
}
.shtab-data { font-size: 12px; color: var(--fg-3); }

.shtab-rashozhdenie {
  margin: 0 0 6px;
  font-size: 12px;
  color: var(--accent-ink);
  border: 1px dashed var(--accent-ring);
  border-radius: var(--r-sm);
  padding: 3px 8px;
  display: inline-block;
}

.shtab-zagolovok { margin: 0 0 6px; font-size: 15px; font-weight: 600; line-height: 1.4; }
.shtab-poyasnenie { margin: 0 0 6px; font-size: 13px; color: var(--fg-2); line-height: 1.5; }
.shtab-sled { margin: 8px 0 0; font-size: 12px; color: var(--fg-3); }

.shtab-podrobno { margin-top: 8px; }
.shtab-podrobno > summary {
  cursor: pointer;
  font-size: 13px;
  color: var(--accent-ink);
  width: fit-content;
}
.shtab-pole { margin: 8px 0 0; font-size: 13px; color: var(--fg-2); overflow-wrap: anywhere; }

.shtab-knopki {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.shtab-knopka {
  font: inherit;
  font-size: 12px;
  padding: 4px 10px;
  border: 1px solid var(--bd-2);
  border-radius: var(--r-sm);
  background: var(--paper);
  color: var(--fg-2);
  cursor: pointer;
}
.shtab-knopka:hover { background: var(--hover); color: var(--ink); }

/* --- тело записи ---------------------------------------------------------- */

.shtab-telo { margin-top: 8px; color: var(--fg-1); font-size: 13px; line-height: 1.55; }
.shtab-telo p { margin: 0 0 8px; }
.shtab-telo p:last-child { margin-bottom: 0; }
.shtab-metka { font-weight: 600; color: var(--fg-2); }
.shtab-punkt { padding-left: 16px; position: relative; }
.shtab-punkt::before {
  content: "·";
  position: absolute;
  left: 5px;
  color: var(--fg-3);
}
.shtab-kod {
  margin: 0 0 8px;
  padding: 10px 12px;
  background: var(--sunken);
  border-radius: var(--r-sm);
  font-size: 12px;
  overflow-x: auto;
}

/* --- журнал замеров под доской -------------------------------------------- */

.shtab-razdel { margin: 0 0 34px; }
.shtab-razdel > h2 {
  margin: 0 0 4px;
  font-size: 20px;
  font-weight: 600;
  border-bottom: 1px solid var(--bd);
  padding-bottom: 6px;
}
.shtab-razdel > .tech { margin: 0 0 14px; }
.shtab-zapis {
  background: var(--paper);
  border: 1px solid var(--bd);
  border-radius: var(--r-md);
  padding: 14px 16px;
  margin: 0 0 10px;
  box-shadow: var(--sh-1);
}
/* Замер — не карточка новости, а строка журнала: пары «графа — значение». */
.shtab-grafy { margin: 8px 0 0; font-size: 14px; }
.shtab-grafy dt {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--fg-3);
}
.shtab-grafy dd { margin: 2px 0 10px; color: var(--fg-1); line-height: 1.55; }
.shtab-grafy dd:last-child { margin-bottom: 0; }

.shtab-pusto {
  margin: 0;
  padding: 12px 14px;
  border: 1px dashed var(--bd-2);
  border-radius: var(--r-md);
  color: var(--fg-3);
  font-size: 13px;
}

.shtab-istochniki { display: flex; flex-wrap: wrap; gap: 4px 14px; }

/* Телефон: три колонки в ряд нечитаемы, поэтому они встают друг под друга.
   Тащить там нечего и незачем — перенос делают кнопки внутри карточки. */
@media (max-width: 860px) {
  .shtab-doska { grid-template-columns: minmax(0, 1fr); }
}

/* Ожидание решения: охра Насти и чернильный контур Эда. Текст и форма
   различаются вместе с цветом; у общей развилки видны оба края. */
.shtab-karta-zhdet-nastya { border-left: 4px solid var(--accent-ink); }
.shtab-karta-zhdet-ed { border-right: 4px solid var(--ink); }
.shtab-karta-zhdet-utochnit { border-left: 4px dashed var(--fg-3); }
.shtab-ozhidanie { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.shtab-ozhidanie > span {
  font-size: 15px;
  line-height: 1.4;
  padding: 3px 8px;
  border-radius: var(--r-sm);
  border: 1px solid var(--bd-2);
  color: var(--fg-1);
}
.shtab-ozhidanie .shtab-ozhidanie-nastya {
  background: var(--accent-wash);
  border-color: var(--accent-ring);
  color: var(--deystvie);
}
.shtab-ozhidanie .shtab-ozhidanie-ed { border-color: var(--ink); color: var(--ink); }
.shtab-schyot-zhdut { font-size: 14px; }
.shtab-dorozhka { flex-wrap: wrap; }