/* ==========================================================================
   District Estate — investor portal
   Dark luxury: black ground, gold accents. Loaded after styles.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   The [hidden] attribute must win.
   A class like .deal-grid{display:grid} outranks the user-agent rule
   [hidden]{display:none}, so elements toggled with el.hidden = true stayed
   visible. This restores the expected behaviour everywhere in the portal.
   -------------------------------------------------------------------------- */
[hidden]{ display:none !important; }

/* --------------------------------------------------------------- hero ---- */
.portal-hero{
  padding:64px 6% 40px;
  text-align:center;
  border-bottom:1px solid var(--de-line);
}

.portal-hero .eyebrow{
  color:var(--de-gold);
  letter-spacing:3px;
  text-transform:uppercase;
  font-size:12px;
  margin:0 0 10px;
}

.portal-hero h1{ margin:0; font-size:clamp(28px,5vw,44px); }

.portal-hero-sub{
  opacity:.75;
  max-width:620px;
  margin:14px auto 0;
}

.nav-auth{ color:var(--de-gold) !important; }

/* ------------------------------------------------------------- filters --- */
.filter-bar{
  background:var(--de-panel);
  border-bottom:1px solid var(--de-line);
  padding:20px 6%;
  position:sticky;
  top:76px;
  z-index:900;
}

.filter-inner{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:14px;
  max-width:1200px;
  margin:0 auto;
  align-items:end;
}

.filter-search{ grid-column:span 2; }

.filter-field{ display:flex; flex-direction:column; }

.filter-field label{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:#9a9a9a;
  margin-bottom:6px;
}

/* Scoped so the global form rules in styles.css don't stretch these. */
.filter-field input,
.filter-field select{
  width:100%;
  max-width:none;
  margin:0;
  padding:11px 12px;
  font-size:15px;
  background:#0a0a0a;
  color:var(--de-text);
  border:1px solid var(--de-line-soft);
  border-radius:8px;
  font-family:inherit;
}

.filter-actions{ display:flex; align-items:flex-end; }

.btn-ghost{
  background:transparent;
  color:var(--de-gold);
  border:1px solid var(--de-gold);
  padding:11px 20px;
  border-radius:8px;
  font-weight:700;
  cursor:pointer;
  font-family:inherit;
  font-size:14px;
}

.btn-ghost:hover{ background:var(--de-gold); color:var(--de-gold-ink); }

@media (max-width:768px){
  .filter-bar{ position:static; padding:18px 5%; }
  .filter-search{ grid-column:span 1; }
}

/* --------------------------------------------------------------- deals --- */
.deals-section{ padding:34px 6% 60px; max-width:1200px; margin:0 auto; }

.deals-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:18px;
  flex-wrap:wrap;
  gap:10px;
}

.deal-count{ color:#9a9a9a; font-size:14px; margin:0; }

.deal-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:20px;
}

.deal-card{
  background:var(--de-panel);
  border:1px solid var(--de-line);
  border-radius:14px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:border-color .2s, transform .2s;
}

.deal-card:hover{ border-color:var(--de-gold); transform:translateY(-3px); }

.deal-media{
  position:relative;
  aspect-ratio:3/2;
  background:#0a0a0a;
  overflow:hidden;
}

.deal-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.deal-media .no-photo{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#555;
  font-size:13px;
  letter-spacing:1px;
}

