/* ── Reset & base ──────────────────────────────────────────────────────────── */

*, *::before, *::after { box-sizing: border-box; }

body {
  background: #f4f5f7;
  color: #111;
  -webkit-font-smoothing: antialiased;
}

/* navbarPage wraps the tab body in a Bootstrap .container-fluid whose default
   gutter padding creates the grey frame around the hero. Strip it so the hero
   sits flush below the navbar and spans the full page width; inner sections
   (hero, hero-tabs, cards) carry their own horizontal padding. Scope to the
   page-level container only — the navbar keeps its own inner .container-fluid. */
.navbar + .container-fluid {
  padding-left: 0;
  padding-right: 0;
}

h3, h4, h5 { font-weight: 700; }
h6 { font-size: 10px; font-weight: 600; }

/* ── Navbar ────────────────────────────────────────────────────────────────── */

.navbar {
  background: #fff !important;
  border-bottom: 1px solid #e8e8e8;
  padding: 0 32px;
  min-height: 52px;
  box-shadow: none;
  position: sticky;
  top: 0;
  z-index: 1030;
  margin-bottom: 0; /* kill Bootstrap default so hero sits flush under navbar */
}

.navbar-brand {
  color: #111 !important;
  font-weight: 700;
  letter-spacing: -0.01em;
  padding: 0;
  display: flex !important;
  align-items: center;
  height: 52px;
}

.navbar-brand:hover { color: #111 !important; }

.navbar-nav { gap: 12px; }

.nav-link {
  color: #555 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 6px 14px !important;
  border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}

.nav-link:hover {
  color: #111 !important;
  background: #f4f5f7;
}

.nav-link.active {
  color: #fff !important;
  background: #111 !important;
  border-radius: 6px;
}

/* Spacing between hero and inner tab strip */
.hero-tabs {
  margin-top: 24px;
}

.hero-tabs ul.nav-tabs {
  padding: 0 32px;
  background: transparent;
  border-bottom: none !important;
  margin-bottom: 0;
  gap: 4px;
}

/* Bootstrap draws the divider on .nav-tabs itself and a border on tab-content;
   kill both so only the active tab's short underline remains. */
.hero-tabs .nav-tabs { border-bottom: none !important; }
.hero-tabs .tab-content { border: none !important; }

/* Inner tabs — minimal underline, refreshed to fit the dashboard: uppercase
   small-caps rhythm (like the section labels) with a navy accent underline.
   Distinct from the black navbar pill and the navy filter chips. */
.nav-tabs .nav-link {
  text-transform: uppercase;
  letter-spacing: 0.07em;
  border: none;
  border-radius: 0;
  background: transparent !important;
  color: #8a94a0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 14px 8px !important;
  margin-bottom: -1px;
  box-shadow: inset 0 -2px 0 transparent;
  transition: color 0.15s, box-shadow 0.15s;
}

.nav-tabs .nav-link:hover {
  color: #0b233f !important;
  background: transparent !important;
  box-shadow: inset 0 -2px 0 #cdd6e0;
}

.nav-tabs .nav-link.active {
  color: #0b233f !important;
  background: transparent !important;
  box-shadow: inset 0 -2px 0 #0b233f;
  font-weight: 700 !important;
}

/* ── Tab header strip (plain — no stats) ───────────────────────────────────── */

.tab-header-strip {
  background: #fff;
  border-bottom: 1px solid #e8e8e8;
  padding: 14px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.tab-header-title {
  font-size: 16px;
  font-weight: 700;
  color: #111;
  letter-spacing: -0.01em;
  margin: 0;
}

/* ── Hero strip (dark — with stats) ────────────────────────────────────────── */

.hero-strip {
  background: #0b233f;
  padding: 28px 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px 40px;
}

.hero-strip-left {
  display: flex;
  flex-direction: column;
  flex: 1 1 360px;
  min-width: 300px;
  max-width: 560px;
}

.hero-strip-compact {
  min-height: 138px;
}

.hero-strip-title {
  font-size: 34px;
  font-weight: 600;
  color: #fff;
  letter-spacing: -0.02em;
  line-height: 1;
}

.hero-strip-subtitle {
  margin-top: 10px;
  font-size: 13.5px;
  font-weight: 400;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.7);
}

/* ── Selector bar ──────────────────────────────────────────────────────────── */

.selector-bar {
  background: #fff;
  position: sticky;
  top: 52px;
  z-index: 1020;
  /* Match the report sheet: 1200px centred, same 48px side gutters as
     .page-content so bar and report share left/right edges at any width. */
  margin: 20px auto 0;
  max-width: 1200px;
  width: calc(100% - 96px);
  border: 1px solid #e2e2e2;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(11, 35, 63, 0.06);
  /* No overflow:hidden — it would clip the selectize dropdown. The inner
     .filter-body carries matching corners so the fill still stays rounded. */
}

/* Collapsible filter section */
.filter-section { border: none; }

/* Inline variant — sits inside page-content, card width not full window */
.filter-section-inline {
  background: #fff;
  border: 1px solid #e2e2e2 !important;
  border-radius: 6px;
  margin-bottom: 36px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.filter-section-inline .filter-toggle {
  padding: 0 18px;
  border-bottom-color: transparent;
}

.filter-section-inline[open] .filter-toggle {
  border-bottom: 1px solid #e8eaef;
}

.filter-section-inline .filter-body {
  background: #fff;
  border-bottom: none;
  padding: 16px 18px 20px;
}

.filter-inline-row {
  display: flex;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 0;
}

/* Keyword search shares the inline row and fills the remaining width. Declared
   after .filter-inline-group so it overrides that rule's flex-shrink:0. */
.filter-inline-search.filter-inline-group {
  flex: 1 1 auto;
  min-width: 180px;
  padding-left: 16px;
}
.filter-inline-search .shiny-input-container { width: 100% !important; }
.filter-inline-search .form-control {
  margin-bottom: 0;
  height: 40px;
  font-size: 14px;
  padding: 8px 12px;
}

/* Keyword search — full-width second row beneath the pill groups. */
.filter-search-row {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid #eaecef;
}
.filter-search-row .filter-inline-label { display: block; margin-bottom: 8px; }
.filter-search-row .shiny-input-container { margin-bottom: 0; width: 100% !important; }
.filter-search-row .form-control {
  margin-bottom: 0;
  height: 40px;
  font-size: 14px;
  padding: 8px 12px;
}

.filter-inline-search .form-control { margin-bottom: 0; }
.filter-inline-search .shiny-input-container { margin-bottom: 0; width: 100% !important; }
.filter-inline-search .selectize-input { margin-bottom: 0; }
.filter-inline-search .selectize-control { margin-bottom: 0; }

.filter-inline-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex-shrink: 0;
  padding-left: 16px;
}
.filter-inline-row > .filter-inline-group:first-child { padding-left: 0; }

.filter-inline-group + .filter-inline-group {
  margin-left: 0;
}

.filter-inline-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #999;
  white-space: nowrap;
  line-height: 1;
}

