html {
    --montanha-black-theme-contrast: 1;
}

/* Tema preto: elimina as caixas visuais que não aparecem nos temas azul e vinho. */
#app .van-tabs__wrap:has(.wh1navTab) {
    border-bottom: 0 !important;
    box-shadow: none !important;
}

#app .tabbar-UME5K {
    background: var(--cms-background-color-primary, #212227) !important;
    background-color: var(--cms-background-color-primary, #212227) !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/*
 * Contraste do tema preto.
 * O pacote original usa texto preto em alguns blocos que também ficam pretos
 * nesta pele. Os seletores abaixo são limitados às telas afetadas e não mudam
 * fundos, cores de destaque ou o tema roxo.
 */
#app [class*="notice"] p,
#app [class*="notice"] span,
#app [class*="announce"] p,
#app [class*="announce"] span,
#app [class*="marquee"] p,
#app [class*="marquee"] span,
#app [class*="broadcast"] p,
#app [class*="broadcast"] span {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

/* Central de mensagens / suporte. */
#app [class*="customer"] p,
#app [class*="customer"] span:not([class*="icon"]),
#app [class*="service"] p,
#app [class*="service"] span:not([class*="icon"]),
#app [class*="support"] p,
#app [class*="support"] span:not([class*="icon"]),
#app [class*="message"] p,
#app [class*="message"] span:not([class*="icon"]) {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

/* Login e cadastro: rótulos, textos auxiliares e conteúdo dos campos. */
#app .van-popup [class*="login"] label,
#app .van-popup [class*="login"] p,
#app .van-popup [class*="login"] input,
#app .van-popup [class*="register"] label,
#app .van-popup [class*="register"] p,
#app .van-popup [class*="register"] input,
#app [class*="loginPopup"] label,
#app [class*="loginPopup"] p,
#app [class*="loginPopup"] input,
#app [class*="registerPopup"] label,
#app [class*="registerPopup"] p,
#app [class*="registerPopup"] input {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

#app .van-popup input::placeholder,
#app [class*="login"] input::placeholder,
#app [class*="register"] input::placeholder {
    color: #c9c9c9 !important;
    -webkit-text-fill-color: #c9c9c9 !important;
    opacity: 1 !important;
}

/* Textos comuns dentro do modal, sem alterar os botões amarelos. */
#app .van-popup [class*="field"] span:not([class*="icon"]),
#app .van-popup [class*="form"] label,
#app .van-popup [class*="form"] p,
#app .van-popup [class*="agreement"] span,
#app .van-popup [class*="terms"] span {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

/* Marcado automaticamente apenas quando texto e fundo são ambos escuros. */
#app .montanha-black-low-contrast {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

#app .montanha-black-muted-contrast {
    color: #d7d7d7 !important;
    -webkit-text-fill-color: #d7d7d7 !important;
}

#app .van-tab:not(.van-tab--active) .wh1navTab,
#app .van-tab:not(.van-tab--active) .wh1navTab * {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

#app .tabbar-leftMenu-item-kEUbE:not(.tabbar-active-kbSWf),
#app .tabbar-leftMenu-item-kEUbE:not(.tabbar-active-kbSWf) .tabbar-leftMenu-item-text-AcsQ8,
#app .tabbar-item-Dc5ll:not(.tabbar-active-kbSWf) .tabbar-item-text-W4NOD {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Classes reais do aviso que é remontado pelo aplicativo após o carregamento. */
#app .van-notice-bar,
#app .van-notice-bar__content,
#app .van-notice-bar__content span,
#app [class*="notice" i] [class*="content" i],
#app [class*="marquee" i] [class*="content" i] {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

/* Classes reais dos formulários de Login/Registro. */
#app [class*="form-box-form" i],
#app [class*="form-box-form" i] label,
#app [class*="form-box-form" i] p,
#app [class*="form-box-form" i] span:not([class*="icon" i]),
#app [class*="loginAccount" i] p,
#app [class*="loginAccount" i] span:not([class*="icon" i]),
#app [class*="loginAccount" i] label,
#app [class*="passwordStrength" i],
#app [class*="form-box-form-select-info" i] {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