.deal-status{
  position:absolute;
  top:12px;
  left:12px;
  padding:5px 12px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  letter-spacing:1.2px;
  text-transform:uppercase;
  background:#1f8b2c;
  color:#fff;
}
.deal-status.pending{ background:#b58b00; color:#1a1a1a; }
.deal-status.sold{ background:#8c1d1d; }

.deal-body{ padding:18px; display:flex; flex-direction:column; flex:1; }

.deal-title{
  margin:0 0 4px;
  font-size:18px;
  line-height:1.35;
  color:var(--de-text);
}

.deal-title a{ color:inherit; text-decoration:none; }
.deal-title a:hover{ color:var(--de-gold); }

.deal-location{ color:#9a9a9a; font-size:13px; margin:0 0 14px; }

.deal-price{
  font-size:26px;
  font-weight:700;
  color:var(--de-gold);
  margin:0 0 2px;
}

.deal-price-label{
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:#777;
  margin:0 0 14px;
}

.deal-specs{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  font-size:13px;
  color:#bdbdbd;
  padding-bottom:14px;
  margin-bottom:14px;
  border-bottom:1px solid var(--de-line);
}

.deal-figures{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 14px;
  font-size:13px;
  margin-bottom:16px;
}

.deal-figures dt{ color:#8d8d8d; margin:0; }
.deal-figures dd{ margin:0; color:var(--de-text); font-weight:600; }
.deal-figures dd.muted{ color:#777; font-weight:400; font-size:12px; }
.deal-figures dd.positive{ color:#6fd37a; }

.deal-actions{ margin-top:auto; display:flex; gap:10px; }

.deal-actions .gold-btn,
.deal-actions .btn-ghost{
  margin-top:0;
  flex:1;
  text-align:center;
  padding:11px 14px;
  font-size:14px;
  border-radius:8px;
}

/* ------------------------------------------------------------ skeletons -- */
.deal-card.skeleton{ pointer-events:none; }

.sk-img{ aspect-ratio:3/2; background:#161616; }
.sk-line{
  height:12px;
  background:#161616;
  border-radius:6px;
  margin:14px 18px 0;
}
.sk-line.short{ width:55%; }

.deal-card.skeleton .sk-img,
.deal-card.skeleton .sk-line{
  animation:sk-pulse 1.4s ease-in-out infinite;
}

@keyframes sk-pulse{
  0%,100%{ opacity:1; }
  50%{ opacity:.45; }
}

/* ----------------------------------------------------------- state panels */
.state-panel{
  text-align:center;
  padding:60px 24px;
  background:var(--de-panel);
  border:1px solid var(--de-line);
  border-radius:14px;
}

.state-panel h2{ margin-top:0; color:var(--de-text); }
.state-panel p{ opacity:.75; max-width:460px; margin:10px auto; }
.state-panel.error{ border-color:#5a2020; }
.state-panel .state-sub{ font-size:14px; opacity:.6; margin-top:20px; }

/* -------------------------------------------------------------- network -- */
.network-section{
  background:var(--de-panel);
  border-top:1px solid var(--de-line);
  padding:60px 6%;
}

.network-inner{
  max-width:1000px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  align-items:start;
}

.network-copy h2{ margin-top:0; color:var(--de-gold); }
.network-copy p{ opacity:.8; }

.network-points{ padding-left:20px; opacity:.8; }
.network-points li{ margin-bottom:8px; }

.network-form{ align-items:stretch; max-width:none; margin:0; }

.network-form input,
.network-form select{
  max-width:none;
  margin:0 0 12px;
  padding:14px;
  border-radius:10px;
}

.network-form .gold-btn{ margin-top:4px; width:100%; }

.network-success{
  grid-column:1 / -1;
  text-align:center;
  padding:30px;
  border:1px solid var(--de-gold);
  border-radius:14px;
}
.network-success h3{ color:var(--de-gold); margin-top:0; }

@media (max-width:820px){
  .network-inner{ grid-template-columns:1fr; gap:28px; }
}

/* ---------------------------------------------------------------- modal -- */
.modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.78);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  z-index:5000;
}

.modal[hidden]{ display:none; }

.modal-card{
  background:var(--de-panel);
  border:1px solid var(--de-line-soft);
  border-radius:14px;
  padding:30px;
  max-width:440px;
  width:100%;
  position:relative;
}

.modal-card h2{ margin:0 0 6px; }
.modal-sub{ opacity:.7; font-size:14px; margin:0 0 20px; }

.modal-card input,
.modal-card textarea,
.modal-card select{
  width:100%;
  max-width:none;
  margin:0 0 12px;
  padding:14px;
  background:#0a0a0a;
  color:var(--de-text);
  border:1px solid var(--de-line-soft);
  border-radius:10px;
  font-size:16px;
  font-family:inherit;
}

.modal-actions{ display:flex; gap:10px; margin-top:6px; }
.modal-actions .gold-btn,
.modal-actions .btn-ghost{ margin-top:0; flex:1; }

.modal-close{
  position:absolute;
  top:10px;
  right:14px;
  background:none;
  border:none;
  color:#999;
  font-size:30px;
  line-height:1;
  cursor:pointer;
  padding:4px 8px;
}
.modal-close:hover{ color:var(--de-text); }

.disclaimer{
  font-size:12px;
  opacity:.5;
  max-width:720px;
  margin:18px auto 0;
  line-height:1.6;
}

/* ============================ DEAL DETAIL PAGE ============================ */
.deal-detail{ max-width:1100px; margin:0 auto; padding:30px 6% 60px; }

.breadcrumb{ font-size:13px; color:#8d8d8d; margin-bottom:18px; }
.breadcrumb a{ color:#8d8d8d; text-decoration:none; }
.breadcrumb a:hover{ color:var(--de-gold); }

.detail-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom:22px;
}

.detail-head h1{ margin:0 0 6px; font-size:clamp(24px,4vw,36px); }
.detail-head .deal-location{ margin:0; }

.detail-price{ text-align:right; }
.detail-price .amount{ font-size:34px; font-weight:700; color:var(--de-gold); }
.detail-price .label{ font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:#777; }

@media (max-width:640px){
  .detail-price{ text-align:left; }
}

/* gallery */
.gallery{ margin-bottom:28px; }

.gallery-main{
  width:100%;
  aspect-ratio:16/9;
  background:#0a0a0a;
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--de-line);
}

.gallery-main img{ width:100%; height:100%; object-fit:cover; display:block; }

.gallery-thumbs{
  display:flex;
  gap:10px;
  margin-top:10px;
  overflow-x:auto;
  padding-bottom:4px;
}

.gallery-thumbs button{
  flex:0 0 auto;
  width:92px;
  height:62px;
  padding:0;
  border:2px solid transparent;
  border-radius:8px;
  overflow:hidden;
  background:#0a0a0a;
  cursor:pointer;
}

.gallery-thumbs button[aria-current="true"]{ border-color:var(--de-gold); }
.gallery-thumbs img{ width:100%; height:100%; object-fit:cover; }

.gallery-empty{
  width:100%;
  aspect-ratio:16/9;
  background:#0a0a0a;
  border:1px dashed var(--de-line-soft);
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#666;
  text-align:center;
  padding:20px;
}

/* detail layout */
.detail-grid{
  display:grid;
  grid-template-columns:1fr 340px;
  gap:30px;
  align-items:start;
}

@media (max-width:900px){
  .detail-grid{ grid-template-columns:1fr; }
}

.detail-panel{
  background:var(--de-panel);
  border:1px solid var(--de-line);
  border-radius:14px;
  padding:24px;
  margin-bottom:20px;
}

.detail-panel h2{ margin:0 0 16px; font-size:19px; color:var(--de-gold); }

.spec-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:16px;
}

.spec dt{ font-size:11px; letter-spacing:1.4px; text-transform:uppercase; color:#8d8d8d; margin-bottom:4px; }
.spec dd{ margin:0; font-size:16px; font-weight:600; }
.spec dd.muted{ color:#777; font-weight:400; font-size:14px; }

.fin-table{ width:100%; border-collapse:collapse; }
.fin-table th,
.fin-table td{
  text-align:left;
  padding:11px 0;
  border-bottom:1px solid var(--de-line);
  font-size:15px;
}
.fin-table th{ font-weight:400; color:#9a9a9a; }
.fin-table td{ text-align:right; font-weight:600; }
.fin-table td.muted{ color:#777; font-weight:400; font-size:13px; }
.fin-table td.positive{ color:#6fd37a; }
.fin-table tr:last-child th,
.fin-table tr:last-child td{ border-bottom:none; }

.sticky-panel{ position:sticky; top:96px; }

@media (max-width:900px){
  .sticky-panel{ position:static; }
}

.detail-panel .gold-btn,
.detail-panel .btn-ghost{ width:100%; margin-top:10px; }

.estimate-note{
  font-size:12px;
  color:#8d8d8d;
  line-height:1.6;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid var(--de-line);
}

.pill-row{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.pill{
  background:#0a0a0a;
  border:1px solid var(--de-line-soft);
  color:#cfcfcf;
  padding:5px 12px;
  border-radius:20px;
  font-size:12px;
}

.bullet-list{ padding-left:20px; margin:0; }
.bullet-list li{ margin-bottom:9px; line-height:1.6; }

.detail-loading,
.detail-error{ text-align:center; padding:80px 20px; }

/* ==========================================================================
   Account page, locks, calculators and the enriched deal page
   ========================================================================== */

/* ------------------------------------------------------------- account ---- */
.account-grid{
  max-width:1100px;
  margin:0 auto;
  padding:0 6% 60px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  align-items:start;
}

@media (max-width:820px){
  .account-grid{ grid-template-columns:1fr; }
}

.account-grid .detail-panel{ margin-bottom:0; }

.account-grid label{
  display:block;
  font-size:11px;
  letter-spacing:1.4px;
  text-transform:uppercase;
  color:#9a9a9a;
  margin-bottom:6px;
}

.account-grid input,
.account-grid select{
  width:100%;
  max-width:none;
  margin:0 0 12px;
  padding:12px;
  background:#0a0a0a;
  color:var(--de-text);
  border:1px solid var(--de-line-soft);
  border-radius:8px;
  font-size:15px;
  font-family:inherit;
}

.account-grid select[multiple]{ padding:6px; }

.field-hint{ font-size:11px; color:#777; margin:-6px 0 12px; }

.buybox-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:16px;
  margin-top:14px;
}

.buybox-numbers{ display:flex; flex-direction:column; }

.checkbox-row{
  display:flex !important;
  align-items:center;
  gap:10px;
  margin:10px 0 16px;
  font-size:14px;
  text-transform:none !important;
  letter-spacing:0 !important;
  color:var(--de-text) !important;
}

.checkbox-row input{ width:auto !important; margin:0 !important; }

/* status pills */
.pill-good{ border-color:#2f6b38; color:#6fd37a; }
.pill-warn{ border-color:#6b5a1f; color:#e2c04f; }
.pill-bad{ border-color:#6b2f2f; color:#ff8a8a; }
.pill-muted{ color:#8d8d8d; }

.pof-status{ margin:14px 0; font-size:14px; }
.pof-ok{ color:#6fd37a; }
.pof-pending{ color:#e2c04f; }
.pof-bad{ color:#ff8a8a; }

/* compact lists */
.mini-list{ display:flex; flex-direction:column; }

.mini-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:12px 0;
  border-bottom:1px solid var(--de-line);
  flex-wrap:wrap;
}
.mini-row:last-child{ border-bottom:none; }
.mini-row a{ color:var(--de-text); text-decoration:none; font-weight:600; }
.mini-row a:hover{ color:var(--de-gold); }
.mini-sub{ font-size:12px; color:#8d8d8d; margin-top:2px; }
.mini-right{ display:flex; align-items:center; gap:10px; font-size:14px; }

.link-btn{
  background:none;
  border:none;
  color:#8d8d8d;
  cursor:pointer;
  font-size:13px;
  text-decoration:underline;
  padding:2px 4px;
  font-family:inherit;
}
.link-btn:hover{ color:var(--de-gold); }

/* ---------------------------------------------------------------- locks --- */
.lock-banner{
  border-radius:12px;
  padding:16px 18px;
  margin-bottom:18px;
  border:1px solid var(--de-line-soft);
  background:#0f0f0f;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}

.lock-banner.held{ border-color:#6b5a1f; }
.lock-banner.mine{ border-color:#2f6b38; }

.lock-banner h3{ margin:0 0 4px; font-size:16px; }
.lock-banner p{ margin:0; font-size:13px; opacity:.75; }

.lock-countdown{
  font-size:22px;
  font-weight:700;
  color:var(--de-gold);
  font-variant-numeric:tabular-nums;
}

.lock-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.lock-actions .gold-btn,
.lock-actions .btn-ghost{ margin-top:0; }

/* ---------------------------------------------------------- watch button -- */
.watch-btn{
  background:transparent;
  border:1px solid var(--de-line-soft);
  color:#bdbdbd;
  border-radius:8px;
  padding:10px 14px;
  cursor:pointer;
  font-family:inherit;
  font-size:14px;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.watch-btn:hover{ border-color:var(--de-gold); color:var(--de-gold); }
.watch-btn[aria-pressed="true"]{
  border-color:var(--de-gold);
  color:var(--de-gold);
  background:rgba(201,162,39,.08);
}

/* ------------------------------------------------------------ match badge - */
.match-badge{
  display:inline-block;
  padding:4px 11px;
  border-radius:20px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.6px;
  background:rgba(111,211,122,.12);
  border:1px solid #2f6b38;
  color:#6fd37a;
  margin-bottom:10px;
}
.match-badge.partial{
  background:rgba(226,192,79,.1);
  border-color:#6b5a1f;
  color:#e2c04f;
}

.match-reasons{ font-size:12px; color:#8d8d8d; margin:8px 0 0; padding-left:18px; }
.match-reasons li{ margin-bottom:4px; }

/* ----------------------------------------------------------- calculators -- */
.calc-tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:18px; }

.calc-tab{
  background:#0a0a0a;
  border:1px solid var(--de-line-soft);
  color:#bdbdbd;
  padding:9px 16px;
  border-radius:8px;
  cursor:pointer;
  font-family:inherit;
  font-size:13px;
}
.calc-tab[aria-selected="true"]{
  border-color:var(--de-gold);
  color:var(--de-gold);
  background:rgba(201,162,39,.08);
}

.calc-fields{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;
  margin-bottom:18px;
}

.calc-fields label{
  display:block;
  font-size:11px;
  letter-spacing:1.3px;
  text-transform:uppercase;
  color:#9a9a9a;
  margin-bottom:5px;
}

.calc-fields input{
  width:100%;
  max-width:none;
  margin:0;
  padding:11px;
  background:#0a0a0a;
  color:var(--de-text);
  border:1px solid var(--de-line-soft);
  border-radius:8px;
  font-size:15px;
  font-family:inherit;
}

.calc-results{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:14px;
  padding:16px 0;
  border-top:1px solid var(--de-line);
  border-bottom:1px solid var(--de-line);
  margin-bottom:14px;
}

.calc-result .label{
  font-size:11px;
  letter-spacing:1.3px;
  text-transform:uppercase;
  color:#8d8d8d;
  margin-bottom:4px;
}
.calc-result .value{ font-size:22px; font-weight:700; }
.calc-result .value.positive{ color:#6fd37a; }
.calc-result .value.negative{ color:#ff8a8a; }
.calc-result .value.neutral{ color:var(--de-gold); }

.calc-assumptions{
  font-size:12px;
  color:#8d8d8d;
  line-height:1.7;
  padding-left:18px;
  margin:0;
}

/* ------------------------------------------------------------- timeline --- */
.timeline{ display:flex; gap:0; flex-wrap:wrap; margin:6px 0 0; padding:0; list-style:none; }

.timeline li{
  flex:1;
  min-width:110px;
  padding:10px 12px;
  border-top:3px solid var(--de-line-soft);
  font-size:12px;
  color:#777;
}
.timeline li.done{ border-top-color:var(--de-gold); color:var(--de-text); }
.timeline li.current{ border-top-color:var(--de-gold); color:var(--de-gold); font-weight:700; }
.timeline .step-label{ display:block; letter-spacing:1.2px; text-transform:uppercase; }

/* ------------------------------------------------------------ documents --- */
.doc-list{ list-style:none; padding:0; margin:0; }
.doc-list li{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:11px 0;
  border-bottom:1px solid var(--de-line);
  gap:12px;
  font-size:14px;
}
.doc-list li:last-child{ border-bottom:none; }
.doc-list .doc-meta{ font-size:12px; color:#8d8d8d; }

/* ----------------------------------------------------------------- comps -- */
.comps-table{ width:100%; border-collapse:collapse; font-size:14px; }
.comps-table th,
.comps-table td{
  text-align:left;
  padding:10px 8px;
  border-bottom:1px solid var(--de-line);
}
.comps-table th{ color:#9a9a9a; font-weight:400; font-size:12px; letter-spacing:1px; text-transform:uppercase; }
.comps-table td.num{ text-align:right; font-variant-numeric:tabular-nums; }

/* --------------------------------------------------------------- video ---- */
.video-wrap{
  position:relative;
  padding-bottom:56.25%;
  height:0;
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--de-line);
}
.video-wrap iframe{
  position:absolute;
  top:0; left:0;
  width:100%; height:100%;
  border:0;
}

/* ========================================================================== 
   Investor dashboard (dashboard.html)
   Panels are independent: one failing query must not blank the page, so each
   carries its own empty / error state inside the same shell.
   ========================================================================== */
.dash-wrap{ padding:40px 6% 72px; max-width:1180px; margin:0 auto; }

.dash-head{
  display:flex; flex-wrap:wrap; gap:12px;
  align-items:baseline; justify-content:space-between;
  margin:0 0 28px;
}
.dash-head h1{ margin:0; font-size:clamp(24px,4vw,34px); }
.dash-head-actions{ display:flex; gap:10px; flex-wrap:wrap; }

.dash-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:20px;
}

.dash-panel{
  background:var(--de-panel);
  border:1px solid var(--de-line);
  border-radius:var(--de-radius-lg);
  padding:20px;
  min-width:0;              /* lets long titles truncate instead of overflowing */
}
.dash-panel-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin:0 0 14px;
}
.dash-panel-head h2{
  margin:0; font-size:15px; letter-spacing:2px; text-transform:uppercase;
  color:var(--de-gold);
}
.dash-panel-head a{ font-size:13px; opacity:.75; }

/* A panel spanning the full width on wide screens, for the deal lists. */
.dash-panel-wide{ grid-column:1 / -1; }

/* ------------------------------------------------------------------ rows - */
.dash-row{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:11px 0;
  border-bottom:1px solid var(--de-line);
  text-decoration:none; color:inherit;
}
.dash-row:last-child{ border-bottom:0; }
.dash-row:hover{ color:var(--de-gold); }

.dash-row-main{ min-width:0; display:flex; flex-direction:column; gap:3px; }
.dash-row-title{
  font-weight:600;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.dash-row-sub{ font-size:13px; color:var(--de-text-muted); }
.dash-row-side{
  display:flex; align-items:center; gap:10px;
  flex-shrink:0; text-align:right;
}
.dash-row-price{ font-weight:700; white-space:nowrap; }
.dash-row-when{ font-size:12px; color:var(--de-text-muted); white-space:nowrap; }

.dash-badge{
  background:rgba(245,197,24,.14);
  color:var(--de-gold);
  border:1px solid rgba(245,197,24,.35);
  border-radius:999px;
  padding:3px 10px;
  font-size:11px; font-weight:700; white-space:nowrap;
}

/* --------------------------------------------------------------- status -- */
.dash-status{
  border-radius:999px; padding:3px 10px;
  font-size:11px; font-weight:700; white-space:nowrap;
  border:1px solid var(--de-line-soft); color:var(--de-text-muted);
}
.dash-status-submitted,
.dash-status-pending{ color:#cfcfcf; border-color:#444; }
.dash-status-under-review{ color:#8fc7ff; border-color:#2f5d85; }
.dash-status-countered{ color:#f5c518; border-color:#8a7016; }
.dash-status-accepted{ color:#6fd37a; border-color:#2f6b36; }
.dash-status-rejected{ color:#ff8a8a; border-color:#7a3333; }
.dash-status-withdrawn,
.dash-status-expired{ color:#999; border-color:#3a3a3a; }

/* -------------------------------------------------------- notifications -- */
.dash-note{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 0; border-bottom:1px solid var(--de-line);
}
.dash-note:last-child{ border-bottom:0; }
.dash-note-unread{ cursor:pointer; }
.dash-note-unread .dash-row-title{ position:relative; padding-left:14px; }
.dash-note-unread .dash-row-title::before{
  content:""; position:absolute; left:0; top:50%;
  width:7px; height:7px; margin-top:-3px;
  border-radius:50%; background:var(--de-gold);
}

.dash-unread-badge{
  background:var(--de-gold); color:var(--de-gold-ink);
  border-radius:999px; min-width:18px; height:18px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:800; padding:0 5px;
}

/* ------------------------------------------------- empty / error / load -- */
.dash-empty{ padding:18px 0; color:var(--de-text-muted); }
.dash-empty p{ margin:0 0 12px; }
.dash-error p{ color:#ff8a8a; }

.dash-btn{
  display:inline-block;
  background:var(--de-gold); color:var(--de-gold-ink);
  border:0; border-radius:999px;
  padding:9px 18px; font-size:14px; font-weight:700;
  cursor:pointer; text-decoration:none;
}
.dash-btn:hover{ background:var(--de-gold-strong); color:var(--de-gold-ink); }

.dash-skel{
  height:44px; margin-bottom:8px; border-radius:var(--de-radius);
  background:linear-gradient(90deg,#161616 25%,#1e1e1e 37%,#161616 63%);
  background-size:400% 100%;
  animation:dash-shimmer 1.3s ease-in-out infinite;
}
@keyframes dash-shimmer{ 0%{background-position:100% 50%} 100%{background-position:0 50%} }

@media (prefers-reduced-motion: reduce){
  .dash-skel{ animation:none; }
}

@media (max-width:640px){
  .dash-wrap{ padding:28px 16px 56px; }
  .dash-grid{ grid-template-columns:1fr; }
  .dash-row-sub{ font-size:12px; }
}

/* ==========================================================================
   Marketplace: layout toggle and paging
   ========================================================================== */
.view-toggle{
  display:inline-flex;
  border:1px solid var(--de-line-soft);
  border-radius:999px;
  overflow:hidden;
}
.view-btn{
  background:transparent;
  color:var(--de-text-muted);
  border:0;
  padding:7px 16px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}
.view-btn[aria-pressed="true"]{
  background:var(--de-gold);
  color:var(--de-gold-ink);
}
.view-btn:focus-visible{ outline:2px solid var(--de-gold); outline-offset:2px; }

/* List view reuses the same cards: one per row, image beside the text, so
   nothing has to be re-rendered when the mode changes. */
.deal-grid-list{ grid-template-columns:1fr; gap:12px; }

.deal-grid-list .deal-card{
  display:grid;
  grid-template-columns:220px 1fr;
  align-items:stretch;
}
.deal-grid-list .deal-media{ height:100%; min-height:150px; }
.deal-grid-list .deal-media img{ height:100%; object-fit:cover; }

@media (max-width:640px){
  /* Two columns at phone width would give each card ~150px. Below this the
     list view collapses back to the stacked card, which is the same thing
     grid view already does. */
  .deal-grid-list .deal-card{ grid-template-columns:1fr; }
  .deal-grid-list .deal-media{ min-height:0; }
}

.load-more-wrap{
  display:flex;
  justify-content:center;
  margin-top:26px;
}

/* --------------------------------------------------------------------------
   Visible entry point to the portal.
   "Investor Login" lives in the nav, which collapses behind the hamburger on
   a phone - so the only door into the portal was two taps deep in a menu of
   ten links. This puts one in the hero where people look for it.
   -------------------------------------------------------------------------- */
.portal-hero-cta{
  margin:22px 0 0;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
}

.portal-hero-cta .gold-btn,
.portal-hero-cta .btn-ghost{
  padding:13px 24px;
  font-size:1rem;
  font-weight:700;
  border-radius:var(--de-radius,6px);
  text-decoration:none;
  cursor:pointer;
}

@media (max-width:560px){
  .portal-hero-cta{ flex-direction:column; }
  .portal-hero-cta .gold-btn,
  .portal-hero-cta .btn-ghost{ width:100%; text-align:center; }
}
