.home-upcoming-payments {
  display: grid;
  gap: 9px;
}

.home-upcoming-payments > .section-title {
  margin-bottom: 2px;
}

.home-payment-upcoming {
  border-color: color-mix(in srgb, var(--blue) 28%, var(--border));
  background: color-mix(in srgb, var(--blue) 8%, var(--card));
}

.home-payment-upcoming > .material-icon,
.home-payment-upcoming .item-icon,
.home-payment-upcoming .item-copy strong {
  color: var(--blue);
}

.dark .home-payment-upcoming {
  border-color: color-mix(in srgb, #8dcbff 34%, var(--border));
  background: color-mix(in srgb, #1453a0 18%, var(--card));
}