/* Estilo para o formulário de perfil do usuário */
.wx4-login-usuario-profile-form,
.wx4-login-regra-profile-form  {
  max-width: 900px !important;
  margin: 20px auto !important;
  padding: 20px !important;
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  background-color: #f9f9f9 !important;
}

.wx4-include-user-popup, .wx4-user-list-ajax, .wx4-regra-list, .wx4-regra-list-ajax {
  max-width: 900px !important;
  margin: 20px auto !important;
  padding: 0px 20px;
  border: 0px solid #ccc !important;
  border-radius: 5px !important;
  background-color: #f9f9f9 !important;
}
.wx4-login-usuario-profile-form label {
  display: block !important;
  margin-bottom: 10px;
  font-style: normal !important;
}

.wx4-login-usuario-button-save{
  background-color: #28a745 !important;
}
.wx4-login-usuario-button-cancel,
.wx4-login-usuario-button-cancelar {
  background-color: #dc3545 !important;
}

.wx4-login-usuario-profile-form input[type="text"],
.wx4-login-usuario-profile-form input[type="password"], 
.wx4-login-usuario-profile-form input[type="email"]{
  width: 100% !important;
  padding: 10px !important;
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  margin-bottom: 20px !important;
}

.wx4-login-usuario-profile-form input[type="submit"],
.wx4-login-usuario-button-cancel,
.wx4-login-usuario-button-cancelar,
button#wx4-login-usuario-edit-profile-button {
  padding: 10px 20px !important;
  border: none !important;
  border-radius: 5px !important;
  color: #fff !important;
  cursor: pointer !important;
  line-height: 1.5 !important;
}

.wx4-login-usuario-profile-form input[type="submit"]:hover,
button#wx4-login-usuario-edit-profile-button:hover {
  background-color: #0056b3 !important;
}

.wx4-login-usuario-button-editar{
  background-color: #007bff !important;
  color: #fff !important;
}
.wx4-login-usuario-profile-form button,
button#wx4-login-usuario-edit-profile-button,
.wx4-login-usuario-button-cancel,
.wx4-login-usuario-profile-form input[type="submit"]  {
  margin-right: 10px !important;
}

.wx4-user-list, .wx4-regra-list {
  max-width: 900px !important;
  margin: 20px auto !important;
  padding: 20px;
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  background-color: #f9f9f9 !important;
}

.wx4-regra-list thead {
  font-weight: bold;
}
.wx4-include-regra-popup-title,
.wx4-edit-regra-popup-title,
.wx4-edit-permissoes-popup-title,
.wx4-regra-list h2 em,
.wx4-regras-list-h2 em {
  font-style: normal !important;
  vertical-align: middle;
}
.wx4-regras-list-h2 {
  margin-bottom: 10px; /* Ajuste a margem inferior conforme necessário */
}

.wx4-regras-list-hr {
  border: none;
  border-top: 1px solid #ccc; /* Define a cor e espessura da linha */
  margin: 10px 0; /* Define a margem superior e inferior da linha */
  margin-bottom: 20px !important;
}

.wx4-regra-list td {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

.wx4-user-list thead {
  font-weight: bold;
}

.wx4-user-list td {
  padding: 10px;
  border-bottom: 1px solid #ccc;
}

#wx4-include-user-button, 
#wx4-include-regra-button {
  display: inline-block;
  margin-right: 0px;
  margin-bottom: 20px;
  padding: 6px 10px;
  background-color: #007bff;
  color: #fff;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  font-size: 10px;
}

#wx4-include-user-button:hover,
#wx4-include-regra-button:hover {
  background-color: #0056b3;
}

.wx4-login-usuario-button-editar,
.wx4-login-usuario-button-excluir,
.wx4-login-regra-button-editar,
.wx4-login-usuario-button-min-excluir-regras {
  margin-right: 10px;
  padding: 5px 10px;
  border: none;
  border-radius: 5px;
  color: #fff;
  cursor: pointer;
}

.wx4-login-usuario-button-editar,
.wx4-login-usuario-button-editar-regras,
.wx4-login-usuario-button-editar-permissoes {
  background-color: #007bff !important;
}

.wx4-login-usuario-button-editar:hover,
.wx4-login-usuario-button-editar-regras:hover,
.wx4-login-usuario-button-editar-permissoes:hover {
  background-color: #0056b3 !important;
}

.wx4-login-usuario-button-excluir,
.wx4-login-usuario-button-min-excluir-regras {
  background-color: #dc3545 !important;
}

