/* ============================================================================
   vault.css — tweaks specific to the Vault module ONLY.
   No fonts/colors/global styles here (core.css owns all tokens).
   Everything leans on documented .card/.kpi/.table/.list/.attn/etc classes;
   this file only adds: the gauge overlay core + storage breakdown, the
   .vault-folder tiles, the recent-docs cell layout, shared-link rows and
   the category-donut legend. All classes are prefixed .vault-* and use
   ONLY palette tokens via var(--…).
   ========================================================================== */

/* keep KPI sparks hugging the bottom, like the Command Deck vitals */
.vault-kpi .spark{margin-top:10px}

/* ── storage gauge: svg + centred overlay core ───────────────────────────── */
.vault-gauge{display:flex;flex-direction:column;align-items:center;gap:14px}
.vault-gauge-ring{position:relative;width:200px;max-width:100%}
.vault-gauge-ring .chart{height:200px}
.vault-gauge-core{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.vault-gauge-core .vg-num{font-family:var(--font-display);font-size:38px;font-weight:600;letter-spacing:-.5px;line-height:1;font-variant-numeric:tabular-nums}
.vault-gauge-core .vg-lbl{font-family:var(--font-mono);font-size:9px;letter-spacing:2px;color:var(--text-faint);margin-top:5px}

/* storage-by-type breakdown rows */
.vault-gauge-breakdown{width:100%;display:flex;flex-direction:column;gap:9px;padding-top:4px;border-top:1px solid var(--border)}
.vault-bd-row{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:10px}
.vault-bd-dot{width:9px;height:9px;border-radius:3px;background:var(--accent1);box-shadow:0 0 8px var(--accent1)}
.vault-bd-dot.media{background:var(--accent2);box-shadow:0 0 8px var(--accent2)}
.vault-bd-dot.signed{background:var(--accent3);box-shadow:0 0 8px var(--accent3)}
.vault-bd-dot.archive{background:var(--text-faint);box-shadow:none}
.vault-bd-name{font-size:12px;color:var(--text-muted)}
.vault-bd-val{font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--text);letter-spacing:.3px}

/* ── folder grid: the .vault-folder tiles ────────────────────────────────── */
.vault-folder-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
@media (max-width:820px){.vault-folder-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.vault-folder-grid{grid-template-columns:1fr}}

.vault-folder{
  position:relative;text-align:left;overflow:hidden;
  display:flex;flex-direction:column;gap:6px;
  padding:14px;border-radius:var(--radius-sm);
  background:var(--bg2);border:1px solid var(--border);
  transition:border-color .18s var(--ease),transform .18s var(--ease),background .18s var(--ease)}
.vault-folder::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--accent-grad);opacity:.7;transition:opacity .18s var(--ease)}
.vault-folder:hover{transform:translateY(-2px);border-color:var(--border-hi);background:var(--panel)}
.vault-folder:hover::before{opacity:1}

/* per-folder accent on the spine + icon glow */
.vault-folder.vault-tone-a1::before{background:linear-gradient(180deg,var(--accent1),transparent)}
.vault-folder.vault-tone-a2::before{background:linear-gradient(180deg,var(--accent2),transparent)}
.vault-folder.vault-tone-a3::before{background:linear-gradient(180deg,var(--accent3),transparent)}
.vault-folder.vault-tone-warn::before{background:linear-gradient(180deg,var(--warn),transparent)}

.vault-folder-top{display:flex;align-items:center;justify-content:space-between}
.vault-folder-ico{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:18px;
  background:var(--panel-hi);border:1px solid var(--border)}
.vault-folder-count{
  font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.5px;
  color:var(--text-muted);background:var(--panel-hi);border:1px solid var(--border);
  border-radius:20px;padding:2px 9px}
.vault-folder-name{font-family:var(--font-display);font-size:15px;font-weight:600;letter-spacing:.2px;margin-top:2px}
.vault-folder-sub{font-size:11px;color:var(--text-muted)}
.vault-folder-foot{
  display:flex;align-items:center;justify-content:space-between;margin-top:8px;padding-top:9px;
  border-top:1px solid var(--border)}
