/* Metrics, money and status */
.ae-metric {
  display: grid;
  gap: 4px;
}

.ae-metric-label,
.ae-metric-sub {
  color: var(--color-text-muted);
  font-size: var(--ae-font-size-caption);
  line-height: 1.3;
}

.ae-metric-value {
  color: var(--color-text-strong);
  font-size: var(--ae-font-size-amount-lg);
  font-weight: var(--ae-font-weight-amount);
  font-variant-numeric: tabular-nums;
  line-height: var(--ae-line-height-amount);
}

.ae-metric.is-income .ae-metric-value,
.amount-income,
.income,
.ae-amount-income {
  color: var(--consumer-money-positive, var(--text-amount-income)) !important;
}

.ae-metric.is-expense .ae-metric-value,
.amount-expense,
.expense,
.ae-amount-expense {
  color: var(--consumer-money-negative, var(--text-amount-expense)) !important;
}

.ae-metric.is-warning .ae-metric-value,
.amount-warning,
.warning {
  color: var(--color-warning) !important;
}

.amount-transfer,
.ae-amount-transfer,
.ae-amount-neutral {
  color: var(--color-text-secondary) !important;
}

.ae-amount,
.ae-amount-huge,
.ae-amount-lg,
.ae-amount-md,
.ae-amount-sm,
.ae-tx-amount {
  font-weight: var(--ae-font-weight-amount);
  font-variant-numeric: tabular-nums;
  line-height: var(--ae-line-height-amount);
}

.ae-amount-huge {
  font-size: var(--ae-font-size-amount-huge);
  font-weight: var(--ae-font-weight-amount-strong);
}

.ae-amount-lg {
  font-size: var(--ae-font-size-amount-lg);
}

.ae-amount-md,
.ae-tx-amount {
  font-size: var(--ae-font-size-amount-md);
}

.ae-amount-sm {
  font-size: var(--ae-font-size-amount-sm);
}

