/* V77 follow-up: two user-reported regressions, QA only. Loaded AFTER V77 styles.
   Presentation-only: no scenario arithmetic, transaction bookkeeping, theme state,
   split account allocation or network/Supabase code changes. */

/* Expense composer: the two independent split options are neutral until selected.
   The selected fill/border/text derive from the CURRENT Baakee appearance,
   not any of the hard-coded emerald selected-button styles in older bundles. */
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .modal form.add-tx-v128 .u1-regular-expense-splitting > button:not(.primary):not(.danger) {
  -webkit-appearance:none!important;
  appearance:none!important;
  -webkit-tap-highlight-color:transparent!important;
  background:var(--baakee-card-fill)!important;
  background-color:var(--baakee-card-fill)!important;
  background-image:none!important;
  color:var(--baakee-body-ink)!important;
  -webkit-text-fill-color:var(--baakee-body-ink)!important;
  border:1px solid var(--baakee-glass-border)!important;
  outline:0!important;
  box-shadow:none!important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .modal form.add-tx-v128 .u1-regular-expense-splitting > button:not(.primary):not(.danger):is(.active,[aria-expanded="true"],[aria-pressed="true"]),
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .modal form.add-tx-v128 .u1-regular-expense-splitting > button:not(.primary):not(.danger):is(.active,[aria-expanded="true"],[aria-pressed="true"]):is(:hover,:active) {
  background:var(--baakee-active-fill)!important;
  background-color:var(--baakee-active-fill)!important;
  background-image:none!important;
  color:var(--baakee-ink)!important;
  -webkit-text-fill-color:var(--baakee-ink)!important;
  border:1.5px solid var(--baakee-ink)!important;
  outline:0!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--baakee-ink) 12%,transparent)!important;
}
html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .modal form.add-tx-v128 .u1-regular-expense-splitting > button:not(.primary):not(.danger):focus-visible {
  outline:2px solid var(--baakee-ink)!important;
  outline-offset:2px!important;
}

/* What-if comparison: create *actual separation* from the action grid.
   Previously the rows were rearranged but #u2p2-comparisons sat flush to
   .u2p2-actions. An empty comparison must not introduce an extra gap. */
html[data-baakee-theme] #modal-root #u2p2-comparisons:has(> .u2p2-compare) + .u2p2-actions,
html[data-baakee-theme] #modal-root #u2p2-comparisons:not(:empty) + .u2p2-actions {
  margin-top:22px!important;
}
html[data-baakee-theme] #modal-root #u2p2-comparisons:empty + .u2p2-actions {
  margin-top:0!important;
}
html[data-baakee-theme] #modal-root #u2p2-comparisons > .u2p2-compare {
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  margin:16px 0 0!important;
  padding:14px!important;
  background:var(--baakee-card-fill)!important;
  border:1px solid var(--baakee-glass-border)!important;
  border-radius:16px!important;
}
html[data-baakee-theme] #modal-root #u2p2-comparisons .u2p2-compare > strong {
  display:block!important;
  margin:0 0 9px!important;
  color:var(--baakee-ink)!important;
  line-height:1.35!important;
}
/* Always use a reliable two-line item: the scenario name occupies the first
   line; the projected balance and Remove sit on the second line. On narrow
   modals they cannot collide, regardless of iPhone/iPad viewport width. */
html[data-baakee-theme] #modal-root #u2p2-comparisons .u2p2-compare > .u2p2-compare-row {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-rows:auto auto!important;
  gap:8px 12px!important;
  align-items:center!important;
  justify-items:stretch!important;
  box-sizing:border-box!important;
  padding:12px 0!important;
  margin:0!important;
  min-width:0!important;
  border-top:1px solid var(--baakee-glass-border)!important;
}
html[data-baakee-theme] #modal-root #u2p2-comparisons .u2p2-compare-row > span {
  display:block!important;
  grid-column:1 / -1!important;
  grid-row:1!important;
  min-width:0!important;
  overflow-wrap:anywhere!important;
  line-height:1.4!important;
  color:var(--baakee-body-ink)!important;
}
html[data-baakee-theme] #modal-root #u2p2-comparisons .u2p2-compare-row > b {
  display:block!important;
  grid-column:1!important;
  grid-row:2!important;
  min-width:0!important;
  overflow-wrap:anywhere!important;
  text-align:left!important;
  white-space:normal!important;
  color:var(--baakee-ink)!important;
  line-height:1.4!important;
  font-variant-numeric:tabular-nums!important;
}
html[data-baakee-theme] #modal-root #u2p2-comparisons .u2p2-compare-row > button {
  grid-column:2!important;
  grid-row:2!important;
  justify-self:end!important;
  align-self:center!important;
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:34px!important;
  padding:6px 11px!important;
  margin:0!important;
  white-space:nowrap!important;
}
@media(max-width:390px) {
  html[data-baakee-theme] #modal-root #u2p2-comparisons > .u2p2-compare {padding:12px!important;}
  html[data-baakee-theme] #modal-root #u2p2-comparisons .u2p2-compare > .u2p2-compare-row {gap:7px 9px!important;}
}
@media(prefers-reduced-motion:reduce) {
  html[data-baakee-theme] body.rufiyaa-liquid-glass #modal-root .modal form.add-tx-v128 .u1-regular-expense-splitting > button:not(.primary):not(.danger) {transition:none!important;}
}