/* ===================================================
   DASHBOARD STYLES
   =================================================== */

/* ─── Dashboard Grid ─────────────────────────────── */
.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) 320px;
  grid-template-rows: auto auto auto;
  gap: 1.25rem;
}

.dashboard-chart-main { grid-column: 1; }
.dashboard-order-card { grid-column: 2; grid-row: 1 / 3; }
.dashboard-watchlist  { grid-column: 2; grid-row: 3; }
.dashboard-ai-card    { grid-column: 1; grid-row: 2; }
.dashboard-holdings   { grid-column: 1; grid-row: 3; }
.dashboard-txns       { grid-column: 1; grid-row: 4; }

/* ─── Stat Icon ──────────────────────────────────── */
.stat-card { position: relative; }
.stat-icon {
  position: absolute; top: 1rem; right: 1rem;
  font-size: 1.75rem; opacity: 0.15;
}

/* ─── Order Form Extras ──────────────────────────── */
.order-total-row {
  padding: 0.5rem 0;
  border-top: 1px solid var(--border-subtle);
}
.order-total-row:first-of-type { border-top: none; }

/* ─── Watchlist Items ─────────────────────────────── */
.watchlist-item { border-bottom: 1px solid rgba(15,122,77,0.06); }
.watchlist-item:hover {
  background: var(--bg-glass);
  margin: 0 -1.5rem; padding: 0.875rem 1.5rem;
  border-radius: 6px;
}

/* ─── AI Insights ─────────────────────────────────── */
.ai-insight {
  display: flex; gap: 0.875rem; align-items: flex-start;
  padding: 0.875rem 0;
  border-bottom: 1px solid rgba(15,122,77,0.05);
}
.ai-insight:last-child { border-bottom: none; }
.ai-insight-icon {
  width: 36px; height: 36px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; flex-shrink: 0;
}
.ai-insight-body { flex: 1; }
.ai-insight-title { font-size: 0.875rem; font-weight: 600; color: var(--text-primary); }
.ai-insight-desc  { font-size: 0.78rem; color: var(--text-secondary); margin-top: 2px; line-height: 1.5; }
.ai-insight-meta  { font-size: 0.7rem; color: var(--text-muted); margin-top: 4px; }

/* ─── Holdings Table ──────────────────────────────── */
#holdings-table th { font-size: 0.68rem; }
#holdings-table td { font-size: 0.82rem; }

/* ─── Transaction List ────────────────────────────── */
.txn-item {
  display: flex; align-items: center; gap: 0.875rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(15,122,77,0.05);
}
.txn-item:last-child { border-bottom: none; }
.txn-icon {
  width: 38px; height: 38px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem; flex-shrink: 0;
}
.txn-body { flex: 1; }
.txn-title { font-size: 0.85rem; font-weight: 600; }
.txn-date  { font-size: 0.72rem; color: var(--text-muted); margin-top: 2px; }
.txn-amount { text-align: right; }
.txn-amount .value { font-weight: 700; font-size: 0.9rem; }
.txn-amount .shares { font-size: 0.72rem; color: var(--text-muted); }

/* ─── Live Clock ─────────────────────────────────── */
.live-market-badge {
  background: rgba(0,230,118,0.06);
  border: 1px solid rgba(0,230,118,0.15);
  border-radius: var(--radius-full);
  padding: 0.35rem 0.875rem;
}

/* ─── Responsive ─────────────────────────────────── */
@media (max-width: 1280px) {
  .dashboard-grid {
    grid-template-columns: 1fr 280px;
  }
}
@media (max-width: 1100px) {
  .dashboard-grid {
    grid-template-columns: 1fr;
  }
  .dashboard-order-card { grid-column: 1; grid-row: auto; }
  .dashboard-watchlist  { grid-column: 1; grid-row: auto; }
  .dashboard-ai-card    { grid-column: 1; grid-row: auto; }
  .dashboard-holdings   { grid-column: 1; grid-row: auto; }
  .dashboard-txns       { grid-column: 1; grid-row: auto; }
}
