/* ==========================================================================
   Светлая тема на всех устройствах — клон Trust Wallet.

   Их CSS переключается на тёмную по системной настройке, и на телефоне с
   тёмной темой посетитель видел тёмный вариант. Теперь тема всегда светлая.

   Их таблицу стилей не переписываем: она подключена как есть, и править
   чужой файл — значит потерять возможность обновить его целиком. Вместо
   этого браузеру сообщается, что страница светлая, а тёмные правила гасятся
   здесь, одним блоком.

   Файл подключается последним, поэтому перекрывает прочие при равной
   специфичности.
   ========================================================================== */

:root,
html {
  color-scheme: light !important;
}

/* Значения взяты из их же светлой темы — вид не меняется, меняется только
   то, что тёмный вариант больше не применяется. */
@media (prefers-color-scheme: dark) {
  :root {
    --v2-chrome-bg: #fff;
    --v2-bg-page: #eeeef0;
    --v2-bg-surface: #fff;
    --v2-bg-light: #f7f7f7;
    --v2-bg-secondary: #f0f0f2;
    --v2-text-primary: #1c2030;
    --v2-text-secondary: #1c2030cc;
    --v2-text-tertiary: #1c203099;
    --v2-text-heading: #262a3f;
    --v2-divider: #a0a1ad52;
    --v2-brand: #0500ff;
  }

  html, body {
    background: #eeeef0 !important;
    color: #1c2030 !important;
  }

  /* Панель */
  .tw-header__inner {
    background: #fff !important;
    border-color: #a0a1ad52 !important;
  }
  .tw-header.is-scrolled .tw-header__inner { background: #fff !important; }

  .tw-menu {
    background: #fff !important;
    box-shadow: 0 16px 48px #090d2126, 0 0 0 1px #a0a1ad52 !important;
  }
  .tw-menu a { color: #1c2030 !important; }
  .tw-menu a:hover { background: #f7f7f7 !important; }
  .tw-menu__trustsend:hover { background: #f7f7f7 !important; }

  .tw-support { color: #1c2030 !important; }
  .tw-cta { background: #f7f7f7 !important; color: #1c2030 !important; }
  .tw-cta:hover { background: #f0f0f2 !important; }
  .tw-globe, .tw-burger { color: #1c2030 !important; }

  /* Список языков */
  .tw-lang__menu {
    background: #fff !important;
    box-shadow: 0 16px 48px #090d2126, 0 0 0 1px #a0a1ad52 !important;
  }
  .tw-lang__item { color: #1c2030 !important; }
  .tw-lang__item:hover { background: #f7f7f7 !important; }
  .tw-lang__item.is-active { background: #eef1ff !important; color: #0500ff !important; }

  /* Мобильное меню */
  .tw-drawer__sheet { background: #fff !important; }
  .tw-drawer__title { color: #262a3f !important; }
  .tw-drawer__x { background: #f0f0f2 !important; color: #1c2030cc !important; }
  .tw-drawer__item { color: #1c2030 !important; }
  .tw-drawer__item:active { background: #f0f0f2 !important; }
  .tw-drawer__label { color: #1c203099 !important; }

  /* Футер */
  .tw-footer { background: #fff !important; }
  .tw-footer__nav h4, .tw-footer__bottom h4 { color: #1c2030 !important; }
  .tw-footer__nav a { color: #1c2030cc !important; }
  .tw-footer__nav a:hover { color: #0500ff !important; }
  .tw-footer__btns a { background: #f7f7f7 !important; color: #1c2030 !important; }
  .tw-footer__social a { background: #f7f7f7 !important; color: #1c2030 !important; }
  .tw-footer__bottom p, .tw-footer__copy { color: #1c203099 !important; }
}

/*
 * Тёмные варианты их разметки гасить не нужно — и попытка это сделать ломала
 * страницы.
 *
 * У них тёмная тема включается классом: правила записаны как
 * `:is(.dark .dark\:text-trustWhite)`, а класс `.dark` на страницу никто не
 * ставит. Значит эти варианты и так не применяются, и трогать их незачем.
 *
 * Здесь стояло `[class*="dark:text-"] { color: inherit !important }` — оно
 * срабатывало на любом элементе, у которого в списке классов есть `dark:…`,
 * и перебивало его обычный цвет. Из-за этого заголовок на синей плашке
 * «Купить криптовалюту» стал тёмным вместо белого.
 */