.ae-money-summary-list {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.ae-upcoming-section {
  margin: var(--ae-page-top-gap) var(--ae-main-content-padding-x) 10px; display: grid; gap: 2px; padding: 0 0 0.2rem; border: 0; background: transparent;
}

.ae-upcoming-main { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.ae-upcoming-copy, .ae-upcoming-total > div, .ae-upcoming-account-meta, .ae-upcoming-account-list, .ae-upcoming-list { display: grid; }
.ae-upcoming-copy { gap: 1px; }
.ae-upcoming-label, .ae-upcoming-empty, .ae-upcoming-kicker, .ae-upcoming-range, .ae-upcoming-subtitle, .ae-upcoming-account-balance, .ae-upcoming-account-status { color: var(--color-text-muted); font-size: var(--ae-font-size-caption); font-weight: 750; }
.ae-upcoming-section strong { color: var(--color-text); font-size: var(--ae-font-size-amount-sm); font-weight: 900; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ae-upcoming-section strong.expense { color: var(--text-amount-expense); }
.ae-upcoming-amount-btn { min-width: 44px; min-height: 44px; display: inline-grid; align-items: center; justify-items: end; padding: 0; border: 0; background: transparent; text-align: right; }
.ae-upcoming-amount-btn:disabled { opacity: 1; }
.ae-upcoming-breakdown-summary { display: grid; gap: 10px; padding: 0 var(--ae-modal-padding-x) 10px; }
.ae-upcoming-total, .ae-upcoming-account-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.ae-upcoming-total > div { min-width: 0; gap: 2px; }
.ae-upcoming-total strong { font-size: var(--ae-font-size-amount-md); font-weight: 950; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ae-upcoming-account-list, .ae-upcoming-list { gap: 6px; }
.ae-upcoming-account-row { min-height: 38px; }
.ae-upcoming-account-name { min-width: 0; overflow: hidden; color: var(--color-text); font-size: var(--ae-font-size-body-sm); font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.ae-upcoming-account-meta { flex: 0 0 auto; max-width: 56%; justify-items: end; gap: 1px; text-align: right; }
.ae-upcoming-account-status.is-enough { color: var(--text-amount-income); }
.ae-upcoming-account-status.is-short { color: var(--text-amount-expense); }
.ae-upcoming-list { padding: 2px var(--ae-modal-padding-x) var(--sheet-bottom-safe); }
.ae-upcoming-tx-row { min-width: 0; }
.ae-upcoming-right { display: grid; justify-items: end; }
.ae-upcoming-breakdown-sheet { max-height: min(78dvh, 660px); }
.ae-upcoming-tx .ae-tx-meta-main > .ae-tx-time, .ae-upcoming-tx .ae-tx-meta-main > .ae-tx-time + span { display: none; }

.ae-money-summary-row,
.ae-money-summary-total {
  width: 100%;
  min-width: 0;
  min-height: var(--ae-control-min-height);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7rem, max-content);
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-text);
  font: inherit;
  text-align: left;
}

.ae-money-summary-total {
  min-height: var(--ae-row-min-height);
}

.ae-money-summary-label {
  min-width: 0;
  color: var(--color-text-muted);
  font-size: var(--ae-font-size-body-sm);
  font-weight: var(--ae-font-weight-medium);
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.ae-money-summary-value {
  min-width: 0;
  max-width: 100%;
  justify-self: end;
  overflow-wrap: anywhere;
  color: var(--color-text-secondary);
  font-weight: var(--ae-font-weight-amount);
  font-variant-numeric: tabular-nums;
  line-height: var(--ae-line-height-amount);
  text-align: right;
}

.ae-money-summary-total .ae-money-summary-label,
.ae-money-summary-total .ae-money-summary-value {
  color: var(--color-text-secondary);
  font-weight: var(--ae-font-weight-amount);
}

@media (max-width: 360px) {
  .ae-money-summary-row,
  .ae-money-summary-total {
    grid-template-columns: minmax(0, 0.86fr) minmax(0, 1.14fr);
  }
}

.ae-chip,
.ae-pill,
.ae-tag,
.ae-badge,
.ae-status-badge {
  min-height: var(--ae-chip-min-height, 26px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: var(--ae-chip-padding, 0 9px);
  border: 1px solid var(--ae-chip-border-color, var(--color-separator));
  border-radius: var(--ae-chip-radius, var(--radius-pill));
  background: var(--ae-chip-bg, transparent);
  color: var(--ae-chip-color, var(--color-text-secondary));
  font-size: var(--ae-chip-font-size, var(--ae-font-size-caption));
  font-weight: var(--ae-chip-font-weight, var(--ae-font-weight-heavy));
  line-height: 1;
  white-space: nowrap;
}

.ae-chip.active,
.ae-pill.active,
.ae-tag.active,
.ae-badge.active,
.ae-status-badge.active {
  border-color: var(--ae-chip-active-border-color, color-mix(in srgb, var(--color-primary) 48%, transparent));
  background: var(--ae-chip-active-bg, var(--ae-chip-bg, transparent));
  color: var(--ae-chip-active-color, var(--color-primary));
}

.ae-status-success {
  border-color: color-mix(in srgb, var(--ui-success) 44%, transparent);
  color: var(--ui-success);
}

.ae-status-danger {
  border-color: color-mix(in srgb, var(--ui-danger) 44%, transparent);
  color: var(--ui-danger);
}

.ae-status-warning {
  border-color: color-mix(in srgb, var(--color-warning) 44%, transparent);
  color: var(--color-warning);
}

/* Empty and inline states */
.ae-empty,
.ae-empty-state {
  min-height: 140px;
  display: grid;
  place-items: center;
  gap: 10px;
  padding: 22px 0;
  color: var(--color-text-muted);
  text-align: center;
}

.ae-empty-icon-wrap,
.ae-empty-icon {
  display: inline-grid;
  place-items: center;
  color: var(--color-text-muted);
}

.ae-empty-icon-wrap {
  width: 44px;
  height: 44px;
  border: 1px solid var(--color-separator);
  border-radius: var(--radius-sm);
}

.ae-empty-loader {
  animation: ae-spin 0.8s linear infinite;
}

.ae-empty-title {
  color: var(--color-text-strong);
  font-size: var(--ae-font-size-title-md);
  font-weight: var(--ae-font-weight-heavy);
  line-height: var(--ae-line-height-title);
}

.ae-empty-text,
.ae-empty-sub {
  max-width: 28rem;
  margin: 0 auto;
  color: var(--color-text-muted);
  font-size: var(--ae-font-size-body-sm);
  line-height: 1.5;
}

.ae-empty-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 4px;
}

.ae-inline-error,
.ae-alert {
  padding: 10px 12px;
  border: 0;
  border-radius: var(--ae-control-radius);
  background: color-mix(in srgb, var(--color-fill) 44%, transparent);
  color: var(--color-text-secondary);
  font-size: var(--ae-font-size-body-sm);
  line-height: 1.45;
}

.ae-inline-error,
.ae-alert-danger {
  background: color-mix(in srgb, var(--color-danger) 9%, transparent);
  color: var(--color-danger);
}

.ae-alert-warning {
  background: color-mix(in srgb, var(--color-warning) 10%, transparent);
  color: var(--color-warning);
}

.ae-alert-success {
  background: color-mix(in srgb, var(--ui-success) 10%, transparent);
  color: var(--ui-success);
}

/* Segmented controls */
.ae-segmented {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 4px;
  padding: 4px;
  border: 0;
  border-radius: var(--ae-control-radius);
  background: var(--ae-field-bg);
}

.ae-segmented button,
.ae-segmented-item {
  min-height: var(--ae-control-min-height);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: calc(var(--ae-control-radius) - 4px);
  background: transparent;
  color: var(--color-text-muted);
  font-size: var(--ae-font-size-body-sm);
  font-weight: var(--ae-font-weight-heavy);
}

.ae-segmented button.active,
.ae-segmented-item.active {
  background: var(--ae-interaction-selected-bg);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-primary) 34%, transparent);
  color: var(--color-text-strong);
}

/* Generic transaction rows kept for older pages. */
.ae-tx-icon,
.ae-row-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  border: 1px solid var(--color-separator);
  border-radius: var(--radius-sm);
  color: var(--color-primary);
}

.ae-tx-main,
.ae-tx-info,
.ae-row-main {
  min-width: 0;
  flex: 1 1 auto;
  display: grid;
  gap: 3px;
}

.ae-tx-title,
.ae-tx-desc,
.ae-row-title {
  min-width: 0;
  color: var(--color-text-strong);
  font-weight: var(--ae-font-weight-semibold);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ae-tx-meta,
.ae-row-meta,
.ae-tx-subtitle {
  min-width: 0;
  color: var(--color-text-muted);
  font-size: var(--ae-font-size-caption);
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ae-tx-meta-main,
.ae-tx-meta-prefix {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
}

.ae-tx-time {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
}

.ae-tx-right {
  min-width: 0;
  flex: 0 0 auto;
  display: grid;
  justify-items: end;
}

.ae-tx-trailing,
.ae-row-trailing {
  flex: 0 0 auto;
  display: grid;
  justify-items: end;
  gap: 3px;
}

@media (max-width: 420px) {
  .ae-page-section-header,
  .ae-action-row-spaced {
    align-items: stretch;
    flex-direction: column;
  }

  :is(.ae-button-primary,
  .ae-button-secondary,
  .ae-button-success,
  .ae-button-danger,
  .ae-button-danger-outline,
  .ae-button-warning,
  .ae-dialog-btn) {
    min-width: 0;
  }
}
