/* Keep portfolio balance and Assets allocation values on the same accent. */
html { --balance-allocation-accent: #20dce5; }
html[data-appearance="light"] { --balance-allocation-accent: #008b94; }
html[data-theme="warm-oak"] { --balance-allocation-accent: #00675d; }
@media (min-width: 761px) {
  html[data-theme="warm-oak"] { --balance-allocation-accent: #1bbbc3; }
}

/* The desktop summary strip has its own high-priority theme layer. */
@layer desktop-screen-fit {
  @media (min-width: 761px) {
    html[data-theme="warm-oak"] body #dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section #dashboard-summary-balance {
      color: var(--balance-allocation-accent) !important;
      -webkit-text-fill-color: var(--balance-allocation-accent) !important;
    }
    html[data-theme="warm-oak"] body :is(#stocks-section, #sectors-section, #deposits-section, #withdrawals-section, #dividends-section, #stocks-gains-section, #taxes-section, #settings-section, #leaderboard-section, #profile-section) :is(#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference#summary-reference, .portfolio-summary-strip) :is(#stocks-summary-balance, #allocation-summary-balance, #deposits-summary-balance, #withdrawals-summary-balance, #dividends-summary-balance, #stock-gains-summary-balance, #taxes-summary-balance, #my-plan-summary-balance, #settings-summary-balance, #leaderboard-summary-balance) {
      color: var(--balance-allocation-accent) !important;
      -webkit-text-fill-color: var(--balance-allocation-accent) !important;
      text-shadow: none !important;
    }
  }
}

html body #dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section#dashboard-section #dashboard-summary-balance,
html body .section :is(#stocks-summary-balance, #allocation-summary-balance, #deposits-summary-balance, #withdrawals-summary-balance, #dividends-summary-balance, #stock-gains-summary-balance, #taxes-summary-balance, #my-plan-summary-balance, #settings-summary-balance, #leaderboard-summary-balance) {
  color: var(--balance-allocation-accent) !important;
  -webkit-text-fill-color: var(--balance-allocation-accent) !important;
  text-shadow: none !important;
}

html:not([data-theme="warm-oak"]) body #stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section #stocks-tbody td[data-field="allocation"] {
  color: var(--balance-allocation-accent) !important;
  -webkit-text-fill-color: var(--balance-allocation-accent) !important;
  text-shadow: none !important;
}

@layer desktop-button-standard {
  @media (min-width: 761px) {
    html[data-theme="warm-oak"] body #stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section#stocks-section #stocks-tbody td[data-field="allocation"] {
      color: var(--balance-allocation-accent) !important;
      -webkit-text-fill-color: var(--balance-allocation-accent) !important;
      text-shadow: none !important;
    }
  }
}

/* Existing important layers take precedence over unlayered important rules. */
@layer desktop-button-standard {
  @media (min-width: 761px) {
    html body .section :is([id$="-summary-balance"], #dashboard-summary-balance),
    html[data-appearance="black"] body .section :is([id$="-summary-balance"], #dashboard-summary-balance) {
      color: var(--balance-allocation-accent) !important;
    }
  }
}

@layer stocks-mobile-reference {
  @media (max-width: 760px) {
    html body #stocks-section .stocks-mobile-weight strong,
    html[data-appearance="black"] body #stocks-section .stocks-mobile-weight strong {
      color: var(--balance-allocation-accent) !important;
      -webkit-text-fill-color: var(--balance-allocation-accent) !important;
      text-shadow: none !important;
    }
  }
}