/* Modal dialogs: price-list edit, opportunity, confirm, help. */
.modal{position:fixed;inset:0;background:rgba(24,25,39,.72);display:flex;align-items:center;justify-content:center;z-index:60;padding:16px}
.modal.hide{display:none}
.modal-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:26px 28px;width:560px;max-width:100%;max-height:92vh;overflow:auto;box-shadow:var(--shadow);position:relative}
.modal-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--sig);border-radius:var(--r) var(--r) 0 0}
.modal-card h3{margin:0 0 4px;color:var(--text);font-size:21px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.modal-card .eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--blue-ink);font-weight:800;margin-bottom:8px}
.modal-card .sub{color:var(--muted);font-size:14px;margin:0 0 18px}
.modal-card.narrow{width:440px}
.modal-actions{display:flex;align-items:center;gap:8px;margin-top:22px}
.modal-card .x{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:0;background:transparent;color:var(--muted);cursor:pointer;display:grid;place-items:center}
.modal-card .x:hover{background:var(--surface);color:var(--text)}
.modal-card .x svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
button.btn.danger{background:var(--red);color:#fff}
.helpsec{margin-top:16px}.helpsec b{display:block;font-size:15px;color:var(--text);margin-bottom:3px}.helpsec p{color:var(--muted);font-size:14px;line-height:1.5}
.helpsec+.helpsec{padding-top:14px;border-top:1px solid var(--line)}
.btn.sm{width:auto;padding:10px 22px}
.modal-card:focus{outline:none} /* focused by script when a dialog opens; the card itself is not a control */