/* ═══════════════════════════════════════════════════════════════════════════
   BUILDWISE E-SOURCING — GLOBAL STYLES
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
    --bg: #0d1117;
    --s1: #161b22;
    --s2: #1c2128;
    --bdr: #30363d;
    /*    --teal:   #00b4c8;
    --teal-d: #007d8c;*/
    --teal: #666E77;
    --teal-d: #000;
    --orange: #f0883e;
    --green: #3fb950;
    --purple: #b392f0;
    --gold: #ffd700;
    --txt: #e6edf3;
    --muted: #8b949e;
    --dim: #484f58;
    --r: 8px;
}

/* ── SHELL / LAYOUT ────────────────────────────────────────────────────────── */
.bw-shell  { display:flex; flex-direction:column; height:100vh; background:var(--bg); color:var(--txt); font-size:14px; }
.bw-body   { display:flex; flex:1; overflow:hidden; }
.bw-main   { flex:1; overflow-y:auto; padding:20px; }

/* ── HEADER ────────────────────────────────────────────────────────────────── */
.bw-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:0 24px; height:56px; flex-shrink:0;
    background:var(--s1); border-bottom:1px solid var(--bdr);
}
.bw-logo { display:flex; align-items:center; gap:10px; }
.bw-logo-icon {
    width:36px; height:45px; border-radius:8px;
    background:linear-gradient(135deg,#000,#000);
    color:#000; font-size:18px; font-weight:800;
    display:flex; align-items:center; justify-content:center;
}
.bw-logo-text   { display:flex; flex-direction:column; }
.bw-brand       { font-size:14px; font-weight:700; }
.bw-tagline     { font-size:9px; letter-spacing:.1em; color:var(--muted); text-transform:uppercase; }
.bw-project-badge {
    background:var(--s2); border:1px solid var(--bdr);
    border-radius:20px; padding:4px 14px; font-size:12px; color:var(--muted);
}
.bw-header-right { display:flex; align-items:center; gap:10px; }
.bw-live-badge   { color:var(--green); font-size:12px; font-weight:600; }

/* ── STEPPER ───────────────────────────────────────────────────────────────── */
.bw-stepper {
    display:flex; align-items:center; padding:12px 32px; flex-shrink:0;
    background:var(--s1); border-bottom:1px solid var(--bdr);
}
.bw-step { display:flex; align-items:center; gap:8px; }
.bw-step-circle {
    width:28px; height:28px; border-radius:50%; border:2px solid var(--bdr);
    display:flex; align-items:center; justify-content:center;
    font-size:11px; font-weight:700; color:var(--muted); transition:all .2s;
}
.bw-step.active  .bw-step-circle { border-color:var(--teal); background:var(--teal); color:#fff; }
.bw-step.complete .bw-step-circle { border-color:var(--green); background:var(--green); color:#000; }
.bw-step-label   { font-size:12px; color:var(--muted); white-space:nowrap; }
.bw-step.active  .bw-step-label { color:var(--teal); font-weight:600; }
.bw-step.complete .bw-step-label { color:var(--green); }
.bw-step-line    { flex:1; height:2px; background:var(--bdr); margin:0 8px; min-width:16px; }
.bw-step-line.complete { background:var(--green); }

/* ── NAV TABS ──────────────────────────────────────────────────────────────── */
.bw-nav {
    display:flex; background:var(--s1); border-bottom:1px solid var(--bdr);
    padding:0 20px; flex-shrink:0;
}
.bw-nav-link {
    display:block; padding:11px 16px; font-size:13px; color:var(--muted);
    border-bottom:2px solid transparent; transition:all .15s; margin-bottom:-1px;
    cursor:pointer;
}
.bw-nav-link:hover { color:var(--txt); }
.bw-nav-link.active { color:var(--teal); border-bottom-color:var(--teal); font-weight:600; }

/* ── RIGHT SIDEBAR ─────────────────────────────────────────────────────────── */
.bw-aside {
    width:272px; border-left:1px solid var(--bdr); background:var(--s1);
    overflow-y:auto; padding:12px; display:flex; flex-direction:column; gap:10px;
}
.bw-aside-card { background:var(--s2); border:1px solid var(--bdr); border-radius:var(--r); padding:12px; }
.bw-aside-title {
    font-size:10px; font-weight:700; letter-spacing:.1em; color:var(--muted);
    text-transform:uppercase; margin-bottom:10px; padding-bottom:8px;
    border-bottom:1px solid var(--bdr);
}
.bw-info-row { display:flex; gap:6px; margin-bottom:6px; font-size:12px; align-items:flex-start; }
.bw-info-row span:first-child { color:var(--muted); min-width:64px; flex-shrink:0; }
.bw-info-sm  { font-size:10px; word-break:break-all; }

/* sourcing dots */
.bw-src-row   { display:flex; align-items:center; gap:7px; margin-bottom:7px; font-size:12px; }
.bw-src-name  { color:var(--muted); font-size:11px; min-width:72px; }
.bw-src-dots  { display:flex; flex-wrap:wrap; gap:3px; }
.bw-dot       { width:8px; height:8px; border-radius:50%; background:var(--dim); display:inline-block; }
.bw-dot.sl    { background:var(--orange); }
.bw-dot.itb   { background:var(--green);  }
.bw-src-legend { display:flex; gap:10px; margin-top:6px; font-size:10px; color:var(--muted); flex-wrap:wrap; }

/* activity log */
.bw-log-entry   { margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid var(--bdr); }
.bw-log-entry:last-child { border-bottom:none; margin-bottom:0; }
.bw-log-msg     { font-size:11px; color:var(--txt); line-height:1.4; }
.bw-log-time    { font-size:10px; color:var(--dim); margin-top:2px; }

/* ── UTILITIES ─────────────────────────────────────────────────────────────── */
.ml-auto    { margin-left:auto; }
.bw-muted   { color:var(--muted); }
.bw-teal    { color:var(--teal); }
.bw-orange  { color:var(--orange); }
.bw-green   { color:var(--green); }
.bw-purple  { color:var(--purple); }
.bw-star-gold { color:var(--gold); }
.bw-tc      { text-align:center; }

.bw-div {
    background:var(--s2); border:1px solid var(--bdr);
    border-radius:4px; padding:2px 6px; font-size:11px;
    font-family:monospace; color:var(--muted);
}

/* ── BUTTONS ───────────────────────────────────────────────────────────────── */
.bw-btn-ghost {
    background:none; border:1px solid var(--bdr); color:var(--muted);
    padding:5px 12px; border-radius:var(--r); cursor:pointer; font-size:12px; transition:all .15s;
}
.bw-btn-ghost:hover { border-color:var(--teal); color:var(--teal); }

.bw-btn-teal {
    background:var(--teal); color:whitesmoke; border:none;
    padding:7px 15px; border-radius:6px; font-size:13px; font-weight:700;
    cursor:pointer; transition:background .15s; white-space:nowrap;
}
    .bw-btn-teal:hover {
        background: #7D8691;
        color: whitesmoke
    }
.bw-btn-teal:disabled { opacity:.4; cursor:not-allowed; }
.bw-btn-full { width:100%; }
.bw-btn-lg   { padding:12px 28px !important; font-size:14px !important; }

.bw-btn-sm { padding:5px 11px; border-radius:6px; font-size:12px; font-weight:600; cursor:pointer; border:none; transition:all .15s; }
.bw-btn-outline { background:none; border:1px solid var(--bdr); color:var(--txt); cursor:pointer; }
.bw-btn-outline:hover { border-color:var(--teal); color:var(--teal); }

.bw-btn-export {
    display:flex; align-items:center; gap:7px;
    background:var(--s1); border:1px solid var(--bdr); color:var(--txt);
    padding:8px 16px; border-radius:var(--r); font-size:13px; font-weight:600;
    cursor:pointer; white-space:nowrap; transition:all .15s; flex-shrink:0;
}
.bw-btn-export:hover { border-color:var(--teal); color:var(--teal); }

/* ── BADGES ────────────────────────────────────────────────────────────────── */
.bw-badge         { padding:2px 8px; border-radius:20px; font-size:11px; font-weight:600; white-space:nowrap; }
.bw-badge-pending      { background:rgba(139,148,158,.2); color:var(--muted);   }
.bw-badge-vendorsfound { background:rgba(56,139,253,.2);  color:#79b8ff;        }
.bw-badge-shortlisted  { background:rgba(240,136,62,.2);  color:var(--orange);  }
.bw-badge-itbsent      { background:rgba(63,185,80,.2);   color:var(--green);   }

.bw-qualified-badge { padding:3px 12px; border-radius:20px; font-size:12px; font-weight:700; border:1px solid; }
.bw-sl-count-badge  {
    background:rgba(240,136,62,.12); border:1px solid rgba(240,136,62,.3);
    color:var(--orange); border-radius:20px; padding:2px 10px; font-size:11px; font-weight:700;
}
.bw-filtered-note {
    font-size:11px; color:var(--muted); background:rgba(139,148,158,.1);
    border:1px solid var(--bdr); border-radius:10px; padding:2px 8px;
}

/* ── TABLE ─────────────────────────────────────────────────────────────────── */
.bw-table { width:100%; border-collapse:collapse; }
.bw-table th {
    background:var(--s2); padding:9px 13px; text-align:left;
    font-size:11px; font-weight:600; color:var(--muted);
    text-transform:uppercase; letter-spacing:.05em; border-bottom:1px solid var(--bdr);
}
.bw-table td { padding:9px 13px; border-bottom:1px solid var(--bdr); font-size:13px; }
.bw-table tr:last-child td { border-bottom:none; }
.bw-tr { cursor:pointer; transition:background .1s; }
.bw-tr:hover { background:var(--s2); }
.bw-tr-sl    { background:rgba(240,136,62,.04); }
.bw-tr-itb   { background:rgba(63,185,80,.04);  }
.bw-v-name   { font-weight:600; font-size:13px; }
.bw-v-email  { font-size:11px; color:var(--muted); }

/* compliance bar */
.bw-cbar      { width:80px; height:6px; background:var(--bdr); border-radius:3px; overflow:hidden; display:inline-block; vertical-align:middle; }
.bw-cbar-fill { height:100%; border-radius:3px; background:var(--teal); }

/* ── GENERIC CARD ──────────────────────────────────────────────────────────── */
.bw-card         { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); margin-bottom:18px; overflow:hidden; }
.bw-card-hdr     {
    padding:10px 14px; font-size:11px; font-weight:700; text-transform:uppercase;
    letter-spacing:.06em; color:var(--muted); border-bottom:1px solid var(--bdr); background:var(--s2);
}

/* ── STAT TILES ────────────────────────────────────────────────────────────── */
.bw-stats-row { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.bw-stat {
    background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r);
    padding:14px; display:flex; flex-direction:column; align-items:center; gap:3px;
    font-size:12px; color:var(--muted);
}
.bw-stat-n      { font-size:2rem; font-weight:700; line-height:1; }
.bw-stat-teal   .bw-stat-n { color:var(--teal);   }
.bw-stat-orange .bw-stat-n { color:var(--orange); }

/* ── PHASE CARD ────────────────────────────────────────────────────────────── */
.bw-phase-card { padding:14px; }
.bw-phase-hdr  { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.bw-phase-ico  { font-size:20px; }
.bw-phase-title { font-size:14px; font-weight:600; }
.bw-phase-sub  { font-size:11px; color:var(--muted); }
.bw-uploaded-badge {
    background:rgba(63,185,80,.12); border:1px solid var(--green);
    color:var(--green); border-radius:var(--r); padding:4px 10px; font-size:12px;
}
.bw-upload-drop {
    border:2px dashed var(--bdr); border-radius:var(--r);
    padding:28px; text-align:center; cursor:pointer; transition:all .2s;
}
.bw-upload-drop:hover { border-color:var(--teal); background:rgba(0,180,200,.04); }
.bw-upload-ico  { font-size:2rem; margin-bottom:8px; }
.bw-upload-hint { font-size:11px; color:var(--muted); margin-top:4px; }

/* ── UPLOAD CTA ────────────────────────────────────────────────────────────── */
.bw-upload-cta {
    display:flex; flex-direction:column; align-items:center;
    justify-content:center; padding:80px 20px; gap:14px; text-align:center;
}
.bw-upload-cta-ico   { font-size:3.5rem; }
.bw-upload-cta-title { font-size:1.2rem; font-weight:700; }
.bw-upload-cta-sub   { color:var(--muted); max-width:480px; }

/* ── EMPTY STATE ───────────────────────────────────────────────────────────── */
.bw-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:60px; gap:12px; color:var(--muted); text-align:center; }
.bw-empty-ico { font-size:3rem; }

/* ── PACKAGES GRID ─────────────────────────────────────────────────────────── */
.bw-pkg-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.bw-pkg-card {
    background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r);
    overflow:hidden; transition:border-color .15s;
}
.bw-pkg-card:hover { border-color:var(--teal); }
.bw-pkc-hdr { display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--bdr); background:var(--s2); }
.bw-pkc-ico  { font-size:1.5rem; flex-shrink:0; }
.bw-pkc-name { font-weight:700; font-size:14px; }
.bw-pkc-div  { font-size:11px; color:var(--muted); }
.bw-vendor-pill { display:flex; flex-direction:column; align-items:center; padding:4px 10px; border-radius:20px; border:1px solid var(--bdr); flex-shrink:0; }
.bw-vendor-pill.no-vendors  { border-color:var(--orange); }
.bw-vendor-pill.has-vendors { border-color:var(--green);  }
.bw-vp-num  { font-size:1.1rem; font-weight:800; line-height:1; }
.bw-vendor-pill.no-vendors  .bw-vp-num { color:var(--orange); }
.bw-vendor-pill.has-vendors .bw-vp-num { color:var(--green);  }
.bw-vp-lbl  { font-size:9px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.bw-spec-list { list-style:none; padding:12px 14px; display:flex; flex-direction:column; gap:6px; border-bottom:1px solid var(--bdr); }
.bw-spec-list li { font-size:12px; color:var(--muted); padding-left:14px; position:relative; }
.bw-spec-list li::before { content:""; position:absolute; left:0; top:6px; width:5px; height:5px; border-radius:50%; background:var(--bdr); }
.bw-pkc-vendors { padding:12px 14px; }
.bw-pkc-vendors-title { font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-bottom:8px; font-weight:700; }
.bw-vendor-chips { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.bw-vendor-chip  {
    display:flex; align-items:center; gap:5px; background:var(--s2);
    border:1px solid var(--bdr); border-radius:6px; padding:4px 8px; font-size:12px;
}
.bw-vendor-chip.shortlisted { border-color:rgba(240,136,62,.5); background:rgba(240,136,62,.06); }
.bw-vendor-chip.itb-sent    { border-color:rgba(63,185,80,.5);  background:rgba(63,185,80,.06);  }
.bw-vc-avatar { width:20px; height:20px; border-radius:50%; background:var(--teal-d); color:#fff; font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.bw-vc-name   { font-size:12px; }
.bw-vc-tag    { padding:1px 5px; border-radius:4px; font-size:9px; font-weight:700; text-transform:uppercase; }
.bw-vc-tag.sl  { background:rgba(240,136,62,.2); color:var(--orange); }
.bw-vc-tag.itb { background:rgba(63,185,80,.2);  color:var(--green);  }
.bw-pkc-actions { display:flex; gap:8px; justify-content:flex-end; }

/* ── VENDOR CARD GRID ──────────────────────────────────────────────────────── */
.bw-vendors-all { display:flex; flex-direction:column; gap:24px; }
.bw-vgroup      { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); overflow:hidden; }
.bw-vgroup-hdr  {
    display:flex; align-items:center; gap:10px; padding:14px 18px;
    background:var(--s2); border-bottom:1px solid var(--bdr);
}
.bw-vgroup-ico   { font-size:1.25rem; }
.bw-vgroup-name  { font-size:15px; font-weight:700; }
.bw-vgroup-empty { padding:20px 18px; font-size:13px; color:var(--muted); background:var(--bg); border-top:1px solid var(--bdr); }

.bw-vcard-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--bdr); }
.bw-vendor-card {
    background:var(--s1); padding:14px 16px; cursor:pointer;
    transition:background .15s; display:flex; flex-direction:column; gap:10px;
    position:relative; user-select:none;
}
.bw-vendor-card:hover { background:#1a2030; }
.bw-vendor-card.sl    { background:rgba(240,136,62,.06); }
.bw-vendor-card.itb   { background:rgba(63,185,80,.06);  }
.bw-vendor-card.sl::before,.bw-vendor-card.itb::before {
    content:""; position:absolute; left:0; top:0; bottom:0; width:3px; border-radius:2px 0 0 2px;
}
.bw-vendor-card.sl::before  { background:var(--orange); }
.bw-vendor-card.itb::before { background:var(--green);  }
.bw-vc-top  { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.bw-vc-name-block { flex:1; min-width:0; }
.bw-vc-vname { font-size:13px; font-weight:700; line-height:1.3; margin-bottom:3px; }
.bw-vc-spec  { font-size:11px; color:var(--muted); }
.bw-vc-itb-badge { background:rgba(63,185,80,.15); border:1px solid rgba(63,185,80,.4); color:var(--green); border-radius:4px; padding:2px 7px; font-size:10px; font-weight:700; }
.bw-vc-sl-badge  { color:var(--orange); font-size:16px; }
.bw-vc-add-hint  { font-size:10px; color:var(--dim); opacity:0; transition:opacity .15s; }
.bw-vendor-card:hover .bw-vc-add-hint { opacity:1; }
.bw-vc-bottom { display:flex; align-items:center; gap:14px; font-size:12px; }
.bw-vc-compliance { display:flex; align-items:center; gap:3px; }
.bw-vc-check { font-size:12px; font-weight:800; }
.bw-vc-pct   { font-weight:700; }
.bw-vc-rating { display:flex; align-items:center; gap:3px; }
.bw-vc-rat-val { font-weight:700; }
.bw-vc-days    { color:var(--muted); font-size:12px; font-weight:600; }
.bw-vc-days-lbl { font-size:10px; color:var(--dim); }

/* ── QUALIFICATION SLIDERS ─────────────────────────────────────────────────── */
.bw-qual-panel   { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); padding:16px 20px; margin-bottom:20px; }
.bw-qual-title   { font-size:13px; font-weight:700; margin-bottom:16px; }
.bw-qual-controls{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.bw-qual-ctrl    { display:flex; flex-direction:column; gap:8px; }
.bw-qual-lbl     { display:flex; justify-content:space-between; align-items:center; font-size:12px; color:var(--muted); }
.bw-qual-val     { font-size:15px; font-weight:800; line-height:1; }
.bw-slider       { -webkit-appearance:none; appearance:none; width:100%; height:4px; border-radius:2px; background:var(--bdr); outline:none; cursor:pointer; }
.bw-slider-teal  { accent-color:var(--teal); }
.bw-slider::-webkit-slider-thumb {
    -webkit-appearance:none; width:16px; height:16px; border-radius:50%;
    background:var(--teal); cursor:pointer; box-shadow:0 0 0 3px rgba(0,180,200,.2);
}
.bw-slider::-moz-range-thumb { width:16px; height:16px; border-radius:50%; background:var(--teal); cursor:pointer; border:none; }

/* ── REVIEW TAB ────────────────────────────────────────────────────────────── */
.bw-rv-kpi-row { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; margin-bottom:20px; }
.bw-rv-kpi     { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); padding:16px 14px; display:flex; flex-direction:column; align-items:center; gap:5px; text-align:center; }
.bw-rv-kpi-teal { border-top:2px solid var(--teal); }
.bw-rv-kpi-num  { font-size:1.9rem; font-weight:800; line-height:1; }
.bw-rv-kpi-lbl  { font-size:11px; color:var(--muted); line-height:1.3; }

.bw-rv-grid     { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:24px; }
.bw-rv-card     { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column; }
.bw-rv-card-hdr { display:flex; align-items:center; gap:10px; padding:12px 14px; background:var(--s2); border-bottom:1px solid var(--bdr); }
.bw-rv-card-ico  { font-size:1.3rem; flex-shrink:0; }
.bw-rv-card-name { font-weight:700; font-size:13px; }
.bw-rv-card-div  { font-size:11px; color:var(--muted); }
.bw-rv-stats    { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--bdr); }
.bw-rv-stat     { display:flex; flex-direction:column; align-items:center; padding:10px 6px; border-right:1px solid var(--bdr); text-align:center; }
.bw-rv-stat:last-child { border-right:none; }
.bw-rv-stat-n   { font-size:1.3rem; font-weight:800; line-height:1; }
.bw-rv-stat-l   { font-size:9px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); margin-top:2px; }
.bw-rv-compliance-section { padding:12px 14px 8px; }
.bw-rv-comp-lbl { display:flex; justify-content:space-between; font-size:11px; color:var(--muted); margin-bottom:5px; }
.bw-rv-comp-bar { width:100%; height:7px; background:var(--bdr); border-radius:4px; overflow:hidden; }
.bw-rv-comp-fill { height:100%; border-radius:4px; transition:width .4s ease; }
.bw-rv-criteria { padding:6px 14px 12px; display:flex; flex-direction:column; gap:5px; border-bottom:1px solid var(--bdr); }
.bw-rv-crit     { display:flex; align-items:center; gap:8px; font-size:11px; }
.bw-rv-crit-bar-wrap { width:60px; height:4px; background:var(--bdr); border-radius:2px; overflow:hidden; flex-shrink:0; display:block; }
.bw-rv-crit-fill     { height:100%; border-radius:2px; display:block; }
.bw-rv-crit-lbl { color:var(--muted); flex:1; }
.bw-rv-crit-val { color:var(--txt); font-weight:600; white-space:nowrap; }
.bw-rv-top-vendor { padding:10px 14px; border-bottom:1px solid var(--bdr); }
.bw-rv-tv-label { font-size:9px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); display:block; margin-bottom:6px; font-weight:700; }
.bw-rv-tv-chip  { display:flex; align-items:center; gap:8px; background:var(--s2); border:1px solid var(--bdr); border-radius:6px; padding:7px 10px; }
.bw-rv-tv-av    { width:28px; height:28px; border-radius:50%; color:#000; font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.bw-rv-tv-info  { flex:1; min-width:0; }
.bw-rv-tv-name  { font-size:12px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bw-rv-tv-spec  { font-size:10px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bw-rv-tv-scores { display:flex; flex-direction:column; align-items:flex-end; font-size:11px; gap:2px; flex-shrink:0; }
.bw-rv-actions  { padding:10px 14px; display:flex; gap:8px; justify-content:flex-end; margin-top:auto; background:var(--bg); }
.bw-rv-matrix-card { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); overflow:hidden; }
.bw-rv-matrix-title { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:var(--s2); border-bottom:1px solid var(--bdr); font-size:13px; font-weight:700; }

/* ── REPORT TAB ────────────────────────────────────────────────────────────── */
.bw-report-wrap  { max-width:900px; }
.bw-report-card  { background:var(--s1); border:1px solid var(--bdr); border-radius:var(--r); overflow:hidden; }
.bw-rpt-card-hdr { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:20px 22px 18px; border-bottom:1px solid var(--bdr); background:var(--s2); }
.bw-rpt-card-title   { font-size:18px; font-weight:800; margin-bottom:5px; }
.bw-rpt-card-sub     { font-size:13px; color:var(--muted); margin-bottom:3px; }
.bw-rpt-card-prepared { font-size:11px; color:var(--dim); }
.bw-rpt-tiles { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--bdr); }
.bw-rpt-tile  { display:flex; flex-direction:column; align-items:center; gap:6px; padding:22px 16px; border-right:1px solid var(--bdr); }
.bw-rpt-tile:last-child { border-right:none; }
.bw-rpt-tile-num { font-size:2.4rem; font-weight:800; line-height:1; }
.bw-rpt-tile-lbl { font-size:12px; color:var(--muted); text-align:center; }
.bw-rpt-gate { display:flex; align-items:center; justify-content:center; padding:60px 20px; }
.bw-rpt-gate-txt { font-size:14px; color:var(--muted); text-align:center; }
.bw-rpt-body { padding:20px 22px; display:flex; flex-direction:column; gap:24px; }
.bw-rpt-section-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }

