/* ============================================================
   Единый стиль, часть «Текст и поля»: шрифт, шкала размеров,
   поля ввода, загрузка, ссылки, полоса прокрутки, печать.
   Подключается последним (из _control_banner.html).
   Шкала: 12/13/14/16/18/22/28, начертания 400/600/700.
   ============================================================ */

/* ---------- 1. Шрифт: один токен --font-body от настройки ---------- */
html:root {
  --font-body: "Times New Roman", Times, "Liberation Serif", "Nimbus Roman", serif;
}
html:root[data-pusk-font="kniga"] { --font-body: var(--pf-pt-serif); }
html:root[data-pusk-font="smes"]  { --font-body: var(--pf-system); }
html:root[data-pusk-font="sovr"]  { --font-body: var(--pf-system); }
html:root[data-pusk-font="pt"]    { --font-body: var(--pf-pt-sans); }
html:root {
  --font-head: var(--font-body);
  --font-tnr: var(--font-body);
  --serif: var(--font-body);
  --sans: var(--font-body);
  --font-sans: var(--font-body);
  --font-display: var(--font-body);
}
html:root[data-pusk-font="smes"] { --font-head: var(--pf-pt-serif); }
/* старые слои переопределяют --sans/--serif на body и в телефонном :root */
html[data-pusk-font] body,
html[data-pusk-font] body:is(.tasks-approved, .today-web, .approved-desktop-page) {
  --sans: var(--font-body); --serif: var(--font-body);
  --font-sans: var(--font-body); --font-display: var(--font-body);
}
/* перекрываем жёсткие font-family !important (font-unify, pusk-today, figma-workspace) */
html[data-pusk-font] body,
html[data-pusk-font] body :is(button, input, select, textarea, option, optgroup) {
  font-family: var(--font-tnr) !important;
}
/* кружки сотрудников и иконки — свой шрифт, как было */
html[data-pusk-font] body :is(.ui-av, .pusk-tasks-avatar, .who-dot, .pusk-kanban-avatar, .pusk-mob-avatar) {
  font-family: -apple-system, "Segoe UI", Roboto, sans-serif !important;
}

/* ---------- 2. Ссылки в тексте ---------- */
body:not(.m-app) :is(main, .panel, .card, article, p, td, .prose) a:not([class]):not(.btn) {
  color: #168f89; text-decoration: none;
}
body:not(.m-app) :is(main, .panel, .card, article, p, td, .prose) a:not([class]):not(.btn):hover {
  text-decoration: underline;
}

/* ---------- 3. Полоса прокрутки — одна, тонкая ---------- */
* { scrollbar-width: thin; scrollbar-color: #c9c3b8 transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: #c9c3b8; border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover { background-color: #a9a294; }

/* ---------- 4. Поля ввода (компьютер) ---------- */
body:not(.m-app) :is(
  input:not([type]),
  input:is([type="text"],[type="search"],[type="email"],[type="tel"],[type="url"],[type="password"],
           [type="number"],[type="date"],[type="time"],[type="datetime-local"],[type="month"],[type="week"]),
  select:not([multiple]):not([size])
) {
  box-sizing: border-box;
  height: 36px;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid #d9d4ca;
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
  line-height: normal;
}
body:not(.m-app) textarea {
  box-sizing: border-box;
  min-height: 72px;
  padding: 8px 10px;
  border: 1px solid #d9d4ca;
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
}
body:not(.m-app) :is(input, select, textarea):focus { outline: none; }
body:not(.m-app) :is(input, select, textarea):focus-visible {
  border-color: #168f89 !important;
  box-shadow: 0 0 0 3px #e4f2f1 !important;
  outline: none;
}
body:not(.m-app) :is(input[type="checkbox"], input[type="radio"]):focus-visible {
  outline: 2px solid #168f89; outline-offset: 2px; box-shadow: none !important;
}
body:not(.m-app) form label:not(:has(input[type="checkbox"], input[type="radio"])) {
  font-size: 12px;
  color: var(--muted, #6c7882);
}
.is-required::after { content: " *"; color: #b42318; }
.field-error { display: block; margin-top: 4px; font-size: 12px; line-height: 1.35; color: #b42318; }
body .is-invalid,
body :is(input, select, textarea).is-invalid { border-color: #b42318 !important; }
body :is(input, select, textarea).is-invalid:focus-visible { box-shadow: 0 0 0 3px #fbe9e7 !important; }

/* ---------- 5. Загрузка ---------- */
.ui-spinner {
  display: inline-block; flex: none;
  width: 18px; height: 18px; box-sizing: border-box;
  border: 2px solid #cfe7e5; border-top-color: #168f89; border-radius: 50%;
  vertical-align: -4px;
  animation: ui-spin .7s linear infinite;
}
button .ui-spinner, .btn .ui-spinner { width: 14px; height: 14px; margin-right: 6px; vertical-align: -2px; border-color: currentColor; border-top-color: transparent; opacity: .8; }
@keyframes ui-spin { to { transform: rotate(360deg); } }
.ui-skel {
  display: block; min-height: 12px; border-radius: 6px;
  background: linear-gradient(90deg, #eeebe5 25%, #f6f4f0 37%, #eeebe5 63%);
  background-size: 400% 100%;
  animation: ui-skel 1.4s ease infinite;
  color: transparent !important;
}
@keyframes ui-skel { 0% { background-position: 100% 50%; } 100% { background-position: 0 50%; } }
.is-busy { cursor: progress; }
@media (prefers-reduced-motion: reduce) { .ui-spinner, .ui-skel { animation-duration: 2.5s; } }

/* ---------- 6. Печать ---------- */
@media print {
  @page { margin: 14mm 12mm; }
  html, body { background: #fff !important; color: #000 !important; }
  body * { box-shadow: none !important; }
  aside, nav, .side, .sidebar, .pusk-side, .pusk-sidebar, .app-side, .topbar, .top-bar, .pusk-topbar, header.top,
  .worktabs, .pusk-worktabs, .work-tabs, .chat-fab, .chat-btn, #chat-fab, .pusk-chat-btn, .mic-btn, .mic-fab, #mic-fab,
  .toolbar, .pusk-toolbar, .list-toolbar, .page-actions, .ctl-banner, .undo-bar,
  button, .btn, input[type="submit"], input[type="button"], .ui-spinner { display: none !important; }
  main, .with-side, main.with-side, .content, .page { margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; overflow: visible !important; }
  body, html { height: auto !important; overflow: visible !important; }
  h1, .page-title { display: block !important; font-size: 22px !important; margin: 0 0 10px !important; }
  table { width: 100% !important; border-collapse: collapse; }
  tr, li, .card { break-inside: avoid; page-break-inside: avoid; }
  thead { display: table-header-group; }
  a { color: #000 !important; text-decoration: none !important; }
}