.bg-negro-900{
    background-color: #3c3c3c !important;
}

.bg-negro{
    background-color: #282828;
}

.border-amarillo{
    border: 1px solid #f6be1f !important;
}

.border-amarillo:focus{
    box-shadow: none !important;
    border: 2px solid #f6be1f !important;
}

.barra::-webkit-scrollbar, body::-webkit-scrollbar{
    width: 0.4rem;
}

.dataTables_scrollBody::-webkit-scrollbar{
    width: 0.7rem;
    height: 0.7rem;
}

.dataTables_scrollBody::-webkit-scrollbar-track, .barra::-webkit-scrollbar-track, body::-webkit-scrollbar-track{
    background: #313131;
    border-radius: 5px;
    padding: 10px;
}

.dataTables_scrollBody::-webkit-scrollbar-thumb, .barra::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb{
    background: #e3a008;
    border-radius: 5px;
}

.texto-blanco{
    color: #fff !important;
}

.texto-blanco::placeholder{
    color: #fff !important;
}

.select2-results__option--highlighted{
    background: #bd7604 !important;
    color: #fff !important;
}

.text-truncate{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Mejoras para modal: header fijo (sticky) y body scrollable */
.modal-content-flex {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 1rem);
    overflow: hidden;
  }

  .modal-header-sticky {
    position: sticky;
    top: 0;
    z-index: 30; /* mayor que el body scrolleable */
    background: inherit; /* mantener el fondo oscuro del modal */
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
  }

  .modal-body-scroll {
    overflow: auto;
    -webkit-overflow-scrolling: touch; /* smooth scrolling en iOS */
    padding-bottom: 1rem; /* espacio para botones al final */
    max-height: calc(100vh - 6.5rem); /* dejar espacio para header y márgenes */
  }

  /* shadow amarillo */
  .shadow-amarillo {
    box-shadow: 0px 0px 10px #f6be1f;
  }

  /* Ajuste específico para pantallas pequeñas */
  @media (max-width: 640px) {
    .modal-content-flex {
      max-height: calc(100vh - 0.5rem);
    }
    .modal-body-scroll {
      max-height: calc(100vh - 7rem);
    }
  }