/* © 2026 VEYRO (ИП Макаров И. В.). appagent — проприетарная программа. Использование — по лицензионному договору https://appagent.ru/legal/offer/. Копирование и распространение без разрешения запрещены. */
/* Подэкран «Идеи» роликов (rli-*, modules-reels-ideas.js): карточки идей на графитовой теме с мягким свечением вместо рамок, «Берём» и «Отложить»
   кнопками-переключателями или свайпом (вправо — взять, влево — отложить), поле корректировки и «Отправить корректировку».
   Значения — только из tokens.css, размеры в rem, отступы по сетке --space-*. Ширина карточек не больше 47.5rem, на 390px без горизонтальной
   прокрутки, касания не меньше --size-touch-min. Движение — только transform и opacity, при prefers-reduced-motion отключено. */

.rli { min-width: 0; }
.rli-body { display: grid; gap: var(--space-4); align-content: start; width: 100%; max-width: 47.5rem; min-width: 0; box-sizing: border-box; }
.rli-body > * { min-width: 0; }
.rli-body [hidden] { display: none; }
.rli-content { display: grid; gap: var(--space-4); align-content: start; }

/* ---------- Над списком ---------- */
.rli-bar { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.rli-btn { min-height: var(--size-touch-min); max-width: 100%; white-space: normal; text-align: center; }
.rli-btn .ic { width: 1.125rem; height: 1.125rem; }
.rli-btn:disabled { opacity: .6; cursor: not-allowed; }
@media (max-width: 47.9375rem) { .rli-bar .rli-btn { flex: 1 1 100%; } }

.rli-status, .rli-lead, .rli-tally { 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); }
.rli-status[data-tone="ok"] { color: var(--color-ok-text); }
.rli-status[data-tone="danger"], .rli-err { color: var(--color-danger-text); }
.rli-err { margin: 0; overflow-wrap: anywhere; font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-tally { font-variant-numeric: tabular-nums; }

/* ---------- Своя идея ---------- */
.rli-add { display: grid; gap: var(--space-2); padding: var(--space-4); border-radius: var(--radius-card); background: var(--color-panel); box-shadow: var(--shadow-md); box-sizing: border-box; }
.rli-lbl { color: var(--color-ink); font: var(--weight-medium) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-in {
  width: 100%; min-height: var(--size-touch-min); padding: var(--space-2) var(--space-3); box-sizing: border-box; border: 0; border-radius: var(--radius-ctl);
  background: var(--color-panel2); color: var(--color-ink); box-shadow: var(--shadow-ring); font: var(--weight-regular) var(--text-ui-size)/var(--text-ui-line) var(--font-sans);
}
.rli-area { resize: vertical; min-height: 6rem; }
.rli-in:focus-visible { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.rli-in[aria-invalid="true"] { box-shadow: 0 0 0 1px var(--color-danger-text); }
.rli-add__act { display: flex; flex-wrap: wrap; gap: var(--space-2); padding-top: var(--space-2); }

/* ---------- Карточки ---------- */
.rli-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.rli-card {
  position: relative; display: grid; min-width: 0; border-radius: var(--radius-card); background: var(--color-panel2);
  box-shadow: var(--shadow-ring); overflow: hidden; box-sizing: border-box;
  transition: box-shadow var(--duration-base) var(--ease-out), opacity var(--duration-base) var(--ease-out);
}
.rli-card[data-mark="take"] { box-shadow: 0 0 0 1px var(--color-acc), 0 0 1.25rem var(--color-acc-glow); }
.rli-card[data-mark="defer"] { opacity: .72; }
.rli-card__hint {
  position: absolute; top: 0; bottom: 0; display: flex; align-items: center; padding-inline: var(--space-5); opacity: 0;
  color: var(--color-ink); font: var(--weight-medium) var(--text-ui-size)/1 var(--font-sans); transition: opacity var(--duration-fast) var(--ease-out);
}
.rli-card__hint--take { left: 0; color: var(--color-acc-text); }
.rli-card__hint--defer { right: 0; color: var(--color-ink2); }
.rli-card[data-swipe="take"] .rli-card__hint--take, .rli-card[data-swipe="defer"] .rli-card__hint--defer { opacity: 1; }
.rli-card__face {
  position: relative; display: grid; gap: var(--space-2); align-content: start; min-width: 0; padding: var(--space-4) var(--space-4) var(--space-2);
  background: var(--color-panel); touch-action: pan-y; user-select: none; -webkit-user-select: none;
  transform: translateX(var(--rli-dx, 0px)); transition: transform var(--duration-base) var(--ease-out);
}
.rli-card[data-swipe] .rli-card__face { transition: none; }
.rli-card__face > * { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.rli-card__t { color: var(--color-ink); font: var(--text-h3-weight) var(--text-h3-size)/var(--text-h3-line) var(--font-head); letter-spacing: var(--text-h3-track); }
.rli-card__topic, .rli-why { color: var(--color-ink2); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-why__l { color: var(--color-ink); font-weight: var(--weight-medium); }
.rli-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.rli-chips .ui-chip { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.rli-dirty { color: var(--color-warn-text); font: var(--weight-medium) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-hooks { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); gap: var(--space-1) var(--space-3); margin: 0; font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-hooks dt { color: var(--color-ink2); }
.rli-hooks dd { margin: 0; color: var(--color-ink); overflow-wrap: anywhere; }
@media (max-width: 29.9375rem) { .rli-hooks { grid-template-columns: minmax(0, 1fr); } }
.rli-hold { display: grid; gap: var(--space-2); justify-items: start; padding: var(--space-3); border-radius: var(--radius-ctl); background: var(--color-panel2); }
.rli-hold__t, p.rli-hold { margin: 0; color: var(--color-warn-text); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-note { color: var(--color-warn-text); font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }

/* Кнопки отбора: две крупные цели, на телефоне — на всю ширину карточки. */
.rli-card__act { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); padding: var(--space-2) var(--space-4) var(--space-4); background: var(--color-panel); }
.rli-mark {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--size-touch-min); min-width: 0; padding-inline: var(--space-3);
  border: 0; border-radius: var(--radius-ctl); background: var(--color-panel2); color: var(--color-ink2); cursor: pointer; box-shadow: var(--shadow-ring);
  font: var(--weight-medium) var(--text-ui-size)/1 var(--font-sans);
  transition: background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out);
}
.rli-mark .ic { flex: none; width: 1.125rem; height: 1.125rem; }
.rli-mark:hover:not(:disabled) { color: var(--color-ink); background: var(--color-panel); }
.rli-mark:focus-visible { outline: var(--size-focus-width) solid var(--color-focus); outline-offset: var(--size-focus-offset); }
.rli-mark:disabled { opacity: .5; cursor: not-allowed; }
.rli-mark--take[aria-pressed="true"] { background: var(--color-acc); color: var(--color-on-acc); box-shadow: 0 0 1rem var(--color-acc-glow); }
.rli-mark--defer[aria-pressed="true"] { background: var(--color-dark); color: var(--color-on-dark); box-shadow: var(--shadow-sm); }

/* ---------- Корректировка ---------- */
.rli-fb { display: grid; gap: var(--space-3); padding: var(--space-5); border-radius: var(--radius-card); background: var(--color-panel); box-shadow: var(--shadow-md); box-sizing: border-box; }
@media (max-width: 47.9375rem) { .rli-fb { padding: var(--space-4); } }
.rli-fb > * { min-width: 0; margin: 0; }
.rli-fb__h { color: var(--color-ink); font: var(--text-h3-weight) var(--text-h3-size)/var(--text-h3-line) var(--font-head); letter-spacing: var(--text-h3-track); }
.rli-hint { color: var(--color-ink2); overflow-wrap: anywhere; font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-send { justify-self: start; }
@media (max-width: 47.9375rem) { .rli-send { justify-self: stretch; } }
.rli-corr { display: grid; gap: var(--space-2); padding-top: var(--space-3); }
.rli-corr__h { margin: 0; color: var(--color-ink2); font: var(--weight-medium) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }
.rli-corr__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); }
.rli-corr__li { padding: var(--space-2) var(--space-3); border-radius: var(--radius-ctl); background: var(--color-panel2); color: var(--color-ink2); overflow-wrap: anywhere; font: var(--text-caption-weight) var(--text-caption-size)/var(--text-caption-line) var(--font-sans); }

@media (prefers-reduced-motion: reduce) {
  .rli-card, .rli-card__hint, .rli-card__face, .rli-mark { transition: none; }
}