/* =====================================================================
   LOGBOOK REVIEW -- AI Scan candidates inside the flight log (2026-10-07)
   js/logbook-review-panel.js + js/image-viewer.js. Tokens only (app.html
   :root / comfort.tokens.css); dark mode comes from the token remap.
   ===================================================================== */

/* ---- Pending projection row in the flight log ---------------------- */
.row.lbr-pending-row{
  cursor:pointer;
  border:1px dashed var(--amber,#C5772E);
  border-radius:var(--radius,12px);
  background:var(--amber-bg,#FDEFD7);
  margin:6px 0;
  padding:12px 14px;
}
.row.lbr-pending-row:last-child{border-bottom:1px dashed var(--amber,#C5772E)}
.row.lbr-pending-row:hover,.row.lbr-pending-row:focus-visible{
  outline:2px solid var(--amber,#C5772E);outline-offset:1px;
}
.row.lbr-pending-row .row-title{color:var(--ink-1)}
.row.lbr-pending-row .row-meta{color:var(--ink-2)}
.lbr-pending-label{
  font-family:var(--mono,ui-monospace,monospace);
  font-size:11px;font-weight:700;letter-spacing:.08em;
  color:var(--amber,#C5772E);
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  margin-bottom:3px;
}
.lbr-warn-glyph{color:var(--amber,#C5772E);font-size:13px;line-height:1}
.lbr-chip{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:.06em;
  padding:2px 6px;border-radius:999px;line-height:1.3;
}
.lbr-chip-dup{background:var(--red,#B4262A);color:#fff}
.lbr-review-cta{font-size:13px;font-weight:600;color:var(--amber,#C5772E);white-space:nowrap}

/* ---- Panel shell ---------------------------------------------------- */
body.lbr-panel-open{overflow:hidden}
.lbr-panel{
  position:fixed;inset:0;z-index:9000;
  background:var(--bg,#F6F7F9);
  color:var(--ink-1);
  display:flex;flex-direction:column;
  font-family:var(--sans,system-ui,sans-serif);
  overflow:hidden;
  overscroll-behavior:contain;
}
.lbr-panel:focus{outline:none}
.lbr-head{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;
  border-bottom:1px solid var(--card-line,#EEF0F4);
  background:var(--surface,#fff);
  flex:0 0 auto;
}
.lbr-close{
  width:36px;height:36px;border-radius:999px;border:1px solid var(--card-line,#EEF0F4);
  background:var(--surface,#fff);color:var(--ink-2);font-size:15px;cursor:pointer;flex:0 0 auto;
}
.lbr-head-main{flex:1;min-width:0}
.lbr-title{font-size:16px;font-weight:600;color:var(--ink-1);line-height:1.2}
.lbr-sub{font-family:var(--mono,ui-monospace,monospace);font-size:12px;color:var(--ink-3);margin-top:2px}
.lbr-nav{display:flex;gap:6px;flex:0 0 auto}

.lbr-body{
  flex:1 1 auto;min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(320px,1fr);
  gap:0;
}
.lbr-state{
  padding:32px 16px;text-align:center;color:var(--ink-2);font-size:14px;
}
.lbr-state-actions{display:flex;gap:8px;justify-content:center;margin-top:14px}

/* ---- Image column --------------------------------------------------- */
.lbr-image{
  display:flex;flex-direction:column;min-height:0;
  background:#1b1f26;color:#fff;
  border-right:1px solid var(--card-line,#EEF0F4);
}
.lbr-image-toolbar{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:8px 12px;flex:0 0 auto;
  background:rgba(255,255,255,.06);
}
.lbr-image-toolbar .btn{color:#fff;background:rgba(255,255,255,.12);border-color:transparent}
.lbr-image-toolbar .btn.is-active{background:rgba(255,255,255,.3)}
.lbr-zoom-group{display:inline-flex;gap:4px;margin-left:auto}
.lbr-stage-wrap{flex:1 1 auto;min-height:0;position:relative}
.lbr-stage,.biv-stage{
  position:absolute;inset:0;overflow:hidden;touch-action:none;cursor:grab;
  background:#1b1f26;
}
.biv-stage.is-dragging{cursor:grabbing}
.biv-frame{
  position:absolute;left:0;top:0;transform-origin:0 0;
  opacity:0;transition:opacity .18s ease;
  background:#fff;
}
.biv-img{
  position:absolute;left:0;top:0;transform-origin:0 0;
  user-select:none;-webkit-user-drag:none;max-width:none;display:block;
}
.biv-stage.is-ready .biv-frame{opacity:1}
.lbr-image-note{
  position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);
  text-align:center;font-size:13px;color:rgba(255,255,255,.8);pointer-events:none;
}
.lbr-image-note a{pointer-events:auto;color:#fff;text-decoration:underline}
.lbr-image[data-image-state="ready"] .lbr-image-note{display:none}
.lbr-caption{
  flex:0 0 auto;padding:8px 12px;
  font-family:var(--mono,ui-monospace,monospace);font-size:11px;color:rgba(255,255,255,.7);
}

/* ---- Detail column -------------------------------------------------- */
.lbr-detail{
  min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;
  padding:16px;background:var(--surface,#fff);
}
.lbr-h{font-size:13px;font-weight:600;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em;margin:16px 0 8px}
.lbr-fields{margin:0;display:grid;gap:8px}
.lbr-field{display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;align-items:baseline}
.lbr-field dt{font-size:13px;color:var(--ink-3)}
.lbr-field dd{margin:0;font-size:15px;color:var(--ink-1);font-variant-numeric:tabular-nums;min-width:0}
.lbr-hobbs{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.lbr-arrow{color:var(--ink-3)}
.lbr-val{display:inline-block;padding:2px 6px;border-radius:6px}
.lbr-val-high{background:transparent}
.lbr-val-medium{background:var(--amber-bg,#FDEFD7);box-shadow:inset 0 0 0 1px var(--amber,#C5772E)}
.lbr-val-low,.lbr-val-unresolved{color:var(--ink-3);font-style:italic;background:transparent;box-shadow:inset 0 0 0 1px var(--card-line,#EEF0F4)}
.lbr-val-edited{background:var(--accent-tint,#E6F1FB)}
.lbr-raw{font-style:normal;color:var(--ink-3);font-size:12px}
.lbr-input{
  width:100%;max-width:260px;height:40px;padding:0 10px;
  border:1px solid var(--card-line,#EEF0F4);border-radius:8px;
  background:var(--bg,#F6F7F9);color:var(--ink-1);font:inherit;font-size:15px;
}
.lbr-hobbs .lbr-input{max-width:120px}
.lbr-legend{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.lbr-tier{font-size:11px;color:var(--ink-3);padding:2px 8px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--card-line,#EEF0F4)}
.lbr-tier-medium{background:var(--amber-bg,#FDEFD7);box-shadow:inset 0 0 0 1px var(--amber,#C5772E)}
.lbr-tier-low{font-style:italic}

.lbr-findings{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.lbr-finding{display:flex;gap:8px;align-items:flex-start;font-size:14px;line-height:1.4;color:var(--ink-1)}
.lbr-finding-glyph{flex:0 0 18px;text-align:center;font-weight:700}
.lbr-finding-ok .lbr-finding-glyph{color:var(--pos-text,#1B7F5C)}
.lbr-finding-warn .lbr-finding-glyph{color:var(--amber,#C5772E)}
.lbr-finding-none{color:var(--ink-3)}

.lbr-neighbours{
  margin-top:14px;padding:10px 12px;border-radius:10px;
  background:var(--bg,#F6F7F9);font-family:var(--mono,ui-monospace,monospace);font-size:12px;color:var(--ink-2);
  display:grid;gap:4px;
}

.lbr-status{margin-top:14px;padding:10px 12px;border-radius:10px;font-size:14px;background:var(--bg,#F6F7F9);color:var(--ink-2)}
.lbr-status-stale{background:var(--amber-bg,#FDEFD7);color:var(--ink-1);border-left:3px solid var(--amber,#C5772E)}
.lbr-status-error{background:var(--red-bg,#F8E9E7);color:var(--ink-1);border-left:3px solid var(--red,#B4262A)}
.lbr-status-ok{color:var(--pos-text,#1B7F5C)}
.lbr-link{background:none;border:none;padding:0;color:var(--accent,#2D6FE8);text-decoration:underline;cursor:pointer;font:inherit}

.lbr-actions{
  position:sticky;bottom:0;margin-top:18px;padding:12px 0 0;
  display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;
  background:var(--surface,#fff);border-top:1px solid var(--card-line,#EEF0F4);
}
.lbr-actions .btn{min-height:40px}
.lbr-actions .lbr-approve{margin-left:auto}
.lbr-danger{color:var(--red,#B4262A);border-color:var(--red,#B4262A)}
.lbr-stacked-only{display:none}

/* ---- Narrow screens: stacked (crop, tap for full; proposed; checks; actions) */
@media (max-width:899px){
  .lbr-body{display:flex;flex-direction:column;overflow:auto;-webkit-overflow-scrolling:touch}
  .lbr-head{padding:10px 16px}
  .lbr-nav .btn{padding:6px 10px}
  .lbr-image{flex:0 0 auto;border-right:none;border-bottom:1px solid var(--card-line,#EEF0F4)}
  .lbr-stage-wrap{height:38vh;min-height:220px}
  .lbr-image-toolbar{display:none}
  .lbr-stacked-only{display:inline}
  .lbr-detail{overflow:visible;padding:16px 16px 24px}
  .lbr-field{grid-template-columns:88px minmax(0,1fr)}
  .lbr-actions{position:sticky;bottom:0;padding-bottom:max(8px,env(safe-area-inset-bottom))}
  .lbr-actions .btn{flex:1 1 auto}
  .lbr-panel.is-image-full .lbr-body{overflow:hidden}
  .lbr-panel.is-image-full .lbr-image{flex:1 1 auto;min-height:0;display:flex}
  .lbr-panel.is-image-full .lbr-image-toolbar{display:flex}
  .lbr-panel.is-image-full .lbr-stage-wrap{height:auto;flex:1 1 auto}
  .lbr-panel.is-image-full .lbr-detail{display:none}
  .lbr-panel.is-image-full .lbr-tap-hint{display:none}
  .lbr-panel.is-image-full [data-lbr-stacked]{display:inline-block;margin-left:auto}
}