/* Budget management and dashboard refinements — 2026-10-16.
   This stylesheet is loaded last so it wins over prior mobile overrides. */

/* Shared dashboard header: account first, navigation second, period third. */
#dashboard .page-header { grid-template-rows:auto auto auto; }
#kf-view .kf-account {margin:0 0 12px;}
#kf-view .kf-topbar {margin-top:0;}
#dashboard .page-header .dashboard-account {
  grid-column:1/-1;
  grid-row:1;
  justify-self:stretch;
  min-width:0;
}
#dashboard .page-header .dashboard-topbar {
  grid-column:1/-1;
  grid-row:2;
}
#dashboard .page-header .header-controls { grid-column:2;grid-row:3; }
#dashboard .page-header .dashboard-title { grid-column:1;grid-row:3; }
@media(max-width:640px){
  #dashboard .page-header { grid-template-columns:minmax(0,1fr); }
  #dashboard .page-header .dashboard-account {grid-column:1;grid-row:1;}
  #dashboard .page-header .dashboard-topbar {grid-column:1;grid-row:2;}
  #dashboard .page-header .header-controls {grid-column:1;grid-row:3;}
  #dashboard .page-header .dashboard-title {grid-column:1;grid-row:4;}
}

/* Collapsed budget card: headings to the right, three figures to the left,
   familiar action surface across the bottom. */
.tracker-grid .budget-center-card .budget-center-launch {
  direction:rtl;
  display:grid!important;
  grid-template-columns:minmax(95px,.85fr) minmax(0,1.65fr)!important;
  grid-template-rows:minmax(0,1fr) auto!important;
  align-items:start!important;
  align-content:stretch!important;
  justify-items:stretch!important;
  gap:7px 16px!important;
  box-sizing:border-box;
  min-height:160px;
  width:100%;
  padding:14px 18px 12px!important;
}
.tracker-grid .budget-center-card .budget-center-heading {
  grid-column:1;
  grid-row:1;
  direction:rtl;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items:flex-start;
  width:100%!important;
  min-width:0;
  max-width:none;
  gap:3px;
  margin:0;
  text-align:right;
}
.budget-center-heading .budget-center-card-kicker {
  margin:0;
  color:#a8b9d1;
  font-size:clamp(11px,1.25vw,13px);
  font-weight:650;
  line-height:1.4;
}
.tracker-grid .budget-center-card .budget-center-heading h2 {
  margin:0;
  font-size:clamp(23px,2.3vw,28px);
  line-height:1.18;
}
.tracker-grid .budget-center-card .budget-center-figures {
  grid-column:2;
  grid-row:1;
  align-self:center;
  justify-self:center;
  direction:rtl;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  flex:initial;
  box-sizing:border-box;
  min-width:0;
  width:min(100%,435px)!important;
  max-width:435px;
  gap:7px!important;
  margin:0 auto;
}
.tracker-grid .budget-center-card .budget-center-figures > span:not(.budget-center-divider) {
  box-sizing:border-box;
  min-width:0;
  gap:7px!important;
  padding:3px 2px!important;
  overflow:visible;
}
.tracker-grid .budget-center-card .budget-center-figures strong {
  font-size:clamp(18px,2vw,24px)!important;
  font-weight:800;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
}
.tracker-grid .budget-center-card .budget-center-figures small {
  font-size:12px;
}
.tracker-grid .budget-center-card .budget-center-open-hint {
  grid-column:1/-1;
  grid-row:2;
  justify-self:stretch;
  align-self:end;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:9px;
  box-sizing:border-box;
  width:100%;
  min-height:39px;
  margin:0;
  padding:8px 10px;
  border:1px solid rgba(115,191,255,.56);
  border-radius:11px;
  background:linear-gradient(90deg,rgba(26,98,157,.18),rgba(43,116,177,.10));
  color:#8cceff;
  font-size:clamp(13px,1.4vw,15px);
  font-weight:750;
  text-align:center;
}
.tracker-grid .budget-center-card .budget-center-launch:hover .budget-center-open-hint {
  border-color:rgba(142,214,255,.8);
  background:rgba(39,129,203,.18);
}
.tracker-grid .budget-center-card .budget-center-open-arrow {
  order:-1;
}
@media(max-width:640px){
  .tracker-grid .budget-center-card .budget-center-launch {
    grid-template-columns:minmax(82px,.8fr) minmax(0,1.8fr)!important;
    grid-template-rows:minmax(0,1fr) min-content!important;
    min-height:0!important;
    height:100%!important;
    padding:11px 12px 10px!important;
    gap:5px 8px!important;
  }
  .tracker-grid .budget-center-card .budget-center-heading {
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    max-width:none!important;
    padding:0;
    flex:initial!important;
  }
  .tracker-grid .budget-center-card .budget-center-card-kicker {font-size:clamp(10px,2.5vw,12px);}
  .tracker-grid .budget-center-card .budget-center-heading h2 {font-size:clamp(20px,5vw,25px);}
  .tracker-grid .budget-center-card .budget-center-figures {
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    max-width:100%;
    align-self:center;
    justify-self:stretch;
    flex:initial!important;
    margin:0;
    gap:4px!important;
  }
  .tracker-grid .budget-center-card .budget-center-figures > span:not(.budget-center-divider) {
    padding:2px 0!important;
    gap:5px!important;
  }
  .tracker-grid .budget-center-card .budget-center-figures strong {
    font-size:clamp(12px,3.45vw,18px)!important;
  }
  .tracker-grid .budget-center-card .budget-center-figures small {font-size:clamp(10px,2.65vw,12px)!important;}
  .tracker-grid .budget-center-card .budget-center-open-hint {
    grid-column:1/-1!important;
    grid-row:2!important;
    min-height:36px;
    font-size:clamp(11px,3vw,13px);
    padding:7px 6px;
  }
}
@media(max-width:350px){
  .tracker-grid .budget-center-card .budget-center-launch {
    grid-template-columns:minmax(73px,.74fr) minmax(0,1.9fr)!important;
    padding-inline:9px!important;
    gap:4px!important;
  }
  .tracker-grid .budget-center-card .budget-center-figures strong {font-size:11px!important;}
}

