/* Billing center: one restrained charcoal language across balance, plans and history. */
body.dashboard-page #billing {
  --bill-panel: #1a1e25;
  --bill-line: #363e4a;
  --bill-muted: #a7afbd;
}
body.dashboard-page #billing .billing-page-head { margin-bottom: 23px; }
body.dashboard-page #billing .billing-page-head h1 { font-size: clamp(25px,2.3vw,32px); }
body.dashboard-page #billing .billing-head-cta,
body.dashboard-page #billing .billing-balance-hero > .balance-topup {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  min-width: 150px;
  min-height: 42px;
  padding: 9px 16px;
  border: 1px solid #a58aba;
  border-radius: 10px;
  background: #332b3e;
  box-shadow: none;
  color: #f5eafd;
  font: 700 12px Vazirmatn,sans-serif;
  cursor: pointer;
}
body.dashboard-page #billing .billing-head-cta:hover,
body.dashboard-page #billing .billing-balance-hero > .balance-topup:hover { background: #41344f; border-color: #c1a4d9; }
body.dashboard-page #billing .billing-overview { gap: 16px; margin-bottom: 20px; }
body.dashboard-page #billing .billing-balance-hero {
  min-height: 340px;
  padding: 25px;
  border: 1px solid #5b5069;
  border-radius: 20px;
  background: linear-gradient(140deg,#25222d,#1b2027 75%);
  box-shadow: 0 10px 26px #0003;
}
body.dashboard-page #billing .balance-glow { display: none; }
body.dashboard-page #billing .billing-balance-hero header { color: #e4d9ec; }
body.dashboard-page #billing .billing-balance-hero header i { border-color: #6b5a7a; background: #342c3d; }
body.dashboard-page #billing .billing-balance-hero > strong { margin-top: 22px; font-size: clamp(42px,4vw,60px); text-shadow: none; }
body.dashboard-page #billing .billing-balance-hero > p { color: #bbc0ca; }
body.dashboard-page #billing .balance-details > span { border-color: #45424e; background: #1e2028; }
body.dashboard-page #billing .balance-details i { background: transparent; color: #bda8d1; }
body.dashboard-page #billing .balance-details small { color: #aab0bb; }
body.dashboard-page #billing .billing-balance-hero > .balance-topup { width: 100%; margin-top: 18px; }
body.dashboard-page #billing .billing-summary-grid { gap: 12px; }
body.dashboard-page #billing .billing-summary-grid article {
  min-height: 160px;
  padding: 20px;
  border: 1px solid var(--bill-line);
  border-radius: 17px;
  background: #1b2028;
  box-shadow: 0 8px 22px #0002;
}
body.dashboard-page #billing .billing-summary-grid article:hover { border-color: #777080; }
body.dashboard-page #billing .summary-icon { width: 38px; height: 38px; border-radius: 10px; background: #2b2d35; }
body.dashboard-page #billing .billing-summary-grid small { color: #adb5c1; }
body.dashboard-page #billing .billing-summary-grid em { color: #a0a9b7; }
body.dashboard-page #billing .billing-plans-section,
body.dashboard-page #billing .billing-ledger {
  margin-top: 20px;
  padding: 25px;
  border: 1px solid var(--bill-line);
  border-radius: 20px;
  background: #191f27;
  box-shadow: 0 10px 28px #0002;
}
body.dashboard-page #billing .billing-section-head h2 { font-size: 20px; }
body.dashboard-page #billing .billing-section-head p { color: #aab2bf; font-size: 11px; }
body.dashboard-page #billing .billing-rate { border-color: #46505e; background: #222a34; color: #bbc4cf; }
body.dashboard-page #billing .billing-plan-grid {
  grid-template-columns: repeat(auto-fit,minmax(min(100%,245px),1fr));
  gap: 14px;
  align-items: stretch;
}
body.dashboard-page #billing .billing-plan-card {
  max-width: none;
  min-height: 0;
  padding: 22px;
  background: #242830;
  border-color: #444a55;
  box-shadow: 0 8px 20px #0002;
}
body.dashboard-page #billing .billing-plan-card.featured { background: #2b2934; border-color: #a58aba; }
body.dashboard-page #billing .billing-plan-card:last-child:nth-child(odd) { grid-column: auto; }
body.dashboard-page #billing .plan-price { margin-top: 20px; }
body.dashboard-page #billing .plan-price strong { font-size: clamp(28px,2.5vw,38px); }
body.dashboard-page #billing .plan-credit { margin-top: 10px; }
body.dashboard-page #billing .plan-purchase { margin-top: 22px; }
body.dashboard-page #billing .billing-plan-card ul { gap: 9px; margin-top: 24px; font-size: 11px; }
body.dashboard-page #billing .billing-trust-row { gap: 12px; margin-top: 14px; }
body.dashboard-page #billing .billing-trust-row > div { border-color: var(--bill-line); background: #1b2028; }
body.dashboard-page #billing .billing-refresh,
body.dashboard-page #billing .ledger-toolbar { border-color: #444c59; background: #222933; }
body.dashboard-page #billing .ledger-tabs button.active { background: #3b3149; box-shadow: inset 0 0 0 1px #806a9c; }
body.dashboard-page #billing .ledger-row,
body.dashboard-page #billing .invoice-row { border-color: #384453; background: #1b242e; }
body.dashboard-page #billing .billing-empty.compact { border-color: #424c59; background: #1b242e; }
body.dashboard-page #billing :is(button,select):focus-visible { outline: 2px solid #bba1d5; outline-offset: 3px; }

@media (max-width: 760px) {
  body.dashboard-page #billing .billing-head-cta { width: 100%; }
  body.dashboard-page #billing .billing-balance-hero { min-height: 0; padding: 20px; }
  body.dashboard-page #billing .billing-summary-grid article { min-height: 105px; }
  body.dashboard-page #billing .billing-plans-section,
  body.dashboard-page #billing .billing-ledger { padding: 18px; }
  body.dashboard-page #billing .billing-plan-grid { grid-template-columns: minmax(0,1fr); }
}
