/* Modo noturno (igual à w1-seesawpg.com).
   Ativo quando <html data-cs-noite="1"> (definido por assets/custom/modo-noturno.js).
   As cores abaixo são as que a base troca no modo noturno (paleta escura neutra). */
:root[data-cs-noite="1"] {
  --skin__accent_2: #EA4E3D !important;
  --skin__accent_2__toRgbString: 234,78,61 !important;
  --skin__accent_4: #C609FF !important;
  --skin__accent_4__toRgbString: 198,9,255 !important;
  --skin__alt_border: #999999 !important;
  --skin__alt_border__toRgbString: 153,153,153 !important;
  --skin__alt_lead: #E3E3E3 !important;
  --skin__alt_lead__toRgbString: 227,227,227 !important;
  --skin__alt_neutral_1: #999999 !important;
  --skin__alt_neutral_1__toRgbString: 153,153,153 !important;
  --skin__alt_neutral_2: #666666 !important;
  --skin__alt_neutral_2__toRgbString: 102,102,102 !important;
  --skin__bg_1: #0A0A0A !important;
  --skin__bg_1__toRgbString: 10,10,10 !important;
  --skin__bg_2: #1A1A1A !important;
  --skin__bg_2__toRgbString: 26,26,26 !important;
  --skin__border: #333333 !important;
  --skin__border__toRgbString: 51,51,51 !important;
  --skin__bs_topnav_bg: #1A1A1A !important;
  --skin__bs_topnav_bg__toRgbString: 26,26,26 !important;
  --skin__bs_zc_an1: #0A0A0A !important;
  --skin__bs_zc_an1__toRgbString: 10,10,10 !important;
  --skin__bs_zc_bg: #1A1A1A !important;
  --skin__bs_zc_bg__toRgbString: 26,26,26 !important;
  --skin__btmnav_def: #999999 !important;
  --skin__btmnav_def__toRgbString: 153,153,153 !important;
  --skin__cards_text: #999999 !important;
  --skin__cards_text__toRgbString: 153,153,153 !important;
  --skin__ddt_bg: #333333 !important;
  --skin__ddt_bg__toRgbString: 51,51,51 !important;
  --skin__ddt_icon: #1A1A1A !important;
  --skin__ddt_icon__toRgbString: 26,26,26 !important;
  --skin__disabled-bg-color__custom: #666666 !important;
  --skin__filter_bg: #1A1A1A !important;
  --skin__filter_bg__toRgbString: 26,26,26 !important;
  --skin__home_bg: #1A1A1A !important;
  --skin__home_bg__toRgbString: 26,26,26 !important;
  --skin__home_db: #0A0A0A !important;
  --skin__home_db__toRgbString: 10,10,10 !important;
  --skin__icon_tg_q: #BEBEBE !important;
  --skin__icon_tg_q__toRgbString: 190,190,190 !important;
  --skin__icon_tg_z: #A8A8A8 !important;
  --skin__icon_tg_z__toRgbString: 168,168,168 !important;
  --skin__kb_bg: #0A0A0A !important;
  --skin__kb_bg__toRgbString: 10,10,10 !important;
  --skin__lead: #E3E3E3 !important;
  --skin__lead__toRgbString: 227,227,227 !important;
  --skin__leftnav_def: #999999 !important;
  --skin__leftnav_def__toRgbString: 153,153,153 !important;
  --skin__neutral_1: #999999 !important;
  --skin__neutral_1__toRgbString: 153,153,153 !important;
  --skin__neutral_2: #666666 !important;
  --skin__neutral_2__toRgbString: 102,102,102 !important;
  --skin__neutral_3: #666666 !important;
  --skin__neutral_3__toRgbString: 102,102,102 !important;
  --skin__table_bg: #0A0A0A !important;
  --skin__table_bg__toRgbString: 10,10,10 !important;
  --skin__tg_accent_1: #CDF2CC !important;
  --skin__tg_accent_1__toRgbString: 205,242,204 !important;
  --skin__tg_accent_3: #FFEECE !important;
  --skin__tg_accent_3__toRgbString: 255,238,206 !important;
  --skin__tg_primary: #CDF5FD !important;
  --skin__tg_primary__toRgbString: 205,245,253 !important;
  --skin__web_bs_yj_bg: #1A1A1A !important;
  --skin__web_bs_yj_bg__toRgbString: 26,26,26 !important;
  --skin__web_bs_zc_an2: #FFFFFF !important;
  --skin__web_bs_zc_an2__toRgbString: 255,255,255 !important;
  --skin__web_btmnav_db: #1E1E1E !important;
  --skin__web_btmnav_db__toRgbString: 30,30,30 !important;
  --skin__web_left_bg_q: #232323 !important;
  --skin__web_left_bg_q__toRgbString: 35,35,35 !important;
  --skin__web_left_bg_z: #262626 !important;
  --skin__web_left_bg_z__toRgbString: 38,38,38 !important;
  --skin__web_load_zz: #33333366 !important;
  --skin__web_plat_line: #333333 !important;
  --skin__web_plat_line__toRgbString: 51,51,51 !important;
  color-scheme: dark;
}

