/* Subscription layout. Scoped specificity wins over the legacy theme cascade. */

/* Keep every visual panel in Settings consistent with the square Billing cards. */
html body #settings-section#settings-section.banymay-settings :is(
  #platform-settings-card .settings-form-section,
  #account-settings-card .settings-form-section,
  #chart-history-card .chart-history-panel,
  #chart-history-card .chart-history-controls,
  #chart-history-card .chart-history-table-wrap,
  #download-data-card .download-data-hero,
  #download-data-card .download-export-options,
  #download-data-card .download-data-security,
  #contact-us-card .contact-form,
  #fi-metrics-formulas-card .fi-formula-hero,
  #fi-metrics-formulas-card .fi-formula-coverage-card,
  #fi-metrics-formulas-card .fi-formula-section,
  #fi-metrics-formulas-card .fi-formula-card
) {
  border-radius: 0 !important;
}

/* Download Data: use the same very light blue as the Settings page in light mode. */
html[data-appearance="light"] body #settings-section#settings-section.banymay-settings #download-data-card :is(
  .download-data-hero,
  .download-export-options,
  .download-data-security
) {
  background: var(--appearance-page, #f4f9fc) !important;
  background-image: none !important;
}

html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card {
  --billing-surface: #111c23;
  --billing-inner-surface: #101a21;
  --billing-border: #263a46;
  --billing-text: #f0f5fa;
  --billing-muted: #b3c8dc;
  --billing-accent: #20d1df;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card .settings-content {
  padding: 12px 0 0 !important;
  background: transparent !important;
  height: auto !important;
  min-height: 0 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card .billing-page-heading {
  margin: 0 0 24px !important;
  padding: 0 !important;
  display: block !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card .billing-page-heading h2 {
  margin: 0 0 6px !important;
  color: var(--billing-text) !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -.025em !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card .billing-page-heading p {
  margin: 0 !important;
  color: var(--billing-muted) !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-rows: auto !important;
  gap: 16px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-overview-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  grid-auto-rows: auto !important;
  gap: 14px !important;
  min-height: 0 !important;
  height: auto !important;
  align-items: start !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero {
  display: grid !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  gap: 2px !important;
  min-height: 132px !important;
  height: auto !important;
  padding: 14px 20px !important;
  box-sizing: border-box !important;
  border: 1px solid var(--billing-border) !important;
  border-radius: 0 !important;
  background: var(--billing-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero::before,
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero::after,
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel :is(.billing-hero-glow,.billing-expired-hero-icon,.billing-expired-features header h3 > svg) {
  display: none !important;
  content: none !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero-top {
  display: flex !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin: 0 !important;
  gap: 12px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel :is(.billing-kicker,.billing-status-pill) {
  position: static !important;
  margin: 0 !important;
  padding: 6px 10px !important;
  border-radius: 0 !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  letter-spacing: .05em !important;
  font-weight: 700 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero-main {
  display: grid !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  grid-template-columns: 2fr 1fr !important;
  align-items: center !important;
  gap: 26px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-plan-copy {
  grid-column: 1 !important;
  grid-row: 1 !important;
  max-width: none !important;
  margin: 0 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-status-group {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-trial-remaining {
  color: var(--billing-muted, #98a5b2);
  font-size: 12px;
  line-height: 1.3;
  font-weight: 400;
  letter-spacing: 0;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-trial-remaining[hidden] {
  display: none !important;
}
@media (min-width: 1101px) {
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-plan-copy p {
    white-space: nowrap !important;
  }
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-plan-copy h3 {
  margin: 0 0 7px !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: var(--billing-text) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-plan-copy p {
  margin: 0 !important;
  color: var(--billing-text) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-price-column {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  border-left: 1px solid var(--billing-border) !important;
  min-height: 70px !important;
  padding-left: 26px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-price-block {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  align-items: flex-end !important;
  justify-content: center !important;
  grid-column: auto !important;
  grid-row: auto !important;
  width: max-content !important;
  min-width: 130px !important;
  min-height: 60px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  box-sizing: border-box !important;
  border: 1px solid #273844 !important;
  border-radius: 0 !important;
  background: var(--billing-inner-surface) !important;
  text-align: right !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-price {
  font-size: 26px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  color: var(--billing-text) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-price-period {
  font-size: 12px !important;
  color: var(--billing-muted) !important;
  line-height: 1.3 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-actions {
  display: grid !important;
  grid-column: 1 !important;
  grid-row: 2 !important;
  grid-template-columns: max-content max-content minmax(0, 1fr) max-content !important;
  grid-template-rows: auto !important;
  align-items: center !important;
  gap: 12px !important;
  height: auto !important;
  min-height: 36px !important;
  position: static !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-actions .billing-btn {
  grid-row: 1 !important;
  grid-column: auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 36px !important;
  padding: 0 16px !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  white-space: nowrap !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-footnotes {
  grid-column: 4 !important;
  grid-row: 1 !important;
  width: auto !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-footnotes span {
  padding: 7px 10px !important;
  font-size: 11px !important;
  border-radius: 0 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel :is(.billing-expired-features,.billing-expired-security) {
  margin: 0 !important;
  border: 1px solid var(--billing-border) !important;
  border-radius: 0 !important;
  background: var(--billing-surface) !important;
  box-shadow: none !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-features { padding: 16px 20px !important; }
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-features header {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  margin: 0 0 16px !important;
  gap: 24px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-features h3 {
  margin: 0 !important;
  font-size: 18px !important;
  color: var(--billing-text) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-features header p {
  margin: 0 !important;
  font-size: 12px !important;
  color: var(--billing-muted) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  column-gap: 30px !important;
  row-gap: 10px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid article {
  display: flex !important;
  gap: 16px !important;
  padding: 0 0 10px !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid article:nth-child(n+4) { padding: 10px 0 0 !important; }
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-icon {
  flex: 0 0 48px !important;
  width: 48px !important;
  height: 48px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--billing-inner-surface) !important;
  color: #4da9c6 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-icon svg {
  width: 28px !important;
  height: 28px !important;
  stroke: #4da9c6 !important;
  stroke-width: 1.6 !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid h4 {
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.3 !important;
  margin: 2px 0 5px !important;
  color: var(--billing-text) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid p {
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--billing-muted) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-security {
  padding: 14px 20px !important;
  gap: 16px !important;
  min-height: 70px !important;
  color: var(--billing-muted) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-security strong {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--billing-accent) !important;
}
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-security p { font-size: 12px !important; }
html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel.billing-state-lifetime#billing-panel .billing-price-block {
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 8px !important;
  white-space: nowrap !important;
}
html[data-appearance="light"] body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card {
  --billing-surface: #ffffff;
  --billing-inner-surface: #f5f9fc;
  --billing-border: #e2edf5;
  --billing-text: #183554;
  --billing-muted: #607c99;
  --billing-accent: #009e98;
}
html[data-appearance="light"] body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero {
  background: #ffffff !important;
}
html[data-appearance="light"] body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-price-block {
  background: var(--billing-inner-surface) !important;
  border-color: var(--billing-border) !important;
}
html[data-appearance="light"] body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-icon { background: #eaf6f8 !important; color: #159d9a !important; }
html[data-appearance="light"] body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-footnotes span {
  color: #183554 !important;
  background: #eef8f7 !important;
  border-color: #c8e6e2 !important;
}
@media (min-width: 1101px) {
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card {
    margin-left: -20px !important;
    width: calc(100% + 20px) !important;
    max-width: none !important;
  }
}
@media (max-width: 1100px) {
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid { column-gap: 24px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid article { gap: 14px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-features header { flex-direction: column !important; gap: 8px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-footnotes { grid-column: 1 / -1 !important; grid-row: 2 !important; justify-content: flex-start !important; }
}
@media (max-width: 680px) {
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel :is(.billing-kicker,.billing-status-pill) { font-size: 11px !important; padding: 6px 8px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card .billing-page-heading h2 { font-size: 28px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero { padding: 18px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-hero-main { grid-template-columns: 1fr !important; gap: 18px !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-price-column { grid-column: 1 !important; grid-row: 2 !important; border-left: 0 !important; padding-left: 0 !important; justify-content: flex-start !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid { grid-template-columns: 1fr !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-feature-grid article::after { display: none !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-actions { grid-template-columns: 1fr !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-actions .billing-btn { grid-column: 1 !important; grid-row: auto !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-footnotes { grid-column: 1 !important; grid-row: auto !important; flex-wrap: wrap !important; }
  html body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel .billing-expired-security { flex-wrap: wrap !important; }
}

/* Light Settings theme: every content panel uses the page's pale-blue surface. */
html[data-appearance="light"] body #settings-section#settings-section#settings-section.banymay-settings :is(
  #platform-settings-card .settings-form-section,
  #account-settings-card .settings-form-section,
  #chart-history-card .chart-history-panel,
  #chart-history-card .chart-history-controls,
  #chart-history-card .chart-history-table-wrap,
  #download-data-card .download-data-hero,
  #download-data-card .download-export-options,
  #download-data-card .download-data-security,
  #contact-us-card .contact-form,
  #fi-metrics-formulas-card .fi-formula-hero,
  #fi-metrics-formulas-card .fi-formula-coverage-card,
  #fi-metrics-formulas-card .fi-formula-section,
  #fi-metrics-formulas-card .fi-formula-card
) {
  background: var(--appearance-page, #f4f9fc) !important;
  background-image: none !important;
}

html[data-appearance="light"] body #settings-section #billing-settings-card#billing-settings-card#billing-settings-card #billing-panel#billing-panel :is(
  .billing-hero,
  .billing-expired-features,
  .billing-expired-security
) {
  background: var(--appearance-page, #f4f9fc) !important;
  background-image: none !important;
}