/* ── TOAST ─────────────────────────────────────────────────────────────────── */
.bw-toast {
    position:fixed; bottom:24px; right:24px;
    background:var(--s1); border:1px solid var(--teal); color:var(--txt);
    padding:12px 18px; border-radius:var(--r); font-size:13px;
    opacity:0; transform:translateY(8px); transition:all .3s;
    z-index:9999; max-width:380px; box-shadow:0 4px 20px rgba(0,0,0,.5);
}
.bw-toast.on { opacity:1; transform:translateY(0); }

/* ═══════════════════════════════════════════════════════════════════════════
   THEME SYSTEM — dark (default) and light
   All tokens are overridden at the .bw-shell level so every child inherits.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── DARK THEME (default, already active via :root) ────────────────────── */
.bw-theme-dark {
    --bg:     #0d1117;
    --s1:     #161b22;
    --s2:     #1c2128;
    --bdr:    #30363d;
    --teal:   #00b4c8;
    --teal-d: #007d8c;
    --orange: #f0883e;
    --green:  #3fb950;
    --purple: #b392f0;
    --gold:   #ffd700;
    --txt:    #e6edf3;
    --muted:  #8b949e;
    --dim:    #484f58;

    /* component tokens */
    --header-bg:   #161b22;
    --nav-bg:      #161b22;
    --aside-bg:    #161b22;
    --card-bg:     #161b22;
    --card-bg2:    #1c2128;
    --input-bg:    #0d1117;
    --row-hover:   #1c2128;
    --row-sl:      rgba(240,136,62,.04);
    --row-itb:     rgba(63,185,80,.04);
    --vendor-hover:#1a2030;
    --vendor-sl:   rgba(240,136,62,.06);
    --vendor-itb:  rgba(63,185,80,.06);
    --shadow:      rgba(0,0,0,.5);
    --toggle-bg:   #21262d;
    --toggle-border:#30363d;
    --toggle-hover:#30363d;
}

