/* Self-contained colors + explicit dark-mode overrides, since Gin's dark
   mode (html.gin--dark-mode) is enabled by default here. */
#figli-dashboard-app {
  --figli-bg: #ffffff;
  --figli-bg-alt: #f5f6f8;
  --figli-text: #1a1a1a;
  --figli-text-light: #6b7280;
  --figli-border: #dcdee2;
  --figli-error: #c9312b;
  --figli-positive: #1a7f37;

  font-family: Inter, -apple-system, sans-serif;
  max-width: 1200px;
  margin: 1rem 0;
  color: var(--figli-text);
}

html.gin--dark-mode #figli-dashboard-app {
  --figli-bg: #232426;
  --figli-bg-alt: #2c2d30;
  --figli-text: #e8e9ea;
  --figli-text-light: #a1a5ab;
  --figli-border: #3d3e42;
  --figli-error: #ff6b6b;
  --figli-positive: #4ade80;
}

#figli-dashboard-app h2 {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 2rem 0 0.75rem;
  color: var(--figli-text);
}

#figli-dashboard-app .figli-note {
  color: var(--figli-text-light);
  font-size: 0.875rem;
  margin-bottom: 1rem;
}

#figli-dashboard-app table {
  width: 100%;
  border-collapse: collapse;
  background: var(--figli-bg);
  color: var(--figli-text);
  border: 1px solid var(--figli-border);
  border-radius: 6px;
  overflow: hidden;
}

#figli-dashboard-app th,
#figli-dashboard-app td {
  text-align: left;
  padding: 0.5rem 0.85rem;
  border-bottom: 1px solid var(--figli-border);
  color: var(--figli-text);
}

#figli-dashboard-app th {
  background: var(--figli-bg-alt);
  font-weight: 600;
  font-size: 0.85rem;
}

#figli-dashboard-app td.amount {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

#figli-dashboard-app tr.positive td.amount { color: var(--figli-positive); }
#figli-dashboard-app tr.negative td.amount { color: var(--figli-error); }
#figli-dashboard-app tr.total td { font-weight: 700; border-top: 2px solid var(--figli-border); }

#figli-dashboard-app .figli-error {
  background: #fde8e8;
  border: 1px solid #f4a3a3;
  color: #7a1a1a;
  padding: 0.75rem 1rem;
  border-radius: 6px;
}