/* ============================================================
   DISC-CLOSE — shared stylesheet
   Loaded by every page. Change the palette or spacing once here
   and every page picks it up — that is the whole point of pulling
   this out of the single HTML file it started in.
   ============================================================ */

:root{
  --bg:#0c0d10; --surface:#1a1c21; --surface2:#1f2128; --border:#2d313d;
  --accent:#00f2ff; --text:#ffffff; --text2:#bfbfbf; --danger:#f87171; --accent2:#34d399;
  --warn:#fbbf24;
}
*{ box-sizing:border-box }
body{
  margin:0; min-height:100vh;
  background:var(--bg); font-family:ui-sans-serif,system-ui,sans-serif; color:var(--text);
}

/* ── Centered card layout, used by the login page ─────────── */
.center-screen{ display:flex; align-items:center; justify-content:center; min-height:100vh; padding:24px; }
.card{
  width:360px; background:var(--surface); border:1px solid var(--border);
  border-radius:10px; padding:32px 28px; transition:width .15s;
}
.card.wide{ width:min(680px, 92vw); }

.logo{
  font-family:ui-monospace,monospace; font-size:22px; font-weight:600;
  letter-spacing:.1em; color:var(--accent); text-align:center; margin-bottom:6px;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.logo span{ color:var(--text2) }
.logo-icon{ width:24px; height:24px; flex-shrink:0; object-fit:contain; }
.app-sidebar .logo{ justify-content:flex-start; font-size:17px; }
.app-sidebar .logo-icon{ width:20px; height:20px; }
.sub{ text-align:center; font-size:12px; color:var(--text2); margin-bottom:20px; }

/* ── Forms ─────────────────────────────────────────────────── */
label{ font-size:11px; color:var(--text2); display:block; margin-bottom:5px; margin-top:16px; }
input{
  width:100%; background:var(--surface2); border:1px solid var(--border); color:var(--text);
  padding:10px 12px; border-radius:6px; font-size:13px; outline:none;
}
input:focus{ border-color:var(--accent); }
button{
  padding:11px 16px; border:none; border-radius:6px;
  background:var(--accent); color:#00161a; font-weight:600; font-size:13px; cursor:pointer;
}
button.secondary{ background:transparent; border:1px solid var(--border); color:var(--text2); }
.lib-filter-btn.active{ background:rgba(0,242,255,.1); border-color:var(--accent); color:var(--accent); }
button:disabled{ opacity:.5; cursor:default; }
button.full{ width:100%; margin-top:24px; }

#msg{ margin-top:14px; font-size:12px; text-align:center; min-height:16px; }
#msg.err{ color:var(--danger); }
#msg.ok{ color:var(--accent2); }

/* ── App shell (dashboard pages) ─────────────────────────────
   A left sidebar plus a content area. Every dashboard page uses
   this shell instead of a centered card — it's how the app stops
   looking like a login form once you're actually inside it. */
.app-shell{ display:flex; min-height:100vh; }
.app-sidebar{
  width:220px; flex-shrink:0; background:var(--surface); border-right:1px solid var(--border);
  padding:20px 16px; display:flex; flex-direction:column;
}
.app-sidebar .logo{ margin-bottom:2px; }
.app-sidebar .role-tag{
  font-size:10px; font-family:ui-monospace,monospace; color:var(--accent);
  background:rgba(0,242,255,.08); border:1px solid rgba(0,242,255,.3);
  display:inline-block; padding:2px 8px; border-radius:20px; margin:10px 0 20px;
}
.app-sidebar .who{ font-size:11px; color:var(--text2); line-height:1.7; margin-bottom:20px; }
.app-sidebar .who b{ color:var(--text); display:block; }
.admin-nav-link{
  display:block; padding:8px 10px; border-radius:6px; font-size:12.5px;
  color:var(--text2); text-decoration:none;
}
.admin-nav-link:hover{ background:var(--surface2); color:var(--text); }
.admin-nav-link.active{ background:rgba(0,242,255,.08); color:var(--accent); font-weight:600; }
.app-content{ flex:1; padding:28px 32px; overflow-x:auto; }
.app-content h1{ font-size:18px; margin:0 0 4px; }
.app-content .page-sub{ font-size:12px; color:var(--text2); margin-bottom:24px; }

/* ── Data sections ────────────────────────────────────────── */
.section{ margin-bottom:28px; }
.section h3{
  font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--text2);
  margin:0 0 10px; font-weight:600;
}
.section-status{ font-size:12px; color:var(--text2); font-family:ui-monospace,monospace; }
.section-status.err{ color:var(--danger); }

