/* rename-notice.css — окно «Артикулы изменились» (смена артикула, пункт Н-01-260910).
   Владелец разметки — src/assets/rename-notice.js. Здесь только вид.

   ТОЛЬКО ТОКЕНЫ theme.css: ни одного жёсткого цвета, ни одного жёсткого шрифта.
   Обе темы приходят сами — токены переопределяются в theme.css.

   🔴 ЛИПКОСТЬ — ТОЛЬКО НА ЛИСТЬЯХ (failure-taxonomy Cat 1.2). Прилипает шапка
   таблицы через `th`, а НЕ через `thead`, и панель выбора — отдельным блоком.
   Вложенной липкости (липкий контейнер с липкими детьми) здесь нет ни одной.

   🔴 ЦЕПОЧКА FLEX (Cat 1.1). Карточку окна раскладывает MA_Modal.place():
   она ставит карточке display:flex + flex-direction:column, а телу — flex:1 +
   min-height:0 + overflow-y:auto. Поэтому здесь высоты тела НЕ задаём: второй
   владелец раскладки — это и есть тот дефект, ради которого MA_Modal заведён. */

/* ── Подложка и карточка ─────────────────────────────────────────────────── */
.mrn-backdrop {
  /* fixed/inset/затемнение ставит MA_Modal.backdrop(); здесь — только слой темы. */
  background: var(--scrim);
}

.mrn-card {
  width: min(1180px, 96vw);
  font-family: var(--font, system-ui, sans-serif);
  font-size: 13px;
  color: var(--text);
}

/* ── Шапка окна ──────────────────────────────────────────────────────────── */
.mrn-head {
  flex: 0 0 auto;
  display: flex;
  align-items: flex-start;
  gap: var(--space-3, 12px);
  padding: var(--space-4, 16px) var(--space-5, 20px) var(--space-3, 12px);
  border-bottom: 1px solid var(--border);
  cursor: move;                 /* карточку можно оттащить (MA_Modal.makeDraggable) */
}
.mrn-head-text { flex: 1 1 auto; min-width: 0; }
.mrn-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 4px;
}
.mrn-sub {
  font-size: 12px;
  color: var(--text2);
  line-height: 1.45;
  margin: 0;
}
.mrn-close {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 6px);
  background: var(--surface);
  color: var(--text2);
  cursor: pointer;
}
.mrn-close:hover { background: var(--surface2); color: var(--text); }

/* ── Полоса разбора ──────────────────────────────────────────────────────── */
.mrn-progress {
  flex: 0 0 auto;
  padding: var(--space-2, 8px) var(--space-5, 20px);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: var(--space-3, 12px);
  font-size: 12px;
  color: var(--text2);
  background: var(--surface2);
}
.mrn-bar {
  flex: 1 1 auto;
  height: 6px;
  border-radius: var(--radius-pill, 999px);
  background: var(--border);
  overflow: hidden;
}
.mrn-bar-fill {
  height: 100%;
  background: var(--accent);
  border-radius: var(--radius-pill, 999px);
  transition: width .2s ease;
}
.mrn-progress-num { flex: 0 0 auto; color: var(--text); font-weight: 600; }

/* ── Тело ────────────────────────────────────────────────────────────────── */
.mrn-body { padding: 0 var(--space-5, 20px) var(--space-4, 16px); }

/* ── Панель выбранных строк (блок каркаса, НЕ липкий слой) ───────────────── */
.mrn-bulk {
  /* ВНЕ области прокрутки, а не липким слоем внутри неё: липкая панель над липкой
     шапкой таблицы — это ровно та вложенная липкость, из-за которой шапка уезжает
     под панель (Cat 1.2). Здесь панель — обычный блок каркаса окна. */
  flex: 0 0 auto;
  padding: var(--space-2, 8px) var(--space-5, 20px);
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2, 8px);
}
.mrn-bulk[hidden] { display: none; }
.mrn-bulk-count { font-weight: 600; color: var(--text); margin-right: var(--space-2, 8px); }
.mrn-bulk-sep { flex: 1 1 auto; }

.mrn-btn {
  padding: 5px 10px;
  font-family: inherit;
  font-size: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 6px);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
}
.mrn-btn:hover:not(:disabled) { background: var(--surface2); }
.mrn-btn:disabled { opacity: .5; cursor: default; }
.mrn-btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--on-accent);
}
.mrn-btn-primary:hover:not(:disabled) { background: var(--accent-hover); }
.mrn-btn-link {
  border-color: transparent;
  background: transparent;
  color: var(--accent);
  padding: 4px 6px;
}
.mrn-btn-link:hover:not(:disabled) { text-decoration: underline; background: transparent; }

