/* Shared theme layer. Brand artwork and product images retain their original colors. */
:root[data-theme] {
  --rpm-bg: #f6f5f9;
  --rpm-panel: #fff;
  --rpm-soft: #efedf5;
  --rpm-text: #272735;
  --rpm-muted: #666878;
  --rpm-border: #dddce8;
  --rpm-accent: #4b40ff;
  --rpm-accent-text: #4b40d8;
  --rpm-shadow: 0 16px 50px rgb(34 27 78 / 12%);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --rpm-bg: #10111b;
  --rpm-panel: #1b1d2c;
  --rpm-soft: #252739;
  --rpm-text: #eef0fa;
  --rpm-muted: #b0b3c9;
  --rpm-border: #3b3e55;
  --rpm-accent: #7967f4;
  --rpm-accent-text: #b6aaff;
  --rpm-shadow: 0 18px 60px rgb(0 0 0 / 25%);
  --bg: var(--rpm-bg);
  --panel: var(--rpm-panel);
  --panel-light: var(--rpm-soft);
  --stroke: var(--rpm-border);
  --text: var(--rpm-text);
  --muted: var(--rpm-muted);
  --purple: #7060ee;
  --purple-dark: #5747c7;
  --green: #5ed7a2;
  --danger: #ff909c;
}
:root[data-theme="light"] { color-scheme: light; }
html[data-theme] { background-color: var(--rpm-bg); }
html[data-theme="dark"] body { background-color: var(--rpm-bg); color: var(--rpm-text); }
html[data-theme="dark"] :is(input, select, textarea) { color-scheme: dark; }
html[data-theme="dark"] option { background: var(--rpm-panel); color: var(--rpm-text); }
html[data-theme="dark"] :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid var(--rpm-accent-text); outline-offset: 3px;
}

/* The control is isolated from the different legacy page styles. */
#rpm-theme-switch {
  position: fixed; z-index: 10050;
  left: max(18px, env(safe-area-inset-left));
  bottom: max(18px, env(safe-area-inset-bottom));
  font: 500 14px/1.4 system-ui, sans-serif;
  color: var(--rpm-text); text-align: left;
}
#rpm-theme-switch button {
  appearance: none; box-sizing: border-box; font: inherit;
  color: var(--rpm-text); cursor: pointer; letter-spacing: normal;
  text-transform: none; margin: 0;
}
#rpm-theme-switch .rpm-theme-icon {
  width: 22px; height: 22px; display: flex; align-items: center; justify-content: center;
  line-height: 0; pointer-events: none;
}
#rpm-theme-switch svg { width: 22px; height: 22px; display: block; flex: 0 0 22px; }
#rpm-theme-switch .rpm-theme-trigger {
  width: 44px; height: 44px; min-width: 44px; min-height: 44px; padding: 0;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--rpm-border); border-radius: 50%;
  background: var(--rpm-panel); box-shadow: 0 5px 24px rgb(0 0 0 / 15%);
}
#rpm-theme-switch .rpm-theme-trigger:hover { background: var(--rpm-soft); }
#rpm-theme-switch button:focus-visible { outline: 2px solid var(--rpm-accent-text); outline-offset: 2px; }
@media (max-width: 560px) {
  #rpm-theme-switch { left: max(12px, env(safe-area-inset-left)); bottom: max(12px, env(safe-area-inset-bottom)); }
}

/* Landing page. Keep the embedded illustrations, change their surrounding UI. */
html[data-theme="dark"][data-rpm-page="home"] .window {
  background: var(--rpm-panel); color: var(--rpm-text);
  box-shadow: 0 24px 80px rgb(0 0 0 / 30%);
}
html[data-theme="dark"][data-rpm-page="home"] .showcase { background: var(--rpm-soft); }
html[data-theme="dark"][data-rpm-page="home"] :is(.welcome-sub, .online, .footer-note) { color: var(--rpm-muted); }
html[data-theme="dark"][data-rpm-page="home"] .creators { color: var(--rpm-accent-text); }
html[data-theme="dark"][data-rpm-page="home"] .logo {
  content: url('/static/media/logo_white.e4a082d60deb07692ec197a58e460b4f.svg');
}
html[data-theme="dark"][data-rpm-page="home"] .donate::before { background: var(--rpm-panel); }

