/* Neutral mobile surfaces for Black; keep chart and status accent colors. */
@layer mobile-black-theme-fixes {
  @media (max-width: 760px) {
    html[data-appearance="black"] #dashboard-section :is(.dashboard-cash-flow, .dashboard-mobile-metric-group),
    html[data-appearance="black"] #profile-section .my-plan-nav,
    html[data-appearance="black"] #taxes-section .taxes-mobile-metric,
    html[data-appearance="black"] :is(#deposits-pagination-wrapper, #monthly-pagination-wrapper, #stock-gains-pagination-wrapper) {
      background: #151515 !important;
      border-color: #383838 !important;
      box-shadow: none !important;
    }
    html[data-appearance="black"] #dashboard-section :is(.dashboard-cash-flow-list, .dashboard-mobile-metric-rows) > * {
      border-color: #383838 !important;
    }
    html[data-appearance="black"] #profile-section .my-plan-nav-item:not(.is-active) {
      background: transparent !important;
      border-color: transparent !important;
    }
    html[data-appearance="black"] #profile-section .my-plan-nav-item.is-active {
      background: #222 !important;
      border-color: #555 !important;
    }
    html[data-appearance="black"] #profile-section .my-plan-fi-track {
      background: #383838 !important;
    }
    html[data-appearance="black"] #profile-section .my-plan-fi-metrics > div + div,
    html[data-appearance="black"] #withdrawals-section .withdrawals-mobile-total,
    html[data-appearance="black"] #dividends-section .dividend-mobile-metadata > * {
      border-color: #414141 !important;
    }
    html[data-appearance="black"] #taxes-section :is(.taxes-mobile-country, .taxes-mobile-metrics, .taxes-mobile-metric) {
      border-color: #383838 !important;
    }
    html[data-appearance="black"] :is(#deposits-section .deposits-mobile-sort-wrap, #withdrawals-section .withdrawals-mobile-sort),
    html[data-appearance="black"] :is(#deposits-mobile-sort, #withdrawals-mobile-sort) {
      background-color: #151515 !important;
      border-color: #404040 !important;
    }
    html[data-appearance="black"] #withdrawals-mobile-count {
      background: #292929 !important;
    }
    html[data-appearance="black"] :is(#deposits-pagination-wrapper, #monthly-pagination-wrapper, #stock-gains-pagination-wrapper) :is(select, .monthly-page-btn:not(.active):not(.is-active)) {
      background-color: #202020 !important;
      border-color: #414141 !important;
    }
  }
}
