/* ============================================================================
   «Сборник» – администратор: Главная (views/admin/dashboard.php, .sb-ah) и экран
   «Сборник» (views/admin/collection_form.php, .sb-cb): состав таблицей, порядок,
   «Ещё» у статьи, титул и просмотр строками, служебные записки (_memos.php).
   Строки-ссылки «Титул…», «Просмотр…» – те же .sb-as-list, что в «Настройках»
   (area-admin-settings.css). Скругления – только var(--sb-radius) и var(--sb-radius-lg).
   Блок «Служебные записки» (_memos.php) оформляет только area-memos.css.
   ========================================================================== */

/* ------------------------------ колонка всех экранов администратора -- */
/* Каждый экран администратора (views/admin/*.php) ставит body.sb-adm: одна колонка
   по центру, одной ширины везде (72rem); заголовок, плашки и карточки – вровень. */
.sb-adm .sb-main > .sb-content { max-width: 72rem; margin-inline: auto; }
/* поле, растущее с текстом, на планшете и телефоне – той же высоты, что обычное (44 px) */
@media (max-width: 991.98px) { .sb-adm textarea.sb-autosize { min-height: 44px; } }
/* кнопки одной высоты и одного размера букв: «маленьких» (28 px, 13 px) на экранах администратора нет */
.sb-adm .btn-sm { --bs-btn-padding-x: .875rem; --bs-btn-padding-y: .3125rem; --bs-btn-font-size: .875rem; --bs-btn-border-radius: var(--sb-radius); gap: .375rem; }
@media (min-width: 992px) {
  .sb-adm .btn-sm { min-height: 34px; }
  /* поле выбора файла – той же высоты, что остальные поля (34 px) */
  .sb-adm input[type=file].form-control { padding: .3125rem .625rem; }
  .sb-adm input[type=file].form-control::file-selector-button { margin: -.3125rem .75rem -.3125rem -.625rem; padding: .375rem .875rem; }
}
/* ссылки-названия и навигация – без подчёркивания (п. 42, 53 владельца) */
.sb-adm :is(.sb-as-li-name, .sb-row-title, .sb-bi-title, .sb-u-name > a, .sb-ap-st, .sb-ap-free a) { text-decoration: none; }
.sb-adm :is(.sb-row-title, .sb-bi-title, .sb-u-name > a, .sb-ap-st, .sb-ap-free a):hover { color: var(--sb-brand-800); }

/* ---------------------------------------------------------- Главная -- */
.sb-ah-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin-bottom: .75rem; }
.sb-ah-top .sb-card-title { margin: 0; }
.sb-ah-state { font-weight: 400; color: var(--sb-ink-2); }
.sb-ah-facts { margin: 0; }
.sb-ah-facts > div { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .125rem 1rem; min-height: 40px; padding: .5rem 0; border-top: 1px solid var(--sb-line); }
.sb-ah-facts > div:last-child { padding-bottom: 0; }
.sb-ah-facts dt { font-weight: 400; color: var(--sb-ink-2); }
.sb-ah-facts dd { margin: 0 0 0 auto; min-width: 0; text-align: right; }
.sb-ah-facts b { font-weight: 700; font-variant-numeric: tabular-nums; }
.sb-ah-facts a { text-decoration: none; font-weight: 500; }

/* ------------------------------------------------- Сборник: шапка -- */
.sb-cb-head { align-items: flex-start; }
.sb-cb-head h1 { margin: 0; }
.sb-cb-state { font-weight: 400; color: var(--sb-ink-2); }
.sb-ah-state .sb-ah-dot, .sb-cb-state .sb-cb-dot { color: var(--sb-muted); }
.sb-cb-dl { display: flex; flex-direction: column; align-items: flex-end; gap: .375rem; }
.sb-cb-formats { margin: 0; font-size: .8125rem; color: var(--sb-muted); text-align: right; }
.sb-cb-formats a { color: var(--sb-brand-700); text-decoration: none; font-weight: 500; }
.sb-cb-formats a:hover { color: var(--sb-brand-800); text-decoration: none; }

/* ------------------------------------------------ Сборник: состав -- */
.sb-cb-top { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding-bottom: 1.25rem; }
.sb-cb-top .sb-card-title { margin: 0; }
.sb-cb-n { font-weight: 400; color: var(--sb-ink-2); }
.sb-cb-top .sb-book-saved { margin-right: auto; }
.sb-cb-top .sb-card-title + .sb-cb-order { margin-left: auto; }
/* «Порядок: По фамилиям · По названиям · Вручную» – тихие слова, выбранное – тёмным, без плиток */
.sb-cb-order { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .5rem; margin: 0; }
.sb-cb-order-l { color: var(--sb-ink-2); }
.sb-cb-order .sb-choice { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0; }
.sb-cb-ord { display: inline-flex; align-items: center; min-height: 34px; margin: 0; padding: 0 .125rem; border-radius: var(--sb-radius); color: var(--sb-brand-700); font-weight: 500; cursor: pointer; white-space: nowrap; }
.sb-cb-ord:hover { color: var(--sb-brand-800); }
.sb-cb-order .btn-check:checked + .sb-cb-ord { color: var(--sb-ink); font-weight: 700; cursor: default; }
.sb-cb-order .btn-check:focus-visible + .sb-cb-ord { outline: 2px solid var(--sb-brand); outline-offset: 2px; }
.sb-cb-ord-sep { padding: 0 .5rem; color: var(--sb-muted); }
.sb-cb-none { padding-top: 0; }
.sb-cb-none > p { text-align: center; }