.vault-folder-files{font-family:var(--font-mono);font-size:10px;letter-spacing:1px;color:var(--text-faint);text-transform:uppercase}
.vault-folder-go{font-family:var(--font-mono);font-size:10px;letter-spacing:1px;color:var(--text-faint);transition:color .18s var(--ease)}
.vault-folder:hover .vault-folder-go{color:var(--accent1)}

/* ── recent documents table ──────────────────────────────────────────────── */
.vault-table-scroll{overflow-x:auto;margin:0 -4px;padding:0 4px}
.vault-table{min-width:580px}
.vault-table tbody tr{cursor:pointer}
.vault-table tbody td{padding:9px 12px}

.vault-doc-cell{display:flex;align-items:center;gap:11px}
.vault-doc-ico{
  width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:15px;flex:none;
  background:var(--panel);border:1px solid var(--border)}
.vault-doc-meta{min-width:0}
.vault-doc-name{font-size:13px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:240px}
.vault-doc-folder{font-family:var(--font-mono);font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--text-faint);margin-top:1px}

.vault-owner{display:flex;align-items:center;gap:8px}
.vault-owner-name{font-size:12px;color:var(--text-muted)}

/* ── e-signature queue ───────────────────────────────────────────────────── */
.vault-sig-list{display:flex;flex-direction:column;gap:10px}
.vault-sig-card .attn .btn{flex:none}

/* ── shared links ────────────────────────────────────────────────────────── */
.vault-link-item{cursor:default}
.vault-link-right{display:flex;align-items:center;gap:12px;flex:none}
.vault-link-views{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--text);letter-spacing:.3px;white-space:nowrap}
.vault-link-views small{font-size:9px;letter-spacing:1px;color:var(--text-faint);text-transform:uppercase;font-weight:400}
.vault-link-exp{color:var(--text-faint)}
.vault-link-exp.warn{color:var(--warn)}
.vault-links-card .list-item{padding:11px 2px}

/* ── category donut legend ───────────────────────────────────────────────── */
.vault-donut-card .chart{display:grid;place-items:center}
.vault-cat-legend{display:flex;flex-direction:column;gap:8px;margin-top:13px;padding-top:13px;border-top:1px solid var(--border)}
.vault-cat-row{display:grid;grid-template-columns:12px 1fr auto auto;align-items:center;gap:10px}
.vault-cat-dot{width:10px;height:10px;border-radius:3px;background:currentColor;box-shadow:0 0 8px currentColor;flex:none}
.vault-cat-name{font-size:12px;color:var(--text-muted)}
.vault-cat-val{font-family:var(--font-mono);font-size:12px;font-weight:600;color:var(--text);letter-spacing:.3px}
.vault-cat-pct{font-family:var(--font-mono);font-size:11px;min-width:34px;text-align:right}

/* responsive: links right-cluster wraps under title on very narrow decks */
@media (max-width:560px){
  .vault-link-right{gap:8px}
  .vault-doc-name{max-width:160px}
}

/* ════════════════════════════════════════════════════════════════════════
   IN-MODULE TABS (Files · Generate · Sign)
   ════════════════════════════════════════════════════════════════════════ */
.vault-tabs{display:inline-flex;gap:5px;padding:4px;margin-bottom:var(--gap);
  background:var(--bg2);border:1px solid var(--border);border-radius:11px}
.vault-tab{display:inline-flex;align-items:center;gap:7px;padding:7px 15px;border-radius:8px;
  font-size:12.5px;font-weight:600;letter-spacing:.1px;color:var(--text-muted);
  border:1px solid transparent;transition:all .15s var(--ease)}
.vault-tab .vt-ico{font-size:13px;line-height:1}
.vault-tab:hover{color:var(--text);background:var(--panel)}
.vault-tab.on{background:var(--panel-hi);color:var(--text);border-color:var(--border-hi);
  box-shadow:inset 0 0 0 1px rgba(0,229,209,.20)}
.vault-tab.on .vt-ico{filter:drop-shadow(0 0 6px var(--glow))}

