/* checklist.css — interactive BP344 audit tool */

button.btn-ghost,button.btn-primary{cursor:pointer;font-family:inherit;background:transparent}
button.btn-primary{background:var(--blue)}
button.btn-ghost:disabled,button.btn-primary:disabled{opacity:.5;cursor:default}

.cl-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.cl-toolbar button{background:#0d1e38;border:1px solid var(--border);color:var(--text);padding:9px 16px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.cl-toolbar button:hover{border-color:var(--blue);color:#fff}
.cl-toolbar #cl-reset{margin-left:auto;color:#ff8c8c;border-color:#3a1e28}
.cl-toolbar #cl-reset:hover{border-color:#ef5350}

.cl-field{margin-bottom:14px}
.cl-field label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:5px;letter-spacing:.02em}
.cl-field input{width:100%;padding:10px 12px;background:#0a1628;border:1px solid var(--border);border-radius:8px;color:#fff;font-size:14px;font-family:inherit;outline:none}
.cl-field input:focus{border-color:var(--blue)}
.cl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 16px}
@media(max-width:600px){.cl-grid{grid-template-columns:1fr}}

.cl-progress-bar{position:sticky;top:56px;z-index:90;background:#0d1e38;border-bottom:1px solid var(--border);padding:12px 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cl-progress-track{flex:1;min-width:140px;height:8px;background:#162040;border-radius:5px;overflow:hidden}
.cl-progress-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--accent));width:0%;transition:width .2s}
.cl-progress-text{font-size:12px;color:var(--muted);white-space:nowrap}
.cl-progress-stats{display:flex;gap:14px;font-size:12px;white-space:nowrap}
.cl-progress-stats .ok{color:var(--green);font-weight:600}
.cl-progress-stats .bad{color:#ef5350;font-weight:600}
@media(max-width:700px){.cl-progress-bar{top:0;padding:10px 16px}}

.cl-section{background:var(--card);border:1px solid var(--border);border-radius:12px;margin-bottom:12px;overflow:hidden}
.cl-sec-head{width:100%;display:flex;align-items:center;gap:12px;padding:16px 18px;background:none;border:none;color:#fff;font-size:15px;font-weight:700;cursor:pointer;text-align:left;font-family:inherit}
.cl-sec-title{flex:1}
.cl-sec-count{font-size:12px;font-weight:600;color:var(--accent);background:#0f2040;padding:3px 10px;border-radius:5px}
.cl-sec-chevron{transition:transform .18s;color:var(--muted)}
.cl-section.open .cl-sec-chevron{transform:rotate(180deg)}
.cl-sec-body{display:none;padding:0 18px 16px}
.cl-section.open .cl-sec-body{display:block}

.cl-item{padding:14px 0;border-top:1px solid #162040}
.cl-item:first-child{border-top:none}
.cl-item-top{display:flex;gap:12px;align-items:flex-start}
.cl-item-num{flex-shrink:0;width:22px;height:22px;border-radius:6px;background:#0a1628;color:var(--muted);font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px}
.cl-item-body{flex:1;min-width:160px}
.cl-item-text{font-size:14px;color:#fff;font-weight:500;line-height:1.4}
.cl-item-std{font-size:12px;color:var(--accent);font-family:'JetBrains Mono',monospace;margin-top:3px}
.cl-item-status{display:flex;gap:6px;flex-wrap:wrap;flex-shrink:0}
.cl-item-status button{font-size:11px;font-weight:600;padding:7px 10px;border-radius:6px;border:1px solid var(--border);background:#0a1628;color:var(--muted);cursor:pointer;font-family:inherit;white-space:nowrap}
.cl-item-status button:hover{border-color:var(--blue);color:#fff}
.cl-item-status button.active.ok{background:rgba(0,208,132,.18);border-color:var(--green);color:var(--green)}
.cl-item-status button.active.bad{background:rgba(239,83,80,.18);border-color:#ef5350;color:#ef5350}
.cl-item-status button.active.na{background:rgba(107,132,168,.22);border-color:var(--muted);color:#cbd6e6}
.cl-item-remarks{margin-top:8px;margin-left:34px;width:calc(100% - 34px);padding:7px 10px;background:#0a1628;border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:12.5px;font-family:inherit;outline:none}
.cl-item-remarks:focus{border-color:var(--blue)}
@media(max-width:560px){.cl-item-remarks{margin-left:0;width:100%}}

.cl-download-float{position:fixed;bottom:22px;right:22px;z-index:95;background:var(--blue);color:#fff;border:none;padding:14px 22px;border-radius:30px;font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 10px 28px rgba(10,132,255,.4);font-family:inherit}
.cl-download-float:hover{opacity:.92}
@media(max-width:560px){.cl-download-float{bottom:14px;right:14px;left:14px;text-align:center}}

/* Lead gate modal */
.cl-gate-overlay{position:fixed;inset:0;background:rgba(4,11,22,.82);backdrop-filter:blur(5px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px;opacity:0;pointer-events:none;transition:opacity .22s}
.cl-gate-overlay.open{opacity:1;pointer-events:all}
.cl-gate-box{background:#0b1828;border:1px solid var(--border);border-radius:18px;padding:32px 28px;width:100%;max-width:440px;position:relative;transform:translateY(16px);transition:transform .24s}
.cl-gate-overlay.open .cl-gate-box{transform:translateY(0)}
.cl-gate-close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--muted);font-size:26px;cursor:pointer}
.cl-gate-close:hover{color:#fff}
.cl-gate-icon{font-size:30px;margin-bottom:10px}
.cl-gate-box h3{color:#fff;font-size:19px;font-weight:800;margin-bottom:8px}
.cl-gate-box p{color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:20px}
.cl-gate-error{display:none;color:#ef5350;font-size:12.5px;margin-top:10px;text-align:center}
.cl-gate-note{font-size:11px;color:var(--muted);text-align:center;margin-top:12px;line-height:1.5}