.filter-inline-search-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #999;
  white-space: nowrap;
  line-height: 1;
  display: block;
  margin-bottom: 6px;
}

.filter-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 32px;
  height: 44px;
  cursor: pointer;
  user-select: none;
  list-style: none;
  transition: background 0.15s;
}

.filter-toggle:hover { background: #f8f9fa; }

.filter-toggle::-webkit-details-marker { display: none; }
.filter-toggle::marker { display: none; }

.filter-toggle-left {
  display: flex;
  align-items: center;
  gap: 7px;
}

.filter-toggle-icon {
  display: flex;
  align-items: center;
  opacity: 0.6;
}

.filter-toggle-label {
  font-size: 12px;
  font-weight: 600;
  color: #333;
  letter-spacing: 0;
}

.filter-toggle-chevron {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: #f0f2f4;
  border: 1px solid #e2e6ea;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #666;
  transition: transform 0.22s ease, background 0.15s, border-color 0.15s;
  flex-shrink: 0;
}

.filter-toggle:hover .filter-toggle-chevron {
  background: #e8edf3;
  border-color: #c8d0d8;
  color: #333;
}

details.filter-section[open] .filter-toggle {
  border-bottom: 1px solid #eaecef;
}

details.filter-section[open] .filter-toggle-chevron {
  transform: rotate(180deg);
  background: #0b233f;
  border-color: #0b233f;
  color: #fff;
}

/* Animated body */
.filter-body {
  padding: 18px 32px 20px;
  background: #f8f9fb;
  border-radius: 6px;
  animation: filter-expand 0.2s ease;
}

/* Reports-tab filter bar: white interior (no grey fill) + more breathing room. */
.selector-bar .filter-body {
  background: #fff;
  padding: 20px 28px 22px;
}

/* Project search fills the row; Outcome filter sits to its right. */
.filter-row {
  display: flex;
  align-items: flex-end;
  gap: 40px;
}
.filter-project { flex: 1 1 auto; min-width: 0; }
.filter-outcome { flex: 0 0 auto; }

/* Export-PDF button — mirrors the navy brand used across the report sheets. */
.btn-export-pdf {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 40px;
  padding: 0 18px;
  background: #0b233f;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.15s ease;
}
.btn-export-pdf:hover,
.btn-export-pdf:focus {
  background: #123356;
  color: #fff;
}
.btn-export-pdf .fa,
.btn-export-pdf .glyphicon { margin-right: 2px; }

/* Toolbar row above the report sheet — holds the Export button, right-aligned
   and constrained to the same 1200px centred column as the report card so the
   button lines up with the card's right edge. */
.report-toolbar {
  max-width: 1200px;
  margin: 0 auto 14px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* Report-page "Vote" button — coral, matching the navbar Vote launcher so the
   vote affordance is one consistent colour across the app. Sits beside Export
   PDF; same 40px height so they align. */
.btn-report-vote {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 40px;
  padding: 0 18px;
  background: #e0533d;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.01em;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 1px 4px rgba(224, 83, 61, 0.35);
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.btn-report-vote:hover,
.btn-report-vote:focus {
  background: #c83f2b;
  color: #fff;
  box-shadow: 0 2px 7px rgba(224, 83, 61, 0.45);
}
/* Already voted (or not a voter): quiet navy-outline — no coral urgency. */
.btn-report-vote.is-voted {
  background: #fff;
  color: #0b233f;
  border: 1.5px solid #d0d7de;
  box-shadow: none;
}
.btn-report-vote.is-voted:hover,
.btn-report-vote.is-voted:focus {
  background: #f5f7f9;
  color: #0b233f;
  border-color: #0b233f;
  box-shadow: none;
}

/* Taller search input in the filter bar (default compact height elsewhere). */
.selector-bar .selectize-input {
  min-height: 48px !important;
  padding: 0 16px !important;
  font-size: 16px !important;
  display: flex !important;
  align-items: center !important;   /* vertically centre the selected text */
}
.selector-bar .selectize-control.single .selectize-input > div {
  line-height: normal !important;
}
.selector-bar .selectize-control.single .selectize-input:after {
  margin-top: 0 !important;
}

@keyframes filter-expand {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes filter-expand {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.selector-bar .control-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #999;
  margin-bottom: 4px;
}

.selector-bar .form-control:not(.selectize-input):not(.selectize-dropdown):not(.selectize-dropdown-content),
.selector-bar .form-select {
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  font-size: 13px;
  height: 36px;
  padding: 0 10px;
  background: #fafafa;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.selector-bar .form-control:not(.selectize-input):not(.selectize-dropdown):not(.selectize-dropdown-content):focus,
.selector-bar .form-select:focus {
  border-color: #0b233f;
  box-shadow: 0 0 0 2px rgba(11,35,63,0.08);
  background: #fff;
  outline: none;
}

.selector-bar .shiny-input-container { margin-bottom: 0; }
.selector-bar .radio-pill-group { margin-top: 2px; }


/* ── Page content area ─────────────────────────────────────────────────────── */

.page-content {
  padding: 28px 48px;
  /* Inner content capped at 1200px (1200 + 2×48px gutter) and centred, so the
     Summary cards line up with the 1200px report/filter panels. */
  max-width: 1296px;
  margin: 0 auto;
}

/* ── Stats (inside hero-strip) ─────────────────────────────────────────────── */

/* Two-tier stats: hero total + labelled Outcome / Status tiers. */
.summary-stats {
  display: flex;
  align-items: stretch;
  gap: 16px;
}

/* Hero total */
.summary-stat-hero {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 8px 20px 8px 0;
  border-right: 1px solid rgba(255,255,255,0.15);
}
.summary-stat-hero-value {
  font-size: 46px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  letter-spacing: -0.04em;
}
.summary-stat-hero-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.55);
  margin-top: 8px;
  white-space: nowrap;
}

/* Stacked tiers */
.summary-stat-tiers {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 12px;
}
.summary-stat-tier {
  display: flex;
  align-items: center;
  gap: 16px;
}
.summary-stat-tier-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.4);
  flex-shrink: 0;
  text-align: right;
}
.summary-stat-row {
  display: flex;
  align-items: center;
  gap: 4px;
}

.summary-stat-cell {
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding: 5px 14px;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
  white-space: nowrap;
}
.summary-stat-value {
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
}
.summary-stat-label {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.55);
  white-space: nowrap;
}