/* ── LIGHT THEME ────────────────────────────────────────────────────────── */
.bw-theme-light {
    --bg: #f0f4f8;
    --s1: #ffffff;
    --s2: #f6f8fa;
    --bdr: #d0d7de;
    /*  --teal:   #0891a8;
    --teal-d: #065f6b;*/
    --teal: #666E77;
    --teal-d: #000;
    --orange: #c05621;
    --green: #1a7f37;
    --purple: #7c4bba;
    --gold: #b08800;
    --txt: #1f2328;
    --muted: #57606a;
    --dim: #8c959f;
    /* component tokens */
    --header-bg: #ffffff;
    --nav-bg: #ffffff;
    --aside-bg: #ffffff;
    --card-bg: #ffffff;
    --card-bg2: #f6f8fa;
    --input-bg: #f6f8fa;
    --row-hover: #f6f8fa;
    --row-sl: rgba(192,86,33,.04);
    --row-itb: rgba(26,127,55,.04);
    --vendor-hover: #f0f4f8;
    --vendor-sl: rgba(192,86,33,.06);
    --vendor-itb: rgba(26,127,55,.06);
    --shadow: rgba(0,0,0,.12);
    --toggle-bg: #f6f8fa;
    --toggle-border: #d0d7de;
    --toggle-hover: #e8ecf0;
}

