/* Shared component styles for the Tamil Nadu leadership desk pages.
   Loaded on top of the global /tn/styles.css. Keeps per-page <style> blocks out. */

/* --- Filter chips + live count (cabinet, MLAs, agencies) --- */
.chips { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 16px; }
.chip {
  font:600 12px/1 var(--font-mono,monospace); letter-spacing:.03em;
  padding:8px 13px; border:1px solid var(--rule-hair); border-radius:999px;
  background:transparent; color:var(--ink-2); cursor:pointer; text-transform:uppercase;
}
.chip .n { opacity:.6; margin-left:6px; font-weight:500; }
.chip[aria-pressed="true"] { background:var(--civic-red); color:#fff; border-color:var(--civic-red); }
.livecount { font:500 12px var(--font-mono,monospace); color:var(--graphite); margin-left:auto; }

/* --- Table rows --- */
.row-click { cursor:pointer; }
.row-click:hover { background:var(--paper-3); }
.pf { color:var(--graphite); font-size:12.5px; }
.muted { color:var(--graphite); }
.caret { color:var(--graphite); font-size:11px; margin-left:6px; }
td .mono, .mono { font-family:var(--font-mono); }

/* --- Party tag --- */
.party-tag {
  display:inline-block; font:600 10.5px/1 var(--font-mono,monospace);
  padding:3px 7px; border-radius:4px; border:1px solid var(--rule-hair);
  color:var(--ink-2); letter-spacing:.03em; white-space:nowrap;
}
.party-tag.TVK { color:var(--civic-red); border-color:var(--civic-red); }

/* --- Footnotes / notes --- */
.section-foot { margin:16px 2px 0; font-size:12px; line-height:1.6; color:var(--graphite); }
.cutoff-note { margin:16px 2px 0; font-size:12.5px; line-height:1.7; color:var(--graphite); }
.cutoff-note .vbadge { margin:0 1px; }
.cab-source { margin:14px 2px 0; font-size:12.5px; line-height:1.5; color:var(--graphite); }
.cab-source a { color:var(--civic-red); border-bottom:1px solid currentColor; }

/* --- Reveal-on-click contact (cabinet) --- */
.reveal-btn {
  font:600 12px var(--font-mono,monospace); color:var(--civic-red); background:transparent;
  border:1px solid var(--rule-hair); border-radius:5px; padding:4px 10px; cursor:pointer;
}
.unofficial { font:500 10.5px/1.4 var(--font-mono,monospace); color:var(--graphite); margin-left:9px; }

/* --- Grouped lists (agencies by parent department) --- */
.group-head {
  font:600 12px/1 var(--font-mono,monospace); letter-spacing:.05em; text-transform:uppercase;
  color:var(--civic-red); margin:26px 0 8px; padding-bottom:6px; border-bottom:1px solid var(--rule-hair);
}
.group-head:first-of-type { margin-top:4px; }
.group-head .gn { color:var(--graphite); font-weight:500; margin-left:8px; }

/* --- Hub: branch cards --- */
.branch-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  border:1px solid var(--rule-hair); border-radius:var(--radius); background:var(--paper-3);
  box-shadow:0 1px 0 var(--rule-soft), 0 8px 24px -12px var(--shadow-soft);
  margin:8px 0 12px; overflow:hidden;
}
@media (max-width:900px){ .branch-grid{ grid-template-columns:1fr; } }
.branch-card {
  display:flex; flex-direction:column; padding:22px 24px 20px;
  border-right:1px solid var(--rule-hair); border-bottom:1px solid var(--rule-hair);
  color:inherit; transition:background var(--motion); min-height:172px;
}
.branch-card:hover { background:var(--paper-2); }
.branch-card .bc-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px; }
.branch-card .bc-title { font-family:var(--font-display); font-weight:500; font-size:21px; line-height:1.15; color:var(--ink); margin:0; }
.branch-card .bc-count { font:600 13px var(--font-mono,monospace); color:var(--civic-red); white-space:nowrap; }
.branch-card .bc-desc { font-size:13px; line-height:1.55; color:var(--graphite); margin:0 0 auto; }
.branch-card .bc-arrow { margin-top:14px; font:600 11px var(--font-mono,monospace); letter-spacing:.08em; text-transform:uppercase; color:var(--civic-red); }

/* --- Minister detail drawer (cabinet page) --- */
.min-drawer-backdrop { position:fixed; inset:0; background:rgba(20,16,12,.42); display:none; z-index:60; }
.min-drawer-backdrop.open { display:block; }
.min-drawer {
  position:absolute; top:0; right:0; height:100%; width:min(460px,93vw); background:var(--paper,#f4efe4);
  box-shadow:-10px 0 44px rgba(0,0,0,.2); padding:24px 26px 44px; overflow-y:auto;
  border-left:3px solid var(--civic-red); animation:drawerIn .18s ease;
}
@keyframes drawerIn { from{ transform:translateX(28px); opacity:.4; } to{ transform:none; opacity:1; } }
.min-drawer-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; border-bottom:1px solid var(--rule-hair); padding-bottom:16px; margin-bottom:18px; }
.min-drawer-head .role { font:600 11px/1 var(--font-mono,monospace); text-transform:uppercase; letter-spacing:.06em; color:var(--graphite); margin-bottom:7px; }
.min-drawer-head .name { font-family:var(--font-display); font-size:25px; line-height:1.15; margin:0 0 8px; }
.min-drawer-head .ptitle { font-size:13.5px; color:var(--ink-2); line-height:1.4; }
.min-drawer .blk { margin:0 0 17px; }
.min-drawer .blk:last-child { margin-bottom:0; }
.min-drawer .dl { font:600 11px/1 var(--font-mono,monospace); text-transform:uppercase; letter-spacing:.05em; color:var(--graphite); margin-bottom:6px; }
.min-drawer .blk a { color:var(--civic-red); border-bottom:1px solid currentColor; }
.min-drawer #minPortfolio { font-size:14px; line-height:1.65; color:var(--ink-2); }