.vault-pane{display:none;animation:viewIn .34s var(--ease)}
.vault-pane.on{display:block}

/* ════════════════════════════════════════════════════════════════════════
   GENERATE
   ════════════════════════════════════════════════════════════════════════ */
.vault-gen-lead{font-size:13px;line-height:1.55;max-width:760px}
.vault-gen-label{font-family:var(--font-mono);font-size:9px;letter-spacing:2px;text-transform:uppercase;
  color:var(--text-faint);margin-bottom:8px}

/* template chips */
.vault-tpl-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.vault-tpl{display:flex;flex-direction:column;gap:2px;text-align:left;padding:10px 11px;
  border-radius:var(--radius-sm);background:var(--bg2);border:1px solid var(--border);
  transition:all .16s var(--ease)}
.vault-tpl:hover{border-color:var(--border-hi);background:var(--panel);transform:translateY(-1px)}
.vault-tpl.on{border-color:var(--border-hi);background:var(--panel-hi);
  box-shadow:inset 0 0 0 1px rgba(0,229,209,.28),0 0 16px var(--glow)}
.vault-tpl-ico{font-size:17px;line-height:1.1}
.vault-tpl-name{font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--text)}
.vault-tpl.on .vault-tpl-name{color:var(--accent1)}
.vault-tpl-sub{font-size:10px;color:var(--text-muted);line-height:1.3}

/* source select */
.vault-gen-field{display:block}
.vault-gen-field select{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:8px;
  padding:9px 11px;font-size:13px;color:var(--text);outline:none;transition:.15s var(--ease)}
.vault-gen-field select:focus{border-color:var(--border-hi)}

/* source preview card */
.vault-src-card{margin-top:11px;padding:12px;border-radius:var(--radius-sm);
  background:var(--bg2);border:1px solid var(--border)}
.vault-src-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.vault-src-id{font-size:10px;letter-spacing:.5px}
.vault-src-name{font-family:var(--font-display);font-size:14px;font-weight:600;margin-bottom:8px}
.vault-src-rows{display:flex;flex-direction:column;gap:5px}
.vault-src-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px}
.vault-src-row span{color:var(--text-faint)}
.vault-src-row b{color:var(--text);font-weight:600;font-size:12px;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60%}
.vault-gen-note{font-size:10.5px;line-height:1.5;margin-top:9px}
.vault-gen-note code,.vault-sign-foot code{font-family:var(--font-mono);font-size:10px;
  color:var(--accent1);background:rgba(0,229,209,.08);border:1px solid rgba(0,229,209,.18);
  border-radius:5px;padding:1px 5px}

/* ── the framed document preview ─────────────────────────────────────────────
   The .vault-doc surface is a deliberate LIGHT "ink-on-paper" sheet inside the
   dark deck (a Word/PDF mock). The dark global tokens can't drive it, so the
   paper palette is declared once as scoped --vd-* custom properties on
   .vault-doc and every value below flows through var(--…) — no loose hex. ── */
.vault-doc-frame{background:repeating-linear-gradient(135deg,var(--bg) 0,var(--bg) 12px,var(--bg2) 12px,var(--bg2) 24px);
  border-radius:var(--radius-sm);padding:20px;display:flex;justify-content:center;overflow-x:auto}
.vault-doc{
  /* paper palette (light surface, scoped to this sheet only) */
  --vd-paper:#fbfcfe;       /* sheet background */
  --vd-ink:#10202c;         /* primary ink */
  --vd-ink-soft:#27424f;    /* body copy */
  --vd-ink-mute:#5a7184;    /* secondary text */
  --vd-ink-faint:#7c93a4;   /* labels / fine print */
  --vd-rule:#c3d2dd;        /* strong rules */
  --vd-rule-soft:#e3eaef;   /* soft row rules */
  --vd-line:#9fb3c0;        /* signature line */
  --vd-tint:#eef3f7;        /* tinted party box */
  --vd-tint-bd:#dde6ec;     /* tinted box border */
  --vd-logo-a:#00b3a4;      /* logo gradient (calm accent on paper) */
  --vd-logo-b:#2f9fd6;
  --vd-shadow:rgba(0,0,0,.5);
  --vd-edge:rgba(0,0,0,.3);
  --vd-mark:rgba(16,32,44,.05);  /* watermark ink */
  position:relative;width:100%;max-width:600px;background:var(--vd-paper);color:var(--vd-ink);
  border-radius:6px;padding:30px 34px 26px;box-shadow:0 18px 50px var(--vd-shadow),0 0 0 1px var(--vd-edge);
  font-family:var(--font-body);overflow:hidden}
