/* MV_ResolutionUI — owner contributor-review surface (#184).
   The review itself now runs on the shared guided review flow (#390) — person
   cards, item rows, Keep/Skip controls and the guided mode live in
   css/review-flow.css. This file keeps the resolution-only chrome: the level-1
   contributor list, the pending-photo strip mounted in a person card's head,
   the post-apply "merged · revert" pill, and the contributor-side "editing
   paused" banner. Launched from the toolbar Share menu (#320); the "something
   to review" count badge lives on the Share button itself (css/layout.css).
   Palette + spacing come from variables.css — no literal colours here. */

/* ---- Level 1: contributor list ---- */
.review-list__intro {
  margin: 0 0 var(--space-md);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-normal);
}

.review-list__row {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
}
.review-list__row:last-child {
  border-bottom: none;
}

.review-list__info {
  flex: 1 1 auto;
  min-width: 0;
}
.review-list__name {
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}
.review-list__status {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}
.review-list__status--none {
  color: var(--color-text-faint);
}
.review-list__status--error {
  color: var(--color-error);
}
/* Inline "Try again" after a failed contributor check (#394) — a quiet link,
   not a second button competing with Review. */
.review-list__retry {
  border: none;
  background: none;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  color: var(--color-error);
  text-decoration: underline;
  cursor: pointer;
}
.review-list__retry:hover {
  color: var(--color-text);
}
.review-list__retry:focus-visible {
  outline: 2px solid var(--color-error);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}
.review-list__open {
  flex: 0 0 auto;
}

/* Contributor's pending photos for everything under a person card (#211) — a
   small thumbnail strip in the card's control slot so the owner sees what
   they're approving. */
.review-photos {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}
.review-photos__thumb {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-border);
  background: var(--color-surface-alt);
}

/* ---- Post-apply "merged · revert" pill ----
   Non-blocking confirmation shown after Apply: the review closes so the merged
   tree is visible, and this floats top-centre (above the canvas, below panels)
   with a brief one-tap Revert. Auto-dismisses; the Drive backup is the longer
   safety net. Accent-tinted (a success), distinct from the brass paused banner. */
.merge-undo {
  position: absolute;
  top: var(--space-sm);
  left: 50%;
  transform: translateX(-50%);
  z-index: 6;
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  max-width: min(560px, calc(100% - 2 * var(--space-md)));
  padding: var(--space-xxs) var(--space-xs) var(--space-xxs) var(--space-md);
  background: var(--color-accent-soft);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-accent);
  border-radius: var(--radius-pill);
  box-shadow: var(--shadow-md);
}
.merge-undo__text {
  font-size: var(--font-size-sm);
  color: var(--color-text);
}
.merge-undo__revert {
  flex: 0 0 auto;
  padding: var(--space-xxs) var(--space-sm);
  font-size: var(--font-size-sm);
}
.merge-undo__dismiss {
  flex: 0 0 auto;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--color-text-muted);
  font-size: var(--font-size-md);
  line-height: 1;
  padding: 0 var(--space-xxs);
  border-radius: var(--radius-sm);
}
.merge-undo__dismiss:hover {
  color: var(--color-text);
}
.merge-undo__dismiss:focus-visible,
.merge-undo__revert:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ---- Contributor-side paused banner ----
   Floats above the (absolutely-positioned) tree canvas, top-centre below the
   toolbar — sits over the tree but below slide-in panels. */
.review-paused {
  position: absolute;
  top: var(--space-sm);
  left: 50%;
  transform: translateX(-50%);
  z-index: 6;
  width: min(560px, calc(100% - 2 * var(--space-md)));
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  padding: var(--space-sm) var(--space-md);
  background: var(--color-highlight-soft);
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-highlight);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-md);
}
.review-paused__icon {
  flex: 0 0 auto;
  font-size: var(--font-size-lg);
  line-height: 1.2;
}
.review-paused__headline {
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
}
.review-paused__sub {
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
  line-height: var(--line-height-normal);
}

/* ---- Touch / small viewports (MOBILE/TOUCH PARITY RULE) ---- */
@media (max-width: 640px) {
  .review-list__row {
    flex-wrap: wrap;
  }
}

@media (hover: none) and (pointer: coarse) {
  .merge-undo__revert {
    min-height: var(--touch-target-min);
  }
  .merge-undo__dismiss {
    min-width: var(--touch-target-min);
    min-height: var(--touch-target-min);
  }
  /* Inline link — grow the hit area without moving the text (#394). */
  .review-list__retry {
    padding: var(--space-sm);
    margin: calc(-1 * var(--space-sm));
  }
}