:root[data-cs-noite="1"] body {
  background-color: #0a0a0a;
}

/* ---------- janela "Configurações do modo noturno" ---------- */
.cs-noite-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 0.3rem;
  background: rgba(0, 0, 0, 0.6);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

.cs-noite {
  box-sizing: border-box;
  width: 100%;
  max-width: 6.9rem;
  padding: 0.3rem 0.6rem 0.6rem;
  border: 1px solid var(--skin__border, #034570);
  border-radius: 0.2rem;
  background: var(--skin__bg_2, #002744);
  color: var(--skin__lead, #fff);
  font-size: 0.24rem;
}

.cs-noite__title {
  margin-bottom: 0.3rem;
  color: var(--skin__lead, #fff);
  font-size: 0.34rem;
  text-align: center;
}

.cs-noite__sub {
  margin-bottom: 0.2rem;
  color: var(--skin__neutral_1, #7fb8d2);
  font-size: 0.24rem;
}

.cs-noite__opcoes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.2rem 0.2rem;
}

.cs-noite__opcao {
  display: flex;
  align-items: flex-start;
  gap: 0.12rem;
  color: var(--skin__lead, #fff);
  font-size: 0.24rem;
  line-height: 0.33rem;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.cs-noite__radio {
  position: relative;
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 0.32rem;
  height: 0.32rem;
  margin-top: 0.005rem;
  border: 1px solid var(--skin__border, #034570);
  border-radius: 50%;
}

.cs-noite__opcao.is-on {
  color: var(--skin__primary, #04ccf3);
}

.cs-noite__opcao.is-on .cs-noite__radio {
  border-color: var(--skin__primary, #04ccf3);
  background: var(--skin__primary, #04ccf3);
}

.cs-noite__opcao.is-on .cs-noite__radio::after {
  content: "";
  position: absolute;
  top: 0.06rem;
  left: 0.1rem;
  width: 0.07rem;
  height: 0.13rem;
  border: solid #fff;
  border-width: 0 0.035rem 0.035rem 0;
  transform: rotate(45deg);
}

/* horário programado */
.cs-noite__prog {
  margin-top: 0.3rem;
  padding-top: 0.3rem;
  border-top: 1px solid var(--skin__border, #034570);
}

.cs-noite__prog[hidden] {
  display: none;
}

.cs-noite__horas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.2rem;
}

.cs-noite__hora-linha {
  display: flex;
  align-items: center;
  gap: 0.1rem;
}

.cs-noite__hora-rotulo {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--skin__lead, #fff);
  font-size: 0.24rem;
  line-height: 0.3rem;
}

.cs-noite__sel {
  box-sizing: border-box;
  width: 0.8rem;
  height: 0.5rem;
  padding: 0 0.05rem;
  border: 1px solid var(--skin__border, #034570);
  border-radius: 0.08rem;
  background: transparent;
  color: var(--skin__lead, #fff);
  font-size: 0.24rem;
  text-align: center;
  text-align-last: center;
  -webkit-appearance: none;
  appearance: none;
}

.cs-noite__sel option {
  background: var(--skin__bg_2, #002744);
  color: var(--skin__lead, #fff);
}

.cs-noite__sel.is-vazio {
  color: var(--skin__neutral_2, #5b8fa7);
}

.cs-noite__erro {
  margin-top: 0.08rem;
  color: var(--skin__accent_2, #ff4a4a);
  font-size: 0.24rem;
  line-height: 0.33rem;
}

.cs-noite__erro[hidden] {
  display: none;
}

/* botões */
.cs-noite__botoes {
  display: flex;
  gap: 0.6rem;
  margin-top: 0.4rem;
}

.cs-noite__btn {
  flex: 1 1 0;
  height: 0.8rem;
  border: 1px solid var(--skin__primary, #04ccf3);
  border-radius: 0.1rem;
  background: transparent;
  color: var(--skin__primary, #04ccf3);
  font-size: 0.28rem;
  cursor: pointer;
}

.cs-noite__btn--ok {
  background: var(--skin__primary, #04ccf3);
  color: #fff;
}

.cs-noite__fechar {
  box-sizing: border-box;
  width: 0.6rem;
  height: 0.6rem;
  margin-top: 0.3rem;
  border: 0.04rem solid #fff;
  border-radius: 50%;
  background: transparent;
  color: #fff;
  font-size: 0.36rem;
  line-height: 0.5rem;
  cursor: pointer;
}

/* Barra "Baixar Agora" acima do topo: o front escreve a cor da configuração da marca direto no elemento
   (style="background-color: ..."), que não muda com o tema. No modo noturno usa a cor escura, como na base. */
:root[data-cs-noite="1"] #loadClick,
:root[data-cs-noite="1"] [class*="_top-download_"] {
  background-color: var(--skin__bg_2) !important;
}