.card { box-shadow: 0 0 5px rgba(0,0,0,0.1); }
.countdown { font-size: 1.1em; margin-top: 5px; display: block; }
.usuario-id-box {
  position: fixed;
  top: 10px;
  right: 10px;
  z-index: 9999;
  font-family: monospace;
}

/* === Dark mode overrides === */
body.dark-mode {
  background-color: #0f1113;
  color: #e6e6e6;
}

/* Containers e seções */
body.dark-mode .container,
body.dark-mode .card,
body.dark-mode .table {
  background-color: transparent;
  color: inherit;
}

/* Form controls (inputs, selects, textarea) */
body.dark-mode .form-control,
body.dark-mode .form-select,
body.dark-mode input[type="number"],
body.dark-mode input[type="datetime-local"],
body.dark-mode select {
  background-color: #1f1f1f;
  border-color: #333 !important;
  color: #eaeaea;
  box-shadow: none !important;
}

/* Placeholder */
body.dark-mode .form-control::placeholder {
  color: #9a9a9a;
}

/* Focus */
body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus {
  background-color: #232323;
  color: #fff;
  border-color: #5b9bd5 !important;
  box-shadow: 0 0 0 .15rem rgba(91,155,213,.15) !important;
}

/* Labels e textos do form */
body.dark-mode .form-label,
body.dark-mode .form-check-label,
body.dark-mode label {
  color: #dcdcdc;
}

/* Checkboxes / radios */
body.dark-mode .form-check-input {
  background-color: #111;
  border-color: #444;
  accent-color: #0d6efd; /* muda a cor do checkbox/radio modernamente */
}

/* Alert (infoCriatura) */
body.dark-mode .alert {
  background-color: #232323;
  color: #e6e6e6;
  border-color: #333;
}

/* Botões */
body.dark-mode .btn-primary {
  background-color: #0b5ed7;
  border-color: #0b5ed7;
  color: #fff;
}
body.dark-mode .btn-outline-secondary {
  border-color: #6c757d;
  color: #e6e6e6;
}

/* Dropdowns / menu do grupo */
body.dark-mode .dropdown-menu {
  background-color: #171717;
  border-color: #2b2b2b;
  color: #e6e6e6;
}
body.dark-mode .dropdown-item {
  color: #e6e6e6;
}
body.dark-mode .dropdown-item:hover {
  background-color: #272727;
  color: #fff;
}

/* tenta estilizar options (nem todos os navegadores obedecem) */
body.dark-mode select option {
  background-color: #1f1f1f;
  color: #e6e6e6;
}

/* pequenas correções */
body.dark-mode .bi { filter: none; } /* ícones bootstrap */