table.data-table{
  width:100%; border-collapse:collapse; font-size:12px;
  background:var(--surface); border:1px solid var(--border); border-radius:8px; overflow:hidden;
}
table.data-table th{
  text-align:left; font-size:10px; color:var(--text2); font-weight:600;
  padding:9px 12px; border-bottom:1px solid var(--border);
  text-transform:uppercase; letter-spacing:.04em; background:var(--surface2);
}
table.data-table td{
  padding:10px 12px; border-bottom:1px solid var(--border); color:var(--text); vertical-align:top;
}
table.data-table tr:last-child td{ border-bottom:none; }
.row-org{ font-size:10px; color:var(--accent); font-family:ui-monospace,monospace; margin-top:2px; }
.amt{ font-family:ui-monospace,monospace; text-align:right; }

.cusip-code{ font-family:ui-monospace,monospace; }
.cusip-code.placeholder{ color:var(--warn); }
.badge-placeholder{
  display:inline-block; margin-left:6px; font-size:9px; font-family:ui-monospace,monospace;
  background:rgba(251,191,36,.12); color:var(--warn); border:1px solid rgba(251,191,36,.4);
  padding:1px 6px; border-radius:20px; white-space:nowrap;
}
.status-pill{
  font-size:9px; font-family:ui-monospace,monospace; padding:1px 7px; border-radius:20px;
  border:1px solid var(--border); color:var(--text2);
}
.status-pill.ACTIVE{ color:var(--accent2); border-color:rgba(52,211,153,.4); }
.link-btn{
  background:none; border:none; color:var(--accent); font-size:10px; font-family:ui-monospace,monospace;
  padding:0; margin-left:6px; cursor:pointer; text-decoration:underline;
}
.link-btn:hover{ opacity:.8; }

/* ── Disclosure tables — variable-shaped data ────────────────
   Unlike issuances/CUSIPs, these tables don't have fixed columns.
   cols/rows come from the database as JSON, so each card renders
   whatever shape that particular table actually has. */
