
/* Bogoni Finance Vault — local styles */
.bgfv-wrap{ width:100%; max-width:1200px; margin:0 auto; padding: 12px 10px 40px; color:#0B1A33; }
.bgfv-hero{
  border-radius: 28px; overflow:hidden; border: 1px solid rgba(11,26,51,.10);
  box-shadow: 0 20px 60px rgba(7,17,33,.12);
  background:
    radial-gradient(900px 700px at 10% 10%, rgba(56,211,200,.22), transparent 55%),
    radial-gradient(900px 700px at 90% 15%, rgba(11,46,95,.18), transparent 60%),
    radial-gradient(900px 700px at 30% 95%, rgba(246,196,83,.18), transparent 60%),
    radial-gradient(900px 700px at 95% 90%, rgba(139,92,246,.14), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.70) 0%, rgba(255,255,255,.55) 100%);
  padding: clamp(18px, 3.2vw, 40px);
}
.bgfv-badge{ display:inline-flex; padding: 8px 12px; border-radius:999px; background: rgba(255,255,255,.75); border:1px solid rgba(11,26,51,.12); font-weight:900; }
.bgfv-title{ margin: 10px 0 10px; font-size: clamp(30px, 4.2vw, 46px); letter-spacing:-.02em; }
.bgfv-sub{ margin:0 0 16px; font-size: 1.05rem; color: rgba(11,26,51,.78); max-width: 70ch; }
.bgfv-strip{ display:flex; flex-wrap:wrap; gap:10px; margin-top: 16px;}
.bgfv-chip{ padding: 10px 12px; border-radius:999px; background: rgba(255,255,255,.70); border:1px solid rgba(11,26,51,.10); font-weight:800; }
.bgfv-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 16px;}
.bgfv-btn{
  appearance:none; cursor:pointer; text-decoration:none;
  border: 1px solid rgba(11,46,95,.18);
  border-radius: 999px; padding: 12px 16px;
  background: linear-gradient(135deg, rgba(11,46,95,.08), rgba(56,211,200,.10));
  font-weight: 900; color:#0B1A33;
  display:inline-flex; align-items:center; justify-content:center;
  box-shadow: 0 10px 18px rgba(7,17,33,.10);
  transition: transform .15s ease, box-shadow .15s ease;
}
.bgfv-btn:hover{ transform: translateY(-1px); box-shadow: 0 16px 28px rgba(7,17,33,.12); }
.bgfv-btn.ghost{ background: rgba(255,255,255,.75); }
.bgfv-note{ margin-top: 14px; padding: 12px 14px; border-radius: 18px; background: rgba(56,211,200,.08); border: 1px solid rgba(56,211,200,.20); color: rgba(11,26,51,.78); }

.bgfv-grid{ display:grid; grid-template-columns: repeat(12, 1fr); gap:12px; margin-top: 16px;}
.bgfv-card{ grid-column: span 6; padding: 16px; border-radius: 22px; background: rgba(255,255,255,.80); border:1px solid rgba(11,26,51,.10); box-shadow: 0 12px 28px rgba(7,17,33,.10);}
.bgfv-card h3{ margin:0 0 8px; letter-spacing:-.015em;}
.bgfv-card p{ margin:0 0 10px; color: rgba(11,26,51,.74); }

.bgfv-panel{ margin-top: 18px; padding: 18px; border-radius: 22px; background: rgba(255,255,255,.80); border:1px solid rgba(11,26,51,.10); box-shadow: 0 12px 28px rgba(7,17,33,.10); }
.bgfv-h2{ margin: 0 0 8px; font-size: clamp(20px, 2.6vw, 30px); letter-spacing:-.02em;}
.bgfv-p{ margin: 0 0 14px; color: rgba(11,26,51,.78); max-width: 80ch; }
.bgfv-form{ display:grid; gap:10px; max-width: 760px;}
.bgfv-lab{ font-weight:900; color: rgba(11,26,51,.84); }
.bgfv-input{ width:100%; padding: 12px 14px; border-radius: 16px; border:1px solid rgba(11,26,51,.14); background: rgba(255,255,255,.75); outline:none; }
.bgfv-input:focus{ box-shadow: 0 0 0 4px rgba(56,211,200,.22); border-color: rgba(56,211,200,.35); }
.bgfv-row{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 6px; }
.bgfv-small{ font-size:.92rem; color: rgba(11,26,51,.68); }
.bgfv-muted{ color: rgba(11,26,51,.62); }