/* Budget management modal: top hierarchy and explanation beside the total. */
.budget-center-modal .budget-activity-header {padding-top:13px;padding-bottom:13px;}
.budget-center-modal .budget-activity-header h3 {margin:0;line-height:1.25;}
.budget-center-modal .budget-activity-content {gap:14px;}
.budget-center-modal .budget-center-explanation {
  margin:-5px 0 3px;
  color:#b8cce1;
  font-size:13px;
  line-height:1.55;
  text-align:right;
}
.budget-center-modal .budget-center-total {gap:12px;}
.budget-center-modal .budget-center-list-header {min-height:24px;}
.budget-center-modal .budget-center-list-count {
  display:block;
  justify-self:end;
  width:100%;
  margin:-3px 0 2px;
  color:#75cfff;
  text-align:right;
  direction:rtl;
}
.budget-center-modal .budget-center-row-actions {
  display:flex;
  flex:none;
  align-items:center;
  gap:8px;
}
.budget-center-modal .budget-center-edit-action,
.budget-center-modal .budget-center-remove {
  display:grid;
  flex:none;
  place-items:center;
  box-sizing:border-box;
  width:42px;
  height:42px;
  min-height:42px;
  padding:0!important;
  margin:0;
  border-radius:12px;
  line-height:1;
  font-size:22px;
}
.budget-center-modal .budget-center-edit-action {
  border:1px solid rgba(111,198,255,.6);
  color:#a1e5ff;
  background:linear-gradient(150deg,rgba(43,126,190,.25),rgba(20,61,111,.27));
  box-shadow:0 0 9px rgba(78,173,255,.16);
}
.budget-center-modal .budget-center-edit-action:hover {
  border-color:#79d2ff;
  box-shadow:0 0 13px rgba(78,173,255,.3);
}
.budget-center-modal .budget-center-remove {
  border:1px solid rgba(249,135,156,.45);
  color:#ff96a8;
  background:rgba(163,59,77,.12);
  font-size:26px;
}
.budget-center-modal .budget-center-remove:hover {
  border-color:#ff9aa9;
  background:rgba(174,64,84,.2);
}
.budget-center-modal .budget-center-edit-action:focus-visible,
.budget-center-modal .budget-center-remove:focus-visible {
  outline:2px solid #b7dfff;
  outline-offset:3px;
}

/* Actual expense-list container is rounded, not just its parent panel. */
.budget-center-modal .budget-center-expense-details {
  transition:none!important;
  opacity:0;
  visibility:hidden;
}
.budget-center-modal .budget-center-expense-details.is-expanded {
  transition:none!important;
  opacity:1;
  visibility:visible;
}
.budget-center-modal .budget-center-expense-details-inner {
  overflow:hidden;
  border:1px solid rgba(103,151,204,.23);
  border-radius:16px;
  background:#0b192b;
  min-height:0;
}
.budget-center-modal .budget-center-expense-details-title {
  padding:14px 12px 10px;
  border-top:none;
  background:#101f33;
}
.budget-center-modal .budget-center-detail-line {
  border-inline:0;
  border-radius:0;
}
.budget-center-modal .budget-center-detail-line:last-child {
  border-bottom:0;
  border-radius:0 0 16px 16px;
}
@media(max-width:640px){
  .budget-center-modal .budget-activity-header {padding-top:15px;padding-bottom:14px;}
  .budget-center-modal .budget-activity-content {gap:13px;}
  .budget-center-modal .budget-center-edit-action,
  .budget-center-modal .budget-center-remove {width:38px;height:38px;min-height:38px;}
}
@media(prefers-reduced-motion:reduce){
  .budget-center-card .budget-center-open-hint,
  .budget-center-modal .budget-center-expense-details {transition:none!important;}
}