/* таблица: прокрутку-обёртку из app.js не включаем – иначе меню «Ещё» обрезалось бы */
.sb-cb-wrap.table-responsive { overflow: visible; }
.sb-cb-table { margin: 0; }
.sb-cb-table > thead th:first-child { border-top-left-radius: 0; }
.sb-cb-table > thead th:last-child { border-top-right-radius: 0; }
.sb-cb-table th, .sb-cb-table td { padding-left: .75rem; padding-right: .75rem; }
.sb-cb-table > thead th:first-child, .sb-cb-table > tbody > tr > :first-child { padding-left: var(--sb-pad); }
.sb-cb-table > tbody > tr > td { padding-top: .75rem; padding-bottom: .75rem; vertical-align: top; border-bottom: 1px solid var(--sb-line); }
.sb-cb-table > tbody:last-child > tr:last-child > td { border-bottom: 0; }
/* нижние углы «Состава» скруглены, как у карточки (меню «Ещё» обрезалось бы от overflow: hidden) */
.sb-cb-table > tbody:last-child > tr:last-child > :first-child { border-bottom-left-radius: calc(var(--sb-radius-lg) - 1px); }
.sb-cb-table > tbody:last-child > tr:last-child > :last-child { border-bottom-right-radius: calc(var(--sb-radius-lg) - 1px); }
.sb-cb-c-drag { width: 3.25rem; }
.sb-cb-c-who { width: 14rem; }
.sb-cb-c-state { width: 9.5rem; }
.sb-cb-c-more { width: 3.5rem; text-align: right; }
.sb-cb-table .sb-cb-c-drag, .sb-cb-table > tbody > tr > .sb-cb-c-drag { padding-right: 0; }
.sb-cb-table > tbody > tr > td.sb-cb-c-more { padding-top: .375rem; padding-bottom: .375rem; padding-right: .5rem; }
.sb-cb-table > tbody > tr > td.sb-cb-c-drag { padding-top: .375rem; padding-bottom: .375rem; }

/* строка статьи – строка таблицы (в общей теме .sb-bi – сетка-карточка) */
.sb-cb-table tr.sb-bi { display: table-row; padding: 0; border: 0; background: transparent; }
.sb-cb-table tr.sb-bi.is-flash { animation: sb-flash 1.2s ease-out; }
.sb-cb-table tr.sb-bi.is-ghost > * { visibility: hidden; }
.sb-cb-table tr.sb-bi.is-ghost { background: var(--sb-brand-50); outline: 2px dashed var(--sb-brand); outline-offset: -3px; }
.sb-cb-table .sb-bi-title { display: inline; font-weight: 600; color: var(--sb-brand-700); text-decoration: none; overflow-wrap: anywhere; }
.sb-cb-table .sb-bi-title:hover { text-decoration: underline; }
.sb-cb-table .sb-bi-n { color: var(--sb-muted); font-weight: 600; font-variant-numeric: tabular-nums; }
.sb-cb-author, .sb-cb-sup { display: block; }
.sb-cb-sup { color: var(--sb-muted); font-size: .8125rem; margin-top: .125rem; }
.sb-cb-table .sb-status { white-space: normal; }
.sb-cb-table .sb-drag { width: 34px; height: 34px; margin: 0 0 0 -.375rem; }
/* перетаскиваемая строка (Sortable, forceFallback) – копия под пальцем */
tr.sb-bi.is-dragging { display: table; width: 100%; background: #fff; box-shadow: 0 12px 28px rgba(15, 36, 48, .2); border-radius: var(--sb-radius-lg); opacity: 1 !important; }

/* «Ещё» у статьи – значок, меню справа */
.sb-cb-more {
  display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0;
  border: 0; border-radius: var(--sb-radius); background: transparent; color: var(--sb-muted);
}
.sb-cb-more:hover, .sb-cb-more[aria-expanded=true] { background: var(--sb-surface-2); color: var(--sb-ink); }
.sb-cb-c-more .dropdown-menu { --bs-dropdown-min-width: 13rem; }

/* «Ещё не в сборнике» – подпись группы и приглушённые строки */
.sb-cb-group > th {
  padding: .5rem .75rem .5rem var(--sb-pad); background: var(--sb-surface-2); color: var(--sb-ink-2);
  font-size: .8125rem; font-weight: 600; border-bottom: 1px solid var(--sb-line);
}
.sb-cb-out .sb-bi-title { color: var(--sb-ink-2); font-weight: 400; }
.sb-cb-empty > td { color: var(--sb-muted); }

/* --------------------------------------- Сборник: титул и просмотр -- */
.sb-cb-links .sb-as-li-name { font-weight: 600; }
.sb-cb-warn { color: var(--sb-ink); }

/* --------------------------------- варианты-карточки (титул: _book.php, _fold.php) -- */
.sb-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: .75rem; }
.sb-opt-card {
  display: flex; align-items: flex-start; gap: .75rem; padding: 1rem 1.125rem; margin: 0;
  border: 1px solid var(--sb-line-2); border-radius: var(--sb-radius); background: #fff; cursor: pointer; line-height: 1.45;
}
.sb-opt-card:hover { border-color: var(--sb-field); }
.sb-opt-card > .form-check-input { flex: none; margin: .1875rem 0 0; }
.sb-opt-card.is-on, .sb-opt-card:has(> input:checked) { border-color: var(--sb-brand-600); background: var(--sb-brand-50); box-shadow: inset 0 0 0 1px var(--sb-brand-600); }
.sb-opt-card b { font-weight: 600; }
.sb-opt-card small { display: block; margin-top: .25rem; font-size: .875rem; color: var(--sb-ink-2); }