#app input,
#app textarea {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    caret-color: #f5f5f5 !important;
}

#app input::placeholder,
#app textarea::placeholder {
    color: #cfcfcf !important;
    -webkit-text-fill-color: #cfcfcf !important;
    opacity: 1 !important;
}

/* Textos descritivos da Central de mensagens. */
#app [class*="customer" i] p,
#app [class*="customer" i] span:not([class*="icon" i]),
#app [class*="service" i] p,
#app [class*="service" i] span:not([class*="icon" i]),
#app [class*="support" i] p,
#app [class*="support" i] span:not([class*="icon" i]) {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

/*
 * Componentes que chegam depois do primeiro carregamento (rotas lazy-loaded).
 * As classes têm um sufixo gerado a cada compilação, então usamos a parte
 * estável do nome. A regra não alcança botões, preservando o texto escuro nos
 * botões amarelos.
 */
#app .van-notice-bar *,
#app [class*="ctmer-info-des-" i] > div:not(:last-child),
#app [class*="ctmer-list-item-info-" i],
#app [class*="ctmer-list-item-info-" i] *,
#app [class*="customer-con-" i] [class*="info-" i]:not([class*="btn" i]),
#app [class*="customer-con-" i] [class*="info-" i]:not([class*="btn" i]) *,
#app [class*="form-box-form-" i] label,
#app [class*="form-box-form-" i] p,
#app [class*="form-box-form-" i] input,
#app [class*="form-box-form-label-" i],
#app [class*="loginAccount-text-" i],
#app [class*="loginAccount-text-" i] *,
#app [class*="loginAccount-text1-" i],
#app [class*="loginAccount-text1-" i] *,
#app [class*="loginAccount-agreement-" i],
#app [class*="loginAccount-agreement-" i] span,
#app [class*="passwordStrength-" i] {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

#app [class*="form-box-form-input-" i] input,
#app [class*="form-box-form-input-" i] input::placeholder,
#app [class*="loginAccount-" i] input,
#app [class*="loginAccount-" i] input::placeholder {
    color: #d7d7d7 !important;
    -webkit-text-fill-color: #d7d7d7 !important;
    opacity: 1 !important;
}

/*
 * Os modais são movidos pelo Vue para fora de #app em alguns navegadores.
 * Estas regras cobrem o conteúdo teleportado sem alterar os botões dourados.
 */