.wx4-login-usuario-button-excluir:hover,
.wx4-login-usuario-button-min-excluir-regras:hover {
  background-color: #c82333 !important;
}
.wx4-login-usuario-button-min-editar,
.wx4-login-usuario-button-min-excluir,
.wx4-login-usuario-button-min-editar-regras,
.wx4-login-usuario-button-min-excluir-regras,
.wx4-login-usuario-button-min-editar-permissoes,
.wx4-include-regra-select-imagem,
.wx4-edit-regra-select-imagem {
  margin-right: 0px !important;
  padding: 4px 8px !important;
  border: none !important;
  border-radius: 5px !important;
  color: #fff !important;
  cursor: pointer !important;
  font-size: 8px !important;
}
.wx4-login-usuario-button-min-editar-regras{
  margin-right: 4px !important;
}
.wx4-login-usuario-button-acoes,
.wx4-login-regra-button-acoes {
  width: 160px !important;
}
.wx4-login-usuario-button-acoes-td,
.wx4-login-regra-button-acoes-td {
  text-align: center;
}
.wx4-login-usuario-button-min-editar,
.wx4-login-usuario-button-min-editar-permissoes,
.wx4-login-usuario-button-min-editar-regras,
.wx4-include-regra-select-imagem,
.wx4-edit-regra-select-imagem {
  background-color: #007bff !important;
}
.wx4-login-usuario-button-min-excluir,
.wx4-login-usuario-button-min-excluir-regras {
  background-color: #dc3545 !important;
}
.wx4-login-usuario-button-min-editar:hover,
.wx4-login-usuario-button-min-editar-regras:hover,
.wx4-include-regra-select-imagem:hover,
.wx4-edit-regra-select-imagem:hover {
  background-color: #0056b3 !important;
}
.wx4-login-usuario-button-min-excluir:hover,
.wx4-login-usuario-button-min-excluir-regras:hover { 
  background-color: #c82333 !important;
}

.wx4-login-regras th,
.wx4-login-regras td, 
.wx4-login-regras-table th,
.wx4-login-regras-table td{
  font-style: normal;
  vertical-align: middle;
  padding: 2px 10px 2px 10px;
}
.wx4-login-regras th, 
.wx4-login-regras thead,
.wx4-login-regras-table th,
.wx4-login-regras-table thead,
#wx4-edit-permissoes-username,
#wx4-edit-permissoes-useremail{
  font-style: normal;
  vertical-align: middle;
}

.wx4-login-regras-table{
background-color: transparent;
width: 70%;
-webkit-margin-after: 15px;
margin-block-end: 15px;
font-size: .8em;
border-spacing: 0;
border-collapse: collapse;
}
.wx4-login-regras-table-th-permissao{
  width: 10%;
}
/* Estilizando a chave on/off */
.wx4-permissoes-switch {
  position: relative;
  display: inline-block;
  width: 38px; /* diminuindo o tamanho do switch */
  height: 19px; /* diminuindo o tamanho do switch */
  margin-bottom: 0px !important;
}

.wx4-permissoes-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.wx4-permissoes-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.wx4-permissoes-slider:before {
  position: absolute;
  content: "";
  height: 15px; /* diminuindo o tamanho do switch */
  width: 15px; /* diminuindo o tamanho do switch */
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .wx4-permissoes-slider {
  background-color: #2196F3;
}

input:focus + .wx4-permissoes-slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .wx4-permissoes-slider:before {
  -webkit-transform: translateX(18px);
  -ms-transform: translateX(18px);
  transform: translateX(18px);
}

/* Rounded sliders */
.wx4-permissoes-slider.wx4-permissoes-round {
  border-radius: 22px;
}

.wx4-permissoes-slider.wx4-permissoes-round:before {
  border-radius: 50%;
}


/* Alinhando a chave on/off vertical e horizontalmente */
.wx4-permissoes-switch-cell {
  justify-content: center;
  align-items: center;
  padding: 0px 23px !important;
}
.wx4-regras-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wx4-regras-list li {
  margin-bottom: 10px;
}

.wx4-regras-list li a {
  color: #333;
  text-decoration: none;
  font-style: normal;
    
}

.wx4-regras-list li a:hover {
  text-decoration: underline;
}
#wx4-include-regra-icone-size,
#wx4-edit-regra-icone-size {
  width: 25% !important;
  padding: 3px !important;
  border: 1px solid #ccc !important;
  border-radius: 5px !important;
  margin-bottom: 20px !important;
  margin-right: 3px;
}
.wx4-include-regra-icone-size-wrapper,
.wx4-edit-regra-icone-size-wrapper {
  display: inline-flex;
}
.wx4-include-regra-tamanho-icone,
.wx4-edit-regra-tamanho-icone{
    width: 100% !important;
    margin-top: 15px;
    font-size: 12px;
}