/* Phase 1.9C.3 — cohesive AI Review visual language.
   Additive globals. The review pages (AI Review Hub, Global AI Review Workspace,
   AI Processing) reuse layout/button class NAMES that in the rest of the app are only
   defined inside per-page component-scoped .razor.css files (rewritten with [b-xxx]).
   Those scoped rules have higher specificity, so promoting the same names to GLOBAL here
   styles the review pages WITHOUT affecting any page that already scopes its own copy. */

/* ---- Shared page shell (header / cards / states) ---- */
.functional-header { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:1.1rem; }
.functional-header > div:first-child { min-width:0; }
.functional-header span { font-weight:800; color:#7C3AED; letter-spacing:.12em; font-size:.7rem; }
.functional-header h1 { margin:.2rem 0 .3rem; color:#1f2b3a; }
.functional-header p { margin:0; color:#5f6b7a; }
.functional-header > div:last-child { flex:0 0 auto; }

.review-card { background:#fff; border:1px solid #dce6f2; border-radius:10px; padding:1rem 1.1rem; margin-bottom:1rem; box-shadow:0 2px 6px rgba(24,38,48,.035); }
.editor-heading { display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-bottom:.75rem; }
.editor-heading h2 { margin:0; font-size:1.02rem; color:#1f2b3a; }

.review-state { padding:2rem; text-align:center; color:#5f6b7a; background:#fff; border:1px solid #dce6f2; border-radius:10px; margin:1rem; }

/* ---- Button hierarchy (green primary / neutral secondary / red destructive) ---- */
a.primary-button, button.primary-button {
    display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
    padding:.55rem .9rem; border:1px solid var(--brand-700, #6D28D9); border-radius:6px;
    background:var(--brand-600, #7C3AED); color:#fff; font-size:.78rem; font-weight:700;
    text-decoration:none; white-space:nowrap; cursor:pointer; line-height:1.1;
}
a.primary-button:hover, button.primary-button:hover { background:var(--brand-700, #6D28D9); }
button.primary-button:disabled { background:#c3d3e6; border-color:#c3d3e6; color:#f5f9fe; cursor:default; }

a.secondary, button.secondary {
    display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
    padding:.55rem .9rem; border:1px solid #c3d3e6; border-radius:6px;
    background:#fff; color:#1f2b3a; font-size:.78rem; font-weight:650;
    text-decoration:none; white-space:nowrap; cursor:pointer; line-height:1.1;
}
a.secondary:hover, button.secondary:hover { background:#f5f9fe; border-color:#c3d3e6; }

a.danger-button, button.danger-button {
    display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
    padding:.55rem .9rem; border:1px solid #b23b33; border-radius:6px;
    background:#c0392b; color:#fff; font-size:.78rem; font-weight:700;
    text-decoration:none; white-space:nowrap; cursor:pointer; line-height:1.1;
}
a.danger-button:hover, button.danger-button:hover { background:#a5322a; }

/* Bare navigation buttons inside the workspace action rows (Previous / Next / Back). */
.ws-actions, .ws-nav { display:flex; gap:.35rem; flex-wrap:wrap; align-items:center; }
.ws-actions button:not([class]), .ws-nav button:not([class]) {
    padding:.5rem .8rem; border:1px solid #c3d3e6; border-radius:6px;
    background:#fff; color:#1f2b3a; font-size:.78rem; font-weight:650; cursor:pointer; white-space:nowrap;
}
.ws-actions button:not([class]):hover, .ws-nav button:not([class]):hover { background:#f5f9fe; }

/* ---- AI Processing console — two-column console layout. ---- */
.aiproc-grid { display: grid; grid-template-columns: minmax(19rem, 30%) 1fr; gap: 1rem; align-items: start; }
.aiproc-left, .aiproc-right { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
/* Let the cards shrink so a wide table scrolls inside .table-scroll instead of overflowing the
   column. (Scroll-region height + sticky header now come from the global engineering data-grid
   standard in design-system.css.) */
.aiproc-left > *, .aiproc-right > * { min-width: 0; }
@media (max-width: 1100px) { .aiproc-grid { grid-template-columns: 1fr; } }

/* Compact metric strip — equal cells, subtle dividers (matches the Hub). */
.metric-strip { display:grid; grid-template-columns:repeat(auto-fit, minmax(9rem,1fr)); gap:0;
    background:#fff; border:1px solid #dce6f2; border-radius:10px; overflow:hidden; margin-bottom:1rem; }
.metric-strip > div { padding:.7rem .95rem; border-right:1px solid #dce6f2; }
.metric-strip > div:last-child { border-right:none; }
.metric-strip .m-value { font-size:1.5rem; font-weight:700; line-height:1; color:#1f2b3a; }
.metric-strip .m-label { font-size:.72rem; color:#5f6b7a; margin-top:.15rem; }
.metric-strip .clickable { cursor:pointer; }
.metric-strip .clickable:hover { background:#F4F6F9; }

/* Prominent Active Run banner. */
.active-run-banner { display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
    padding:.75rem 1rem; margin-bottom:.75rem; background:var(--brand-50, #eef1ff); border:1px solid var(--brand-100, #dbe2ff);
    border-left:4px solid var(--brand-600, #7C3AED); border-radius:8px; }
.active-run-banner .eyebrow { font-size:.68rem; font-weight:800; letter-spacing:.09em; color:var(--brand-700, #6D28D9); }
.active-run-banner .run-title { font-size:1.02rem; font-weight:700; color:#1f2b3a; margin:.1rem 0; }
.active-run-banner .run-meta { font-size:.82rem; color:#5f6b7a; }
.run-controls { display:flex; gap:.6rem; align-items:end; flex-wrap:wrap; }
.run-controls label span { display:block; font-size:.7rem; color:#5f6b7a; font-weight:650; margin-bottom:.15rem; }
.run-controls select { min-height:38px; padding:.4rem .55rem; border:1px solid #c3d3e6; border-radius:6px; background:#fff; }

/* Neutral chrome for the console's bare action buttons; red outline for row Reject. */
.editor-actions button:not([class]), .editor-heading button:not([class]),
.row-actions button:not([class]), .run-controls button:not([class]) {
    padding:.5rem .8rem; border:1px solid #c3d3e6; border-radius:6px;
    background:#fff; color:#1f2b3a; font-size:.76rem; font-weight:650; cursor:pointer; white-space:nowrap; }
.editor-actions button:not([class]):hover, .editor-heading button:not([class]):hover,
.row-actions button:not([class]):hover, .run-controls button:not([class]):hover { background:#f5f9fe; }
.editor-actions button:disabled, .row-actions button:disabled, .run-controls button:disabled { opacity:.5; cursor:default; }
.row-actions button.reject { border:1px solid #e0bdb9; background:#fff; color:#b23b33; }
.row-actions button.reject:hover { background:#fbeeed; }

/* ---- AI Review Hub — fills the content region; module cards + metric strip. ---- */
.ai-review-hub { width:100%; }
.hub-module-card { transition: box-shadow .15s ease, border-color .15s ease; }
.hub-module-card:hover { box-shadow: 0 3px 12px rgba(0,0,0,.08); border-color: #c3d3e6; }
.hub-metrics > div:last-child { border-right: none; }

/* ---- Global AI Review Workspace — balance the three columns (viewer dominant). ---- */
.ws-grid { display: grid; grid-template-columns: minmax(14rem, 22%) minmax(0, 1fr) minmax(19rem, 24%); gap: .5rem; min-height: 0; }
@media (max-width: 1200px) { .ws-grid { grid-template-columns: 15rem 1fr; } .ws-grid > section:nth-child(3) { grid-column: 1 / -1; } }