/*----------------------------------------cambiar colores en el template-------------------------------------------------------*/
.btn-primary {
    --bs-btn-color: #000000 !important;
    --bs-btn-bg: #344e71 !important;
    --bs-btn-border-color: #344e71 !important;
    --bs-btn-hover-color: #000000 !important;
    --bs-btn-hover-bg: #59769e !important;
    --bs-btn-hover-border-color: #59769e !important;
    --bs-btn-focus-shadow-rgb: 23, 112, 217 !important;
    --bs-btn-active-color: #000000;
    --bs-btn-active-bg: #59769e !important;
    --bs-btn-active-border-color: #59769e !important;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #000000;
    --bs-btn-disabled-bg: #344e71 !important;
    --bs-btn-disabled-border-color: #344e71 !important;
}

[data-bs-theme=light] {
    --bs-page-bg: #F9F9F9;
    --bs-app-blank-bg: #ffffff;
    --bs-header-bg-color: #ffffff;
    --bs-header-border-bottom: 0;
    --bs-header-box-shadow: 0px 10px 30px 0px rgba(82, 63, 105, 0.05);
    --bs-footer-bg-color: #ffffff;
    --bs-header-default-border: 1px solid #F1F1F4;
    --bs-header-default-bg-color: #344e71;
    --bs-sidebar-default-bg-color: #59769e !important;
    --bs-primary: #344e71 !important;
    --bs-btn-hover-bg: #59769e !important;
    --bs-primary-active: #59769e;
    --bs-text-primary: #59769e !important;
    --bs-menu-link-color-active: #59769e !important;
    
    --bs-read-only-form-control-bg: #FCFCFC;
    --bs-readonly-bg: #FDFDFD;

    --bs-primary-rgb:52,78,113
}

[data-bs-theme=dark] {
    --bs-page-bg: #0F1014;
    --bs-app-blank-bg: #0F1014;
    --bs-header-default-bg-color: #0F1014;
    --bs-header-default-border: 1px solid #1E2027;
    --bs-header-fixed-bg-color: #1E1E2D;
    --bs-header-fixed-box-shadow: none;
    --bs-toolbar-bg-color: #0F1014;
    --bs-toolbar-box-shadow: none;
    --bs-toolbar-border: 1px solid #1E2027;
    --bs-aside-bg-color: #090A0D;
    --bs-aside-logo-bg-color: #090A0D;
    --bs-aside-box-shadow: none;
    --bs-footer-bg-color: #0F1014;
    --bs-sidebar-default-bg-color: #0F1014;
    --bs-primary-active: #59769e;
    --bs-primary: #344e71;
    --bs-text-primary: #59769e !important;
    --bs-menu-link-color-active: #59769e !important;

    --bs-read-only-form-control-bg: #0F1014;
    --bs-readonly-bg: #1A1B20;

}

.login1 input[type=email], input[type=password], input[type=text] {
    display: block;
    width: 100%;
    padding: 0.775rem 1rem;
    font-size: 1.1rem;
    font-weight: 500;
    line-height: 1.5;
    color: var(--bs-gray-700);
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: 1px solid var(--bs-gray-300);
    appearance: none;
    border-radius: 0.475rem;
    box-shadow: false;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.login1 label[for="id_email"], label[for="id_login"], label[for="id_password"], label[for="id_password"] {
    display: none !important;
}

.table:not(.table-bordered) td:last-child, .table:not(.table-bordered) th:last-child, .table:not(.table-bordered) tr:last-child {
    border-top-right-radius: 0.475rem !important;
    border-bottom-right-radius: 0.475rem !important;
}

.table:not(.table-bordered) td:first-child, .table:not(.table-bordered) th:first-child, .table:not(.table-bordered) tr:first-child {
    border-top-left-radius: 0.475rem !important;
    border-bottom-left-radius: 0.475rem !important;
    padding-left: 1rem !important;
}

.form-inline {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    gap: 5px;
}

/* Add responsiveness - display the form controls vertically instead of horizontally on screens that are less than 800px wide */
@media (max-width: 800px) {
    .form-inline {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }
}

#div_id_name, #div_id_user_type {
    margin-right: 5px;
}

body:not([data-kt-app-toolbar-fixed=true]) .app-toolbar {
    background-color: transparent;
}

@media (min-width: 992px) {
    .header-fixed .header {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        z-index: 100;
        background-color: var(--bs-header-default-bg-color);
        height: 65px;
        padding: 0;
    }
}

body:not([data-kt-app-toolbar-fixed=true]) .app-toolbar {
    background-color: var(--bs-header-default-bg-color);
}