/* ---------------------------------------------- просмотр сборника -- */
.sb-cbp-note { color: var(--sb-ink-2); margin: 0 0 1rem; }

/* ------------------------------------------------------ планшет -- */
@media (max-width: 991.98px) {
  /* состояние приёма – строкой под заголовком, без точки в начале строки */
  .sb-cb-state, .sb-ah-state { display: block; margin-top: .25rem; font-size: .9375rem; }
  .sb-cb-dot, .sb-ah-dot { display: none; }
  .sb-cb-c-who { width: 11rem; }
  .sb-cb-c-state { width: 8rem; }
  .sb-cb-table .sb-drag, .sb-cb-more { width: 44px; height: 44px; }
  .sb-cb-c-drag { width: 3.75rem; }
  .sb-cb-c-more { width: 4rem; }
}

/* ------------------------------------------------------- телефон -- */
@media (max-width: 767.98px) {
  .sb-ah-top > .btn { width: 100%; }
  .sb-cb-dl { width: 100%; align-items: stretch; }
  .sb-cb-dl > .btn { width: 100%; }
  .sb-cb-formats { text-align: left; }
  .sb-cb-formats a { display: inline-flex; align-items: center; min-height: 44px; }
  .sb-cb-top .sb-card-title + .sb-cb-order, .sb-cb-order { margin-left: 0; width: 100%; }
  .sb-cb-ord { min-height: 44px; }

  /* состав – карточками: номер и название, ниже автор, состояние; «Ещё» справа */
  .sb-cb-table, .sb-cb-table > tbody, .sb-cb-table > tbody > tr { display: block; width: 100%; }
  .sb-cb-table > thead { display: none; }
  .sb-cb-table > tbody > tr.sb-bi, .sb-cb-table > tbody > tr.sb-cb-row {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "title more" "who more" "state more";
    column-gap: .5rem; padding: .75rem .5rem .75rem var(--sb-pad); border-bottom: 1px solid var(--sb-line);
  }
  .sb-cb-table.is-manual > tbody > tr.sb-bi, .sb-cb-table.is-manual > tbody > tr.sb-cb-row {
    grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-areas: "drag title more" "drag who more" "drag state more"; padding-left: .5rem;
  }
  .sb-cb-table > tbody:last-child > tr:last-child { border-bottom: 0; }
  .sb-cb-table > tbody > tr > td { display: block; padding: 0 !important; border: 0 !important; width: auto; }
  .sb-cb-table td.sb-cb-c-title { grid-area: title; }
  .sb-cb-table td.sb-cb-c-who { grid-area: who; margin-top: .25rem; }
  .sb-cb-table td.sb-cb-c-state { grid-area: state; margin-top: .25rem; }
  .sb-cb-table td.sb-cb-c-more { grid-area: more; align-self: start; }
  .sb-cb-table td.sb-cb-c-drag { grid-area: drag; align-self: start; }
  .sb-cb-table .sb-drag { margin: -.5rem 0 0; }
  .sb-cb-more { margin-top: -.5rem; }
  .sb-cb-author, .sb-cb-sup { display: inline; }
  .sb-cb-sup::before { content: " · "; }
  .sb-cb-table > tbody > tr.sb-cb-group, .sb-cb-table > tbody > tr.sb-cb-empty { display: block; }
  .sb-cb-table > tbody > tr.sb-cb-group > th { display: block; }
  .sb-cb-table > tbody > tr.sb-cb-empty > td { padding: .75rem var(--sb-pad) !important; }
  tr.sb-bi.is-dragging { display: grid; }

}
