/* Notifications, history and help screens. Like the rewards screen, their classes had no styles of their own, so they
   rendered as plain text with large gaps. Scoped to .member-page so no other screen is affected. */
.member-page { display: grid; gap: 14px; padding: 14px 16px 28px; }
.member-page .page-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.member-page .page-heading h1 { margin: 2px 0 4px; font-size: 22px; line-height: 1.3; font-weight: 800; color: var(--mak-ink); }
.member-page .page-heading p { margin: 0; font-size: 13px; line-height: 1.5; color: var(--mak-muted); }
.member-page .page-heading .btn { flex: none; white-space: nowrap; font-size: 12px; }
.member-page .eyebrow { margin: 0; font-size: 11px; font-weight: 800; letter-spacing: .12em; color: var(--mak-green); }
.member-page .member-card { padding: 4px 14px; border-radius: 16px; background: #fff; border: 1px solid rgba(15, 81, 50, .12); box-shadow: 0 2px 8px rgba(0, 0, 0, .05); }
.member-page .btn-soft { border: 1px solid rgba(15, 81, 50, .2); background: #eef7f1; color: var(--mak-green); font-weight: 700; }
.member-page .btn-soft:disabled { opacity: .55; }

/* history */
.member-page .history-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.member-page .history-badges .badge { font-size: 11px; font-weight: 700; }
.member-page .activity-item { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid #edf1ee; }
.member-page .activity-item:last-child { border-bottom: 0; }
.member-page .activity-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #e8f4ed; color: var(--mak-green); font-size: 17px; }
.member-page .activity-copy { min-width: 0; display: grid; gap: 2px; }
.member-page .activity-copy strong { font-size: 14px; color: var(--mak-ink); }
.member-page .activity-copy small { font-size: 12px; color: var(--mak-muted); overflow-wrap: anywhere; }
.member-page .activity-value { font-size: 15px; font-weight: 800; color: var(--mak-green); white-space: nowrap; }
.member-page .activity-value.text-danger { color: #c0392b !important; }
.member-page .member-empty { margin: 0; padding: 18px 0; text-align: center; font-size: 13px; color: var(--mak-muted); }

/* notifications */
.member-page .notification-item { display: grid; grid-template-columns: 38px 1fr auto; align-items: start; gap: 10px; padding: 12px 0; border-bottom: 1px solid #edf1ee; }
.member-page .notification-item:last-child { border-bottom: 0; }
.member-page .notification-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #fff4cc; color: var(--mak-green); font-size: 17px; }
.member-page .notification-item.unread .notification-icon { background: #e8f4ed; }
.member-page .notification-copy strong { display: block; font-size: 14px; color: var(--mak-ink); }
.member-page .notification-copy p { margin: 2px 0 4px; font-size: 13px; line-height: 1.5; color: #4b5a51; }
.member-page .notification-copy small { font-size: 11px; color: var(--mak-muted); }
.member-page .notification-item .badge { font-size: 10px; }

/* help */
.member-page .help-contacts { display: grid; gap: 10px; }
.member-page .help-contact { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 12px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid rgba(15, 81, 50, .12); box-shadow: 0 2px 8px rgba(0, 0, 0, .05); color: inherit; text-decoration: none; }
.member-page .help-contact > i:first-child { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #e8f4ed; color: var(--mak-green); font-size: 19px; }
.member-page .help-contact strong { display: block; font-size: 14px; color: var(--mak-ink); }
.member-page .help-contact small { display: block; font-size: 12px; color: var(--mak-muted); }
.member-page .help-contact .help-contact-value { font-size: 13px; font-weight: 800; color: var(--mak-green); white-space: nowrap; }
.member-page .accordion-item { border-color: #edf1ee; }
.member-page .accordion-button { padding: 13px 0; font-size: 14px; font-weight: 700; color: var(--mak-ink); background: transparent; box-shadow: none; }
.member-page .accordion-button:not(.collapsed) { color: var(--mak-green); }
.member-page .accordion-body { padding: 0 0 14px; font-size: 13px; line-height: 1.6; color: #4b5a51; }

/* Labels on the balance cards were 8–9px, below what a phone can read comfortably. */
.mak-app-shell .point-wallet-eyebrow,
.mak-app-shell .point-wallet-stats span,
.mak-app-shell .dealer-quota-stats span,
.mak-app-shell .dealer-latest-credit small { font-size: 11px; }
.mak-app-shell .dealer-status { font-size: 10px; }
.mak-app-shell .promo-pill,
.mak-app-shell .ticket-card span { font-size: 10px; }

/* Home season banner: leave room for Vietnamese accents and balance the mascot with the copy. */
.mak-app-shell .promo-banner-card.promo-season {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34%;
  align-items: center;
  gap: 10px;
  padding: 18px 16px;
  text-decoration: none;
}
.mak-app-shell .promo-season:focus-visible { outline: 3px solid #efb721; outline-offset: 3px; }
.mak-app-shell .promo-season .promo-card-content { padding-bottom: 0; }
.mak-app-shell .promo-season-headline {
  font-size: clamp(13px, 4vw, 19px);
  line-height: 1.4;
  background: none;
  color: #f6c945;
  -webkit-text-fill-color: currentColor;
}
.mak-app-shell .promo-season-mascot {
  align-self: center;
  width: 100%;
  max-height: none;
  object-position: center;
}

/* Farmer registration: optional managing dealer, checked against the dealer list before the OTP is sent. */
.register-optional { color: #7b8780; font-weight: 400; }
.register-dealer-input { text-transform: uppercase; }
.register-dealer-input::placeholder { text-transform: none; }
.register-dealer-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-top: 6px; }
.register-dealer-row .figma-link-btn { flex: none; padding: 0; border: 0; background: none; }
.register-dealer-result { margin: 0; color: #7b8780; font-size: 11.5px; line-height: 1.5; }
.register-dealer-result.ok { color: #087838; font-weight: 700; }
.register-dealer-result.bad { color: #a43328; font-weight: 600; }

.history-transaction-link { color: inherit; text-decoration: none; }
.history-transaction-link:focus-visible { outline: 2px solid #087436; outline-offset: 2px; }
.history-transaction-detail .dealer-detail-row { align-items: flex-start; }
.history-transaction-detail .dealer-detail-row > span { flex: none; }
.history-transaction-detail .dealer-detail-row > strong { min-width: 0; overflow-wrap: anywhere; text-align: right; }