/* Plans-section-specific styles. Most layout reuses filings/css/styles.css.
   This file is a small extension for plan-specific tweaks. */

/* The plan badge sits in the same slot as the Filings status badge. The
   Filings tab uses a hardcoded teal bg; here we color the badge by metal
   tier so a Bronze plan looks visually different from a Gold one. */
.filing-badge.metal-bronze       { background:#b87333; }
.filing-badge.metal-silver       { background:#94a3b8; color:#0f172a; }
.filing-badge.metal-gold         { background:#d4af37; color:#0f172a; }
.filing-badge.metal-platinum     { background:#cbd5e1; color:#0f172a; }
.filing-badge.metal-catastrophic { background:#475569; }
.filing-badge.metal-na           { background:#374151; color:var(--text2); }

/* ── Plan picker table (Plan Detail tab) ── */

.picker-info{
  font-family:var(--cond);
  font-size:12px;
  letter-spacing:.04em;
  color:var(--text3);
  margin-bottom:.6rem;
}
.picker-info span{color:var(--text2);font-weight:600;}

.picker-table{
  width:100%;
  border-collapse:collapse;
  background:var(--navy2);
  border:1px solid var(--border);
  border-radius:8px;
  overflow:hidden;
  margin-bottom:2rem;
}
.picker-table th{
  font-family:var(--cond);
  font-size:11px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text3);
  background:var(--navy3);
  padding:8px 14px;
  text-align:right;
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}
.picker-table th.left{text-align:left;}
.picker-table td{
  padding:9px 14px;
  border-bottom:1px solid rgba(30,58,95,.5);
  font-size:13px;
}
.picker-table td.left{color:var(--text);font-size:13px;}
.picker-table td.num{font-family:var(--mono);font-size:12px;text-align:right;color:var(--text);}
.picker-table tr:last-child td{border-bottom:none;}
.picker-table tr.row{cursor:pointer;transition:background .12s;}
.picker-table tr.row:hover{background:rgba(13,148,136,.08);}
.picker-table tr.row.selected{background:rgba(13,148,136,.18);}
.picker-table tr.row.selected td{color:var(--white);}
.picker-table .pos{color:var(--green);}
.picker-table .neg{color:var(--red);}

/* Plan-name cell can be long — let it ellipsize with the full name in title. */
.picker-table td.plan-name{
  color:var(--text);
  max-width:340px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* ── Year Comparison & Metal Comparison grids ── */
.plans-grid-wrap{
  background:var(--navy2);
  border:1px solid var(--border);
  border-radius:8px;
  overflow:auto;
  max-height:78vh;
}
.plans-grid-table{
  width:100%;
  border-collapse:collapse;
}
.plans-grid-table th, .plans-grid-table td{
  padding:8px 14px;
  text-align:right;
  font-family:var(--mono);
  font-size:12px;
  white-space:nowrap;
}
.plans-grid-table th.left, .plans-grid-table td.left{
  text-align:left;
  font-family:var(--cond);
}
.plans-grid-table thead th{
  background:var(--navy3);
  border-bottom:1px solid var(--border);
  font-family:var(--cond);
  font-weight:600;
  color:var(--text3);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:11px;
  position:sticky;
  top:0;
  z-index:1;
}
.plans-grid-table tbody td{
  border-bottom:1px solid rgba(30,58,95,.5);
  color:var(--text);
}
.plans-grid-table tbody td.left{
  font-family:var(--cond);
  color:var(--text2);
  font-weight:600;
}
.plans-grid-table tbody tr:nth-child(odd) td{background:rgba(255,255,255,0.015);}
.plans-grid-table tbody tr:hover td{background:rgba(13,148,136,.06);}
.plans-grid-table tbody tr:last-child td{border-bottom:none;}

/* Totals row + column visually separated from the grid body. */
.plans-grid-table th.totals,
.plans-grid-table td.totals{
  background:rgba(13,148,136,.08);
  color:var(--white);
  border-left:1px solid var(--border);
}
.plans-grid-table tr.totals-row td{
  background:rgba(13,148,136,.08);
  border-top:1px solid var(--border);
  color:var(--white);
  font-weight:600;
}
.plans-grid-table tr.totals-row td.left{color:var(--white);}

/* Cell text colors for pct_change semantics. */
.plans-grid-table .pos{color:var(--green);}
.plans-grid-table .neg{color:var(--red);}
.plans-grid-table .zero{color:var(--text3);}
.plans-grid-table .co-name{max-width:280px;overflow:hidden;text-overflow:ellipsis;}

/* ── Year Comparison trend chart (line chart by metal) ── */
.plans-yc-chart-wrap{
  margin-top:1rem;
  background:var(--navy2);
  border:1px solid var(--border);
  border-radius:8px;
  padding:.75rem 1rem;
}
.plans-yc-chart{
  display:block;
  width:100%;
  height:auto;
  max-height:420px;
}
.plans-yc-chart .axis-label{
  font-family:var(--mono);
  font-size:10px;
  fill:var(--text3);
}
.plans-yc-chart .legend-label{
  font-family:var(--cond);
  font-size:11px;
  fill:var(--text2);
}
.plans-yc-chart circle{cursor:default;}