/* DataTables + panel AG — controles bien visibles */
div.dt-container {
  margin-top: 0.5rem;
}
div.dt-container .dt-layout-row:first-child {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
  padding: 0.65rem 0.75rem;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.5rem;
}
div.dt-container .dt-search label {
  font-weight: 600;
  color: #212529;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
}
div.dt-container .dt-search input {
  min-width: 220px;
  border-radius: 0.375rem;
  border: 1px solid #86b7fe;
  padding: 0.45rem 0.75rem;
  background: #fff;
  box-shadow: 0 0 0 0.15rem rgba(13, 110, 253, 0.12);
}
div.dt-container .dt-length {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
div.dt-container .dt-length label {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0;
  white-space: nowrap;
}
/* Una sola flecha: ocultar nativa + la de DataTables/Bootstrap y poner una sola */
div.dt-container .dt-length select,
div.dt-container select.dt-input {
  border-radius: 0.375rem;
  border: 1px solid #ced4da;
  padding: 0.4rem 1.85rem 0.4rem 0.65rem;
  min-width: 4.75rem;
  line-height: 1.4;
  color: #212529;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3E%3Cpath fill='%236c757d' d='M4.6 6.2L8 9.6l3.4-3.4 1.2 1.2L8 12 3.4 7.4z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 0.55rem center !important;
  background-size: 12px 12px !important;
}
table.dataTable thead th {
  cursor: pointer;
  white-space: nowrap;
  user-select: none;
}
table.dataTable thead th.dt-orderable-none {
  cursor: default;
}
table.dataTable thead th .dt-column-order {
  opacity: 0.55;
}