body .van-popup [class*="form-box-form-label-" i],
body .van-popup [class*="form-box-form-label-" i] span,
body .van-popup [class*="passwordStrength-" i],
body .van-popup [class*="loginAccount-text-" i],
body .van-popup [class*="loginAccount-text-" i] span,
body .van-popup [class*="loginAccount-text1-" i],
body .van-popup [class*="loginAccount-text1-" i] span {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

body .van-popup [class*="form-box-form-input-" i] input,
body .van-popup [class*="form-box-form-input-" i] input::placeholder,
body .van-popup input,
body .van-popup input::placeholder {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    opacity: 1 !important;
}

/* Variante do formulário usada no login atual (form-select em vez de form-input). */
#app [class*="form-box-form-select-" i],
body [class*="form-box-form-select-" i] {
    --cms-text-color-primary: #f5f5f5;
    --cms-text-color-secondary: #f5f5f5;
    --cms-mango-text-color4: #f5f5f5;
}

#app [class*="form-box-form-select-" i] input,
#app [class*="form-box-form-select-" i] input::placeholder,
#app [class*="form-box-form-select-" i] input::-webkit-input-placeholder,
body [class*="form-box-form-select-" i] input,
body [class*="form-box-form-select-" i] input::placeholder,
body [class*="form-box-form-select-" i] input::-webkit-input-placeholder {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    opacity: 1 !important;
}

/* Cadastro também é teleportado para fora de #app e não usa .van-popup. */
body [class*="form-box-form-input-" i] input,
body [class*="form-box-form-input-" i] input::placeholder,
body [class*="form-box-form-input-" i] input::-webkit-input-placeholder,
body [class*="form-box-form-label-" i],
body [class*="form-box-form-label-" i] span,
body [class*="passwordStrength-" i],
body [class*="loginAccount-text-" i],
body [class*="loginAccount-text-" i] span,
body [class*="loginAccount-text1-" i],
body [class*="loginAccount-text1-" i] span {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

body [class*="form-box-form-input-" i] input::placeholder,
body [class*="form-box-form-input-" i] input::-webkit-input-placeholder {
    opacity: 1 !important;
}

/* Ícones à esquerda dos campos no mesmo branco da plataforma de referência. */
body [class*="form-box-form-select-" i] [class*="form-box-form-icon-" i]:not([class*="form-box-form-icon-close-" i]),
body [class*="form-box-form-input-" i] [class*="form-box-form-icon-" i]:not([class*="form-box-form-icon-close-" i]),
body [class*="form-box-form-select-" i] [class*="form-box-form-icon-" i]:not([class*="form-box-form-icon-close-" i]) svg,
body [class*="form-box-form-input-" i] [class*="form-box-form-icon-" i]:not([class*="form-box-form-icon-close-" i]) svg {
    color: #ffffff !important;
    fill: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Ícone da aba Login quando ela está inativa. */
body .van-tab:not(.van-tab--active) .RentryTabsNav .svg-icon-UPCeJ,
body .van-tab:not(.van-tab--active) .RentryTabsNav .svg-icon-UPCeJ svg,
body .van-tab:not(.van-tab--active) .RentryTabsNav .svg-icon-UPCeJ svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}

/* Dicas dos campos com contraste mais suave que o texto digitado. */
body [class*="form-box-form-select-" i] input::placeholder,
body [class*="form-box-form-select-" i] input::-webkit-input-placeholder,
body [class*="form-box-form-input-" i] input::placeholder,
body [class*="form-box-form-input-" i] input::-webkit-input-placeholder {
    color: #b8b8b8 !important;
    -webkit-text-fill-color: #b8b8b8 !important;
    opacity: 1 !important;
}

/* Campos com a mesma borda cinza da plataforma de referência. */
body [class*="form-box-form-select-" i],
body [class*="form-box-form-input-" i] {
    border-color: #4a4a4a !important;
}

/* Barras vazias da força da senha iguais à referência. */
body [class*="passwordStrength-top-" i] i.default {
    background: #262626 !important;
    background-color: #262626 !important;
}

/* Menu inferior: ícones inativos brancos; Início ativo continua dourado. */
#app .tabbar-item-Dc5ll:not(.tabbar-active-kbSWf) .tabbar-item-svg-grnAx {
    color: #ffffff !important;
    --cms-text-color-secondary: #ffffff;
    --cms-primary-color: #ffffff;
}

#app .tabbar-item-Dc5ll:not(.tabbar-active-kbSWf) .tabbar-item-svg-grnAx svg,
#app .tabbar-item-Dc5ll:not(.tabbar-active-kbSWf) .tabbar-item-svg-grnAx svg * {
    color: #ffffff !important;
}

/* Título do aviso de atualização na mesma cor dourada de Início. */
body [class*="opear-wrap-tit-" i] {
    color: #e7a707 !important;
    -webkit-text-fill-color: #e7a707 !important;
}

/* Menus da página inicial: mantém o ativo dourado e clareia os demais. */
#app .van-tab:not(.van-tab--active) .wh1navTab,
#app .van-tab:not(.van-tab--active) .wh1navTab *,
#app .van-tab:not(.van-tab--active) [class*="game-tabItem-name-" i],
#app .tabbar-leftMenu-item-kEUbE:not(.tabbar-active-kbSWf) [class*="text" i],
#app .tabbar-item-Dc5ll:not(.tabbar-active-kbSWf) [class*="text" i] {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}