.bgfv-tablewrap{ overflow:auto; border-radius: 18px; border:1px solid rgba(11,26,51,.10); background: rgba(255,255,255,.70); }
.bgfv-table{ width:100%; border-collapse:collapse; min-width: 720px; }
.bgfv-table th, .bgfv-table td{ padding: 12px 12px; border-bottom:1px solid rgba(11,26,51,.08); text-align:left; font-size: .96rem; }
.bgfv-table th{ font-weight:900; background: rgba(11,46,95,.06); }
@media (max-width: 860px){ .bgfv-card{ grid-column: span 12; } }

/* v0.3.3 additions */
.bgfv-btn.danger{border-color:rgba(185,28,28,.35); color:#b91c1c;}
.bgfv-btn.danger:hover{background:rgba(185,28,28,.06);}
.bgfv-edit-title{font-weight:900; letter-spacing:.2px;}
.bgfv-grid3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px;}
@media(max-width:980px){.bgfv-grid3{grid-template-columns:1fr;}}
.bgfv-kpi{background:#fff; border:1px solid rgba(11,26,51,.12); border-radius:16px; padding:12px 14px;}
.bgfv-kpi .bgfv-k{font-size:12px; color:rgba(11,26,51,.70); font-weight:800; letter-spacing:.2px;}
.bgfv-kpi .bgfv-v{font-size:18px; font-weight:900; margin-top:6px;}

/* =============================
   Modal (Vault viewer + editor)
   Fixes: previously unstyled, rendered in normal flow
============================= */
.bgfv-modal{ position:fixed; inset:0; z-index:99999; display:none;
  align-items:flex-start; justify-content:center; padding: 22px 14px;
  background: rgba(11,26,51,.55); backdrop-filter: blur(6px);
}
.bgfv-modal[aria-hidden="false"]{ display:flex; }
.bgfv-modal-inner{ width:min(980px, 100%); max-height: calc(100vh - 44px);
  overflow:auto; background:#fff; border-radius: 22px; border:1px solid rgba(11,26,51,.14);
  box-shadow: 0 30px 90px rgba(7,17,33,.28);
}
.bgfv-modal-head{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding: 14px 16px; position:sticky; top:0;
  background: linear-gradient(135deg, rgba(11,46,95,.10), rgba(56,211,200,.10));
  border-bottom:1px solid rgba(11,26,51,.10);
}
.bgfv-modal-title{ font-weight:1000; font-size: 16px; margin:0; }
.bgfv-modal-sub{ font-size:12px; color: rgba(11,26,51,.70); margin-top:3px; }
.bgfv-modal-body{ padding: 14px 16px 18px; }

.bgfv-kv{ display:grid; grid-template-columns: 160px 1fr; gap: 8px 12px; }
.bgfv-kv > div:nth-child(odd){ font-weight:900; color: rgba(11,26,51,.70); }
.bgfv-kv > div:nth-child(even){ color:#0B1A33; }

.bgfv-details{ margin-top: 14px; border:1px solid rgba(11,26,51,.12); border-radius: 16px; overflow:hidden; }
.bgfv-details summary{ cursor:pointer; padding: 12px 14px; font-weight:900; background: rgba(246,248,251,.9); }
.bgfv-pre{ margin:0; padding: 12px 14px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 12px; line-height: 1.45; background:#0b1a33; color:#eaf1ff; overflow:auto;
}

/* Editor */
.bgfv-edit{ border:1px solid rgba(11,26,51,.12); border-radius: 18px; padding: 12px 12px; background: rgba(246,248,251,.85); }
.bgfv-edit-title{ font-weight:1000; }
.bgfv-lab{ display:block; font-size:12px; font-weight:900; margin: 10px 0 6px; color: rgba(11,26,51,.78); }
.bgfv-input{ width:100%; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(11,26,51,.18);
  outline:none; background:#fff;
}
.bgfv-2{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 680px){ .bgfv-kv{grid-template-columns: 1fr; } .bgfv-2{grid-template-columns:1fr;} }
.bgfv-small{ font-size:12px; color: rgba(11,26,51,.70); margin-top:10px; }


/* v0.4.1 reconciliation */
.bgfv-bank-card{ margin-top:14px; border:1px solid rgba(11,26,51,.12); border-radius:20px; background:#fff; padding:14px; box-shadow:0 10px 22px rgba(7,17,33,.06); }
.bgfv-bank-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.bgfv-bank-grid{ display:grid; grid-template-columns: 2.2fr repeat(4, 1fr); gap:10px; margin-bottom:12px; }
.bgfv-bank-actions{ border-top:1px solid rgba(11,26,51,.08); padding-top:12px; }
.bgfv-pill{ display:inline-flex; align-items:center; padding:5px 10px; border-radius:999px; font-size:12px; font-weight:900; background:rgba(11,46,95,.08); border:1px solid rgba(11,46,95,.12); }
.bgfv-pill.final{ background:rgba(22,101,52,.12); color:#166534; border-color:rgba(22,101,52,.20); }
.bgfv-pill.void{ background:rgba(185,28,28,.08); color:#b91c1c; border-color:rgba(185,28,28,.18); }
.bgfv-pill.credit{ background:rgba(22,101,52,.10); color:#166534; border-color:rgba(22,101,52,.18); }
.bgfv-pill.debit{ background:rgba(180,83,9,.10); color:#92400e; border-color:rgba(180,83,9,.18); }
.bgfv-pill.charge{ background:rgba(124,58,237,.10); color:#6d28d9; border-color:rgba(124,58,237,.18); }
.bgfv-link{ appearance:none; border:none; background:none; padding:0; color:#0B2E5F; font-weight:900; cursor:pointer; text-align:left; }
.bgfv-link:hover{ text-decoration:underline; }
@media (max-width: 980px){ .bgfv-bank-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 640px){ .bgfv-bank-head, .bgfv-bank-grid{ grid-template-columns:1fr; display:grid; } }


.bgfv-headsplit{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap}
.bgfv-search{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bgfv-search-input{min-width:280px}
.bgfv-filterbar{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.bgfv-filter{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(15,23,42,.12);border-radius:999px;background:#fff;color:#0f172a;text-decoration:none;font-weight:700}
.bgfv-filter span{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;border-radius:999px;background:rgba(148,163,184,.16);font-size:12px}
.bgfv-filter.active{background:#e8f1fb;border-color:#bfd4ec}
.bgfv-bulkbar{padding:14px;border:1px solid rgba(15,23,42,.08);border-radius:14px;background:#f8fafc;margin-bottom:14px}
.bgfv-bulkgrid{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:12px}
.bgfv-compact-table td,.bgfv-compact-table th{vertical-align:top}
.bgfv-txdesc{max-width:420px;white-space:normal;line-height:1.35}
.bgfv-pill.approved{background:#e8f7ef;color:#166534}
.bgfv-pill.ignored{background:#f3f4f6;color:#475569}
@media (max-width: 920px){.bgfv-bulkgrid{grid-template-columns:repeat(2,minmax(160px,1fr))}.bgfv-search-input{min-width:220px}}
@media (max-width: 640px){.bgfv-bulkgrid{grid-template-columns:1fr}.bgfv-headsplit{flex-direction:column}.bgfv-search{width:100%}.bgfv-search-input{min-width:0;width:100%}}


/* v0.4.3 vault bulk actions */
#bgfvRows input[data-vault-select]{transform:scale(1.05);cursor:pointer}
#bgfvVaultBulkStatus{min-height:18px}


/* v0.4.7 richer reports */
.bgfv-report-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.bgfv-report-controls .bgfv-bulkgrid{grid-template-columns:repeat(6,minmax(150px,1fr))}
@media (max-width: 1100px){.bgfv-report-controls .bgfv-bulkgrid{grid-template-columns:repeat(3,minmax(160px,1fr))}}
@media (max-width: 700px){.bgfv-report-controls .bgfv-bulkgrid{grid-template-columns:1fr}}
