.row-bg {
    background-color: #f9fafc;
    border: dashed 1px #DCDFE6;
}

.divider {
    background-color: #DCDFE6;
    position: relative;
}

.divider--vertical {
    display: inline-block;
    width: 1px;
    height: 1em;
    margin: 0 8px;
    vertical-align: middle;
    position: relative;

}

.error-input {
    border: 1px red solid;
}

.active-estado {
    display: inline-block !important;
}

.inactive-estado {
    display: none !important;
}

.display-flex {
    display: flex !important;
}

.display-none {
    display: none !important;
}

.a-bloqueado {
    pointer-events: none;
    cursor: default;
    color: #6c757d; /* Opcional: Cambia el color del icono para mostrar que está desactivado */
}


.span-dropdown {
    width: 22px !important;
    display: inline-table;
}

.cortar-texto{
    text-overflow: ellipsis;
    overflow-x: hidden;
    white-space: nowrap;
}

.pagination{
    justify-content: center;
}

.cpointer {
    cursor: pointer;
}

.inline-element {
    display: inline;
    margin-right: 10px; /* Añade un espacio entre los elementos si lo deseas */
}

.input-group-sm-custom{
    height: calc(1.8125rem + 2px);
}

.circle{
    border-radius: 1rem;
    display: inline-block;
    position: relative;
    margin-right: 0.5rem;
    width: 0.5rem;
    height: 0.5rem;
}

.active-state-green{
    background-color: #67c23a;
}

.active-state-gray{
    background-color: gray;
}

.active-state-red{
    background-color: red;
}

.active-state-orange{
    background-color: #f7aa24;
}

.active-state-green-text{
    color: #67c23a;
}

.active-state-red-text{
    color: red;
}

.active-state-orange-text{
    color: #f7aa24;
}

.active-state-gray-text{
    color: gray;
}

/* Código para cuando hay un solo registro (una sola fila) en la tabla y se muestre bien el menu de configuracion donde sale los item (icono engranaje)*/
.dropdown-one{
    position: inherit !important;
}

.top-50{
    margin-top: 59px !important;
}
/* Fin código de configuación de un solo registro en la lista (tabla index) */

.space-icon {
    font-size: 0.7rem;
    margin-right: 0.4rem;
}

.font-size-7 {
    font-size: 0.7rem;
}

.btn-export {
    background-color: #f7aa24 !important;
    border-color: #f7aa24 !important;
    color: white !important;
}

.table-layout {
    table-layout:fixed;
    width: 100%;
}

.white-space-nowrap {
    white-space: nowrap;
}

.font-weight-400 {
    font-weight:400!important;
}

.text-align-center {
    text-align: center
}

.clear-filter {
    top: 4px; right: 5px; color: red; font-weight: bold;
}

.autorizado {
    width: 0.5rem;
    height: 0.5rem;
    border-radius:1rem;
    display: inline-block;
    position: relative;
    margin-right: 0.5rem;
    background-color: #67c23a;
}

.denegado {
    width: 0.5rem;
    height: 0.5rem;
    border-radius:1rem;
    display: inline-block;
    position: relative;
    margin-right: 0.5rem;
    background-color:red;
}

.display-contents{
    display: contents;
}

.color-606266{
    color:#606266!important;
}

.width-99{
    width: 99%;
}

.btn-modal {
    font-size: 1rem!important;background-color: white;border: 0.1rem solid lightgray;margin: 0rem 0.2rem;padding: 0.5rem 1rem;
}

#modalVisita .modal-dialog {
    max-width: 45% !important;
}

#modalGeneral .modal-dialog {
    max-width: 45% !important;
}

.modal-loading {
    height: 65px; width: 65px
}

.notifyjs-close-btn {
    top: 10px; /* Distancia desde la parte superior */
    left: 10px; /* Distancia desde el borde izquierdo */
    background-color: transparent;
    color: black;
    font-size: 16px;
    cursor: pointer;
    border: none;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.contenedor-alineado {
    display: flex;
    align-items: center; /* Alinea los elementos verticalmente al centro */
    justify-content: end; /* Alinea los elementos horizontalmente a la izquierda */
    gap: 5px; /* Espacio entre el componentes */
}

.form-opmitized {
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

input, .modal {
    pointer-events: auto;  /* Asegúrate de que los eventos de puntero estén habilitados */
}

.icon-check {
    color: #67c23a;
}

.icon-eye, .icon-print, .icon-doble-check, .icon-trash, .icon-pencil {
    color: #909399;
}

.icon-salida, .icon-stop {
    color: #FF0000;
}

.icon-lista-filtro {
    color: #0c7ee2;
}

.icon-eye:hover, .icon-salida:hover, .icon-stop:hover, .icon-check:hover, .icon-print:hover, .icon-lista-filtro:hover, .icon-trash:hover, .icon-pencil:hover {
    color: #374151;
}

.icon-salida-opacity {
    color: #FF0000;
    opacity: 0.4;
}

.icon-lista-filtro-opacity {
    color: #0c7ee2;
    opacity: 0.5;
}

.icon-doble-check-opacity {
    color: #909399;
    opacity: 0.5;
}

.icon-print-opacity {
    color: #909399;
    opacity: 0.5;
}
btn-toggle {
    border: 1px solid #3a8ee6;
    background-color: #ffffff;
    color: #6c757d;
    width: 200px; 
    padding: 10px 30px 
}

.btn-toggle.active {
  background-color: #3a8ee6;
  color: #ffffff;
}

.btn-toggle:not(:last-child) {
  border-right: none;
}

.btn-toggle:focus {
  box-shadow: none;
}

.custom-modal {
    max-width: 70% !important;
}

.btn-separado {
    margin-right: 20px;
}

.font-size-16 {
  font-size: 16px;
}

.select2-selection__choice {
    padding: 0px 2px !important;
}