/* ── APPLY COMPONENT TOKENS ─────────────────────────────────────────────── */
/* Override every component that uses hard-coded colour values               */

.bw-shell { background: var(--bg); color: var(--txt); }

/* header */
.bw-shell .bw-header     { background: var(--header-bg); border-bottom-color: var(--bdr); }
.bw-shell .bw-stepper    { background: var(--header-bg); border-bottom-color: var(--bdr); }
.bw-shell .bw-nav        { background: var(--nav-bg);    border-bottom-color: var(--bdr); }

/* sidebar */
.bw-shell .bw-aside          { background: var(--aside-bg); border-left-color: var(--bdr); }
.bw-shell .bw-aside-card     { background: var(--card-bg2); border-color: var(--bdr); }
.bw-shell .bw-aside-title    { border-bottom-color: var(--bdr); }
.bw-shell .bw-log-entry      { border-bottom-color: var(--bdr); }
.bw-shell .bw-info-row span:first-child { color: var(--muted); }

/* cards */
.bw-shell .bw-card       { background: var(--card-bg);  border-color: var(--bdr); }
.bw-shell .bw-card-hdr   { background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-phase-card { background: var(--card-bg); }

/* tables */
.bw-shell .bw-table th    { background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-table td    { border-bottom-color: var(--bdr); }
.bw-shell .bw-tr:hover    { background: var(--row-hover); }
.bw-shell .bw-tr-sl       { background: var(--row-sl); }
.bw-shell .bw-tr-itb      { background: var(--row-itb); }

/* stat tiles */
.bw-shell .bw-stat        { background: var(--card-bg); border-color: var(--bdr); }

/* package cards */
.bw-shell .bw-pkg-card    { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-pkc-hdr     { background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-spec-list   { border-bottom-color: var(--bdr); }
.bw-shell .bw-vendor-chip { background: var(--card-bg2); border-color: var(--bdr); }

/* vendor groups */
.bw-shell .bw-vgroup      { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-vgroup-hdr  { background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-vgroup-empty{ background: var(--bg); border-top-color: var(--bdr); }
.bw-shell .bw-vcard-grid  { background: var(--bdr); }
.bw-shell .bw-vendor-card { background: var(--card-bg); }
.bw-shell .bw-vendor-card:hover { background: var(--vendor-hover); }
.bw-shell .bw-vendor-card.sl    { background: var(--vendor-sl); }
.bw-shell .bw-vendor-card.itb   { background: var(--vendor-itb); }

/* review cards */
.bw-shell .bw-rv-kpi         { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-rv-card        { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-rv-card-hdr    { background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-rv-stat        { border-right-color: var(--bdr); }
.bw-shell .bw-rv-criteria    { border-bottom-color: var(--bdr); }
.bw-shell .bw-rv-top-vendor  { border-bottom-color: var(--bdr); }
.bw-shell .bw-rv-tv-chip     { background: var(--card-bg2); border-color: var(--bdr); }
.bw-shell .bw-rv-actions     { background: var(--bg); }
.bw-shell .bw-rv-matrix-card { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-rv-matrix-title{ background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-rv-comp-bar    { background: var(--bdr); }
.bw-shell .bw-rv-crit-bar-wrap { background: var(--bdr); }

/* qualification panel */
.bw-shell .bw-qual-panel  { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-slider      { background: var(--bdr); }

/* report */
.bw-shell .bw-report-card  { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-rpt-card-hdr { background: var(--card-bg2); border-bottom-color: var(--bdr); }
.bw-shell .bw-rpt-tile     { border-right-color: var(--bdr); }
.bw-shell .bw-rpt-tiles    { border-bottom-color: var(--bdr); }

/* project badge */
.bw-shell .bw-project-badge { background: var(--card-bg2); border-color: var(--bdr); }

/* upload area */
.bw-shell .bw-upload-drop { border-color: var(--bdr); }
.bw-shell .bw-upload-drop:hover { border-color: var(--teal); background: rgba(0,180,200,.04); }

/* misc */
.bw-shell .bw-cbar         { background: var(--bdr); }
.bw-shell .bw-step-circle  { border-color: var(--bdr); }
.bw-shell .bw-step-line    { background: var(--bdr); }
.bw-shell .bw-div          { background: var(--card-bg2); border-color: var(--bdr); color: var(--muted); }

/* toast */
.bw-shell .bw-toast { background: var(--card-bg); box-shadow: 0 4px 20px var(--shadow); }

/* btn-ghost */
.bw-shell .bw-btn-ghost     { border-color: var(--bdr); color: var(--muted); }
.bw-shell .bw-btn-ghost:hover { border-color: var(--teal); color: var(--teal); }
.bw-shell .bw-btn-export    { background: var(--card-bg); border-color: var(--bdr); }
.bw-shell .bw-btn-outline   { border-color: var(--bdr); color: var(--txt); }

/* nav link */
.bw-shell .bw-nav-link      { color: var(--muted); }
.bw-shell .bw-nav-link:hover{ color: var(--txt); }
.bw-shell .bw-nav-link.active { color: var(--teal); border-bottom-color: var(--teal); }

/* stepper */
.bw-shell .bw-step-label    { color: var(--muted); }
.bw-shell .bw-step.active  .bw-step-circle { border-color: var(--teal); background: var(--teal); }
.bw-shell .bw-step.complete .bw-step-circle{ border-color: var(--green); background: var(--green); }
.bw-shell .bw-step.active  .bw-step-label  { color: var(--teal); }
.bw-shell .bw-step.complete .bw-step-label { color: var(--green); }
.bw-shell .bw-step-line.complete            { background: var(--green); }

/* ── LIGHT THEME — extra overrides for legibility ───────────────────────── */
.bw-theme-light .bw-vc-add-hint     { color: var(--dim); }
.bw-theme-light .bw-rpt-gate-txt    { color: var(--muted); }
.bw-theme-light .bw-vgroup-empty    { color: var(--muted); }
.bw-theme-light .bw-v-email         { color: var(--muted); }
.bw-theme-light .bw-log-time        { color: var(--dim); }
.bw-theme-light .bw-info-sm         { color: var(--muted); }

/* ensure uploaded badge readable in light */
.bw-theme-light .bw-uploaded-badge {
    background: rgba(26,127,55,.1);
    border-color: var(--green);
    color: var(--green);
}
.bw-theme-light .bw-live-badge { color: var(--green); }

/* ── THEME TOGGLE BUTTON ────────────────────────────────────────────────── */
.bw-theme-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--toggle-bg);
    border: 1px solid var(--toggle-border);
    color: var(--txt);
    padding: 5px 12px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    transition: all .2s;
    user-select: none;
}
.bw-theme-toggle:hover {
    background: var(--toggle-hover);
    border-color: var(--teal);
    color: var(--teal);
}
.bw-theme-icon  { font-size: 14px; line-height: 1; }
.bw-theme-label { font-size: 12px; }

/* smooth transition for all theme changes */
.bw-shell,
.bw-shell * {
    transition:
        background-color .25s ease,
        border-color     .2s  ease,
        color            .2s  ease,
        box-shadow       .2s  ease;
}

/* don't animate things that shouldn't transition */
.bw-shell input[type=range],
.bw-shell .bw-cbar-fill,
.bw-shell .bw-rv-comp-fill,
.bw-shell .bw-step-circle,
.bw-shell .bw-toast {
    transition: none;
}

/* ═══════════════════════════════════════════════════════════════════════════
   RADZEN UPLOAD — full-width drop zone override
   ═══════════════════════════════════════════════════════════════════════════ */

/* Make the outer drop wrapper fill its card */
.bw-upload-radzen-wrap {
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    display: block;
    width: 100%;
    cursor: pointer;
}

/* Radzen renders a <div class="rz-fileupload"> wrapping everything */
.bw-upload-radzen-wrap .rz-fileupload {
    width: 100% !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
}

/* The drag-and-drop content area */
.bw-upload-radzen-wrap .rz-fileupload-content {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 120px;
    border: 2px dashed var(--bdr) !important;
    border-radius: 12px !important;
    background: var(--card-bg2) !important;
    transition: border-color .2s, background .2s;
    cursor: pointer;
}

.bw-upload-radzen-wrap .rz-fileupload-content:hover,
.bw-upload-radzen-wrap .rz-fileupload-content.rz-fileupload-highlight {
    border-color: var(--teal) !important;
    background: color-mix(in srgb, var(--teal) 5%, var(--card-bg2)) !important;
}

/* Hide the default Radzen choose button — the entire zone is clickable */
.bw-upload-radzen-wrap .rz-fileupload-choose {
    display: none !important;
}

/* The "Drag and drop here…" choose-text label */
.bw-upload-radzen-wrap .rz-fileupload-content .rz-button-label,
.bw-upload-radzen-wrap .rz-fileupload-content span {
    font-size: 14px !important;
    color: var(--muted) !important;
    font-weight: 500 !important;
    pointer-events: none;
}

/* Hide the Radzen toolbar row (upload/cancel buttons) */
.bw-upload-radzen-wrap .rz-fileupload-row,
.bw-upload-radzen-wrap .rz-fileupload-buttonbar {
    display: none !important;
}

/* File list that appears after selection */
.bw-upload-radzen-wrap .rz-fileupload-files {
    width: 100%;
    padding: 8px 14px;
    font-size: 13px;
    color: var(--txt);
}

.bw-upload-radzen-wrap .rz-fileupload-row {
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid var(--bdr);
    font-size: 12px;
}

/* ── UPLOAD PROGRESS BAR ─────────────────────────────────────────────────── */
.bw-upload-progress {
    position: relative;
    width: 100%;
    height: 6px;
    background: var(--bdr);
    border-radius: 3px;
    overflow: hidden;
    margin-top: 10px;
}

.bw-upload-progress-bar {
    height: 100%;
    background: var(--teal);
    border-radius: 3px;
    transition: width .3s ease;
}

.bw-upload-progress-label {
    display: block;
    text-align: center;
    font-size: 11px;
    color: var(--muted);
    margin-top: 4px;
}
.bw-specs {
    display: grid;
    grid-template-columns: 1fr auto; /* Left flexible, right fixed */
    gap: 20px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   BOQ PAGE — Bill of Quantities
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Page header ── */
.boq-page-hdr {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 18px;
}

.boq-title {
    font-size: 1.5rem;
    font-weight: 800;
    margin-bottom: 4px;
}

.boq-subtitle {
    font-size: 12px;
    color: var(--muted);
}

.boq-hdr-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-shrink: 0;
}

.boq-btn-export {
    background: #1a7f37;
    color: #fff;
    border: none;
    padding: 9px 18px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s;
    white-space: nowrap;
}

    .boq-btn-export:hover {
        background: #22a244;
    }

/* ── Stat tiles ── */
.boq-tiles {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.boq-tile {
    background: var(--card-bg);
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    padding: 18px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.boq-tile-n {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.boq-tile-l {
    font-size: 12px;
    color: var(--muted);
}

.boq-blue {
    color: #3b82f6;
}

/* ── Body layout ── */
.boq-body {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

/* ── Left panel ── */
.boq-left {
    width: 260px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.boq-gen-card {
    background: var(--card-bg);
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    padding: 14px;
}

.boq-gen-title {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--bdr);
    color: var(--txt);
}

.boq-field-label {
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted);
    margin-top: 10px;
    margin-bottom: 5px;
}

    .boq-field-label:first-of-type {
        margin-top: 0;
    }

/* Spec tag row */
.boq-spec-tag {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--card-bg2);
    border: 1px solid var(--bdr);
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 600;
    color: var(--txt);
}

.boq-version-tag {
    background: rgba(139,148,158,.2);
    color: var(--muted);
    border-radius: 4px;
    padding: 1px 5px;
    font-size: 10px;
}

.boq-dd-tag {
    background: rgba(56,139,253,.15);
    color: #79b8ff;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: 700;
}

/* Plan file tag */
.boq-plan-tag {
    display: flex;
    align-items: center;
    gap: 7px;
    background: var(--card-bg2);
    border: 1px solid var(--bdr);
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 11px;
    color: var(--muted);
}

.boq-plan-ico {
    font-size: 13px;
}

/* Standard tag */
.boq-std-tag {
    background: var(--card-bg2);
    border: 1px solid var(--bdr);
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 12px;
    color: var(--txt);
}

/* Two-column contingency/currency */
.boq-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 10px;
}

.boq-cont-tag {
    background: rgba(56,139,253,.1);
    color: #79b8ff;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

.boq-curr-tag {
    background: rgba(56,139,253,.1);
    color: #79b8ff;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}

/* Software rows */
.boq-sw-subtitle {
    font-size: 11px;
    color: var(--dim);
    margin-bottom: 8px;
    margin-top: -6px;
}

.boq-sw-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 7px 0;
    border-bottom: 1px solid var(--bdr);
    gap: 8px;
}

    .boq-sw-row:last-child {
        border-bottom: none;
    }

.boq-sw-name {
    font-size: 12px;
    font-weight: 600;
    color: var(--txt);
}

.boq-sw-sub {
    font-size: 10px;
    color: var(--dim);
}

.boq-sw-badge {
    background: rgba(63,185,80,.12);
    border: 1px solid rgba(63,185,80,.3);
    color: var(--green);
    border-radius: 4px;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Division nav buttons */
.boq-divnav {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    background: none;
    border: none;
    border-radius: 5px;
    padding: 6px 8px;
    cursor: pointer;
    font-size: 12px;
    color: var(--muted);
    transition: background .12s, color .12s;
    text-align: left;
}

    .boq-divnav:hover {
        background: var(--card-bg2);
        color: var(--txt);
    }

    .boq-divnav.active {
        background: rgba(59,130,246,.1);
        color: #3b82f6;
    }

.boq-divnav-name {
    flex: 1;
    font-weight: 500;
}

.boq-divnav-total {
    font-size: 11px;
    color: var(--muted);
    margin-left: auto;
}

/* ── Right panel ── */
.boq-right {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    overflow: hidden;
}

/* ── Summary bar (dark) ── */
.boq-summary-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: #0d1117;
    padding: 16px 20px;
    gap: 4px;
    border-bottom: 1px solid #30363d;
}

/* Always dark regardless of theme */
.bw-theme-light .boq-summary-bar {
    background: #1a1f2e;
    border-bottom-color: #2d3549;
}

.boq-sb-item {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.boq-sb-label {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8b949e;
}

.boq-sb-value {
    font-size: 1.1rem;
    font-weight: 700;
    color: #e6edf3;
}

.boq-sb-total {
}

.boq-sb-value-lg {
    font-size: 1.4rem;
    font-weight: 800;
    color: #f0883e;
}

/* ── BOQ Table ── */
.boq-table-wrap {
    overflow-x: auto;
    overflow-y: auto;
    max-height: calc(100vh - 380px);
    background: var(--card-bg);
}

.boq-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    min-width: 900px;
}

    /* Sticky header */
    .boq-table thead th {
        position: sticky;
        top: 0;
        z-index: 2;
        background: var(--card-bg2);
        padding: 9px 12px;
        text-align: left;
        font-size: 10px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: var(--muted);
        border-bottom: 2px solid var(--bdr);
        white-space: nowrap;
    }

.boq-th-ref {
    width: 60px;
}

.boq-th-desc {
    min-width: 280px;
}

.boq-th-unit {
    width: 55px;
}

.boq-th-num {
    width: 110px;
    text-align: right;
}

/* Division header rows */
.boq-div-row td {
    padding: 10px 12px;
    background: color-mix(in srgb, var(--teal) 6%, var(--card-bg2));
    border-top: 2px solid var(--bdr);
    border-bottom: 1px solid var(--bdr);
    font-size: 13px;
    font-weight: 700;
}

.boq-div-icon {
    font-size: 14px;
    margin-right: 6px;
}

.boq-div-total {
    float: right;
    font-size: 12px;
    color: var(--teal);
    font-weight: 800;
}

/* Item rows */
.boq-item-row td {
    padding: 9px 12px;
    border-bottom: 1px solid color-mix(in srgb, var(--bdr) 60%, transparent);
    vertical-align: top;
}

.boq-item-row:hover td {
    background: var(--card-bg2);
}

.boq-provisional td {
    background: rgba(240,136,62,.04);
}

.boq-item-desc {
    font-size: 12px;
    color: var(--txt);
    line-height: 1.4;
    margin-bottom: 3px;
}

.boq-item-note {
    font-size: 10px;
    color: var(--muted);
    font-style: italic;
    line-height: 1.4;
}

.boq-td-ref {
    font-family: monospace;
    font-size: 11px;
    color: var(--muted);
    white-space: nowrap;
    vertical-align: top;
}

.boq-td-spec {
    font-family: monospace;
    font-size: 10px;
    color: var(--muted);
    white-space: pre-line;
}

.boq-td-plan {
    font-family: monospace;
    font-size: 10px;
    color: var(--muted);
    white-space: pre-line;
}

.boq-td-unit {
    font-size: 11px;
    color: var(--muted);
    text-align: center;
}

.boq-td-num {
    text-align: right;
    font-family: monospace;
}

.boq-rate {
    color: var(--muted);
}

.boq-amount {
    color: var(--txt);
    font-size: 13px;
}

/* Subtotal rows */
.boq-subtotal-row td {
    padding: 7px 12px;
    background: var(--card-bg2);
    border-top: 1px solid var(--bdr);
    border-bottom: 2px solid var(--bdr);
    font-size: 11px;
}

.boq-subtotal-label {
    color: var(--muted);
    font-style: italic;
}

.boq-subtotal-val {
    text-align: right;
    color: var(--txt);
    font-weight: 700;
    font-size: 12px;
}

/* Grand total rows */
.boq-grand-row td {
    padding: 8px 12px;
    border-bottom: 1px solid var(--bdr);
    font-size: 12px;
    color: var(--muted);
}

    .boq-grand-row td:first-child {
        padding-left: 20px;
        font-style: italic;
    }

.boq-grand-row .boq-td-num {
    color: var(--txt);
    font-weight: 600;
}

.boq-total-row td {
    padding: 12px;
    background: color-mix(in srgb, var(--teal) 8%, var(--card-bg2));
    border-top: 2px solid var(--teal);
    font-size: 14px;
    font-weight: 800;
    color: var(--txt);
}

.boq-total-val {
    text-align: right;
    color: var(--teal);
    font-size: 16px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   AI VENDOR EVALUATION PAGE  (/vendor-eval)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Page header ── */
.ve-page-hdr {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 18px;
}

.ve-title {
    font-size: 1.5rem;
    font-weight: 800;
    margin-bottom: 4px;
}

.ve-subtitle {
    font-size: 12px;
    color: var(--muted);
}

.ve-hdr-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-shrink: 0;
}

.ve-btn-demo, .ve-btn-run {
    display: flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg,#0891a8,#065f6b);
    color: #fff;
    border: none;
    padding: 9px 20px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity .15s;
    white-space: nowrap;
}

    .ve-btn-demo:hover, .ve-btn-run:hover {
        opacity: .9;
    }

    .ve-btn-demo:disabled, .ve-btn-run:disabled {
        opacity: .5;
        cursor: not-allowed;
    }

/* ── Add form ── */
.ve-form-card {
    background: var(--card-bg);
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    padding: 16px 18px;
    margin-bottom: 16px;
}

.ve-form-title {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
}

.ve-form-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

.ve-input {
    background: var(--card-bg2);
    border: 1px solid var(--bdr);
    border-radius: 6px;
    padding: 8px 12px;
    font-size: 13px;
    color: var(--txt);
    outline: none;
    flex: 1;
    min-width: 130px;
}

    .ve-input:focus {
        border-color: var(--teal);
    }

.ve-input-url {
    flex: 2;
}

.ve-select {
    background: var(--card-bg2);
    border: 1px solid var(--bdr);
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 13px;
    color: var(--txt);
    cursor: pointer;
}

.ve-btn-add {
    background: var(--teal);
    color: #000;
    border: none;
    padding: 8px 16px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

    .ve-btn-add:disabled {
        opacity: .4;
        cursor: not-allowed;
    }

/* Queue */
.ve-queue {
    margin-top: 12px;
    border-top: 1px solid var(--bdr);
    padding-top: 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ve-q-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 6px;
    background: var(--card-bg2);
    border-radius: 5px;
    font-size: 12px;
}

.ve-q-n {
    background: var(--bdr);
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
}

.ve-q-name {
    font-weight: 600;
    flex-shrink: 0;
}

.ve-q-url {
    color: var(--muted);
    font-size: 11px;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ve-q-tag {
    background: rgba(0,180,200,.1);
    color: var(--teal);
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 10px;
}

.ve-q-del {
    background: none;
    border: none;
    color: var(--muted);
    cursor: pointer;
    font-size: 14px;
}

    .ve-q-del:hover {
        color: #f85149;
    }

.ve-q-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 8px;
}

/* ── Progress bar ── */
.ve-progress {
    background: var(--card-bg);
    border: 1px solid var(--teal);
    border-radius: var(--r);
    padding: 14px 18px;
    margin-bottom: 16px;
    animation: bw-slidein .25s ease-out;
}

.ve-prog-top {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.ve-prog-ico {
    font-size: 16px;
}

.ve-prog-msg {
    font-size: 13px;
    flex: 1;
    color: var(--txt);
}

    .ve-prog-msg strong {
        color: var(--teal);
    }

.ve-prog-pct {
    font-size: 14px;
    font-weight: 800;
    color: var(--teal);
}

.ve-prog-track {
    width: 100%;
    height: 8px;
    background: var(--bdr);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 10px;
}

.ve-prog-bar {
    height: 100%;
    border-radius: 4px;
    transition: width .5s ease;
    background: linear-gradient(90deg,#065f6b,#00b4c8,#56d8eb);
    background-size: 200% 100%;
}

    .ve-prog-bar.active {
        animation: boq-shimmer 1.5s linear infinite;
    }

    .ve-prog-bar.done {
        background: var(--teal);
        animation: none;
    }

.ve-prog-tags {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.ve-tag {
    font-size: 11px;
    color: var(--dim);
    padding: 2px 8px;
    border-radius: 12px;
    border: 1px solid var(--bdr);
}

    .ve-tag.run {
        color: var(--teal);
        border-color: var(--teal);
        background: rgba(0,180,200,.08);
    }

    .ve-tag.done {
        color: var(--green);
        border-color: rgba(63,185,80,.4);
        background: rgba(63,185,80,.07);
    }

/* ── Summary tiles ── */
.ve-tiles {
    display: grid;
    grid-template-columns: repeat(6,1fr);
    gap: 10px;
    margin-bottom: 18px;
}

.ve-tile {
    background: var(--card-bg);
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    padding: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    color: var(--muted);
}

.ve-tile-n {
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 1;
}

.ve-muted-n {
    color: var(--muted);
}

.ve-green-n {
    color: var(--green);
}

.ve-orange-n {
    color: var(--orange);
}

.ve-red-n {
    color: #f85149;
}

/* ── Vendor eval card grid ── */
.ve-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px,1fr));
    gap: 14px;
    margin-bottom: 20px;
}

.ve-card {
    background: var(--card-bg);
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    padding: 16px;
    cursor: pointer;
    transition: border-color .15s;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    .ve-card:hover {
        border-color: #555;
    }

.ve-card-approved {
    border-left: 4px solid var(--green);
}

.ve-card-review {
    border-left: 4px solid var(--orange);
}

.ve-card-rejected {
    border-left: 4px solid #f85149;
}

/* Card header */
.ve-card-hdr {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.ve-card-name-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

.ve-card-verdict-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ve-dot-approved {
    background: var(--green);
}

.ve-dot-review {
    background: var(--orange);
}

.ve-dot-rejected {
    background: #f85149;
}

.ve-card-name {
    font-size: 14px;
    font-weight: 700;
}

.ve-card-spec {
    font-size: 11px;
    color: var(--muted);
    margin-top: 1px;
}

/* Verdict pill */
.ve-verdict-pill {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}

.ve-verdict-approved {
    background: rgba(63,185,80,.15);
    color: var(--green);
}

.ve-verdict-review {
    background: rgba(240,136,62,.15);
    color: var(--orange);
}

.ve-verdict-rejected {
    background: rgba(248,81,73,.15);
    color: #f85149;
}

/* URL row */
.ve-card-url-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.ve-url {
    font-size: 11px;
    color: var(--teal);
    text-decoration: none;
    word-break: break-all;
    flex: 1;
}

    .ve-url:hover {
        text-decoration: underline;
    }

/* Reachability chip */
.ve-reach-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}

.ve-reach-reachable {
    background: rgba(63,185,80,.12);
    color: var(--green);
}

.ve-reach-unreachable {
    background: rgba(248,81,73,.12);
    color: #f85149;
}

.ve-reach-retired {
    background: rgba(248,81,73,.12);
    color: #f85149;
}

.ve-reach-redirected {
    background: rgba(56,139,253,.12);
    color: #79b8ff;
}

.ve-reach-consumer {
    background: rgba(240,136,62,.12);
    color: var(--orange);
}

.ve-reach-unknown {
    background: rgba(139,148,158,.12);
    color: var(--muted);
}

/* Score bars */
.ve-score-row {
    display: flex;
    gap: 16px;
}

.ve-score-item {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
}

.ve-score-lbl {
    font-size: 10px;
    color: var(--muted);
    min-width: 38px;
}

.ve-score-track {
    flex: 1;
    height: 5px;
    background: var(--bdr);
    border-radius: 3px;
    overflow: hidden;
}

.ve-score-bar {
    height: 100%;
    border-radius: 3px;
    transition: width .4s;
}

.ve-risk-low {
    background: var(--green);
}

.ve-risk-med {
    background: var(--orange);
}

.ve-risk-high {
    background: #f85149;
}

.ve-qual-bar {
    background: var(--teal);
}

.ve-score-num {
    font-size: 11px;
    font-weight: 700;
    color: var(--muted);
    min-width: 24px;
    text-align: right;
}

/* Compliance ticks */
.ve-ticks {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.ve-tick {
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 12px;
    font-weight: 600;
    border: 1px solid;
}

    .ve-tick.ok {
        color: var(--green);
        border-color: rgba(63,185,80,.3);
        background: rgba(63,185,80,.08);
    }

    .ve-tick.no {
        color: var(--dim);
        border-color: var(--bdr);
        background: transparent;
    }

/* Summary + expand hint */
.ve-summary {
    font-size: 12px;
    color: var(--muted);
    font-style: italic;
    line-height: 1.4;
}

.ve-expand-hint {
    font-size: 10px;
    color: var(--dim);
    text-align: right;
    margin-top: -4px;
}

/* ── Expanded detail panel ── */
.ve-detail {
    border-top: 1px solid var(--bdr);
    padding-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.ve-detail-section {
    background: var(--card-bg2);
    border-radius: 6px;
    padding: 10px 12px;
}

.ve-detail-title {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--muted);
    margin-bottom: 7px;
}

.ve-flag-row {
    font-size: 12px;
    color: #f85149;
    padding: 2px 0;
}

    .ve-flag-row::before {
        content: "🚩 ";
    }

.ve-strength-row {
    font-size: 12px;
    color: var(--green);
    padding: 2px 0;
}

    .ve-strength-row::before {
        content: "✅ ";
    }

.ve-kv {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    font-size: 12px;
    margin-bottom: 5px;
}

    .ve-kv span:first-child {
        color: var(--muted);
        flex-shrink: 0;
    }

.ve-alt-section {
    background: rgba(0,180,200,.06);
    border: 1px solid rgba(0,180,200,.25);
}

.ve-alt-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--teal);
}

.ve-detail-ts {
    font-size: 10px;
    color: var(--dim);
    text-align: right;
}

/* ── JSON output card ── */
.ve-json-card {
    background: var(--card-bg);
    border: 1px solid var(--bdr);
    border-radius: var(--r);
    overflow: hidden;
}

.ve-json-hdr {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted);
    border-bottom: 1px solid var(--bdr);
    background: var(--card-bg2);
}

.ve-json-body {
    padding: 16px;
    font-family: monospace;
    font-size: 11px;
    color: var(--muted);
    overflow-x: auto;
    max-height: 400px;
    overflow-y: auto;
    white-space: pre;
    line-height: 1.6;
    margin: 0;
}