#adivinhar_palavra {
  display: grid;
  grid-template-columns: auto auto;
  justify-content: space-between;
  align-items: start;
}

#adivinhar_palavra>div {
  width: fit-content;
  margin-bottom: 5px;
  padding-bottom: 5px;
}

@media (max-width: 1317px) {
  #adivinhar_palavra {
    grid-template-columns: 1fr;
  }
}

div:has(>#tabela_tentativas, >div>#bt_sortear_palavra) {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

#outros_atalhos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0 15px;
}

div:has(>#input_tentativa, >div>#quant_caract, >div>#input_criar_jogo),
#quant_caract,
#quant_consoa,
#quant_vogais {
  display: flex;
  align-items: center;
  gap: 0 5px;
}

@media (max-width: 507px) {
  div:has(>div>#input_criar_jogo) {
    display: block;
    text-align: center;
  }
}

div.tentativas_acima {
  justify-content: flex-start;
}

div.tentativas_acima>table {
  order: 2;
}

div.tentativas_acima>div {
  order: 1;
}

#tabela_tentativas,
#tabela_alfabeto {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#tabela_tentativas tr:hover td.hover_negr,
#tabela_alfabeto tr:hover th:first-child,
th.palavra_formada:not([data-valor="*"]) {
  font-weight: bold;
}


#tabela_tentativas th,
#tabela_tentativas td,
#tabela_alfabeto th,
#tabela_alfabeto td {
  width: 20px;
  text-align: center;
  vertical-align: middle;
}

#tabela_alfabeto tr:nth-child(1) th:not(.palavra_formada, .celula_vazia),
#tabela_alfabeto tr:nth-child(5) th,
#tabela_alfabeto tr:nth-child(9) th,
#tabela_alfabeto tr:nth-child(15) th,
#tabela_alfabeto tr:nth-child(21) th,
#tabela_alfabeto tr:nth-child(1) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(5) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(9) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(15) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(21) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo) {
  background-color: yellowgreen;
  color: var(--cor_texto_fix);
}

/* #tabela_alfabeto tr:nth-child(8) th,
#tabela_alfabeto tr:nth-child(12) th,
#tabela_alfabeto tr:nth-child(18) th,
#tabela_alfabeto tr:nth-child(19) th,
#tabela_alfabeto tr:nth-child(8) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(12) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(18) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo),
#tabela_alfabeto tr:nth-child(19) td:not(.cor_errado, .cor_certo, .cor_confusao, .cor_duvida_errado, .cor_duvida_certo) {
  background-color: khaki;
} */

#tabela_tentativas th:not(.celula_vazia, .col_atual),
#tabela_tentativas tr:not(:last-child) td:not(.celula_vazia, .col_atual),
#tabela_alfabeto th:not(.celula_vazia, .col_atual),
#tabela_alfabeto td:not(.celula_vazia, .col_atual) {
  border-top: 1px solid darkgray;
  border-bottom: 1px solid darkgray;
  border-left: 1px solid darkgray;
}

#tabela_tentativas th:not(.celula_vazia, .col_atual, .ult_caract),
#tabela_tentativas tr:not(:last-child) td:not(.celula_vazia, .col_atual, .ult_caract),
#tabela_alfabeto th:not(.celula_vazia, .col_atual, .ult_caract),
#tabela_alfabeto td:not(.celula_vazia, .col_atual, .ult_caract) {
  border-right: 1px solid darkgray;
}

th.col_atual {
  border-top: 2px solid black;
  border-bottom: 1px solid darkgray;
}

th.col_atual,
td.col_atual {
  border-left: 2px solid black;
  border-right: 2px solid black;
}

#tabela_tentativas tr:nth-last-child(2) td.col_atual,
#tabela_alfabeto tr:last-child td.col_atual {
  border-top: 1px solid darkgray;
  border-bottom: 2px solid black;
}

#tabela_tentativas tr:not(:last-child, :nth-last-child(2)) td.col_atual,
#tabela_alfabeto tr:not(:last-child) td.col_atual {
  border-top: 1px solid darkgray;
  border-bottom: 1px solid darkgray;
}

th.celula_vazia {
  border-top: 2px solid transparent;
}

#tabela_alfabeto tr:last-child td:not(.col_atual).celula_vazia {
  border-bottom: 3px solid transparent;
}

th.palavra_formada,
th.col_n_tent,
span.move_abaixo,
span.move_acima,
th.celula_letra,
td.celula_letra,
td.marcar_linha,
td.marcar_coluna {
  cursor: pointer;
}

td.col_n_tent {
  font-size: 0.75em;
}

tr:not(:nth-last-child(2))>td.col_n_tent {
  cursor: crosshair;
}

td.formada {
  color: gray;
}

th.ult_caract:not(.col_atual),
td.ult_caract:not(.col_atual) {
  border-right: 2px dashed gray;
}

#input_tentativa {
  flex: 1;
}

#letra_posicao>input,
#possui_letra>input {
  width: 35px;
}

button {
  padding: 0 2px;
}

#bt_marcar_auto,
#bt_marcar_coluna_certa,
#bt_marcar_zero_acertos,
#bt_marcar_sobras {
  width: 50px;
  text-align: left;
}

#quant_caract>button,
#quant_consoa>button,
#quant_vogais>button {
  width: 170px;
  text-align: left;
}