/* Общий стиль переделанных страниц — по образцу формы отчёта о выполнении задания (18.09.2026).
   Карточка .ui-card, подписи капителью .ui-caption, серые подсказки .ui-hint, строка кнопок .ui-actions,
   разделённые линией секции .ui-section, пары «название — значение» dl.ui-meta, плашки статусов .ui-badge-*,
   таблица внутри карточки .ui-table. Форма отчёта (.report-*) использует те же правила под своими старыми именами. */

/* ---- Карточка ---- */
.ui-card,
#blog_post .report-box { border: 1px solid #e2e6ea; border-radius: 6px; background: #fff; padding: 22px 24px; margin: 10px 0 24px; }
.ui-card > :last-child { margin-bottom: 0; }
#blog_post .report-box { margin-bottom: 0; }
.ui-card .form-group,
#blog_post .report-box .form-group { margin-bottom: 18px; }

/* ---- Подписи и заголовки секций капителью ---- */
.ui-caption,
.ui-card label,
#blog_post .report-box label,
#blog_post .report-state h4 { display: block; font-size: 13px; font-weight: bold; text-transform: uppercase; letter-spacing: .05em; color: #8a9199; margin: 0 0 7px; }
h4.ui-caption,
#blog_post .report-state h4 { margin-bottom: 12px; }
.ui-caption small { text-transform: none; letter-spacing: 0; font-weight: normal; color: #98a0a8; }

/* ---- Поля ---- */
.ui-card .form-control,
#blog_post .report-box .form-control { border-color: #dfe3e8; box-shadow: none; }
.ui-card .form-control:focus,
#blog_post .report-box .form-control:focus { border-color: #337ab7; box-shadow: 0 0 0 2px rgba(51,122,183,.12); }
.ui-card textarea.form-control,
#blog_post .report-box textarea.form-control { min-height: 150px; resize: vertical; }

/* ---- Подсказки и пустые состояния ---- */
.ui-hint,
.ui-card .help-block,
#blog_post .report-box .help-block,
#blog_post .report-actions .report-hint { color: #98a0a8; font-size: 12.5px; line-height: 1.5; margin: 7px 0 0; }
.ui-empty,
#blog_post .report-state .report-empty { color: #8a9199; margin: 0; }

/* ---- Строка кнопок с пояснением ---- */
.ui-actions,
#blog_post .report-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding-top: 4px; }
.ui-actions .btn-primary,
#blog_post .report-actions .btn { padding: 10px 26px; font-size: 15px; }
.ui-actions .ui-hint,
#blog_post .report-actions .report-hint { margin: 0; }
.ui-actions .form-control { flex: 1 1 260px; max-width: 480px; height: 42px; }

/* ---- Секции внутри карточки ---- */
.ui-section,
#blog_post .report-state { margin-top: 24px; padding-top: 20px; border-top: 1px solid #eef0f2; }
#blog_post .report-comments { margin-top: 18px; padding-top: 16px; border-top: 1px solid #eef0f2; }
#blog_post .report-comments ol { margin: 8px 0 0; padding-left: 20px; }
#blog_post .report-comments li { margin-bottom: 6px; }

/* ---- Пары «название — значение» ---- */
.ui-meta,
#blog_post .report-meta { margin: 0; }
.ui-meta dt,
#blog_post .report-meta dt { float: left; clear: left; width: 130px; color: #98a0a8; font-weight: normal; font-size: 13px; padding: 3px 0; }
.ui-meta dd,
#blog_post .report-meta dd { margin-left: 142px; padding: 3px 0; }

/* ---- Плашки статусов ---- */
.ui-badge,
#blog_post .report-badge { display: inline-block; padding: 3px 11px; border-radius: 3px; font-size: 12.5px; font-weight: bold; white-space: nowrap; }
.ui-badge-check,
#blog_post .report-badge-check { background: #fdf3e6; color: #a06616; }
.ui-badge-ok,
#blog_post .report-badge-ok { background: #eaf4ea; color: #3c763d; }
.ui-badge-no,
#blog_post .report-badge-no { background: #fbeaea; color: #a94442; }
.ui-badge-muted { background: #f1f3f5; color: #8a9199; }

/* ---- Таблица внутри карточки ---- */
.ui-table { width: 100%; margin: 0; border-collapse: collapse; }
.ui-table > thead > tr > th { font-size: 12px; font-weight: bold; text-transform: uppercase; letter-spacing: .05em; color: #8a9199; border-bottom: 1px solid #eef0f2; padding: 0 10px 10px; text-align: left; }
.ui-table > tbody > tr > td { border-top: 1px solid #eef0f2; padding: 11px 10px; vertical-align: middle; }
.ui-table > tbody > tr:first-child > td { border-top: 0; }
.ui-table > thead > tr > th:first-child,
.ui-table > tbody > tr > td:first-child { padding-left: 0; }
.ui-table > thead > tr > th:last-child,
.ui-table > tbody > tr > td:last-child { padding-right: 0; }
.ui-table .ui-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ui-table .ui-muted { color: #98a0a8; font-size: 13px; }

/* ---- Перетаскиваемые списки (порядок занятий, заданий) ----
   Строка .ui-list-item: [.ui-handle] [.ui-list-num] содержимое [.ui-list-actions].
   В .ui-list-numbered номера строк ставятся сами и меняются при перетаскивании */
.ui-handle { cursor: move; color: #c3c8cd; width: 28px; flex: 0 0 auto; }
.ui-handle:hover { color: #337ab7; }
.ui-list { margin: 0; min-height: 44px; }
.ui-list:empty:not(.ui-list-numbered) { min-height: 0; }
.ui-list-item { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid #eef0f2; background: #fff; }
.ui-list-item:first-child { border-top: 0; }
.ui-list-item .ui-handle { width: 16px; }
.ui-list-item .ui-list-title { flex: 1 1 auto; min-width: 0; }
.ui-list-item .ui-list-title small { color: #98a0a8; margin-left: 4px; }
.ui-list-item .ui-list-actions { flex: 0 0 auto; }
.ui-list-numbered { counter-reset: ui-list; }
.ui-list-num { display: none; }
.ui-list-numbered .ui-list-num { display: inline-block; flex: 0 0 22px; color: #98a0a8; font-size: 13px; text-align: right; font-variant-numeric: tabular-nums; }
.ui-list-numbered .ui-list-num::before { counter-increment: ui-list; content: counter(ui-list) "."; }
.ui-list-empty { padding: 12px 0; color: #98a0a8; font-size: 13px; }
.ui-list:not(:empty) + .ui-list-empty { display: none; }
.sortable-ghost,
.sortable-ghost > td { background: #f5f8fb; opacity: .6; }

/* ---- Полоска доли (например, явка) ---- */
.ui-bar { display: inline-block; width: 90px; height: 6px; border-radius: 3px; background: #eef0f2; vertical-align: middle; overflow: hidden; }
.ui-bar > span { display: block; height: 100%; background: #337ab7; }

@media (max-width: 600px) {
  .ui-card,
  #blog_post .report-box { padding: 16px; }
  .ui-meta dt,
  #blog_post .report-meta dt { float: none; width: auto; padding-bottom: 0; }
  .ui-meta dd,
  #blog_post .report-meta dd { margin-left: 0; }
}

/* ---- Окна Bootstrap ----
   index.css (анимации главной) задаёт .fade { position: absolute; display: none } — это ломает окна и подложку Bootstrap,
   у которых тоже есть класс .fade: окно уезжает со страницей, крестик прячется под шапку,
   затемнение покрывает только верх экрана. Возвращаем бутстраповское fixed */
.modal.fade,
.modal-backdrop.fade { position: fixed; }
.modal-backdrop.fade { display: block; }