/* ══════════════════════════════════════════════════════════════
   Workspace overlay — folders / checklists / sticky notes / creds
   Reuses the app's :root theme tokens (--bg, --acc, --card, ...).
   All classes are namespaced `ws-` to avoid clashing with the app.
   ══════════════════════════════════════════════════════════════ */

.ws-launch {
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:calc(100% - 20px); margin:10px 10px 0; padding:9px 12px; min-height:36px;
  background:var(--bg2); color:var(--txt);
  border:1px solid var(--bdr2); border-radius:10px;
  font:600 13px/1 var(--sans); cursor:pointer; transition:.15s;
}
.ws-launch:hover { border-color:var(--bdr-a); background:var(--card-h); }
.ws-launch svg { stroke:var(--acc); }

.ws-overlay {
  position:fixed; inset:0; z-index:9999; display:none;
  background:rgba(3,4,9,.72); backdrop-filter:blur(6px);
  align-items:center; justify-content:center; padding:26px;
  font-family:var(--sans); color:var(--txt);
}
.ws-overlay.open { display:flex; }

.ws-panel {
  width:min(1180px,96vw); height:min(820px,92vh);
  background:var(--bg1); border:1px solid var(--bdr2);
  border-radius:var(--r-lg); box-shadow:var(--shdw-lg);
  display:grid; grid-template-columns:250px 1fr; overflow:hidden;
}

/* header spanning both columns via absolute close btn */
.ws-close {
  position:absolute; top:22px; right:26px; z-index:2;
  width:34px; height:34px; border-radius:9px; cursor:pointer;
  background:var(--bg2); border:1px solid var(--bdr2); color:var(--txt2);
  font-size:18px; line-height:1; display:flex; align-items:center; justify-content:center;
  transition:.15s;
}
.ws-close:hover { color:var(--acc); border-color:var(--bdr-a); }

