/* BK Hero — UI fixes requested by user
   - Reduce bottom whitespace, footer inside block
   - Tighter name/role spacing
   - KPI boxes same size and colors (solved green, unresolved red)
   - Center/align score panel and sparkline smaller
   - Party logo placement adjustments
*/

.bk-hero-root {
  max-width:1140px;
  margin:20px auto;
  padding:22px 28px 64px; /* reduce top/bottom padding, leave space for absolute footer */
  border-radius:14px;
  background: #fbfdff;
  box-shadow: 0 18px 40px rgba(13,23,36,0.06);
  position:relative;
  overflow:visible;
}

/* main layout */
.bk-hero {
  display:flex;
  gap:22px;
  align-items:flex-start;
}

/* left column: avatar + meta */
.bk-left {
  width:200px;
  text-align:left;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
}

/* avatar */
.bk-avatar img{
  border-radius:50%;
  width:160px;
  height:160px;
  object-fit:cover;
  box-shadow:0 6px 18px rgba(13,23,36,0.08);
  border:8px solid #fff;
}

/* party logo: keep small, aligned under avatar */
.bk-party-left img{
  margin-top:4px;
  width:56px;
  height:auto;
  display:block;
}

/* tighter name / role / meta spacing */
.bk-name {
  font-weight:700;
  margin-top:6px;
  line-height:1.12; /* reduce big gaps */
  font-size:18px;
}
.bk-role {
  color:#6b7280;
  font-size:13px;
  margin-top:4px;
  line-height:1.2;
}
.bk-meta-text {
  margin-top:6px;
  color:#6b7280;
  font-size:13px;
  line-height:1.2;
}

/* center KPIs area */
.bk-center { flex:1 1 580px; }
.bk-title { font-weight:700; margin-bottom:10px; color:#1f2937; }

/* KPI grid: 3 columns on desktop */
.bk-kpis { display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; align-items:stretch; }

/* KPI card base */
.bk-kpi {
  background:#fff;
  border-radius:12px;
  padding:16px;
  box-shadow: 0 6px 18px rgba(13,23,36,0.04);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  min-height:100px;
}
.bk-kpi .num { font-size:22px; font-weight:700; color:#0b1220; }
.bk-kpi .lbl { color:#6b7280; font-size:13px; margin-top:6px; }

/* ensure uniform area style used on requested boxes */
.bk-kpi--area { min-height:110px; padding:18px; display:flex; flex-direction:column; justify-content:center; }

/* solved / unresolved colors adjusted per request */
.bk-kpi--solved { background:#10b981; color:#ffffff; } /* green */
.bk-kpi--solved .num { color:#ffffff; }
.bk-kpi--unresolved { background:#ef4444; color:#ffffff; } /* red */
.bk-kpi--unresolved .num { color:#ffffff; }

/* survey and avg response keep white but same sizing */
.bk-kpi--survey, .bk-kpi--avg_response, .bk-kpi--answered, .bk-kpi--totals {
  background:#ffffff;
  color:#0b1220;
}

/* right column (score block) */
.bk-right { width:320px; display:flex; flex-direction:column; justify-content:center; gap:12px; align-items:stretch; }
.bk-score {
  background:#fff;
  border-radius:12px;
  padding:16px;
  box-shadow: 0 8px 24px rgba(15,23,32,0.06);
  display:flex;
  flex-direction:column;
  align-items:center;
}
.bk-score .small { color:#6b7280; margin-bottom:6px; }
.bk-score .big { font-size:34px; font-weight:800; color:#0b1220; text-align:center; }
.bk-stars { margin:6px 0; }

/* score bar alignment and sizing */
.bk-score-bar { width:100%; height:10px; background:linear-gradient(90deg,#fef2f2 0%, #fef3c7 20%, #ddfce7 100%); border-radius:6px; overflow:hidden; margin:8px 0; }
.bk-score-bar-fill { height:100%; background:linear-gradient(90deg,#ef4444,#f59e0b,#10b981); width:0%; transition:width .6s ease; }

/* actions centered */
.bk-actions { display:flex; gap:12px; align-items:center; justify-content:center; }
.bk-actions .primary, .bk-actions .secondary { padding:10px 18px; border-radius:10px; text-decoration:none; display:inline-block; }
.bk-actions .primary { background:#0b1220; color:#fff; }
.bk-actions .secondary { background:#fff; color:#0b1220; box-shadow: inset 0 0 0 1px rgba(11,18,32,0.06); }

/* trend area: reduce height and vertical spacing to remove big white gap */
.bk-hero-trend { margin-top:10px; padding:8px 12px; height:84px; box-sizing:border-box; }
.bk-sparkline { width:100%; height:84px; display:block; }

/* move footer INSIDE hero block, fixed at bottom center (looks compact) */
.bk-hero-footer {
  position:absolute;
  bottom:12px;
  left:0;
  right:0;
  text-align:center;
  color:#6b7280;
  font-size:13px;
  padding:6px 0;
  background:transparent;
}

/* reduce overall excessive vertical whitespace below hero */
.site-content, .content-area { margin-top:0; }

/* responsive tweaks */
@media(max-width:980px){
  .bk-hero { flex-direction:column; }
  .bk-left { width:100%; flex-direction:row; align-items:center; gap:12px; }
  .bk-center{ order:2; }
  .bk-right{ width:100%; order:3; }
  .bk-kpis{ grid-template-columns: repeat(2,1fr); }
  .bk-hero-root { padding-bottom:90px; }
}

/* small visual polish: reduce oversized gaps for name/role area on small screens */
@media(max-width:480px){
  .bk-name { font-size:16px; }
  .bk-avatar img { width:120px; height:120px; border-width:6px; }
}