/* CK Metrics Budget presentation polish — Sept. 1, 2026 */

/* Header controls: View, Period, Year should read as one control family. */
.budget-header-controls-v2{align-items:center!important;gap:10px!important}
.budget-scope-button,.budget-period-control-v4,.budget-year-control-v4{height:46px!important;border:1px solid #cfdde3!important;background:#fff!important;border-radius:10px!important;box-shadow:0 3px 10px rgba(14,44,63,.04)!important}
.budget-scope-button{min-width:185px!important}
.budget-period-control-v4,.budget-year-control-v4{display:flex!important;flex-direction:column!important;justify-content:center!important;gap:0!important;padding:5px 10px!important;margin:0!important}
.budget-period-control-v4{min-width:215px!important}
.budget-year-control-v4{min-width:105px!important}
.budget-period-control-v4>span,.budget-year-control-v4>span{font-size:8px!important;font-weight:900!important;letter-spacing:.07em!important;text-transform:uppercase!important;color:#82949d!important;line-height:1!important;padding:0 0 3px 1px!important}
.budget-period-control-v4 .year-select,.budget-year-control-v4 .year-select{height:22px!important;min-height:22px!important;min-width:0!important;width:100%!important;border:0!important;border-radius:0!important;padding:0 22px 0 0!important;background-color:transparent!important;box-shadow:none!important;color:#17394c!important;font-size:12px!important;font-weight:850!important;line-height:20px!important}

/* Period KPI rows should always fill the available width. */
#metricGrid.v4-auto-kpis{grid-template-columns:repeat(var(--v4-kpi-count),minmax(0,1fr))!important}

/* Category Detail no longer needs a visual divider between campus and Central categories. */
#scopeCategoryDetail .scope-detail-section+.scope-detail-section{border-top:0!important;padding-top:0!important;margin-top:18px!important}

/* Spending Overview: every campus uses its shared CK Metrics campus color. */
.scope-campus-rows{padding-left:14px!important;padding-right:14px!important}
.scope-campus-row.v4-spending-row{grid-template-columns:112px minmax(260px,1fr) 108px!important;gap:10px!important;padding-left:2px!important;padding-right:2px!important}
.v4-spending-row .combined-bar .bar-main{background:color-mix(in srgb,var(--budget-row-color) 10%,#eef3f5)!important;height:10px!important}
.v4-spending-row .combined-bar .pace-layer{background:color-mix(in srgb,var(--budget-row-color) 42%,white)!important;opacity:1!important;height:100%!important;border-radius:999px!important}
.v4-spending-row .combined-bar .actual-layer{background:var(--budget-row-color)!important;height:100%!important;border-radius:999px!important}
.v4-spending-row[data-budget-overview="Central"] .combined-bar .bar-main{background:#e7edf1!important}
.v4-spending-row[data-budget-overview="Central"] .combined-bar .pace-layer{background:#8ea5b3!important}
.v4-spending-row[data-budget-overview="Central"] .combined-bar .actual-layer{background:#173c51!important}
.budget-comparison-legend{gap:12px!important}
.budget-comparison-legend .v4-key{display:inline-block;width:11px;height:8px;border-radius:99px}
.budget-comparison-legend .v4-key.available{background:#e1ecee}
.budget-comparison-legend .v4-key.pace{background:#94cfcc}
.budget-comparison-legend .v4-key.spent{background:#177d81}

/* Donut uses the exact same campus palette and keeps campus names readable. */
.v4-donut-panel{overflow:hidden}
.v4-donut-panel .panel-inner{overflow:hidden}
.v4-donut-panel .scope-donut-layout{grid-template-columns:182px minmax(250px,1fr)!important;gap:18px!important;padding:16px 18px 22px!important;max-width:100%!important;overflow:hidden!important;align-items:center!important}
.v4-donut-panel .scope-donut-svg-wrap,.v4-donut-panel .scope-donut-svg{width:166px!important;height:166px!important}
.v4-donut-panel .scope-donut-legend{min-width:250px!important;width:100%!important;gap:5px!important}
.v4-donut-panel .scope-donut-row{grid-template-columns:10px minmax(105px,1fr) 42px 82px!important;gap:8px!important;min-width:0!important;width:100%!important;padding:6px 4px!important}
.v4-donut-panel .scope-donut-row>*{min-width:0}
.v4-donut-panel .scope-donut-row strong{overflow:visible!important;text-overflow:clip!important;white-space:nowrap!important;font-size:9.5px!important}
.v4-donut-panel .scope-donut-row>span:nth-of-type(2){text-align:right!important;white-space:nowrap!important}
.v4-donut-panel .scope-donut-row small{white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important;text-align:right!important}
.v4-donut-panel .scope-donut-swatch{background:var(--campus-color)!important}

/* Spend per child-week uses the same campus palette as the other campus charts. */
.budget-efficiency-panel .panel-head{align-items:flex-start!important;gap:14px!important}
.v4-efficiency-sort{margin-left:auto;display:flex;align-items:center;gap:7px;white-space:nowrap}
.v4-efficiency-sort>span{font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#82949d}
.v4-efficiency-sort select{height:34px;min-width:112px;border:1px solid #d4e0e4;border-radius:9px;background:#fff;color:#34515f;padding:0 28px 0 9px;font:inherit;font-size:10px;font-weight:750}
.v4-efficiency-row{grid-template-columns:145px minmax(180px,1fr) 132px!important;gap:11px!important;align-items:center!important}
.v4-efficiency-campus{display:flex;align-items:center;gap:8px;min-width:0}
.v4-efficiency-campus i{width:9px;height:9px;border-radius:50%;background:var(--efficiency-color);flex:0 0 auto}
.v4-efficiency-campus strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#294a59}
.v4-efficiency-row .scope-efficiency-track{background:color-mix(in srgb,var(--efficiency-color) 13%,#eef3f5)!important;overflow:hidden!important}
.v4-efficiency-row .scope-efficiency-track>span{background:var(--efficiency-color)!important;border-radius:999px!important}
.v4-efficiency-row .scope-efficiency-value{white-space:nowrap}

@media(max-width:1180px){
  .scope-campus-row.v4-spending-row{grid-template-columns:105px minmax(210px,1fr) 105px!important}
  .v4-donut-panel .scope-donut-layout{grid-template-columns:176px minmax(250px,1fr)!important}
}
@media(max-width:820px){
  #metricGrid.v4-auto-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .budget-header-controls-v2{align-items:stretch!important}
  .budget-period-control-v4{min-width:180px!important}
  .budget-year-control-v4{min-width:92px!important}
  .scope-campus-row.v4-spending-row{grid-template-columns:92px minmax(140px,1fr) 98px!important}
  .v4-donut-panel .scope-donut-layout{grid-template-columns:1fr!important;justify-items:center}
  .v4-donut-panel .scope-donut-legend{width:min(100%,390px)!important;min-width:0!important}
  .v4-donut-panel .scope-donut-row{grid-template-columns:10px minmax(100px,1fr) 42px 82px!important}
  .budget-efficiency-panel .panel-head{flex-wrap:wrap!important}
  .v4-efficiency-sort{margin-left:0}
}
@media(max-width:590px){
  #metricGrid.v4-auto-kpis{grid-template-columns:1fr!important}
  .budget-period-control-v4,.budget-year-control-v4{width:100%!important;min-width:0!important}
  .scope-campus-row.v4-spending-row{grid-template-columns:1fr!important}
  .v4-efficiency-row{grid-template-columns:1fr!important}
  .v4-donut-panel .scope-donut-row{grid-template-columns:10px minmax(90px,1fr) 38px 76px!important}
}