/* ── Pill filters ──────────────────────────────────────────────────────────── */

.filter-pill,
.summary-pill {
  display: inline-block !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 4px 12px !important;
  margin: 2px 2px 2px 0 !important;
  cursor: pointer !important;
  user-select: none;
  background: #fff !important;
  color: #bbb !important;
  border: 1.5px solid #e2e6ea !important;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  text-decoration: none !important;
  line-height: 1.4;
}

.filter-pill.active,
.summary-pill.active {
  background: #0b233f !important;
  color: #fff !important;
  border-color: #0b233f !important;
}

/* ── Summary cards ─────────────────────────────────────────────────────────── */

.summary-card {
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 6px;
  margin-bottom: 28px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
  transition: box-shadow 0.15s;
}

.summary-card:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,0.13);
}

.summary-card-header {
  padding: 14px 20px;
  border-bottom: 1px solid #f0f0f0;
  background: #fafafa;
}

.summary-card-clickable {
  cursor: pointer;
  transition: background 0.2s, border-color 0.2s;
}

.summary-card-clickable:hover {
  background: #e8edf3;
}

.summary-card-clickable:hover .summary-card-title {
  color: #0b233f;
}

.summary-card-clickable:hover .summary-card-id {
  color: #6b82a0;
}

.summary-card-id {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #999;
  white-space: nowrap;
  flex-shrink: 0;
}

.summary-card-title {
  font-size: 18px;
  font-weight: 700;
  color: #111;
  line-height: 1.3;
  /* Take the middle space and wrap text early (min-width:0 lets a flex item
     shrink below its content width) so the outcome pill stays pinned top-right
     instead of being pushed onto its own line. */
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
}

.summary-card-body { padding: 0; }

.summary-meta-row {
  display: flex;
  border-bottom: 1px solid #f0f0f0;
}

.summary-meta-cell {
  padding: 10px 20px;
  border-right: 1px solid #f0f0f0;
  min-width: 140px;
}

.summary-meta-cell:last-child { border-right: none; }

/* Summary-card meta values are smaller than the full report's (scan vs read). */
.summary-meta-cell .report-meta-value,
.summary-meta-cell .report-lead-name {
  font-size: 15px;
}

.summary-desc {
  padding: 14px 20px 16px;
  font-size: 15px;
  line-height: 1.6;
  color: #1a1a1a;
}