.vault-doc-watermark{position:absolute;top:46%;left:50%;transform:translate(-50%,-50%) rotate(-24deg);
  font-family:var(--font-display);font-size:84px;font-weight:700;letter-spacing:10px;
  color:var(--vd-mark);pointer-events:none;user-select:none}
.vault-doc-header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding-bottom:14px;border-bottom:2px solid var(--vd-ink);position:relative}
.vault-doc-brand{display:flex;align-items:center;gap:11px}
.vault-doc-logo{width:38px;height:38px;border-radius:9px;display:grid;place-items:center;flex:none;
  font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--vd-paper);
  background:linear-gradient(120deg,var(--vd-logo-a),var(--vd-logo-b))}
.vault-doc-org{font-family:var(--font-display);font-size:15px;font-weight:700;color:var(--vd-ink)}
.vault-doc-org-sub{font-size:10px;color:var(--vd-ink-mute);margin-top:2px}
.vault-doc-kind{font-family:var(--font-mono);font-size:10px;letter-spacing:2px;font-weight:600;
  color:var(--vd-ink);border:1px solid var(--vd-rule);border-radius:5px;padding:5px 9px;white-space:nowrap}
.vault-doc-title{font-family:var(--font-display);font-size:19px;font-weight:700;color:var(--vd-ink);
  margin:16px 0 14px;position:relative}
.vault-doc-parties{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px;position:relative}
.vault-doc-party{display:flex;flex-direction:column;gap:2px;padding:11px 12px;border-radius:6px;
  background:var(--vd-tint);border:1px solid var(--vd-tint-bd)}
.vault-doc-plabel{font-family:var(--font-mono);font-size:8.5px;letter-spacing:2px;color:var(--vd-ink-faint);font-weight:600}
.vault-doc-party b{font-size:13px;color:var(--vd-ink);margin-top:1px}
.vault-doc-party span{font-size:11px;color:var(--vd-ink-mute)}
.vault-doc-party span.mono{font-family:var(--font-mono);font-size:10px}
.vault-doc-body{position:relative;font-size:12.5px;line-height:1.62;color:var(--vd-ink-soft)}
.vault-doc-body p{margin-bottom:9px}
.vault-doc-body b{color:var(--vd-ink)}
.vault-doc-table{width:100%;border-collapse:collapse;margin:6px 0 11px;font-size:12px}
.vault-doc-table th{text-align:left;font-family:var(--font-mono);font-size:9px;letter-spacing:1px;
  text-transform:uppercase;color:var(--vd-ink-faint);padding:6px 8px;border-bottom:1.5px solid var(--vd-rule)}
.vault-doc-table th.num,.vault-doc-table td.num{text-align:right;font-variant-numeric:tabular-nums}
.vault-doc-table td{padding:7px 8px;border-bottom:1px solid var(--vd-rule-soft);color:var(--vd-ink-soft)}
.vault-doc-total td{font-weight:700;color:var(--vd-ink);border-bottom:none;border-top:1.5px solid var(--vd-rule)}
.vault-doc-fine{font-size:10.5px;color:var(--vd-ink-faint);margin-top:4px}
.vault-doc-sign{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px;position:relative}
.vault-doc-sigbox{display:flex;flex-direction:column;gap:5px}
.vault-doc-sigline{height:30px;border-bottom:1.5px dashed var(--vd-line)}
.vault-doc-siglabel{font-size:10px;color:var(--vd-ink-mute)}
.vault-preview-card .ch-meta{white-space:nowrap}

/* ════════════════════════════════════════════════════════════════════════
   SIGN
   ════════════════════════════════════════════════════════════════════════ */