.dtable-card{
  background:var(--surface); border:1px solid var(--border); border-radius:8px;
  margin-bottom:16px; overflow:hidden;
}
.dtable-head{
  padding:12px 14px; background:var(--surface2); border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.dtable-name{ font-size:13px; font-weight:600; color:var(--text); }
.dtable-gasb{ font-size:10px; font-family:ui-monospace,monospace; color:var(--text2); }
.dtable-linked{
  padding:8px 14px; font-size:10.5px; color:var(--text2); font-family:ui-monospace,monospace;
  border-bottom:1px solid var(--border);
}
.dtable-body-wrap{ overflow-x:auto; }
.dtable-body-wrap table{ width:100%; border-collapse:collapse; font-size:11.5px; }
.dtable-body-wrap th{
  text-align:left; padding:7px 10px; font-size:9.5px; text-transform:uppercase; letter-spacing:.04em;
  color:var(--text2); border-bottom:1px solid var(--border); white-space:nowrap;
}
.dtable-body-wrap td{ padding:7px 10px; border-bottom:1px solid var(--border); color:var(--text); }
.dtable-body-wrap tr:last-child td{ border-bottom:none; }
.dtable-empty{ padding:14px; font-size:11px; color:var(--text2); font-style:italic; }
.dtable-source-note{
  padding:9px 14px; font-size:10.5px; color:var(--text2); line-height:1.6;
  border-top:1px solid var(--border); background:var(--surface2);
}
.dtable-source-note b{ color:var(--text); font-weight:600; }

.badge{
  font-size:9px; font-family:ui-monospace,monospace; padding:2px 8px; border-radius:20px;
  border:1px solid; white-space:nowrap;
}
.badge.approval-approved{ color:var(--accent2); border-color:rgba(52,211,153,.4); background:rgba(52,211,153,.08); }
.badge.approval-pending{  color:var(--warn);    border-color:rgba(251,191,36,.4); background:rgba(251,191,36,.08); }
.badge.approval-rejected{ color:var(--danger);  border-color:rgba(248,113,113,.4); background:rgba(248,113,113,.08); }
.dt-edit-input{
  background:var(--surface2); border:1px solid var(--border); color:var(--text);
  padding:5px 7px; border-radius:4px; font-size:11.5px; outline:none;
}
.dt-edit-input:focus{ border-color:var(--accent); }
.dt-col-remove, .dt-row-remove{
  background:none; border:none; color:var(--danger); cursor:pointer; font-size:11px;
  padding:2px 4px; margin-left:4px;
}
.dt-col-remove:hover, .dt-row-remove:hover{ opacity:.7; }
.dt-cell-formula-preview{
  font-size:9.5px; font-family:ui-monospace,monospace; color:var(--accent);
  margin-top:2px; min-height:11px; white-space:nowrap;
}
.dtable-formula-cell{
  cursor:help; border-bottom:1px dashed var(--accent) !important;
}
tr.dt-col-letters th{
  padding:2px 12px; font-size:9.5px; border-bottom:none; background:transparent;
  text-transform:none; letter-spacing:0;
}
.dt-toolbar{
  padding:8px 14px; display:flex; align-items:center; gap:6px; flex-wrap:wrap;
  border-bottom:1px solid var(--border);
}
.dt-toolbar-sep{ width:1px; height:18px; background:var(--border); margin:0 4px; }
.dt-fn-btn, .dt-merge-btn, .dt-unmerge-btn, .dt-tag-toggle-btn{
  padding:4px 9px; font-size:10.5px; background:var(--surface2); border:1px solid var(--border);
  color:var(--text2); border-radius:5px; cursor:pointer; white-space:nowrap;
}
.dt-fn-btn:hover, .dt-merge-btn:hover, .dt-unmerge-btn:hover, .dt-tag-toggle-btn:hover{ color:var(--accent); border-color:var(--accent); }
.dt-tag-panel{
  padding:12px 14px; border-bottom:1px solid var(--border); background:var(--surface2);
}
table.dt-tag-table{ width:100%; border-collapse:collapse; font-size:11px; }
table.dt-tag-table th{
  text-align:left; padding:5px 8px; font-size:9.5px; text-transform:uppercase; letter-spacing:.04em;
  color:var(--text2); border-bottom:1px solid var(--border);
}
table.dt-tag-table td{ padding:5px 8px; border-bottom:1px solid var(--border); }
table.dt-tag-table select{ font-size:10.5px; padding:3px 6px; width:100%; }
.dt-tag-hint-col:hover, .dt-tag-hint-row:hover{ text-decoration:underline; }
details summary{ color:var(--text2); }
details summary:hover{ color:var(--accent); }
table.dt-spreadsheet{ user-select:none; }
table.dt-spreadsheet td[data-r], table.dt-spreadsheet th[data-r]{ cursor:cell; }
table.dt-spreadsheet .dt-cell-selected{ background:rgba(0,242,255,.12) !important; outline:1px solid rgba(0,242,255,.5); outline-offset:-1px; }
.dt-row-num{
  font-family:ui-monospace,monospace; color:var(--text2); font-size:10px; text-align:center;
  width:22px; user-select:none;
}

/* ── Official Statement uploads ──────────────────────────── */
.badge.doc-pending{  color:var(--text2); border-color:var(--border); background:var(--surface2); }
.badge.doc-running{  color:var(--accent); border-color:rgba(0,242,255,.4); background:rgba(0,242,255,.08); }
.badge.doc-complete{ color:var(--accent2); border-color:rgba(52,211,153,.4); background:rgba(52,211,153,.08); }
.badge.doc-failed{   color:var(--danger); border-color:rgba(248,113,113,.4); background:rgba(248,113,113,.08); }
.upload-card{
  background:var(--surface); border:1px solid var(--border); border-radius:8px;
  padding:14px; margin-bottom:14px;
}
.upload-row{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.upload-row input[type=file]{
  flex:1; min-width:220px; background:var(--surface2); border:1px solid var(--border);
  border-radius:6px; padding:8px; font-size:12px; color:var(--text2);
}
.doc-name{ color:var(--text); font-size:12.5px; }
.doc-meta{ font-size:10px; color:var(--text2); font-family:ui-monospace,monospace; margin-top:2px; }