/* Server selection and React shop, including every cart/checkout modal. */
html[data-theme] body[class*="Home_body__"] {
  /* The fixed selection UI does not contribute to body height. Give its
     original background a full viewport to paint on in either theme. */
  min-height: 100vh;
}
html[data-theme="dark"] [class*="Home_modal__"] { background: var(--rpm-panel); color: var(--rpm-text); box-shadow: var(--rpm-shadow); }
html[data-theme="dark"] [class*="Home_serversWrapper__"] { background: var(--rpm-soft); }
html[data-theme="dark"] [class*="Home_purple__"] { color: var(--rpm-accent-text); }
html[data-theme="dark"][data-rpm-page="shop"] :is(.top-donator, .news-item, .product:not(.product_popular), .purchase,
  .catalog-filters-items, .catalog-search__input, .modal-window, .header_static, .preloader,
  [class*="DownloadDialog_downloadDialog__"]) {
  background-color: var(--rpm-panel); color: var(--rpm-text); box-shadow: var(--rpm-shadow);
}
html[data-theme="dark"][data-rpm-page="shop"] :is(.modal-gray, .modal-checkout__goods, .modal-checkout-form, .modal-checkout-totals) {
  background: var(--rpm-soft); color: var(--rpm-text);
}
html[data-theme="dark"][data-rpm-page="shop"] :is(.top-donator__top, .product-top, .purchase-body,
  .card-add-item, .modal-checkout-item, .modal-checkout-item__body, .modal-checkout-totals-summary-wrapper) { border-color: var(--rpm-border); }
html[data-theme="dark"][data-rpm-page="shop"] :is(.catalog-filter:not(.catalog-filter_active),
  .header_static .header-nav__link, .header_static .header-nav-mobile__current, .modal-checkout-alert__link) { color: var(--rpm-text); }
