body {
  background: #0b1220;
}

.app-shell {
  min-height: 100%;
  background:
    radial-gradient(1000px 600px at 10% -10%, #2dd4bf22, transparent 60%),
    radial-gradient(1000px 600px at 100% 0%, #60a5fa22, transparent 60%),
    #0b1220;
}

.glass {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(10px);
  border-radius: 16px;
}

.muted {
  color: rgba(255, 255, 255, 0.65);
}

.money {
  font-variant-numeric: tabular-nums;
}

.table-darkish {
  color: rgba(255, 255, 255, 0.85);
}

.table-darkish thead {
  color: rgba(255, 255, 255, 0.95);
}

.table > :not(caption) > * > * {
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.btn-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.sticky {
  position: sticky;
  top: 1rem;
}

.badge-soft-success {
  background: rgba(16, 185, 129, 0.15);
  color: #34d399;
  border: 1px solid rgba(16, 185, 129, 0.25);
}

.badge-soft-danger {
  background: rgba(239, 68, 68, 0.15);
  color: #fb7185;
  border: 1px solid rgba(239, 68, 68, 0.25);
}

/* Inputs en tema oscuro */
.form-control,
.form-select {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.form-control:focus,
.form-select:focus {
  border-color: rgba(96, 165, 250, 0.7) !important;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.15) !important;
}

/* IMPORTANT: color del desplegable (options) */
.form-select option {
  background-color: #0b1220 !important;
  color: #fff !important;
}

/* Placeholder option (Seleccione...) */
.form-select option[value=""] {
  color: rgba(255, 255, 255, 0.65) !important;
}

/* Input group dark (prefijo $) */
.input-group-text {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.8) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.input-group .form-control {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.input-group .form-control:focus,
.input-group-text:focus {
  border-color: rgba(96, 165, 250, 0.7) !important;
  box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.15) !important;
}

/* ===== Modales dark ===== */
.modal-content {
  background: #0b1220 !important;
  color: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 16px !important;
}

.modal-header,
.modal-footer {
  border-color: rgba(255, 255, 255, 0.1) !important;
}

.modal .form-control,
.modal .form-select,
.modal .input-group-text {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

/* opciones del select dentro del modal */
.modal .form-select option {
  background-color: #0b1220 !important;
  color: #fff !important;
}

/* X (btn-close) en blanco */
.modal .btn-close {
  filter: invert(1) grayscale(100%);
  opacity: 0.9;
}

.modal .btn-close:hover {
  opacity: 1;
}

/* Texto general DataTables */
.dataTables_wrapper {
  color: #cbd5e1 !important;
}

/* Label mostrar registros */
.dataTables_length label,
.dataTables_filter label,
.dataTables_info {
  color: #cbd5e1 !important;
}

/* Select y buscador */
.dataTables_wrapper .form-select,
.dataTables_wrapper .form-control {
  background-color: #1e293b !important;
  color: #fff !important;
  border: 1px solid #334155 !important;
}

/* Paginación */
.dataTables_wrapper .page-link {
  background-color: #1e293b;
  color: #cbd5e1;
  border: 1px solid #334155;
}

.dataTables_wrapper .page-item.active .page-link {
  background-color: #2563eb;
  border-color: #2563eb;
  color: #fff;
}

.table-darkee {
  --bs-table-striped-bg: #2c3034;
  --bs-table-striped-color: #fff;
  --bs-table-active-bg: #373b3e;
  --bs-table-active-color: #fff;
  --bs-table-hover-bg: #323539;
  --bs-table-hover-color: #fff;
  color: #fff;
  border-color: #373b3e;
}