/* Live UAT chrome — AppyDave-token-aware, with fallbacks so it works standalone.
   All UI is scoped under .uat-root so it never collides with a Mochaccino. */

:root {
  --uat-ink: var(--text-primary, #342d2d);
  --uat-surface: var(--surface-1, #faf5ec);
  --uat-line: var(--border, #e2d8c8);
  --uat-amber: var(--accent, #c8841a);
  --uat-blue: var(--link, #2E91FC);
  --uat-yellow: var(--cta, #ffde59);
  --uat-red: var(--status-critical, #c0473a);
  --uat-green: var(--status-good, #4a8a4a);
  --uat-shadow: 0 6px 24px rgba(40, 30, 20, .22);
}

.uat-root { font-family: Roboto, system-ui, sans-serif; box-sizing: border-box; }
.uat-root button { font-family: inherit; cursor: pointer; }

/* ---- control bar (bottom-right) ---- */
.uat-bar {
  position: fixed; right: 16px; bottom: 16px; z-index: 2147483000;
  display: flex; gap: 6px; align-items: center;
  background: var(--uat-surface); border: 1px solid var(--uat-line);
  border-radius: 999px; padding: 6px; box-shadow: var(--uat-shadow);
}
.uat-bar button {
  border: 1px solid var(--uat-line); background: #fff; color: var(--uat-ink);
  border-radius: 999px; padding: 7px 12px; font-size: 12.5px; font-weight: 600;
}
.uat-toggle.on { background: var(--uat-amber); color: #fff; border-color: var(--uat-amber); }
.uat-batch-btn.on { background: var(--uat-blue); color: #fff; border-color: var(--uat-blue); }

/* ---- flaggable affordance (only in review mode) ---- */
.uat-review .card, .uat-review .callout, .uat-review .hub-card, .uat-review .stat-tile,
.uat-review blockquote, .uat-review table tr, .uat-review li, .uat-review h1, .uat-review h2,
.uat-review h3, .uat-review h4, .uat-review p, .uat-review .diagram-wrap { cursor: crosshair; }
.uat-review .card:hover, .uat-review .callout:hover, .uat-review .hub-card:hover,
.uat-review .stat-tile:hover, .uat-review blockquote:hover, .uat-review li:hover,
.uat-review h1:hover, .uat-review h2:hover, .uat-review h3:hover, .uat-review h4:hover,
.uat-review p:hover, .uat-review .diagram-wrap:hover, .uat-review table tr:hover {
  outline: 2px dashed var(--uat-amber); outline-offset: 3px; border-radius: 3px;
}
.uat-selected { outline: 2px solid var(--uat-blue) !important; outline-offset: 3px; background: rgba(46,145,252,.07); }

/* ---- batch fab ---- */
.uat-batch-fab {
  position: fixed; left: 50%; bottom: 74px; transform: translateX(-50%); z-index: 2147483000;
  background: var(--uat-blue); color: #fff; border: none; border-radius: 999px;
  padding: 10px 18px; font-weight: 700; font-size: 13px; box-shadow: var(--uat-shadow);
}

/* ---- popover ---- */
.uat-pop {
  position: absolute; z-index: 2147483001; width: 340px; max-width: calc(100vw - 16px);
  background: var(--uat-surface); border: 1px solid var(--uat-line); border-radius: 12px;
  box-shadow: var(--uat-shadow); padding: 12px; color: var(--uat-ink);
}
.uat-pop-snap { font-size: 12px; font-style: italic; color: #6b5f52; margin-bottom: 10px; line-height: 1.35; }
.uat-pop-row { display: flex; gap: 6px; margin-bottom: 8px; }
.uat-chan button { flex: 1; padding: 7px; font-size: 12px; font-weight: 600; border: 1px solid var(--uat-line); background: #fff; color: var(--uat-ink); border-radius: 8px; }
.uat-chan button.on { background: var(--uat-ink); color: #fff; border-color: var(--uat-ink); }
.uat-verd { justify-content: space-between; }
.uat-verd button { flex: 1; font-size: 18px; padding: 6px; border: 1px solid var(--uat-line); background: #fff; border-radius: 8px; }
.uat-verd button.on { border-color: var(--uat-amber); background: #fff6e8; box-shadow: 0 0 0 2px var(--uat-amber) inset; }
.uat-note { width: 100%; min-height: 64px; border: 1px solid var(--uat-line); border-radius: 8px; padding: 8px; font-size: 13px; resize: vertical; color: var(--uat-ink); background: #fff; }
.uat-pop-actions { display: flex; gap: 6px; justify-content: flex-end; margin-top: 8px; }
.uat-cancel { background: transparent; border: 1px solid var(--uat-line); color: var(--uat-ink); border-radius: 8px; padding: 7px 12px; font-size: 12.5px; }
.uat-save { background: var(--uat-yellow); border: 1px solid var(--uat-amber); color: #342d2d; border-radius: 8px; padding: 7px 14px; font-size: 12.5px; font-weight: 700; }
.uat-save:disabled { opacity: .45; cursor: not-allowed; }

/* ---- inbox (right drawer) ---- */
.uat-inbox {
  position: fixed; top: 0; right: 0; height: 100vh; width: 380px; max-width: 92vw; z-index: 2147483002;
  background: var(--uat-surface); border-left: 1px solid var(--uat-line); box-shadow: var(--uat-shadow);
  display: flex; flex-direction: column; color: var(--uat-ink);
}
.uat-inbox-head { padding: 14px 16px; border-bottom: 1px solid var(--uat-line); font-size: 14px; display: flex; align-items: center; gap: 8px; }
.uat-x { margin-left: auto; background: transparent; border: none; font-size: 16px; color: var(--uat-ink); }
.uat-inbox-list { flex: 1; overflow: auto; padding: 10px 12px; }
.uat-empty { color: #6b5f52; font-size: 13px; }
.uat-item { border: 1px solid var(--uat-line); border-left: 4px solid var(--uat-line); border-radius: 8px; padding: 9px 10px; margin-bottom: 8px; background: #fff; }
.uat-item.uat-down { border-left-color: var(--uat-red); }
.uat-item.uat-question { border-left-color: var(--uat-blue); }
.uat-item.uat-up { border-left-color: var(--uat-green); }
.uat-item.uat-idea { border-left-color: var(--uat-amber); }
.uat-item.resolved { opacity: .5; }
.uat-item-top { display: flex; align-items: center; gap: 7px; font-size: 11px; margin-bottom: 5px; }
.uat-chip { font-weight: 700; padding: 1px 6px; border-radius: 4px; font-size: 10px; letter-spacing: .3px; }
.uat-chip-content { background: #efe6d6; color: #6b4a12; }
.uat-chip-presentation { background: #e4eefb; color: #1c4f8a; }
.uat-screen { margin-left: auto; color: #6b5f52; font-family: 'Roboto Mono', monospace; font-size: 10px; }
.uat-snap { font-size: 12px; font-style: italic; color: #40372e; line-height: 1.35; }
.uat-note-view { font-size: 12.5px; margin-top: 5px; color: var(--uat-ink); }
.uat-item-actions { display: flex; gap: 8px; margin-top: 7px; }
.uat-item-actions button { background: transparent; border: none; color: var(--uat-blue); font-size: 11.5px; padding: 0; }
.uat-inbox-foot { border-top: 1px solid var(--uat-line); padding: 10px 12px; display: flex; gap: 6px; flex-wrap: wrap; }
.uat-inbox-foot button { flex: 1; min-width: 96px; border: 1px solid var(--uat-line); background: #fff; color: var(--uat-ink); border-radius: 8px; padding: 8px; font-size: 12px; font-weight: 600; }
.uat-save-repo { background: var(--uat-yellow) !important; border-color: var(--uat-amber) !important; }

/* ---- toast ---- */
.uat-toast {
  position: fixed; left: 50%; bottom: 74px; transform: translateX(-50%); z-index: 2147483003;
  background: var(--uat-ink); color: #fff; padding: 10px 16px; border-radius: 8px;
  font-size: 12.5px; box-shadow: var(--uat-shadow); max-width: 90vw; text-align: center;
}

@media print { .uat-root { display: none !important; } }