.vault-sign-doc{display:flex;align-items:center;gap:13px;padding:12px;border-radius:var(--radius-sm);
  background:var(--bg2);border:1px solid var(--border);margin-bottom:14px;flex-wrap:wrap}
.vault-sign-doc-ico{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:20px;
  background:var(--panel-hi);border:1px solid var(--border);flex:none}
.vault-sign-doc-meta{flex:1;min-width:160px}
.vault-sign-doc-title{font-family:var(--font-display);font-size:15px;font-weight:600}
.vault-sign-doc-sub{font-size:11px;margin-top:2px}
.vault-sign-provider{display:inline-flex;gap:4px;padding:3px;border-radius:9px;
  background:var(--panel);border:1px solid var(--border)}
.vault-prov-btn{padding:5px 11px;border-radius:7px;font-size:11px;font-weight:600;color:var(--text-muted);
  transition:.14s var(--ease)}
.vault-prov-btn:hover{color:var(--text)}
.vault-prov-btn.on{background:var(--panel-hi);color:var(--accent1);
  box-shadow:inset 0 0 0 1px rgba(0,229,209,.28)}

.vault-sign-progress{display:flex;flex-direction:column;gap:7px;margin-top:4px}
.vault-sign-prog-label{font-family:var(--font-mono);font-size:10px;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--text-faint)}
.vault-sign-prog-val{font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--accent1)}
.vault-sign-prog-sub{font-size:11px}

/* signer rows */
.vault-signer-list{display:flex;flex-direction:column;gap:9px}
.vault-signer{display:flex;align-items:center;gap:13px;padding:12px;border-radius:var(--radius-sm);
  background:var(--bg2);border:1px solid var(--border);transition:border-color .16s var(--ease)}
.vault-signer:hover{border-color:var(--border-hi)}
.vault-signer.done{background:linear-gradient(90deg,rgba(0,229,209,.05),transparent);border-color:rgba(0,229,209,.25)}
.vault-signer-av{position:relative;flex:none}
.vault-signer-int{position:absolute;right:-4px;bottom:-4px;font-family:var(--font-mono);font-size:7px;
  font-weight:700;letter-spacing:.5px;color:var(--accent3);background:var(--panel-hi);
  border:1px solid rgba(124,108,255,.4);border-radius:4px;padding:0 3px}
.vault-signer-meta{flex:1;min-width:0}
.vault-signer-name{font-size:13px;font-weight:600;color:var(--text)}
.vault-signer-sub{font-size:11px;color:var(--text-muted);margin-top:1px}
.vault-signer-track{display:flex;align-items:center;gap:0;margin-top:8px}
.vault-signer-dot{width:9px;height:9px;border-radius:50%;flex:none;background:var(--bg);
  border:1.5px solid var(--border-hi);transition:all .2s var(--ease)}
.vault-signer-dot.on{background:var(--accent1);border-color:var(--accent1);box-shadow:0 0 7px var(--accent1)}
.vault-signer-dot.cur{transform:scale(1.25)}
.vault-signer-rail{width:18px;height:1.5px;background:var(--border-hi);flex:none}
.vault-signer-right{display:flex;align-items:center;gap:10px;flex:none}
.vault-signer-ok{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.5px;color:var(--success)}
.vault-sign-foot{font-size:10.5px;line-height:1.5;margin-top:11px}

/* ── responsive ──────────────────────────────────────────────────────────── */
@media (max-width:820px){
  .vault-tpl-grid{grid-template-columns:1fr 1fr}
  .vault-doc{padding:22px 20px}
  .vault-doc-watermark{font-size:60px}
}
@media (max-width:560px){
  .vault-tabs{display:flex}
  .vault-tab{flex:1;justify-content:center;padding:7px 8px}
  .vault-doc-parties,.vault-doc-sign{grid-template-columns:1fr}
  .vault-doc-header{flex-direction:column;gap:10px}
  .vault-signer{flex-wrap:wrap}
  .vault-signer-right{width:100%;justify-content:space-between;margin-left:43px}
}