/* ---- LEFT: folders ---- */
.ws-side { background:var(--bg); border-right:1px solid var(--bdr); display:flex; flex-direction:column; }
.ws-side-head { padding:20px 18px 12px; }
.ws-side-head h2 { font-size:15px; font-weight:700; letter-spacing:.3px; }
.ws-side-head p  { font-size:11px; color:var(--txt2); margin-top:3px; }
.ws-newfolder {
  display:flex; align-items:center; gap:7px; margin:4px 14px 10px;
  padding:9px 11px; border:1px dashed var(--bdr2); border-radius:9px;
  color:var(--txt2); font-size:12.5px; font-weight:600; cursor:pointer; transition:.15s;
}
.ws-newfolder:hover { color:var(--acc); border-color:var(--bdr-a); }
.ws-folders { flex:1; overflow-y:auto; padding:0 10px 14px; }
.ws-folder {
  display:flex; align-items:center; gap:8px; padding:9px 10px; margin-bottom:3px;
  border-radius:9px; cursor:pointer; color:var(--txt2); font-size:13px; transition:.12s;
}
.ws-folder:hover { background:var(--card-h); color:var(--txt); }
.ws-folder.active { background:var(--card-h); color:var(--txt); box-shadow:inset 2px 0 0 var(--acc); }
.ws-folder .ws-fname { flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ws-folder .ws-facts { display:none; gap:4px; }
.ws-folder:hover .ws-facts { display:flex; }
.ws-ico { width:26px; height:26px; border-radius:7px; border:1px solid var(--bdr2);
  background:var(--bg2); color:var(--txt2); display:flex; align-items:center; justify-content:center;
  font-size:12px; cursor:pointer; transition:.12s; }
.ws-ico:hover { color:var(--acc); border-color:var(--bdr-a); }

/* ---- RIGHT: content ---- */
.ws-main { display:flex; flex-direction:column; min-width:0; min-height:0; position:relative; }
.ws-tabs { display:flex; gap:4px; padding:20px 24px 0; border-bottom:1px solid var(--bdr); }
.ws-tab {
  padding:10px 15px; font-size:13px; font-weight:600; color:var(--txt2);
  border:none; background:none; cursor:pointer; border-bottom:2px solid transparent; transition:.12s;
}
.ws-tab:hover { color:var(--txt); }
.ws-tab.active { color:var(--txt); border-bottom-color:var(--acc); }
.ws-body { flex:1; min-height:0; overflow-y:auto; padding:22px 24px 40px; }
.ws-empty { color:var(--txt2); font-size:13px; text-align:center; margin-top:80px; }
.ws-empty b { display:block; color:var(--txt3); font-size:34px; margin-bottom:12px; }

.ws-addbar { display:flex; gap:8px; margin-bottom:18px; }
.ws-input, .ws-textarea {
  width:100%; background:var(--bg); border:1px solid var(--bdr2); border-radius:9px;
  color:var(--txt); font:13px/1.5 var(--sans); padding:9px 11px; outline:none; transition:.15s;
}
.ws-input:focus, .ws-textarea:focus { border-color:var(--bdr-a); }
.ws-textarea { resize:vertical; min-height:70px; }
.ws-btn {
  display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
  padding:9px 14px; border-radius:9px; border:1px solid var(--bdr2);
  background:var(--bg2); color:var(--txt); font:600 12.5px/1 var(--sans); cursor:pointer; transition:.15s;
}
.ws-btn:hover { border-color:var(--bdr-a); background:var(--card-h); }
.ws-btn.acc { background:var(--acc); border-color:var(--acc); color:#fff; }
.ws-btn.acc:hover { background:var(--acc2); }
.ws-btn.sm { padding:6px 9px; font-size:11.5px; }

/* checklists */
.ws-card {
  background:var(--card); border:1px solid var(--bdr); border-radius:var(--r);
  padding:15px 16px; margin-bottom:14px;
}
.ws-card-head { display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.ws-card-title { flex:1; font-weight:700; font-size:14px; background:none; border:none; color:var(--txt); outline:none; }
.ws-card-title:focus { border-bottom:1px dashed var(--bdr-a); }
.ws-prog { font-size:11px; color:var(--txt2); font-family:var(--mono); }
.ws-item { display:flex; align-items:center; gap:10px; padding:6px 2px; }
.ws-check {
  width:18px; height:18px; border-radius:5px; border:1.6px solid var(--bdr2);
  cursor:pointer; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  color:transparent; font-size:12px; transition:.12s;
}
.ws-check.on { background:var(--grn); border-color:var(--grn); color:#04120a; }
.ws-item-text { flex:1; font-size:13px; background:none; border:none; color:var(--txt); outline:none; }
.ws-item.done .ws-item-text { text-decoration:line-through; color:var(--txt2); }
.ws-x { cursor:pointer; color:var(--txt3); font-size:15px; padding:0 4px; transition:.12s; }
.ws-x:hover { color:var(--acc); }
.ws-additem { display:flex; gap:8px; margin-top:8px; }

/* sticky notes */
.ws-notes-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; }
.ws-note { border-radius:var(--r); padding:13px 14px; min-height:160px; display:flex; flex-direction:column;
  border:1px solid var(--bdr2); position:relative; }
.ws-note.amber  { background:linear-gradient(160deg,#3a2c05,#241c05); }
.ws-note.green  { background:linear-gradient(160deg,#043226,#04211a); }
.ws-note.cyan   { background:linear-gradient(160deg,#042b3a,#041d29); }
.ws-note.purple { background:linear-gradient(160deg,#241246,#170c2e); }
.ws-note.red    { background:linear-gradient(160deg,#3a0810,#26060b); }
.ws-note-title { font-weight:700; font-size:13.5px; background:none; border:none; color:var(--txt); outline:none; margin-bottom:6px; }
.ws-note-body  { flex:1; font-size:12.5px; line-height:1.55; background:none; border:none; color:var(--txt);
  outline:none; resize:none; width:100%; font-family:var(--sans); }
.ws-note-foot { display:flex; align-items:center; gap:5px; margin-top:8px; }
.ws-swatch { width:15px; height:15px; border-radius:50%; cursor:pointer; border:1.5px solid rgba(255,255,255,.25); }

/* credentials */
.ws-cred { background:var(--card); border:1px solid var(--bdr); border-radius:var(--r); padding:13px 15px; margin-bottom:12px; }
.ws-cred-head { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
.ws-cred-label { font-weight:700; font-size:14px; flex:1; }
.ws-cred-row { display:flex; align-items:center; gap:8px; font-size:12.5px; margin:4px 0; }
.ws-cred-row .k { color:var(--txt2); width:74px; flex-shrink:0; }
.ws-cred-row .v { flex:1; font-family:var(--mono); word-break:break-all; }
.ws-cred-row .v.sec { letter-spacing:2px; }
.ws-mini { background:none; border:1px solid var(--bdr2); border-radius:6px; color:var(--txt2);
  font-size:11px; padding:3px 7px; cursor:pointer; transition:.12s; }
.ws-mini:hover { color:var(--acc); border-color:var(--bdr-a); }

.ws-toast {
  position:fixed; bottom:26px; left:50%; transform:translateX(-50%);
  background:var(--sur2); border:1px solid var(--bdr2); color:var(--txt);
  padding:10px 16px; border-radius:10px; font-size:12.5px; z-index:10001;
  box-shadow:var(--shdw); opacity:0; transition:.2s;
}
.ws-toast.show { opacity:1; }

@media (max-width:720px){
  .ws-panel { grid-template-columns:1fr; }
  .ws-side { display:none; }
  .ws-side.mobi { display:flex; position:absolute; inset:0; z-index:3; width:250px; }
}

/* ── VAPT vulnerability search ─────────────────────────────── */
.ws-vuln-search{display:flex;align-items:center;gap:8px;margin:10px 0 12px;padding:9px 11px;background:var(--bg2);border:1px solid var(--bdr2);border-radius:10px;color:var(--txt3)}
.ws-vuln-search:focus-within{border-color:var(--bdr-a);box-shadow:0 0 0 3px rgba(232,25,44,.05)}
.ws-vuln-search svg{flex-shrink:0}.ws-vuln-search input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--txt);font:12.5px/1.4 var(--sans)}
.ws-vuln-search input::placeholder{color:var(--txt3)}.ws-vuln-search .ws-vuln-count{font:10px var(--mono);color:var(--txt3);white-space:nowrap}
.ws-vuln-search button{border:0;background:transparent;color:var(--txt3);cursor:pointer;font-size:15px;padding:0 2px;display:none}.ws-vuln-search.has-value button{display:block}.ws-vuln-search button:hover{color:var(--txt)}
.ws-vuln-empty{display:none;margin:8px 0 0;padding:24px;text-align:center;color:var(--txt3);font-size:12px;border:1px dashed var(--bdr2);border-radius:10px}.ws-vuln-match{outline:1px solid rgba(232,25,44,.28);outline-offset:-1px;background:rgba(232,25,44,.035)}

/* ── VAPT checklist table (v2) ─────────────────────────────── */
.ws-tablewrap { overflow-x:auto; margin-top:6px; border:1px solid var(--bdr); border-radius:10px; }
.ws-vtable { width:100%; border-collapse:collapse; font-size:12.5px; min-width:520px; }
.ws-vtable thead th {
  text-align:left; font-weight:600; color:var(--txt2); font-size:11px; letter-spacing:.4px;
  text-transform:uppercase; padding:9px 10px; background:var(--bg2); border-bottom:1px solid var(--bdr);
  position:sticky; top:0;
}
.ws-vtable td { padding:5px 8px; border-bottom:1px solid var(--bdr); vertical-align:middle; }
.ws-vtable tr:last-child td { border-bottom:none; }
.ws-vtable tr:hover td { background:rgba(255,255,255,.02); }
.ws-vtable .col-status { width:190px; }
.ws-vtable .col-rem    { width:34%; }
.ws-vtable .col-x      { width:34px; text-align:center; }
.ws-item-text, .ws-remark {
  width:100%; background:transparent; border:1px solid transparent; border-radius:6px;
  color:var(--txt); font:13px/1.4 var(--sans); padding:5px 7px; outline:none; transition:.12s;
}
.ws-item-text:focus, .ws-remark:focus { border-color:var(--bdr-a); background:var(--bg); }
.ws-remark { color:var(--txt2); }

.ws-status {
  width:100%; border-radius:7px; padding:6px 8px; cursor:pointer; outline:none;
  font:600 12px/1 var(--sans); border:1px solid var(--bdr2); background:var(--bg2);
  appearance:none; -webkit-appearance:none; transition:.12s;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%237b839e' stroke-width='3' stroke-linecap='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat; background-position:right 8px center; padding-right:24px;
}
.ws-status option { background:var(--bg1); color:var(--txt); }
.ws-st-pending    { color:var(--txt2); border-color:var(--bdr2); }
.ws-st-notfound   { color:var(--grn);  border-color:rgba(0,230,118,.4);  background:rgba(0,230,118,.08); }
.ws-st-vulnerable { color:var(--acc2); border-color:rgba(255,53,71,.45);  background:rgba(232,25,44,.12); }
.ws-st-na         { color:var(--cyn);  border-color:rgba(0,176,255,.35);  background:rgba(0,176,255,.07); }

.ws-prog { display:flex; gap:9px; align-items:center; font-size:11px; font-family:var(--mono); }
.ws-prog .p-v  { color:var(--acc2); }
.ws-prog .p-nf { color:var(--grn); }
.ws-prog .p-p  { color:var(--txt2); }

/* Load-template dropdown */
.ws-tpl-wrap { position:relative; }
.ws-tpl-menu {
  display:none; position:absolute; right:0; top:calc(100% + 6px); z-index:20;
  background:var(--bg1); border:1px solid var(--bdr2); border-radius:10px;
  box-shadow:var(--shdw-lg); padding:6px; min-width:210px;
}
.ws-tpl-menu.open { display:block; }
.ws-tpl-menu div {
  padding:9px 11px; border-radius:7px; font-size:12.5px; color:var(--txt2); cursor:pointer; transition:.12s;
}
.ws-tpl-menu div:hover { background:var(--card-h); color:var(--txt); }
.ws-tpl-menu .tpl-all { color:var(--acc2); font-weight:600; border-top:1px solid var(--bdr); margin-top:4px; padding-top:10px; }

/* ── Template manager dialog ─────────────────────────────── */
.ws-tpl-menu .tpl-manage { color:var(--txt); font-weight:600; border-top:1px solid var(--bdr); margin-top:4px; padding-top:10px; }
.ws-tpl-dialog { position:absolute; inset:0; z-index:30; background:rgba(3,4,9,.62);
  display:flex; align-items:center; justify-content:center; padding:20px; }
.ws-tpl-box { width:min(540px,94%); max-height:84%; display:flex; flex-direction:column;
  background:var(--bg1); border:1px solid var(--bdr2); border-radius:16px; box-shadow:var(--shdw-lg); padding:20px; }
.ws-tpl-h { display:flex; align-items:center; justify-content:space-between; }
.ws-tpl-h h3 { font-size:16px; font-weight:700; }
.ws-tpl-sub { font-size:12px; color:var(--txt2); margin:6px 0 14px; line-height:1.5; }
.ws-tpl-controls { display:flex; gap:8px; margin-bottom:12px; }
.ws-tpl-controls .ws-input { cursor:pointer; }
.ws-tpl-list { flex:1; min-height:60px; overflow-y:auto; border:1px solid var(--bdr); border-radius:10px; padding:6px; }
.tpl-meta { font-size:11px; color:var(--txt2); font-family:var(--mono); padding:6px 8px; }
.tpl-empty { font-size:12.5px; color:var(--txt3); text-align:center; padding:22px 8px; }
.tpl-row { display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:8px 10px; border-radius:8px; font-size:13px; }
.tpl-row:hover { background:var(--card-h); }
.tpl-row .ws-x { color:var(--txt3); }
.tpl-row .ws-x:hover { color:var(--acc); }

/* ── Excel tab (x-spreadsheet host) ─────────────────────────── */
.ws-sheet-bar { display:flex; align-items:center; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.ws-sheet-hint { font-size:12px; color:var(--txt2); }
.ws-sheet-host { height:68vh; min-height:420px; border:1px solid var(--bdr); border-radius:10px; overflow:hidden; background:#fff; }
.ws-sheet-host .x-spreadsheet { border-radius:10px; }

/* template manager: actions + list rows */
.ws-tpl-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.ws-tpl-actions .ws-btn { font-size:11.5px; }
.tpl-idx { color:var(--txt3); font-family:var(--mono); font-size:11px; width:26px; flex-shrink:0; text-align:right; }
.tpl-row span.name { flex:1; }

/* ── Markdown tab (editor + preview) ─────────────────────────── */
.ws-md-bar { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.ws-md-wrap { display:grid; grid-template-columns:1fr 1fr; gap:12px; height:66vh; min-height:400px; }
.ws-md-edit {
  width:100%; height:100%; resize:none; background:var(--bg); color:var(--txt);
  border:1px solid var(--bdr2); border-radius:10px; padding:14px;
  font:13px/1.6 var(--mono); outline:none;
}
.ws-md-edit:focus { border-color:var(--bdr-a); }
.ws-md-prev {
  height:100%; overflow-y:auto; background:var(--card); border:1px solid var(--bdr);
  border-radius:10px; padding:16px 18px; font-size:13.5px; line-height:1.6;
}
.ws-md-prev h1,.ws-md-prev h2,.ws-md-prev h3 { margin:.6em 0 .35em; line-height:1.25; }
.ws-md-prev h1 { font-size:1.5em; } .ws-md-prev h2 { font-size:1.3em; } .ws-md-prev h3 { font-size:1.12em; }
.ws-md-prev p,.ws-md-prev ul,.ws-md-prev ol { margin:.45em 0; }
.ws-md-prev code { background:var(--bg2); padding:1px 5px; border-radius:5px; font-family:var(--mono); font-size:.9em; }
.ws-md-prev pre { background:var(--bg); border:1px solid var(--bdr); border-radius:9px; padding:12px 14px; overflow-x:auto; }
.ws-md-prev pre code { background:none; padding:0; }
.ws-md-prev a { color:var(--cyn); }
.ws-md-prev blockquote { border-left:3px solid var(--bdr-a); margin:.5em 0; padding:.2em 0 .2em 12px; color:var(--txt2); }
.ws-md-prev table { border-collapse:collapse; margin:.5em 0; }
.ws-md-prev th,.ws-md-prev td { border:1px solid var(--bdr); padding:6px 10px; }
@media (max-width:720px){ .ws-md-wrap { grid-template-columns:1fr; height:auto; } .ws-md-edit,.ws-md-prev { min-height:280px; } }

/* ── Markdown toolbar + view toggle ─────────────────────────── */
.ws-md-views { display:flex; gap:4px; margin-right:8px; }
.ws-md-vbtn {
  font:600 11px/1 var(--sans); border:1px solid var(--bdr2); background:var(--bg2); color:var(--txt2);
  border-radius:7px; padding:6px 10px; cursor:pointer; transition:.12s;
}
.ws-md-vbtn:hover { color:var(--txt); }
.ws-md-vbtn.active { color:#fff; background:var(--acc); border-color:var(--acc); }
.ws-md-tools {
  display:flex; flex-wrap:wrap; align-items:center; gap:4px; margin-bottom:10px;
  padding:7px 8px; background:var(--bg2); border:1px solid var(--bdr); border-radius:10px;
}
.ws-md-tools button {
  min-width:30px; height:30px; padding:0 8px; border:1px solid transparent; background:none;
  color:var(--txt); border-radius:7px; cursor:pointer; font:600 12.5px/1 var(--sans); transition:.12s;
}
.ws-md-tools button:hover { background:var(--card-h); border-color:var(--bdr2); }
.ws-md-tools .sep { width:1px; height:18px; background:var(--bdr2); margin:0 4px; }
/* view modes */
.ws-md-wrap.view-edit { grid-template-columns:1fr; }
.ws-md-wrap.view-edit .ws-md-prev { display:none; }
.ws-md-wrap.view-prev { grid-template-columns:1fr; }
.ws-md-wrap.view-prev .ws-md-edit { display:none; }