/* ── Document Review (inline in platform) ──────────────────────────── */
.dr-container {
  display:flex; flex-direction:column;
  height:100%; overflow:hidden; background:var(--bg);
}

/* ── Upload panel ────────────────────────────────────────────────────── */
.dr-upload-panel {
  flex:1; display:flex; align-items:center; justify-content:center; padding:24px;
}
.dr-upload-card {
  background:var(--surface); border:1px solid var(--border); border-radius:12px;
  padding:36px 44px; max-width:560px; width:100%; text-align:center;
  box-shadow:var(--shadow);
}
.dr-upload-icon  { font-size:44px; margin-bottom:12px; }
.dr-upload-title { font-size:20px; font-weight:700; margin-bottom:8px; color:var(--text); }
.dr-upload-body  { font-size:13px; color:var(--text-muted); line-height:1.6; margin-bottom:24px; }
.dr-dropzone {
  border:2px dashed var(--border); border-radius:10px;
  padding:24px 16px; cursor:pointer; transition:border-color .15s, background .15s; margin-bottom:16px;
}
.dr-dropzone:hover, .dr-dropzone.dragover { border-color:var(--blue); background:rgba(20,110,180,.04); }
.dr-dropzone-icon { font-size:28px; margin-bottom:6px; }
.dr-dropzone-text { font-size:14px; font-weight:600; margin-bottom:4px; }
.dr-dropzone-sub  { font-size:12px; color:var(--text-muted); margin-bottom:10px; }
.dr-upload-browse-btn {
  display:inline-block; padding:6px 18px; border-radius:6px; cursor:pointer;
  background:var(--blue); color:#fff; font-size:13px; font-weight:600;
  border:none; transition:opacity .15s;
}
.dr-upload-browse-btn:hover { opacity:.88; }
.dr-divider {
  display:flex; align-items:center; gap:10px;
  color:var(--text-muted); font-size:12px; margin:16px 0;
}
.dr-divider::before, .dr-divider::after { content:''; flex:1; height:1px; background:var(--border); }
.dr-path-row { display:flex; gap:8px; }
.dr-path-input {
  flex:1; padding:8px 12px; border-radius:6px; border:1px solid var(--border);
  background:var(--bg); color:var(--text); font-size:13px; outline:none;
  transition:border-color .15s; font-family:var(--font);
}
.dr-path-input:focus { border-color:var(--blue); }
.dr-load-btn {
  padding:8px 16px; border-radius:6px; border:none;
  background:var(--blue); color:#fff; font-size:13px; font-weight:600;
  cursor:pointer; transition:opacity .15s; white-space:nowrap;
}
.dr-load-btn:hover { opacity:.88; }
.dr-upload-error {
  margin-top:12px; padding:10px 14px; border-radius:6px;
  background:rgba(185,28,28,.08); border:1px solid rgba(185,28,28,.2);
  font-size:12px; color:#b91c1c; text-align:left;
}

