/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* Подэкран «Публикации» (modules-reels-publish.js): план недели, очередь, результат действия, плашка «Публикация выключена».
   Значения — только из tokens.css, размеры в rem, обе темы через переменные. Плитки, кнопки и чипы — из base.css и kit.css.
   На узком экране строки таблиц становятся карточками (без горизонтальной прокрутки страницы). Подключается из index.html. */

.rl-pb { min-width: 0; }
.rl-pb-content { display: grid; gap: var(--tile-gap); min-width: 0; align-content: start; }
.rl-pb-content[hidden], .rl-pb .empty[hidden], .rl-pb .notice[hidden] { display: none; }
.rl-pb-off { margin: 0; }
.rl-pb-off > .btn { min-height: var(--size-touch-min); }

/* ---------- Заголовки блоков и кнопки ---------- */
.rl-pb-plan, .rl-pb-queue { display: grid; gap: var(--space-4); min-width: 0; align-content: start; }
.rl-pb-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); min-width: 0; }
.rl-pb-h { margin: 0; min-width: 0; }
.rl-pb-acts { display: flex; flex-wrap: wrap; gap: var(--space-2); min-width: 0; }
.rl-pb .btn { min-height: var(--size-touch-min); }
.rl-pb .btn[disabled] { cursor: not-allowed; }
.rl-pb-meta, .rl-pb-note, .rl-pb-empty {
  margin: 0; color: var(--color-ink2); overflow-wrap: anywhere;
  font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans);
}
.rl-pb-meta:empty, .rl-pb-note[hidden] { display: none; }
.rl-pb-note { color: var(--color-warn-soft-text); background: var(--color-warn-soft); padding: var(--space-3); border-radius: var(--inner-radius); }
.rl-pb-body { display: grid; gap: var(--space-4); min-width: 0; }

/* ---------- Результат действия ---------- */
.rl-pb-results { display: grid; gap: var(--space-2); min-width: 0; }
.rl-pb-result {
  margin: 0; padding: var(--space-3) var(--space-4); border-radius: var(--inner-radius); overflow-wrap: anywhere;
  font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rl-pb-result[hidden] { display: none; }
.rl-pb-result[data-tone="ok"] { background: var(--color-ok-soft); color: var(--color-ok-soft-text); }
.rl-pb-result[data-tone="danger"] { background: var(--color-danger-soft); color: var(--color-danger-soft-text); }

/* ---------- Фильтр очереди ---------- */
.rl-pb-filter {
  display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--size-touch-min); cursor: pointer; color: var(--color-ink);
  font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rl-pb-check { width: var(--space-5); height: var(--space-5); margin: 0; accent-color: var(--color-acc); flex: none; }

/* ---------- Дни плана ---------- */
.rl-pb-day, .rl-pb-unplaced { display: grid; gap: var(--space-2); min-width: 0; }
.rl-pb-day__h { margin: 0; color: var(--color-ink); font: var(--text-ui-strong-weight) var(--text-ui-strong-size)/var(--text-ui-strong-line) var(--font-sans); }
.rl-pb-unplaced__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.rl-pb-unplaced__li {
  display: grid; gap: var(--space-1); min-width: 0; padding: var(--space-3); background: var(--surface-inner); border-radius: var(--inner-radius);
  font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rl-pb-unplaced__n { color: var(--color-ink); overflow-wrap: anywhere; }
.rl-pb-unplaced__r { color: var(--color-ink2); overflow-wrap: anywhere; }

/* ---------- Таблицы ---------- */
.rl-pb-table {
  width: 100%; min-width: 0; border-collapse: collapse; background: var(--surface-inner); border-radius: var(--inner-radius);
  font: var(--text-ui-weight) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rl-pb-th, .rl-pb-td { padding: var(--space-2) var(--space-3); text-align: start; vertical-align: top; border-bottom: 1px solid var(--color-line); overflow-wrap: anywhere; }
.rl-pb-th { color: var(--color-ink2); font-weight: var(--weight-regular); font-size: var(--text-caption-size); }
.rl-pb-td { color: var(--color-ink); }
.rl-pb-table tbody tr:last-child > .rl-pb-td { border-bottom: 0; }
.rl-pb-td > .ui-chip { margin-inline-start: var(--space-2); }
.rl-pb-table--queue .rl-pb-td > .ui-chip { margin-inline-start: 0; }
.rl-pb-time { font-variant-numeric: tabular-nums; }
.rl-pb-slot { font-variant-numeric: tabular-nums; color: var(--color-ink2); font-size: var(--text-caption-size); }
.rl-pb-err { display: block; margin-top: var(--space-1); color: var(--color-danger-soft-text); background: var(--color-danger-soft); padding: var(--space-1) var(--space-2); border-radius: var(--inner-radius); }
.rl-pb-link {
  display: inline-flex; align-items: center; min-height: var(--size-touch-min); margin-inline-start: var(--space-2);
  color: var(--color-acc-text); text-decoration: underline; text-underline-offset: 0.2em;
}
.rl-pb-table--queue .rl-pb-link { margin-inline-start: 0; display: flex; }

.rl-pb-ig, .rl-pb-report { min-width: 0; }

/* ---------- Узкий экран: строки становятся карточками ---------- */
@media (max-width: 40rem) {
  .rl-pb-table, .rl-pb-table tbody, .rl-pb-tr, .rl-pb-td { display: block; }
  .rl-pb-table { background: transparent; }
  .rl-pb-thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .rl-pb-tr { margin-bottom: var(--space-3); background: var(--surface-inner); border-radius: var(--inner-radius); padding: var(--space-2) 0; }
  .rl-pb-table tbody tr:last-child { margin-bottom: 0; }
  .rl-pb-td { display: grid; grid-template-columns: 6rem minmax(0, 1fr); align-items: center; gap: var(--space-2); border-bottom: 0; }
  .rl-pb-td:empty { display: none; }
  .rl-pb-td::before { content: attr(data-label); color: var(--color-ink2); font-size: var(--text-caption-size); }
  .rl-pb-td > .ui-chip, .rl-pb-td > .rl-pb-err, .rl-pb-td > .rl-pb-link { grid-column: 2; margin-inline-start: 0; justify-self: start; }
  .rl-pb-td > .btn { grid-column: 2; justify-self: stretch; }
  .rl-pb-acts { width: 100%; }
  .rl-pb-acts .btn { flex: 1 1 10rem; justify-content: center; }
  .rl-pb-off > .btn { width: 100%; justify-content: center; }
}