.summary-edit-btn {
  font-size: 18px;
  padding: 4px 10px;
  border-radius: 5px;
  border: 1.5px solid #ddd;
  background: #fff;
  color: #111;
  cursor: pointer;
  line-height: 1;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.summary-edit-btn:hover {
  border-color: #0b233f;
  color: #0b233f;
  background: #f0f4f8;
}

/* Matrix card header — clickable hover */
.matrix-card-clickable {
  transition: background 0.2s;
}

.matrix-card-clickable:hover {
  background: #e8edf3;
}

.matrix-card-clickable:hover > div > div:last-child {
  color: #6b82a0;
}

/* ── Status / outcome tags ─────────────────────────────────────────────────── */

.tag {
  display: inline-block;
  padding: 4px 11px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  border: 1px solid transparent;
}

/* Vivid, saturated status pills — bright fill, matching border, punchy text. */
.status-active       { background: #d2fbe2; color: #067a3a; border-color: #34d17d; }
.status-onhold       { background: #fdf3cf; color: #8a6a00; border-color: #f2c53d; }
.status-closed       { background: #ffdede; color: #b81414; border-color: #f56b6b; }
.status-pending      { background: #ece0ff; color: #6a1fd0; border-color: #b189f5; }
.status-withdrew     { background: #e8eaed; color: #4a4a4a; border-color: #c2c7cd; }
.status-abandoned    { background: #ffdede; color: #b81414; border-color: #f56b6b; }
.status-approved     { background: #d2fbe2; color: #067a3a; border-color: #34d17d; }
.status-consideration{ background: #fdf3cf; color: #8a6a00; border-color: #f2c53d; }
.status-na           { background: #e8eaed; color: #777; border-color: #d0d4d9; }
.status-blue         { background: #d8ecff; color: #0b5bc4; border-color: #5aa8f5; }

.status-high     { background: #d2fbe2; color: #067a3a; border-left: 3px solid #1fbf63; }
.status-moderate { background: #fdf3cf; color: #8a6a00; border-left: 3px solid #f0c040; }
.status-low      { background: #ffdede; color: #b81414; border-left: 3px solid #ef4444; }

/* ── Report document ───────────────────────────────────────────────────────── */
/* The report renders as ONE continuous sheet. The hero flows into a stack of
   sections separated by hairline rules — not detached cards floating on grey. */

.report-doc {
  background: #fff;
  border: 1px solid #e2e2e2;
  border-top: 3px solid #0b233f;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(11, 35, 63, 0.06);
  overflow: hidden;
  max-width: 1200px;
  margin: 0 auto;
}

.report-hero {
  padding: 22px 24px 18px;
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(11, 35, 63, 0.06);
  margin-bottom: 14px;
}

/* Inside the sheet, the hero is the top of the doc — no own card chrome. */
.report-doc .report-hero {
  padding: 26px 34px 22px;
  background: transparent;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #e2e2e2;
  box-shadow: none;
  margin-bottom: 0;
}

.report-hero-id {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #8a94a0;
  margin-bottom: 6px;
}

.report-hero-title {
  font-size: 26px;
  font-weight: 700;
  color: #0f1a26;
  line-height: 1.25;
  margin-bottom: 12px;
}

.report-hero-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

/* Standalone card (used outside .report-doc, e.g. the Research Matrix report):
   a self-contained white card with border + subtle shadow. */
.report-card {
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 6px;
  margin-bottom: 14px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(11, 35, 63, 0.06);
}
.report-card-header {
  padding: 13px 20px;
  background: #fafafa;
  border-bottom: 1px solid #eaecef;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #0b233f;
}

/* Inside the report sheet, cards fuse into sections — no own border/gap. */
.report-doc .report-card {
  background: transparent;
  border: none;
  border-radius: 0;
  border-top: 1px solid #edeff2;
  margin: 0;
  overflow: visible;
  box-shadow: none;
}
.report-doc .report-card:first-of-type { border-top: none; }

/* The header div is just a wrapper providing top spacing; the highlighter
   swipe lives on an inline span so it hugs the words, not the whole row. */
.report-doc .report-card-header {
  padding: 24px 34px 4px;
  border-bottom: none;
  background: transparent;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #0b233f;
}

/* Highlighter-swipe: a soft marker stroke painted behind the heading text,
   sitting slightly low and just shy of full height like a real highlighter. */
.report-hl {
  background-image: linear-gradient(180deg,
    transparent 14%,
    rgba(240, 200, 64, 0.6) 14%,
    rgba(240, 200, 64, 0.6) 92%,
    transparent 92%);
  padding: 1px 4px;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* "AI generated summary" caption — blue highlighter swipe behind the text. */
.ai-summary-tag {
  display: inline-block;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 600;
  font-style: italic;
  color: #1a4f8b;
  background-image: linear-gradient(180deg,
    transparent 14%,
    rgba(96, 165, 250, 0.28) 14%,
    rgba(96, 165, 250, 0.28) 92%,
    transparent 92%);
  padding: 1px 5px;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.report-card-body {
  font-size: 15px;
  line-height: 1.55;
  color: #24303d;
  padding: 0 34px;
}

.report-card-text {
  padding: 10px 34px 22px;
  font-size: 16px;
  line-height: 1.65;
  color: #24303d;
}

.report-card-text p:last-child { margin-bottom: 0; }

/* Lists inside long-text sections: hanging markers, tight rows. Shared spacing
   on .report-list; .report-bullets / .report-numbers set the marker style. */
.report-list {
  margin: 4px 0 12px;
  padding-left: 1.5em;
}
.report-list li {
  margin: 0 0 3px;
  padding-left: 4px;
  line-height: 1.5;
}
.report-list li:last-child { margin-bottom: 0; }
.report-list + p { margin-top: 12px; }

.report-bullets { list-style: disc; }
.report-numbers { list-style: decimal; }

/* Un-marked short-line runs (e.g. a milestone list typed without bullets):
   tightened rows, no markers, no indent. */
.report-lines {
  padding-left: 0;
  list-style: none;
}
.report-line {
  margin: 0 0 3px;
  line-height: 1.5;
}
.report-line:last-child { margin-bottom: 0; }

/* Meta / people grids sit directly under their header inside the sheet. */
.report-doc .report-card-body.report-meta-grid,
.report-doc .report-card-body.report-people-grid,
.report-doc .report-card-body.report-ethics-grid {
  padding: 12px 34px 22px;
}

.report-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px 48px;
}

.report-meta-cell {
  padding: 0;
  border-right: none;
}

.report-meta-cell:last-child { border-right: none; }

.report-meta-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #7a8592;
  margin-bottom: 4px;
}

.report-meta-value {
  font-size: 15px;
  color: #0f1a26;
  line-height: 1.4;
}

.report-people-grid {
  display: grid;
  grid-template-columns: 1fr 1.6fr 1.6fr;
  gap: 4px 40px;
  align-items: start;
}

/* Members stack in a single tidy column. (Auto multi-column flow split short
   lists awkwardly, so it's off — long lists read fine as a compact stack.) */
.report-member-list {
  column-count: 1;
}

.report-member-list p {
  break-inside: avoid;
}

.report-ethics-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px 28px;
}

.report-section-divider {
  border: none;
  border-top: 1px solid #edeff2;
  margin: 14px 0;
}

.report-lead-name {
  font-size: 15px;
  font-weight: 600;
  color: #0b233f;
}

/* ── Placeholder state ─────────────────────────────────────────────────────── */

.tab-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 32px;
  color: #bbb;
  text-align: center;
}

.placeholder-icon { font-size: 36px; margin-bottom: 16px; opacity: 0.4; }
.placeholder-title { font-size: 15px; font-weight: 600; color: #888; margin-bottom: 6px; }
.placeholder-sub   { font-size: 13px; color: #aaa; }


.vscomp-toggle-button { font-size: 12px; }
.vscomp-dropbox-container { z-index: 99999 !important; font-size: 11px; }


/* ── Form controls ─────────────────────────────────────────────────────────── */

.control-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #999; }
.form-control  { font-size: 13px; border-radius: 4px; }
.checkbox-inline { font-size: 11px; padding-top: 8px; }
.checkbox { font-size: 11px; }
.rt-search { font-size: 10px; padding: 2px; }
.btn { font-size: 12px; }


/* ── Custom button classes ─────────────────────────────────────────────────── */

.btn-custom-class {
  background: #fff;
  color: #333;
  border: 1.5px solid #ccc;
  font-size: 11px;
  font-weight: 600;
  border-radius: 4px;
}

.btn-custom-class.active {
  background: #0b233f;
  color: #fff;
  border-color: #0b233f;
}

/* ── Research Assistant ─────────────────────────────────────────────────────── */

#chat-widget {
  position: fixed;
  top: 50vh;
  right: 0;
  transform: translateY(-50%);
  z-index: 1040;
  display: flex;
  flex-direction: row;
  align-items: center;
}

#chat-toggle {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: #0b233f;
  color: white;
  padding: 20px 10px;
  border-radius: 8px 0 0 8px;
  cursor: pointer;
  user-select: none;
  box-shadow: -4px 0 12px rgba(0,0,0,0.15);
  min-height: 120px;
  transition: background 0.15s;
}

#chat-toggle:hover { background: #163d6e; }

/* Remove Bootstrap modal-body padding so chat layout fills edge-to-edge */
.chat-modal {
  display: flex;
  flex-direction: column;
  height: 72vh;
  margin: -16px;
  border-radius: 4px;
  overflow: hidden;
}

.chat-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: #0b233f;
  color: white;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}

#chat-clear-btn {
  cursor: pointer;
  font-size: 15px;
  opacity: 0.7;
  line-height: 1;
  transition: opacity 0.1s;
}

#chat-clear-btn:hover { opacity: 1; }

.chat-history-modal {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: #f4f5f7;
}

.chat-message {
  max-width: 82%;
  padding: 11px 15px;
  border-radius: 10px;
  font-size: 15px;
  line-height: 1.65;
  word-break: break-word;
}

.chat-message.user {
  align-self: flex-end;
  background: #0b233f;
  color: white;
  border-bottom-right-radius: 2px;
  white-space: pre-wrap;
}

.chat-message.assistant {
  align-self: flex-start;
  background: white;
  border: 1px solid #e8e8e8;
  color: #1a1a1a;
  border-bottom-left-radius: 2px;
}

/* Markdown rendered inside assistant messages */
.chat-message.assistant p  { margin: 0 0 9px; }
.chat-message.assistant p:last-child { margin-bottom: 0; }
.chat-message.assistant ul, .chat-message.assistant ol { margin: 4px 0 9px 20px; padding: 0; }
.chat-message.assistant li { margin-bottom: 4px; }
.chat-message.assistant strong { color: #0b233f; }

.chat-thinking {
  align-self: flex-start;
  background: white;
  border: 1px solid #e8e8e8;
  border-bottom-left-radius: 2px;
  display: flex !important;
  align-items: center;
  gap: 5px;
  padding: 14px 16px !important;
}

.chat-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #0b233f;
  opacity: 0.3;
  animation: chat-dot-pulse 1.4s infinite ease-in-out;
}

.chat-dot:nth-child(1) { animation-delay: 0s; }
.chat-dot:nth-child(2) { animation-delay: 0.2s; }
.chat-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes chat-dot-pulse {
  0%, 80%, 100% { opacity: 0.2; transform: scale(0.85); }
  40%           { opacity: 1;   transform: scale(1); }
}

/* Suggested starter question buttons */
.chat-starters {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-self: flex-start;
  width: 100%;
  max-width: 82%;
}

.chat-usage {
  align-self: flex-start;
  font-size: 10px;
  color: #bbb;
  padding: 2px 4px;
  margin-top: -6px;
}

.chat-starter-btn {
  text-align: left;
  background: white;
  border: 1px solid #d0d3d4;
  border-radius: 6px;
  padding: 9px 13px;
  font-size: 14px;
  color: #0b233f;
  cursor: pointer;
  line-height: 1.4;
  transition: background 0.12s, border-color 0.12s;
}

.chat-starter-btn:hover {
  background: #eef2f7;
  border-color: #0b233f;
}

.chat-input-bar {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid #e8e8e8;
  background: white;
  flex-shrink: 0;
}

.chat-input {
  flex: 1;
  padding: 9px 12px;
  font-size: 14px;
  border: 1px solid #d0d3d4;
  border-radius: 4px;
  outline: none;
  resize: none;
  color: #1a1a1a;
  line-height: 1.5;
  font-family: inherit;
}

.chat-input:focus { border-color: #0b233f; }

.chat-send-btn {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 9px 16px;
  border-radius: 4px;
  border: none;
  background: #0b233f;
  color: white;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.15s;
}

.chat-send-btn:hover { background: #163d6e; }

/* ── Selectize overrides ───────────────────────────────────────────────────── */

.selectize-control { border: none !important; box-shadow: none !important; padding: 0 !important; }
.selectize-input { background: #fff !important; box-shadow: none !important; border: 1px solid #e0e0e0 !important; border-radius: 4px !important; font-size: 15px !important; min-height: 36px !important; padding: 0 10px !important; overflow: hidden !important; }
.selectize-control.single .selectize-input > div { display: inline-block !important; max-width: calc(100% - 30px) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; vertical-align: middle !important; }
.selectize-dropdown { background: #fff !important; position: absolute !important; z-index: 10000 !important; }
.selectize-dropdown-content .option { background: #fff !important; color: #111 !important; padding: 6px 10px !important; }
.selectize-dropdown-content .option.active { background: #0b233f !important; color: #fff !important; }
.selectize-dropdown-content .option.active span,
.selectize-dropdown-content .option.active div { color: #fff !important; }
.selectize-dropdown { background: #fff !important; }
.selectize-dropdown-content .option { background: #fff !important; color: #111 !important; padding: 6px 10px !important; }
.selectize-dropdown-content .option.active { background: #0b233f !important; color: #fff !important; }
.selectize-dropdown-content .option.active span,
.selectize-dropdown-content .option.active div { color: #fff !important; }

/* ── Radio pill group ──────────────────────────────────────────────────────── */

.radio-pill-group { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.radio-pill-group .radio-pill-item { margin: 0; }
.radio-pill-group input[type=radio] { display: none; }
.radio-pill-group label {
  display: inline-block;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 11px;
  cursor: pointer;
  user-select: none;
  background: #fff;
  color: #bbb;
  border: 1.5px solid #e2e6ea;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  line-height: 1.4;
  margin: 0;
  white-space: nowrap;
}
.radio-pill-group input[type=radio]:checked + label {
  background: #0b233f;
  color: #fff;
  border-color: #0b233f;
}

/* ── Signed-in user chip ───────────────────────────────────────────────────── */
/* Floated top-right over the sticky navbar. Shows the signed-in Entra user and a
   Sign out link that hits the Easy Auth /.auth/logout endpoint. */
.auth-chip {
  position: fixed;
  top: 0;
  /* Leave room on the right for the Vote launcher (see .vote-launcher). */
  right: 148px;
  height: 52px;
  display: flex;
  align-items: center;
  gap: 12px;
  z-index: 1040;
  font-size: 0.82rem;
  pointer-events: auto;
}
.auth-chip-name {
  color: #0b233f;
  font-weight: 600;
  max-width: 240px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.auth-chip-logout {
  color: #6c757d !important;
  text-decoration: none;
  border: 1px solid #D0D3D4;
  border-radius: 4px;
  padding: 3px 10px;
  transition: all 0.15s ease;
}
.auth-chip-logout:hover {
  color: #0b233f !important;
  border-color: #0b233f;
}
.auth-chip-dev {
  background: #b45309;
  color: #fff;
  border-radius: 4px;
  padding: 2px 8px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

/* ── Navbar "Vote" launcher (council only) ─────────────────────────────────── */
.vote-launcher {
  position: fixed;
  top: 9px;
  right: 32px;
  z-index: 1041;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  padding: 0 14px;
  border: none;
  border-radius: 7px;
  background: #e0533d;
  color: #fff;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(224, 83, 61, 0.35);
  transition: background 0.15s ease, box-shadow 0.15s ease;
}
.vote-launcher:hover { background: #c83f2b; box-shadow: 0 2px 7px rgba(224, 83, 61, 0.45); }
.vote-launcher-icon { font-size: 0.95rem; line-height: 1; }
.vote-launcher-label { line-height: 1; }
.vote-launcher-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 19px; height: 19px; padding: 0 5px; margin-left: 1px;
  border-radius: 10px; background: #0b233f; color: #fff;
  font-size: 0.72rem; font-weight: 800; line-height: 1;
}
/* Nothing outstanding: quieter, no badge. */
.vote-launcher.is-empty {
  background: #fff; color: #0b233f;
  border: 1px solid #D0D3D4; box-shadow: none;
}
.vote-launcher.is-empty:hover { border-color: #0b233f; background: #f7f9fb; box-shadow: none; }

/* ── Outstanding-ballots queue modal ───────────────────────────────────────── */
.vote-queue-list { display: flex; flex-direction: column; gap: 8px; }
.vote-queue-row {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  width: 100%; text-align: left; cursor: pointer;
  border: 1.5px solid #e2e6ea; border-radius: 10px; background: #fff;
  padding: 13px 15px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.vote-queue-row:hover {
  border-color: #0b233f; background: #f7f9fb;
  box-shadow: 0 1px 4px rgba(11, 35, 63, 0.12);
}
.vote-queue-row-main { min-width: 0; }
.vote-queue-row-title {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 14px; font-weight: 700; color: #0b233f; line-height: 1.35;
}
.vote-queue-row-id { color: #7c8896; font-weight: 700; flex-shrink: 0; }
.vote-queue-row-tally { margin-top: 3px; font-size: 12px; color: #5a6572; }
.vote-queue-row-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
.vote-queue-row-chevron { font-size: 20px; color: #b9c4d0; line-height: 1; }
.vote-queue-row:hover .vote-queue-row-chevron { color: #0b233f; }

.vote-queue-empty {
  display: flex; align-items: center; gap: 14px;
  padding: 22px 18px; border-radius: 10px;
  background: #f2fbf5; border: 1.5px solid #cdefd8; color: #1a7f43;
}
.vote-queue-empty-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 50%;
  background: #27a35a; color: #fff; font-size: 18px; font-weight: 800;
}
.vote-queue-empty b { color: #14663a; }
.vote-queue-empty-sub { margin-top: 2px; font-size: 12.5px; color: #3f7a56; }

/* Type tag distinguishing proposals vs external requests in the mixed queue.
   Sits on its own line above the id/title. */
.vote-queue-type {
  display: inline-block; margin-bottom: 6px;
  font-size: 9.5px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 2px 7px; border-radius: 4px; line-height: 1.4;
}
.vote-queue-type-proposal { background: #e8eef5; color: #234a72; }
.vote-queue-type-request  { background: #f0e9f7; color: #5a3ea9; }

@media (max-width: 560px) {
  .vote-launcher { right: 16px; }
  .auth-chip { right: 132px; }
}

/* ── Shiny error suppression ───────────────────────────────────────────────── */

.shiny-output-error,
.shiny-output-error:before { visibility: hidden; }

/* ── Research Council voting — flat single sheet (no nested card) ───────────── */
/* The modal is the only card. The voting content flows as sections separated by
   whitespace + hairlines, so there is one visual container, not three. */
.vote-panel { margin-top: 6px; }

/* Header: tally + countdown on one line, thin progress bar beneath */
.vote-head { margin-bottom: 18px; }
.vote-head-top {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-bottom: 9px;
}
.vote-tally { font-size: 14px; font-weight: 700; color: #0b233f; }
.vote-progress {
  height: 5px; border-radius: 999px; background: #eef2f6; overflow: hidden;
}
.vote-progress-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #1a7f43, #27a35a);
  transition: width 0.3s ease;
}

/* Countdown badge (light — the sheet is white now) */
.vote-badge {
  font-size: 10.5px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
  letter-spacing: 0.02em; white-space: nowrap;
}
.vote-badge-ok    { background: #e3f5ea; color: #1a7f43; }
.vote-badge-soon  { background: #fdf1dc; color: #a9611a; }
.vote-badge-today { background: #fde3e3; color: #b3261e; }
.vote-badge-over  { background: #eceff3; color: #5b6470; }
.vote-badge-none  { background: #eceff3; color: #5b6470; }

/* Your-vote status cue */
.vote-status {
  display: flex; align-items: center; gap: 9px;
  font-size: 13px; font-weight: 600; border-radius: 8px;
  padding: 10px 13px; margin-bottom: 16px;
}
.vote-status-icon { font-size: 14px; line-height: 1; }
.vote-status-pending { background: #fdf4e3; color: #92590f; border: 1px solid #f4e1bd; }
.vote-status-done    { background: #eaf7ef; color: #1a7f43; border: 1px solid #cdead9; }
.vote-status b { font-weight: 700; }

/* Generic section: a small label + its content, with a hairline above */
.vote-section { padding-top: 16px; margin-top: 16px; border-top: 1px solid #eef2f6; }
.vote-section-label {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
  color: #6b7a8d; margin-bottom: 11px;
}

/* Per-member vote positions as inline pills */
.vote-responses { display: flex; flex-wrap: wrap; gap: 7px; }
.vote-response-row {
  display: flex; align-items: center; gap: 8px;
  background: #f7f9fb; border: 1px solid #eceff3; border-radius: 999px;
  padding: 4px 5px 4px 12px;
}
.vote-response-who { font-size: 12px; font-weight: 600; color: #33414f; }

/* Vote chips (position tags) */
.vote-chip {
  font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em;
  padding: 3px 9px; border-radius: 999px; white-space: nowrap;
}
.vote-chip-approve          { background: #e3f5ea; color: #1a7f43; }
.vote-chip-decline          { background: #fde3e3; color: #b3261e; }
.vote-chip-needmoreinformation { background: #fdf1dc; color: #a9611a; }
.vote-chip-conflictofinterest  { background: #eae6f5; color: #5a3ea9; }
/* Council member who hasn't voted yet — muted, so cast votes stand out. */
.vote-chip-awaiting         { background: #eef1f4; color: #8a95a1; }
.vote-response-row:has(.vote-chip-awaiting) .vote-response-who { color: #8a95a1; }

/* Ballot — poll-style tappable choices */
.vote-choice-group { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.vote-choice-group .radio-pill-item { margin: 0; }
.vote-choice-group input[type=radio] { display: none; }
.vote-choice-group label {
  display: flex; align-items: center; gap: 9px; width: 100%;
  border: 1.5px solid #e2e6ea; border-radius: 10px; background: #fff;
  padding: 11px 13px; cursor: pointer; user-select: none;
  font-size: 13.5px; font-weight: 600; color: #33414f;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}
.vote-choice-group label:hover { border-color: #b9c4d0; background: #fafbfc; }
.vote-choice-dot {
  width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid #cdd5dd; transition: border-color 0.15s, background 0.15s;
  position: relative;
}
/* Accent colour per option, keyed off the data-vote attribute */
.vote-choice-group label[for] { }
input[data-vote="Approve"] + label:hover .vote-choice-dot           { border-color: #27a35a; }
input[data-vote="Decline"] + label:hover .vote-choice-dot           { border-color: #d3453c; }
input[data-vote="Need more information"] + label:hover .vote-choice-dot { border-color: #c9821f; }
input[data-vote="Conflict of interest"] + label:hover .vote-choice-dot  { border-color: #6f52c9; }

.vote-choice-group input[type=radio]:checked + label {
  box-shadow: 0 0 0 1.5px currentColor inset;
}
input[data-vote="Approve"]:checked + label            { color: #1a7f43; border-color: #27a35a; background: #f2fbf5; }
input[data-vote="Decline"]:checked + label            { color: #b3261e; border-color: #d3453c; background: #fef4f3; }
input[data-vote="Need more information"]:checked + label { color: #a9611a; border-color: #c9821f; background: #fefaf2; }
input[data-vote="Conflict of interest"]:checked + label  { color: #5a3ea9; border-color: #6f52c9; background: #f7f5fd; }
.vote-choice-group input[type=radio]:checked + label .vote-choice-dot {
  border-color: #27a35a; background: #27a35a;
  box-shadow: none;
}
/* Green tick inside the circle for the selected option */
.vote-choice-group input[type=radio]:checked + label .vote-choice-dot::after {
  content: ""; position: absolute;
  left: 4.5px; top: 2px; width: 4px; height: 8px;
  border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

/* ── Changing-your-vote state ───────────────────────────────────────────────
   Once the ballot has an original vote and the member picks a different option
   (JS adds .is-dirty), show the NEW pick as solid dark-blue + green tick, and
   keep the PREVIOUS pick visible as a faded, transparent-blue pill + green tick
   so it's clear the vote is changing and hasn't been submitted yet. */
.vote-choice-group.is-dirty input[type=radio]:checked + label {
  color: #0b233f; border-color: #0b233f; background: #0b233f;
  box-shadow: 0 0 0 1.5px #0b233f inset;
}
.vote-choice-group.is-dirty input[type=radio]:checked + label .vote-choice-text {
  color: #fff;
}
/* The originally-submitted option, now deselected: faded transparent blue */
.vote-choice-group.is-dirty input[data-original]:not(:checked) + label {
  color: #0b233f; border-color: rgba(11, 35, 63, 0.35);
  background: rgba(11, 35, 63, 0.07); box-shadow: none;
}
.vote-choice-group.is-dirty input[data-original]:not(:checked) + label .vote-choice-dot {
  border-color: #27a35a; background: #27a35a; opacity: 0.55;
}
.vote-choice-group.is-dirty input[data-original]:not(:checked) + label .vote-choice-dot::after {
  content: ""; position: absolute;
  left: 4.5px; top: 2px; width: 4px; height: 8px;
  border: solid #fff; border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.vote-submit-row { text-align: right; margin-top: 14px; }
.vote-submit-btn {
  background: #0b233f; color: #fff; border: none; border-radius: 8px;
  font-weight: 600; padding: 9px 22px; font-size: 13px;
  transition: background 0.15s, opacity 0.15s;
}
.vote-submit-btn:hover { background: #143a63; color: #fff; }
/* Inactive until the member actually changes their vote */
.vote-submit-btn.is-clean, .vote-submit-btn:disabled {
  opacity: 0.45; pointer-events: none; background: #0b233f;
}

/* Modal "Close" dismiss button — brand-matched secondary (navy outline), so it
   reads as part of the dashboard rather than a stock Bootstrap button. */
.vote-close-btn.btn {
  background: #fff; color: #0b233f; border: 1.5px solid #d0d7de;
  border-radius: 8px; font-weight: 600; padding: 9px 22px; font-size: 13px;
  box-shadow: none; transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.vote-close-btn.btn:hover,
.vote-close-btn.btn:focus {
  background: #f5f7f9; color: #0b233f; border-color: #0b233f;
}

.vote-your-note {
  font-size: 12px; color: #4a5560; background: #f0f4f8; border-radius: 8px;
  padding: 9px 12px;
}

@media (max-width: 560px) {
  .vote-choice-group { grid-template-columns: 1fr; }
}

/* ── Discussion thread — flat list, no boxes around items ───────────────────── */
.thread-list { display: flex; flex-direction: column; margin-bottom: 12px; }
.thread-empty { font-size: 12.5px; color: #8a929b; font-style: italic; margin-bottom: 8px; }
.thread-item { padding: 9px 0; border-bottom: 1px solid #f0f3f6; }
.thread-item:last-child { border-bottom: none; }
.thread-item-head {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 3px;
}
.thread-author { font-size: 12.5px; font-weight: 600; color: #26323f; }
.thread-time   { font-size: 11px; color: #9aa3ac; }
.thread-body   { font-size: 12.5px; color: #4a5560; line-height: 1.45; white-space: pre-wrap; }
.action-body textarea.form-control {
  border-radius: 8px; border: 1px solid #d0d3d4; font-size: 13px;
  padding: 9px 11px; resize: vertical; box-shadow: none;
}
.action-body textarea.form-control:focus {
  border-color: #0b233f; box-shadow: 0 0 0 2px rgba(11,35,63,0.08);
}
.action-body textarea.form-control::placeholder { color: #9aa3ac; }
.thread-add-row { text-align: right; margin-top: 9px; }
/* Match .vote-submit-btn exactly so "Add point" and "Save outcome" are identical */
.thread-add-btn {
  background: #0b233f; color: #fff; border: none; border-radius: 8px;
  font-weight: 600; padding: 9px 22px; font-size: 13px;
}
.thread-add-btn:hover { background: #143a63; color: #fff; }

/* ── Action buttons (tab-style): fixed side-by-side row that never reflows, ──
   with a borderless content area below that swaps to the active editor. */
.action-row-section { border-top: 1px solid #eef2f6; }
.action-row { display: flex; gap: 10px; }
.action-btn {
  flex: 1 1 0; min-width: 0;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  height: 40px; cursor: pointer; user-select: none;
  border: 1.5px solid #e2e6ea; border-radius: 9px; background: #fff;
  font-size: 13px; font-weight: 600; color: #33414f;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.action-btn:hover { border-color: #b9c4d0; background: #fafbfc; }
.action-btn-icon { font-size: 15px; line-height: 1; opacity: 0.7; }
.action-btn.is-active {
  border-color: #0b233f; color: #0b233f; background: #f4f7fa;
}
.action-btn.is-active .action-btn-icon { opacity: 1; }

/* Content area — borderless; only the active panel shows */
.action-panel { display: none; margin-top: 14px; }
.action-panel.is-active { display: block; }

/* ── Outcome selector inside its disclosure ─────────────────────────────────── */
.outcome-admin-label {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
  color: #6b7a8d; display: block; margin-bottom: 9px;
}
.radio-pill-outcome label { padding: 6px 14px; font-size: 12.5px; }
.radio-pill-outcome input[data-outcome="Approved"]:checked + label            { background: #1a7f43; border-color: #1a7f43; }
.radio-pill-outcome input[data-outcome="Declined"]:checked + label            { background: #b3261e; border-color: #b3261e; }
.radio-pill-outcome input[data-outcome="Under Consideration"]:checked + label { background: #a9611a; border-color: #a9611a; }
.radio-pill-outcome input[data-outcome="Proposal Withdrawn"]:checked + label  { background: #5b6470; border-color: #5b6470; }