/* ── Mode picker ─────────────────────────────────────────────────────── */
.dr-mode-panel { flex:1; display:flex; align-items:center; justify-content:center; padding:24px; }
.dr-mode-card {
  background:var(--surface); border:1px solid var(--border); border-radius:12px;
  padding:32px 40px; max-width:620px; width:100%; box-shadow:var(--shadow); text-align:center;
}
.dr-mode-file-row {
  display:flex; align-items:center; gap:8px; justify-content:center;
  margin-bottom:24px; flex-wrap:wrap;
}
.dr-mode-file-icon { font-size:20px; }
.dr-mode-filename  { font-size:14px; font-weight:700; color:var(--text); }
.dr-mode-stats     { font-size:12px; color:var(--text-muted); }
.dr-mode-change-btn {
  margin-left:8px; padding:3px 10px; border-radius:5px; font-size:11px;
  border:1px solid var(--border); background:var(--bg); color:var(--text-muted);
  cursor:pointer; transition:all .15s;
}
.dr-mode-change-btn:hover { border-color:#ef4444; color:#ef4444; }
.dr-mode-title { font-size:18px; font-weight:700; margin-bottom:20px; color:var(--text); }
.dr-mode-choices { display:flex; gap:16px; justify-content:center; }
.dr-mode-btn {
  flex:1; max-width:240px; padding:20px 16px; border-radius:10px;
  border:2px solid var(--border); background:var(--bg); cursor:pointer;
  transition:all .18s; text-align:center;
}
.dr-mode-btn:hover {
  border-color:var(--blue); background:rgba(20,110,180,.04);
  transform:translateY(-2px); box-shadow:0 4px 12px rgba(0,0,0,.08);
}
.dr-mode-btn-icon  { font-size:32px; margin-bottom:8px; }
.dr-mode-btn-label { font-size:15px; font-weight:700; margin-bottom:6px; color:var(--text); }
.dr-mode-btn-desc  { font-size:12px; color:var(--text-muted); line-height:1.5; }

/* ── Workspace ───────────────────────────────────────────────────────── */
.dr-workspace { flex:1; min-height:0; display:flex; flex-direction:column; padding:12px; }
.dr-toolbar {
  display:flex; align-items:center; justify-content:space-between;
  padding:8px 12px; background:var(--surface); border:1px solid var(--border);
  border-radius:8px; margin-bottom:10px; flex-shrink:0; gap:10px;
}
.dr-toolbar-left  { display:flex; align-items:center; gap:8px; min-width:0; }
.dr-toolbar-right { display:flex; gap:8px; flex-shrink:0; }
.dr-doc-filename { font-size:13px; font-weight:700; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dr-doc-badge { padding:2px 8px; border-radius:4px; font-size:10px; font-weight:700; background:rgba(20,110,180,.12); color:var(--blue); flex-shrink:0; }
.dr-doc-stats { font-size:11px; color:var(--text-muted); flex-shrink:0; }
.dr-mode-badge { padding:2px 8px; border-radius:4px; font-size:11px; font-weight:700; flex-shrink:0; }
.dr-mode-badge-summary { background:rgba(22,101,52,.1); color:#166534; }
.dr-mode-badge-review  { background:rgba(20,110,180,.12); color:var(--blue); }
.dr-tool-btn {
  padding:5px 12px; border-radius:6px; border:1px solid var(--border);
  background:var(--surface); color:var(--text); font-size:12px; font-weight:600;
  cursor:pointer; transition:all .15s;
}
.dr-tool-btn:hover { border-color:var(--orange); }
.dr-btn-new-doc { background:var(--surface); border-color:var(--border); color:var(--text); font-weight:600; }
.dr-btn-new-doc:hover { border-color:#ef4444; color:#ef4444; }

.dr-layout { flex:1; min-height:0; display:flex; gap:12px; }

/* ── Doc panel ───────────────────────────────────────────────────────── */
.dr-doc-panel {
  flex:1; min-width:0; min-height:0; display:flex; flex-direction:column;
  background:var(--surface); border:1px solid var(--border); border-radius:8px; overflow:hidden;
}
.dr-panel-hdr {
  padding:9px 14px; border-bottom:1px solid var(--border);
  font-size:13px; font-weight:700; flex-shrink:0;
  display:flex; align-items:center; justify-content:space-between;
}
.dr-doc-text {
  flex:1; overflow-y:auto; padding:20px 24px;
  font-size:13px; line-height:1.8;
  color:var(--text); word-break:break-word; font-family:var(--font);
  white-space: pre-wrap;
}
.dr-doc-para { margin: 0 0 10px; white-space: pre-wrap; }

/* ── Highlights (doc panel marks) ───────────────────────────────────── */
mark.dr-highlight {
  border-radius: 3px; padding: 1px 2px; cursor: pointer;
  transition: opacity .15s, outline .15s; text-decoration: underline dotted 1px;
}
mark.dr-highlight:hover  { opacity: .8; }
mark.dr-hl-focused       { outline: 2px solid #1a56db; outline-offset: 2px; }

mark.dr-hl-critical { background: rgba(185,28,28,.18); color: #7f1d1d; }
mark.dr-hl-high     { background: rgba(194,65,12,.15);  color: #7c2d12; }
mark.dr-hl-moderate { background: rgba(146,64,14,.12);  color: #78350f; }
mark.dr-hl-positive { background: rgba(22,101,52,.12);  color: #14532d; }
mark.dr-hl-gap      { background: rgba(139,92,246,.15); color: #5b21b6; text-decoration: underline dotted 1px rgba(139,92,246,.6); }

/* ── Review panel ────────────────────────────────────────────────────── */
.dr-review-panel {
  width: 420px; flex-shrink:0; min-height:0; display:flex; flex-direction:column;
  background:var(--surface); border:1px solid var(--border); border-radius:8px; overflow:hidden;
}
.dr-review-status-badge { font-size:11px; color:var(--text-muted); font-weight:400; }
.dr-review-msgs {
  flex:1; overflow-y:auto; padding:8px 10px;
  display:flex; flex-direction:column; gap:6px;
}

/* ── Comment cards (right panel, ordered top-to-bottom) ─────────────── */
.dr-comment-card {
  border-left: 3px solid transparent;
  border-radius: 6px;
  padding: 9px 12px;
  font-size: 12px;
  line-height: 1.5;
  flex-shrink: 0;
  transition: box-shadow .15s, transform .1s;
  cursor: default;
}
.dr-comment-card:hover {
  box-shadow: 0 2px 8px rgba(0,0,0,.09);
  transform: translateX(1px);
}
.dr-comment-card-flash {
  outline: 2px solid var(--blue) !important;
  box-shadow: 0 0 0 4px rgba(26,86,219,.12) !important;
}

/* Severity colors */
.dr-hl-critical-card { background: rgba(185,28,28,.06);  border-color: #b91c1c; }
.dr-hl-high-card     { background: rgba(194,65,12,.06);  border-color: #c2410c; }
.dr-hl-moderate-card { background: rgba(146,64,14,.06);  border-color: #92400e; }
.dr-hl-positive-card { background: rgba(22,101,52,.06);  border-color: #166534; }
.dr-hl-gap-card      { background: rgba(139,92,246,.06); border-color: #7c3aed; }

.dr-comment-card-hdr {
  display: flex; align-items: baseline; gap: 6px; margin-bottom: 4px; flex-wrap: wrap;
}
.dr-comment-card-tag {
  font-weight: 700; font-size: 11px; white-space: nowrap; flex-shrink: 0;
}
.dr-comment-card-quote {
  font-style: italic; color: var(--blue); font-size: 11px;
  cursor: pointer; text-decoration: underline dotted;
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 1;
}
.dr-comment-card-quote:hover { opacity: .75; }
.dr-comment-card-body { color: var(--text); font-size: 12px; line-height: 1.5; }

/* ── Chat input ──────────────────────────────────────────────────────── */
.dr-input-area {
  padding:10px 12px 12px; border-top:1px solid var(--border);
  background:var(--surface); flex-shrink:0;
}
.dr-input-row {
  display:flex; gap:8px; background:var(--bg); border:1px solid var(--border);
  border-radius:10px; padding:8px 8px 8px 14px; box-shadow:var(--shadow);
  transition:border-color .15s;
}
.dr-input-row:focus-within { border-color:var(--blue); }
.dr-chat-input {
  flex:1; border:none; outline:none; font-size:13px; font-family:var(--font);
  resize:none; background:none; color:var(--text); line-height:1.5;
  max-height:100px; overflow-y:auto;
}
.dr-send-btn {
  width:34px; height:34px; border-radius:7px; border:none;
  background:var(--blue); color:#fff; font-size:15px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  align-self:flex-end; transition:background .15s; flex-shrink:0;
}
.dr-send-btn:hover:not(:disabled) { background:#0f5a96; }
.dr-send-btn:disabled { background:#ccc; cursor:not-allowed; }
.dr-disclaimer { font-size:10px; color:#aaa; text-align:center; margin-top:6px; }

/* ── Chat message bubbles (follow-up) ───────────────────────────────── */
.dr-msg { display:flex; gap:8px; }
.dr-msg.dr-user { flex-direction:row-reverse; }
.dr-msg-av {
  width:28px; height:28px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:14px;
}
.dr-msg.dr-bot  .dr-msg-av { background:#E8F4FF; }
.dr-msg.dr-user .dr-msg-av { background:#FFF3E0; }
.dr-msg-bub {
  max-width:calc(100% - 38px); padding:10px 14px; border-radius:10px;
  font-size:13px; line-height:1.6; word-break:break-word;
}
.dr-msg.dr-bot  .dr-msg-bub { background:var(--bg); border:1px solid var(--border); border-top-left-radius:3px; }
.dr-msg.dr-user .dr-msg-bub { background:var(--blue); color:#fff; border-top-right-radius:3px; }

/* ── Loading / spinner ───────────────────────────────────────────────── */
.dr-loading {
  display:flex; flex-direction:column; align-items:center;
  justify-content:center; padding:40px 20px; gap:10px;
  color:var(--text-muted); font-size:12px; flex:1;
}
.dr-spin {
  width:26px; height:26px; border:3px solid var(--border);
  border-top-color:var(--blue); border-radius:50%;
  animation:dr-spin .8s linear infinite; flex-shrink:0;
}
@keyframes dr-spin { to { transform:rotate(360deg); } }
.dr-dots { display:flex; gap:4px; }
.dr-dots span {
  width:7px; height:7px; border-radius:50%; background:var(--text-muted);
  animation:dr-bounce .9s infinite;
}
.dr-dots span:nth-child(2) { animation-delay:.15s; }
.dr-dots span:nth-child(3) { animation-delay:.30s; }
@keyframes dr-bounce { 0%,80%,100%{transform:translateY(0)} 40%{transform:translateY(-6px)} }

/* ── Quote links (>>>QUOTE:<<< in review text) ───────────────────────── */
.dr-quote-link {
  display:inline-block; background:rgba(26,86,219,.08); border:1px solid rgba(26,86,219,.2);
  border-radius:4px; padding:1px 6px; font-size:12px; font-style:italic;
  color:var(--blue); cursor:pointer; transition:all .15s; margin:1px 0;
}
.dr-quote-link:hover { background:rgba(26,86,219,.15); border-color:var(--blue); }
.dr-quote-link-active { background:rgba(26,86,219,.25) !important; outline:2px solid var(--blue); }

/* ── Review markdown formatting (used in chat follow-up bubbles) ─────── */
.dr-review-section { font-weight:700; margin:14px 0 4px; font-size:13px; }
.dr-sec-critical   { color:#b91c1c; }
.dr-sec-high       { color:#c2410c; }
.dr-sec-moderate   { color:#92400e; }
.dr-sec-positive   { color:#166534; }
.dr-sec-gap        { color:#5b21b6; }
.dr-review-heading { font-weight:700; font-size:14px; margin:12px 0 4px; color:var(--text); }
.dr-review-bullet  { margin:3px 0 3px 12px; font-size:13px; }
.dr-review-blockquote {
  margin:4px 0 4px 16px; font-style:italic; color:var(--text-muted);
  border-left:2px solid var(--border); padding-left:8px; font-size:12px;
}
.dr-inline-code { background:rgba(0,0,0,.06); padding:1px 4px; border-radius:3px; font-size:12px; font-family:monospace; }