html[data-theme="dark"][data-rpm-page="shop"] :is(.cta-clear, .all-products, .modal-btn-clear, .catalog-filter:hover) { color: var(--rpm-accent-text); }
html[data-theme="dark"][data-rpm-page="shop"] .catalog-filter_active { color: #fff; }
html[data-theme="dark"][data-rpm-page="shop"] :is(.modal-checkout-input-block__input, .modal-checkout-input-block-select, .tips-selector-btn) {
  background: var(--rpm-panel); color: var(--rpm-text); border-color: var(--rpm-border);
}
html[data-theme="dark"][data-rpm-page="shop"] .tips-selector-btn.selected { background: #3b335f; border-color: var(--rpm-accent-text); }
html[data-theme="dark"][data-rpm-page="shop"] :is(input, textarea)::placeholder { color: var(--rpm-muted); opacity: 1; }
html[data-theme="dark"][data-rpm-page="shop"] :is(.modal-voting-option__marker, .modal-promo-option__marker) { border-color: var(--rpm-muted); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static :is(.header-nav-mobile__links, .header-cart) {
  background: var(--rpm-panel); color: var(--rpm-text); border-color: var(--rpm-border);
}
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-cart__icon { background: var(--rpm-soft); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-logo__image:not(.header-logo__image_plashka) {
  content: url('/static/media/logo_white.e4a082d60deb07692ec197a58e460b4f.svg');
}
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-nav__link::before { background: var(--rpm-text); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-socials__link_discord { background-image: url('/static/media/discord.5b722c0dc011626a2a20.svg'); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-socials__link_tiktok { background-image: url('/static/media/tiktok.a12302aa3c307533e1fb.svg'); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-socials__link_youtube { background-image: url('/static/media/youtube.294ae182612424b0720c.svg'); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-socials__link_vk { background-image: url('/static/media/vk.9f05f1bd81cf759db41c.svg'); }
html[data-theme="dark"][data-rpm-page="shop"] .header_static .header-cart::after { background-image: url('/static/media/arrow-right.1afab9801d8abfbf1a5d.svg'); }
html[data-theme="dark"][data-rpm-page="shop"] :is(.modal-close, .modal-checkout-item__remove) { background-image: url('/static/media/close.7dce540df29229df65fe.svg'); }
html[data-theme="dark"][data-rpm-page="shop"] .hero {
  background-image: linear-gradient(0deg, var(--rpm-bg), transparent 38%), url('/static/media/bg.5b7003612c2b3b35611b.jpg');
}
html[data-theme="dark"][data-rpm-page="shop"] .footer { background: #0b0c14; }

/* Payment selection already uses custom properties; cover the remaining literals. */
html[data-theme="dark"][data-rpm-page="payment"] :is(.order-summary, .toast, .payment-modal__card, .voting-option, .voting-modal__skip) {
  background: var(--rpm-panel); color: var(--rpm-text); border-color: var(--rpm-border);
}
html[data-theme="dark"][data-rpm-page="payment"] .order-summary { background: #171925; }
html[data-theme="dark"][data-rpm-page="payment"] :is(.legal-note, .legal-note a, .payment-footer,
  .goods-item span, .payment-modal__close) { color: var(--rpm-muted); }
html[data-theme="dark"][data-rpm-page="payment"] :is(.eyebrow, .payment-notice, .state-message a) { color: var(--rpm-accent-text); }
html[data-theme="dark"][data-rpm-page="payment"] .payment-option_selected { background: #30294d; border-color: #a291ff; }
html[data-theme="dark"][data-rpm-page="payment"] .payment-option:hover:not(:disabled) { background: #2b2945; }
html[data-theme="dark"][data-rpm-page="payment"] .brand img {
  content: url('/static/media/logo_white.e4a082d60deb07692ec197a58e460b4f.svg');
}
html[data-theme="dark"][data-rpm-page="payment"] .checkout-shell { box-shadow: var(--rpm-shadow); }

/* The promo already has a dark art direction. Its light palette uses the same layout. */
html[data-theme="light"][data-rpm-page="promo"] body { background: radial-gradient(circle at 50% 35%, #e0e2ff, #f6f5fa 75%); color: var(--rpm-text); }
/* The illustrated opening screen keeps its own dark backdrop and white branding. */
html[data-theme="light"][data-rpm-page="promo"] .hero-screen { color: #fff; }
html[data-theme="light"][data-rpm-page="promo"] .hero-screen .free-badge { color: #c5c5dd; }
html[data-theme="light"][data-rpm-page="promo"] :is(.promo-title, .gp-modal-title) { color: var(--rpm-text); }
html[data-theme="light"][data-rpm-page="promo"] :is(.stats-subtitle, .feature-desc, .faq-card-answer,
  .gp-modal-subtitle, .dl-stage-subtitle, .dl-region-desc, .dl-region-col-head, .dl-link-tag, .dl-divider span) { color: var(--rpm-muted); }
html[data-theme="light"][data-rpm-page="promo"] :is(.faq-banner, .promo-banner) { background: linear-gradient(#e9e8fa, #f6f5fa); }
html[data-theme="light"][data-rpm-page="promo"] .promo-fade {
  background: linear-gradient(90deg, #f6f5fa, transparent 20%, transparent 80%, #f6f5fa),
    linear-gradient(#e9e8fa, transparent 24%, transparent 76%, #f6f5fa);
}
html[data-theme="light"][data-rpm-page="promo"] :is(.faq-card, .mobile-menu-inner, .lang-dropdown, .gp-modal, .dl-modal) {
  background: var(--rpm-panel); color: var(--rpm-text); border-color: var(--rpm-border); box-shadow: var(--rpm-shadow);
}
html[data-theme="light"][data-rpm-page="promo"] :is(.mobile-menu-link, .mobile-social-link, .mobile-menu-online,
  .mobile-lang-option, .mobile-menu-donate, .mobile-menu-close, .gp-modal-close, .dl-modal-close,
  .dl-platform, .dl-region, .dl-region-col, .dl-link-btn, .dl-support-btn) {
  background: var(--rpm-soft); color: var(--rpm-text); border-color: var(--rpm-border);
}
html[data-theme="light"][data-rpm-page="promo"] :is(.mobile-menu-close svg, .mobile-menu-donate, .dl-stage-title,
  .dl-region-name, .dl-platform-name, .dl-region-hint, .dl-promo-banner) { color: var(--rpm-text); }
html[data-theme="light"][data-rpm-page="promo"] .carousel-dot { background: #9b95bb; }
html[data-theme="light"][data-rpm-page="promo"] .carousel-dot.active { background: var(--rpm-accent); }

/* Creators keeps its orange brand colors in both themes. */
html[data-rpm-page="creators"][data-theme="dark"],
html[data-rpm-page="creators"][data-theme="dark"] body { background-color: #171513; }
html[data-rpm-page="creators"] { --rpm-accent-text: #c87416; }
html[data-rpm-page="creators"][data-theme="dark"] { --rpm-accent-text: #ffc378; }
html[data-rpm-page="creators"][data-theme="light"],
html[data-rpm-page="creators"][data-theme="light"] body { background: #fffaf3; color: #322719; }
html[data-theme="light"][data-rpm-page="creators"] :is(.hero-subtitle, .integrations-title span, .integration-card p,
  .price-card h3, .price-card__rate, .prices-modal__notes, .integrations-subtitle) { color: #514234; }
html[data-theme="light"][data-rpm-page="creators"] :is(.text-orange, .integration-card h3, .footer-center h2) { color: #a65a0a; }
html[data-theme="light"][data-rpm-page="creators"] :is(.btn-dark, .btn-outline, .prices-modal__dialog,
  .price-card, .integration-card, .integration-card.featured, .prices-modal__close) {
  background: #fff; color: #322719; border-color: #ddc8af;
}
html[data-theme="light"][data-rpm-page="creators"] .bg-text { color: #eadfce; }
html[data-theme="light"][data-rpm-page="creators"] :is(.price-card__minimum, .integration-meta, .integrations-note,
  .header-back-link, .footer-center a) { color: #72614f; }
html[data-theme="light"][data-rpm-page="creators"] .hero-left::after {
  background: linear-gradient(transparent, #fffaf3);
}
