/* ==================================================================
   P1 VENDOR HUB, PRECISION Program rules (portal v1.89, Wave 1 workstream C). Classes: pzx-*.
   Scope rules, contract timings, emergencies. Shared pieces (.pzbtn, .pzs, .pzcard, .pzlink)
   are in precision.css. rules/design.md: light surfaces, hairline borders, quiet status text,
   dark primary buttons, no red buttons, no emoji, 16px inputs on a phone.
   ================================================================== */
html.pz-on .pzx{display:flex;flex-direction:column;gap:20px;max-width:1120px;box-sizing:border-box;width:100%;
  font-family:var(--pz-font);color:var(--pz-ink);font-size:14px;line-height:20px;padding:6px 0 28px}
html.pz-on .pzx *{box-sizing:border-box}
html.pz-on .pzx button,html.pz-on .pzx input,html.pz-on .pzx select,html.pz-on .pzx textarea{font-family:inherit}
html.pz-on .pzx-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
html.pz-on .pzx-h1{margin:0;font-family:var(--pz-hfont);font-weight:600;font-size:26px;line-height:34px;letter-spacing:-.01em}
html.pz-on .pzx-sub{margin:6px 0 0;font-size:15px;line-height:22px;color:#475569;max-width:720px}
html.pz-on .pzx-quiet{font-size:13px;color:#5f6b7d}
html.pz-on .pzx-tabs{display:flex;gap:4px;flex-wrap:wrap}
html.pz-on .pzx-tab{height:34px;padding:0 14px;border-radius:8px;border:1px solid transparent;background:transparent;font-size:13.5px;color:#475569;cursor:pointer;display:flex;align-items:center;gap:8px}
html.pz-on .pzx-tab:hover{background:var(--pz-hover)}
html.pz-on .pzx-tab.on{border-color:var(--pz-line);background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.05);font-weight:700;color:var(--pz-ink)}
html.pz-on .pzx-tab:focus-visible,html.pz-on .pzx button:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
html.pz-on .pzx-tab .ct{font-size:12px;font-weight:700;color:#b45309}
html.pz-on .pzx-sel{height:34px;padding:0 10px;border:1px solid var(--pz-line-2);border-radius:8px;background:#fff;font-size:13.5px;color:var(--pz-ink);max-width:100%}

/* a block (card) */
html.pz-on .pzx-card{background:var(--pz-surface);border:1px solid var(--pz-line);border-radius:var(--pz-radius);box-shadow:var(--pz-shadow);overflow:hidden}
html.pz-on .pzx-ch{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;border-bottom:1px solid var(--pz-line);flex-wrap:wrap}
html.pz-on .pzx-ch h2{margin:0;font:700 15px/1.3 var(--pz-font)}
html.pz-on .pzx-ch .pzx-quiet{margin-top:2px}
html.pz-on .pzx-cb{padding:16px 20px}
html.pz-on .pzx-note{font-size:13px;color:#475569;line-height:19px;margin:0}
html.pz-on .pzx-note b{color:var(--pz-ink)}
html.pz-on .pzx-sum{display:flex;gap:28px;flex-wrap:wrap;padding:14px 20px;background:#fbfcfd;border-bottom:1px solid var(--pz-line)}
html.pz-on .pzx-sum div{min-width:0}
html.pz-on .pzx-sum .k{font-size:12px;color:#5f6b7d}
html.pz-on .pzx-sum .v{font-size:20px;font-weight:700;font-variant-numeric:tabular-nums}

/* rows */
html.pz-on .pzx-row{display:grid;gap:16px;align-items:center;padding:12px 20px;border-bottom:1px solid #eef1f4}
html.pz-on .pzx-row:last-child{border-bottom:0}
html.pz-on .pzx-row.r-svc{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) 200px}
html.pz-on .pzx-row.r-reg{grid-template-columns:120px minmax(0,1fr) 110px 120px;padding:8px 20px 8px 36px;background:#fbfcfd;font-size:13px}
html.pz-on .pzx-row.r-sla{grid-template-columns:minmax(0,1.7fr) minmax(0,1.1fr) 110px 120px 90px 70px}
html.pz-on .pzx-row.r-oc{grid-template-columns:28px minmax(0,1fr) 150px 110px minmax(0,220px)}
html.pz-on .pzx-row.r-ov{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 120px minmax(0,1.4fr) 70px}
html.pz-on .pzx-row.r-em{grid-template-columns:120px minmax(0,1.2fr) minmax(0,1.6fr) 120px}
html.pz-on .pzx-th{font-size:12px;color:#5f6b7d;background:#fbfcfd;padding-top:8px;padding-bottom:8px}
html.pz-on .pzx-name{font-weight:700;overflow-wrap:anywhere}
html.pz-on .pzx-small{font-size:12.5px;color:#5f6b7d;overflow-wrap:anywhere}
html.pz-on .pzx-act{display:flex;gap:10px;justify-content:flex-end;align-items:center;flex-wrap:wrap}
html.pz-on .pzx-good{color:var(--pz-good);font-weight:700}
html.pz-on .pzx-warn{color:var(--pz-due);font-weight:700}
html.pz-on .pzx-bad{color:var(--pz-late);font-weight:700}
html.pz-on .pzx-info{color:var(--pz-info);font-weight:700}
html.pz-on .pzx-mute{color:#64748b;font-weight:600}

/* in-page panels (edit, confirm) */
html.pz-on .pzx-pan{margin:0;padding:14px 20px 16px;background:#f8fafc;border-bottom:1px solid #eef1f4}
html.pz-on .pzx-pan h3{margin:0 0 8px;font:700 14px/1.3 var(--pz-font)}
html.pz-on .pzx-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
html.pz-on .pzx-fld{display:flex;flex-direction:column;gap:4px;min-width:0}
html.pz-on .pzx-fld.wide{grid-column:1 / -1}
html.pz-on .pzx-fld label,html.pz-on .pzx-lbl{font-size:12px;color:#475569;font-weight:600}
html.pz-on .pzx-in,html.pz-on .pzx-ta{width:100%;border:1px solid var(--pz-line-2);border-radius:8px;background:#fff;padding:8px 10px;font-size:14px;line-height:20px;color:var(--pz-ink);min-height:36px}
html.pz-on .pzx-ta{min-height:68px;resize:vertical}
html.pz-on .pzx-in:focus,html.pz-on .pzx-ta:focus,html.pz-on .pzx-sel:focus{outline:2px solid #2563eb;outline-offset:1px}
html.pz-on .pzx-months{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
html.pz-on .pzx-mo{display:flex;align-items:center;gap:6px;font-size:13px;padding:5px 8px;border:1px solid var(--pz-line-2);border-radius:8px;background:#fff;cursor:pointer;user-select:none}
html.pz-on .pzx-mo input{margin:0}
html.pz-on .pzx-btns{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;align-items:center}
html.pz-on .pzx-msg{margin-top:10px;font-size:13px}
html.pz-on .pzx-check{display:flex;align-items:center;gap:8px;font-size:13.5px}
html.pz-on .pzx-check input{margin:0;width:16px;height:16px}
html.pz-on .pzx-state{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
html.pz-on .pzx-big{font-size:15px;font-weight:700}
html.pz-on .pzx-list{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
html.pz-on .pzx-list li{display:flex;gap:8px;align-items:baseline;font-size:13.5px}
html.pz-on .pzx-empty{padding:22px 20px;border:1px dashed var(--pz-line-2);border-radius:var(--pz-radius);background:#fff;color:#475569;font-size:14px}
html.pz-on .pzx-skel{height:84px;border-radius:12px}
html.pz-on .pzx-fine{font-size:12.5px;color:#64748b}

@media (max-width:760px){
  html.pz-on .pzx{gap:16px;padding-bottom:96px}
  html.pz-on .pzx-h1{font-size:22px;line-height:28px}
  html.pz-on .pzx-sub{font-size:14px;line-height:20px}
  html.pz-on .pzx-tab{height:38px;padding:0 12px}
  html.pz-on .pzx-ch,html.pz-on .pzx-cb,html.pz-on .pzx-pan,html.pz-on .pzx-sum{padding-left:14px;padding-right:14px}
  html.pz-on .pzx-row,html.pz-on .pzx-row.r-svc,html.pz-on .pzx-row.r-sla,html.pz-on .pzx-row.r-oc,html.pz-on .pzx-row.r-ov,html.pz-on .pzx-row.r-em{grid-template-columns:minmax(0,1fr);gap:6px;padding:12px 14px}
  html.pz-on .pzx-row.r-reg{grid-template-columns:minmax(0,1fr);gap:4px;padding:10px 14px 10px 24px}
  html.pz-on .pzx-th{display:none}
  html.pz-on .pzx-act{justify-content:flex-start}
  html.pz-on .pzx-grid{grid-template-columns:minmax(0,1fr)}
  html.pz-on .pzx-months{grid-template-columns:repeat(4,minmax(0,1fr))}
  html.pz-on .pzx-in,html.pz-on .pzx-ta,html.pz-on .pzx-sel{font-size:16px;min-height:44px}
  html.pz-on .pzx .pzbtn{height:44px}
  html.pz-on .pzx-sum{gap:18px}
}
