/* ============================================================
   DataLab QC Module – styles.css
   Light theme, matches navbar bg-primary (#0d6efd)
   ============================================================ */

:root {
  --qc-primary:   #0d6efd;
  --qc-primary-dk:#0a58ca;
  --qc-success:   #28a745;
  --qc-warning:   #ffc107;
  --qc-danger:    #dc3545;
  --qc-info:      #17a2b8;
  --qc-light:     #f8f9fa;
  --qc-border:    #dee2e6;
  --qc-text:      #212529;
  --qc-muted:     #6c757d;
  --qc-white:     #ffffff;
  --qc-radius:    8px;
  --qc-shadow:    0 2px 8px rgba(0,0,0,.08);
}

/* ---- Base ---- */
body { background:#f4f6fb; font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif; color:var(--qc-text); }

/* ---- Nav tabs (section switcher) ---- */
.qc-nav { border-bottom:2px solid var(--qc-border); margin-bottom:1.5rem; }
.qc-nav .nav-link { color:var(--qc-muted); border:none; padding:.55rem 1.1rem; font-weight:500; border-radius:var(--qc-radius) var(--qc-radius) 0 0; }
.qc-nav .nav-link:hover { color:var(--qc-primary); background:#e8f0fe; }
.qc-nav .nav-link.active { color:var(--qc-primary); border-bottom:3px solid var(--qc-primary); background:var(--qc-white); font-weight:600; }

/* ---- Cards ---- */
.qc-card { background:var(--qc-white); border-radius:var(--qc-radius); box-shadow:var(--qc-shadow); padding:1.25rem; margin-bottom:1.25rem; border:1px solid var(--qc-border); }
.qc-card-header { background:var(--qc-primary); color:#fff; border-radius:var(--qc-radius) var(--qc-radius) 0 0; padding:.75rem 1.25rem; font-weight:600; margin:-1.25rem -1.25rem 1rem; }

/* ---- Summary stat boxes ---- */
.qc-stat { background:var(--qc-white); border-radius:var(--qc-radius); box-shadow:var(--qc-shadow); padding:1rem 1.25rem; border-left:4px solid var(--qc-primary); }
.qc-stat.pass  { border-left-color:var(--qc-success); }
.qc-stat.warn  { border-left-color:var(--qc-warning); }
.qc-stat.fail  { border-left-color:var(--qc-danger);  }
.qc-stat-val { font-size:2rem; font-weight:700; line-height:1; }
.qc-stat-lbl { font-size:.8rem; color:var(--qc-muted); margin-top:.25rem; }

/* ---- Status badges ---- */
.qc-badge { display:inline-block; padding:.25em .65em; border-radius:999px; font-size:.75rem; font-weight:600; }
.qc-badge-pass  { background:#d4edda; color:#155724; }
.qc-badge-warn  { background:#fff3cd; color:#856404; }
.qc-badge-fail  { background:#f8d7da; color:#721c24; }
.qc-badge-info  { background:#d1ecf1; color:#0c5460; }

/* ---- Levey-Jennings chart container ---- */
#ljCanvas { width:100% !important; max-height:380px; }

/* ---- Table ---- */
.qc-table { font-size:.875rem; }
.qc-table thead { background:var(--qc-primary); color:#fff; }
.qc-table tbody tr:hover { background:#e8f0fe; }
.qc-table .pass { background:#f0fff4; }
.qc-table .warn { background:#fffde7; }
.qc-table .fail { background:#fff5f5; }

/* ---- Buttons (match navbar primary) ---- */
.btn-qc { background:var(--qc-primary); color:#fff; border:none; }
.btn-qc:hover { background:var(--qc-primary-dk); color:#fff; }
.btn-qc-outline { border:1px solid var(--qc-primary); color:var(--qc-primary); background:transparent; }
.btn-qc-outline:hover { background:var(--qc-primary); color:#fff; }

/* ---- Lock banner ---- */
.qc-lock-banner { background:#f8d7da; border:1px solid #f5c6cb; border-radius:var(--qc-radius); padding:.85rem 1.25rem; margin-bottom:1rem; display:flex; align-items:center; gap:.75rem; }
.qc-lock-banner i { font-size:1.5rem; color:var(--qc-danger); }
.qc-lock-banner strong { color:#721c24; }

/* ---- Westgard sidebar panel (injected in record_result) ---- */
#qc-westgard-panel { background:var(--qc-white); border:1px solid var(--qc-border); border-radius:var(--qc-radius); padding:.85rem; margin-bottom:1rem; box-shadow:var(--qc-shadow); }
#qc-westgard-panel h6 { color:var(--qc-primary); font-weight:700; margin-bottom:.65rem; border-bottom:1px solid var(--qc-border); padding-bottom:.4rem; }
.qc-rule-row { display:flex; justify-content:space-between; align-items:center; padding:.2rem 0; font-size:.8rem; border-bottom:1px solid #f0f0f0; }
.qc-rule-row:last-child { border-bottom:none; }

/* ---- Spinner ---- */
.qc-spinner { width:2rem; height:2rem; border:.25rem solid var(--qc-border); border-top-color:var(--qc-primary); border-radius:50%; animation:spin .7s linear infinite; margin:auto; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ---- EQA ---- */
.z-score-ok   { color:var(--qc-success); font-weight:600; }
.z-score-warn { color:#e67e00; font-weight:600; }
.z-score-fail { color:var(--qc-danger); font-weight:600; }

/* ---- Responsive tweaks ---- */
@media(max-width:768px) {
  .qc-nav .nav-link { padding:.4rem .6rem; font-size:.82rem; }
}