[data-kt-app-layout=dark-sidebar] .app-sidebar {
    background-color: var(--bs-sidebar-default-bg-color);
    border-right: 0;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-title {
    color: #ffffff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon .svg-icon, [data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon i {
    color: #ffffff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-arrow:after {
    background-color: #ffffff !important;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
    background-color: #344e71;
    color: #f5f5f5;
}


a {
    color: var(--bs-link-color), var(--bs-link-opacity, 1);
    text-decoration: none;
}

[data-kt-app-layout=dark-sidebar] .app-sidebar .app-sidebar-logo {
    border-bottom: 1px dashed #ffffff;
}

.text-primary {
    color: var(--bs-text-primary) !important;
}

.menu-state-color .menu-item .menu-link.active .menu-title {
    color: var(--bs-menu-link-color-active);
}

.menu-active-bg .menu-item .menu-link.active .menu-title {
    color: var(--bs-menu-link-color-active);
}

/*
 * Colored links
 */
.link-primary:focus,.link-primary:hover{
    color:RGBA(112,131,155,var(--bs-link-opacity,1))!important;
    text-decoration-color:RGBA(112,131,155, var(--bs-link-underline-opacity,1))!important
}

/*
 * Radio Button de Formularios
 */
.form-check {
    margin-bottom: .5rem !important;
}

/*
 * Checkbox Select Multiple
 */

.checkbox-select-multiple {
    max-height: 250px;
    overflow: scroll;
    padding: .5rem !important;
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

.checkbox-select-multiple .form-check {
    padding-bottom: .75rem !important;
}

.checkbox-select-multiple .form-check-label {
    color: var(--bs-gray-800);
}

.checkbox-select-multiple .invalid-feedback {
    margin-bottom: .25rem !important;
}


/*
 * Horizontal Checkbox Select Multiple
 */

.checkbox-select-multiple.checkbox-grid {
    display: flex;    
    flex-wrap: wrap;
    justify-content: start;
}

.checkbox-select-multiple.checkbox-grid div {
    margin-bottom: .25rem !important;
}

.checkbox-select-multiple.checkbox-grid.grid-cols-2 div {
    width: calc(100% / 2); 
}

.checkbox-select-multiple.checkbox-grid.grid-cols-3 div {
    width: calc(100% / 3); 
}

.checkbox-select-multiple.checkbox-grid.grid-cols-4 div {
    width: calc(100% / 4); 
}

.checkbox-select-multiple.checkbox-grid.grid-cols-5 div {
    width: calc(100% / 5); 
}

.checkbox-select-multiple.checkbox-grid.grid-cols-6 div {
    width: calc(100% / 6); 
}

.checkbox-select-multiple.checkbox-grid.grid-cols-7 div {
    width: calc(100% / 7); 
}

.checkbox-select-multiple.checkbox-grid.grid-cols-8 div {
    width: calc(100% / 8); 
}

@media (max-width: 800px) {
    .checkbox-select-multiple.checkbox-grid {
        flex-wrap: nowrap;
        flex-direction: column;
    }

    .checkbox-select-multiple.checkbox-grid div {
        width: auto!important;
        margin-bottom: .75rem !important;
    }
    
}

/*
 * Horizontal Checkbox Select Multiple
 */

.horizontal-checkbox-select-multiple {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

/*
 * Tablas
 */
.page-item.active .page-link {
    background-color:var(--bs-primary-active)!important;
}


/*
 * Control de solo lectura
 */
/* Cambia el color para hacer una distinción entre los controls normales, de solo lectura y deshabilitados */
input[readonly='readonly'] {
    background-color: var(--bs-readonly-bg)!important;
}

/*
 * Model Select 2
 */
.select2-selection.select2-selection--single.modelselect2.form-select {
    height: 44px;
}
.select2-selection .select2-selection__clear {
    position: absolute!important;
}

/* Corrección de Ancho del Select2 para que no sobresalga en columnas de Bootstrap pequeñas*/
.select2-container {
    min-width: 10rem!important;
}

.select2-selection__rendered {
    display: flex!important;
    flex-wrap: wrap!important;
}

/*
 * Formulario de Detalles (Solo lectura)
 */
.read-only-form .form-control:disabled {
    background-color: var(--bs-read-only-form-control-bg)!important;
    color: var(--bs-gray-700)!important;
}

.read-only-form .form-select:disabled {
    background-color: var(--bs-read-only-form-control-bg)!important;
    color: var(--bs-gray-700)!important;
}

.read-only-form .select2-container--bootstrap5.select2-container--disabled .form-select {
    background-color: var(--bs-read-only-form-control-bg)!important;
    color: var(--bs-gray-700)!important;
}

.read-only-form .select2-container--bootstrap5.select2-container--disabled .form-select .select2-selection__placeholder, .select2-container--bootstrap5.select2-container--disabled .form-select .select2-selection__rendered {
    color: var(--bs-gray-700)!important;
}

.checkbox-select-multiple:has(.form-check-input:disabled) {
    background-color: var(--bs-read-only-form-control-bg)!important;
}

.read-only-form .form-check .form-check-label {
    color: var(--bs-gray-800)!important;
    opacity: 1;
}

/*
*Animacion pulse
*/
@keyframes pulse-custom {
    0% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.05);
    }
    100% {
      transform: scale(1);
    }
  }
  
.pulse {
    animation: pulse-custom 1.5s infinite;
  }


.custom-tooltip {
    position: relative;
    display: inline-block;
    background-color: transparent;
    color: inherit;
    padding: 0;
    border: none;
}

.custom-tooltip .tooltiptext {
    visibility: hidden;
    width: auto;
    min-width: 350px;
    max-width: 350px;
    background-color: rgba(0, 0, 0, 0.85);
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px;
    position: absolute;
    z-index: 9999;
    top: 100%;
    left: 110%;
    transform: translateY(-10%);
    opacity: 0;
    transition: opacity 0.3s;
    white-space: normal;
    word-wrap: break-word;
}

.custom-tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.custom-tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    transform: translateY(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: transparent rgba(0, 0, 0, 0.85) transparent transparent;
}