/* ── Группа ──────────────────────────────────────────────────────────────── */
.mrn-group { margin-top: var(--space-4, 16px); }
.mrn-group-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2, 8px);
  flex-wrap: wrap;
  padding-bottom: var(--space-2, 8px);
}
.mrn-group-title { font-size: 13px; font-weight: 600; color: var(--text); }
.mrn-group-count { font-size: 12px; color: var(--text2); }
.mrn-group-note {
  flex: 1 1 100%;
  font-size: 12px;
  color: var(--text2);
  line-height: 1.45;
}
.mrn-group-note strong { color: var(--text); font-weight: 600; }

/* ── Таблица позиций ─────────────────────────────────────────────────────── */
.mrn-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12px;
}
.mrn-table th {
  position: sticky;                /* 🔴 липкость на ЛИСТЕ (th), не на thead */
  top: 0;                          /* панель выбора вне прокрутки — накладки нет */
  z-index: 2;
  background: var(--surface2);
  color: var(--text2);
  font-weight: 600;
  text-align: left;
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.mrn-table td {
  padding: 7px 8px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}
.mrn-table tr:hover td { background: var(--row-highlight); }
.mrn-col-check { width: 30px; }
.mrn-col-money { width: 190px; }
.mrn-col-dims  { width: 240px; }
.mrn-col-state { width: 150px; }

.mrn-name { color: var(--text); font-weight: 500; line-height: 1.35; }
.mrn-art {
  color: var(--text2);
  line-height: 1.35;
  margin-top: 2px;
  word-break: break-all;
}
.mrn-art-old { text-decoration: line-through; }
.mrn-art-new { color: var(--text); }

.mrn-was { color: var(--text2); white-space: nowrap; }
.mrn-hint { color: var(--text2); font-size: 11px; line-height: 1.35; margin-top: 3px; }
.mrn-hint-warn { color: var(--warning); }

/* ── Поля ввода ──────────────────────────────────────────────────────────── */
.mrn-input {
  width: 100%;
  box-sizing: border-box;
  padding: 4px 6px;
  font-family: inherit;
  font-size: 12px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm, 4px);
  background: var(--bg);
  color: var(--text);
}
.mrn-input:focus { outline: 2px solid var(--focus-ring, var(--accent)); outline-offset: 1px; }
.mrn-input-dirty { border-color: var(--edit-pending, var(--accent)); }
.mrn-input-bad   { border-color: var(--edit-error, var(--error)); }
.mrn-dims-row { display: flex; align-items: center; gap: 4px; }
.mrn-dims-row .mrn-input { width: 58px; }
.mrn-dims-x { color: var(--text2); }

/* ── Метки состояния ─────────────────────────────────────────────────────── */
.mrn-chip {
  display: inline-block;
  padding: 2px 7px;
  border-radius: var(--radius-pill, 999px);
  font-size: 11px;
  line-height: 1.5;
  border: 1px solid var(--border);
  background: var(--surface2);
  color: var(--text2);
  white-space: nowrap;
}
.mrn-chip-done { border-color: var(--success); color: var(--success); background: var(--success-bg); }
.mrn-chip-todo { border-color: var(--warning-border, var(--warning)); color: var(--warning); background: var(--warning-bg); }

/* ── Подвал ──────────────────────────────────────────────────────────────── */
.mrn-foot {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: var(--space-3, 12px);
  padding: var(--space-3, 12px) var(--space-5, 20px);
  border-top: 1px solid var(--border);
  background: var(--surface);
  flex-wrap: wrap;
}
.mrn-foot-note { flex: 1 1 auto; font-size: 12px; color: var(--text2); line-height: 1.4; }
.mrn-remember { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text2); }

/* ── Пустое состояние и загрузка ─────────────────────────────────────────── */
.mrn-empty, .mrn-loading {
  padding: var(--space-6, 32px) var(--space-5, 20px);
  text-align: center;
  color: var(--text2);
  font-size: 13px;
}
.mrn-error {
  margin: var(--space-3, 12px) 0;
  padding: var(--space-3, 12px);
  border: 1px solid var(--error);
  border-radius: var(--radius-sm, 6px);
  background: var(--error-bg);
  color: var(--error);
  font-size: 12px;
}