.pgx{font-family:Inter,system-ui,Arial,Helvetica,sans-serif;color:#0f172a}
.pgx h2,h3{margin:8px 0 10px}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:14px;box-shadow:0 8px 32px rgba(2,6,23,.05)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
input,select,button{padding:10px 12px;border:1px solid #e2e8f0;border-radius:12px}
input:focus,select:focus{outline:2px solid #93c5fd;border-color:#93c5fd}
button{background:#2563eb;border:0;color:#fff;border-radius:12px;font-weight:700;cursor:pointer}
button.secondary{background:#0ea5e9}
button.danger{background:#ef4444}
.badge{display:inline-block;background:#eef2ff;color:#3730a3;border:1px solid #c7d2fe;border-radius:999px;padding:6px 10px;font-weight:700}
.progress{height:10px;border-radius:999px;background:#f1f5f9;margin:12px 0;overflow:hidden}
.progress>i{display:block;height:100%;background:#2563eb;width:0}
.pgx-table table{width:100%;border-collapse:collapse}
.pgx-table th,.pgx-table td{border-bottom:1px solid #e5e7eb;padding:10px;text-align:left;vertical-align:middle}
img.thumb{max-width:120px;max-height:120px;border-radius:8px;border:1px solid #e5e7eb;cursor:zoom-in}
img.thumb.xs{max-width:60px;max-height:60px;margin-right:8px;vertical-align:middle}
.pgq-empty{opacity:.7}
#pgq-lightbox{display:none;position:fixed;inset:0;z-index:999998;background:rgba(0,0,0,.85);align-items:center;justify-content:center}
#pgq-lightbox img{max-width:90%;max-height:90%;border-radius:10px;box-shadow:0 10px 40px rgba(0,0,0,.6)}
#pgq-print{display:none;position:fixed;inset:0;z-index:999999;background:rgba(2,6,23,.9);color:#111827}
#pgq-print .panel{background:#fff;border-radius:12px;max-width:900px;margin:30px auto;padding:16px;box-shadow:0 10px 40px rgba(0,0,0,.6)}
#pgq-print .panel .bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
#pgq-print .wrap{display:flex;gap:12px;flex-wrap:wrap}
.pgq-label{width:105mm;height:148mm;border:1px dashed #94a3b8;border-radius:8px;padding:8px;box-sizing:border-box;display:flex;flex-direction:column;gap:6px;page-break-after:always}
.pgq-label .row1{display:flex;justify-content:space-between}
.pgq-label .qr{width:35mm;height:35mm;border:1px solid #e5e7eb;border-radius:6px;display:flex;align-items:center;justify-content:center}
.pgq-label .meta{font-size:25px;line-height:1.15}
.pgq-label .big{font-size:24px;font-weight:800}
.pgq-label small{color:#475569}
#sx-suggest .sx-sg-item:hover{background:#f8fafc}
#pgq-progress-text.pct{font-size:12px;opacity:.85;margin-top:-6px;margin-bottom:10px}
@media print{
  body *:not(#pgq-print):not(#pgq-print *){visibility:hidden}
  #pgq-print, #pgq-print *{visibility:visible}
  #pgq-print{background:#fff}
  #pgq-print .panel{box-shadow:none;margin:0;padding:0}
}

/* Dashboard KPIs */
.kpis{display:flex;gap:14px;margin-top:12px;flex-wrap:wrap}
.kpi{flex:1 1 160px;background:#f8fafc;border:1px solid #e5e7eb;border-radius:14px;padding:14px;min-width:180px}
.kpi-label{font-size:12px;color:#475569;margin-bottom:6px}
.kpi-value{font-size:28px;font-weight:800}

/* Dashboard charts */
.pgx-d-charts{margin-top:14px}
.rings{display:flex;gap:16px;flex-wrap:wrap}
.ring{position:relative;width:180px;height:180px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e5e7eb;border-radius:14px}
.ring canvas{width:160px !important;height:160px !important}
.ring-center{position:absolute;text-align:center}
.ring-center span{font-size:26px;font-weight:800;display:block}
.ring-center small{color:#64748b}
.barwrap{margin-top:16px;background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:12px}

/* === Inline code list inside KPI === */
.kpi .kpi-codes{margin-top:8px;max-height:96px;overflow:auto;display:flex;flex-wrap:wrap;gap:6px}
.kpi .kpi-codes .chip{background:#eef2ff;border:1px solid #e5e7eb;border-radius:999px;padding:2px 8px;font-size:12px;white-space:normal;overflow-wrap:anywhere;line-height:1.2}
.kpi .kpi-codes .chip.warn{background:#fee2e2}


/* === Patch v3: Fix KPI scroll + prevent chip stretch === */
.kpi{display:flex;flex-direction:column}
.kpi .kpi-codes{max-height:none;flex:1;overflow:auto;display:flex;flex-wrap:wrap;gap:6px;align-content:flex-start}
.kpi .kpi-codes .chip{flex:0 0 auto}


/* === Patch v5: Highlight GH area when expanded === */
.gh-row .gh-box{
  background:#fff7ed;
  border:1px dashed #f59e0b;
  border-radius:12px;
  padding:12px;
  margin-top:8px;
}


/* === Patch v6: Make 'Tải ảnh' upload button prominent === */
.upload-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  border-radius:999px;
  font-weight:700;
  background:#2563eb;
  color:#fff;
  border:1px solid #1d4ed8;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(37,99,235,.25);
  user-select:none;
}
.upload-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(37,99,235,.35); }
.upload-btn:active{ transform:translateY(0); box-shadow:0 2px 10px rgba(37,99,235,.2); }
.upload-btn input[type=file]{ display:none !important; }

.pgq-label .meta b{font-weight:800}