:root {
    --color-empresarial-azul: #1a003c;
    --color-empresarial-magenta: #C60161;
    --color-empresarial-blanco: #F9F9F9;
    --color-gris-bootstrap: #747474;
    --color-gris-disabled: #E9ECEF;
}

a {
    text-decoration: none !important;
}

table,
.dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
.dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
    font-size: 1vw !important;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
    color: inherit;
    padding-bottom: 1.5%;
}

input,
select,
textarea,
p,
span,
text,
label {
    font-size: 14px !important;
}

label,
th,
.fw-bolder {
    font-weight: 500 !important;
}

.link-redirect,
.text-rosa {
    color: var(--color-empresarial-magenta) !important;
}


div.dataTables_wrapper div.dataTables_length label,
div.dataTables_wrapper div.dataTables_filter label {
    font-size: 15px !important;
}

.font-size-14 {
    font-size: 14px !important;
}

.titulo {
    font-size: 17px !important;
    font-weight: 600;
}

.subtitulo { 
    font-size: 15px !important;
    font-weight: 400;
}

.nav-pills .nav-link {
    background-color: transparent !important;
    color: black !important;
    border-radius: 0 !important;
    width: auto !important;
    white-space: nowrap !important
}

.nav .nav-link.active {
    border-bottom: 3px solid #C60161 !important;
}
/*VALIDAR EN LA SINCRONIZACION CON ITSM - BORRAR*/
.bg-rosa {
    background: #c40161 !important;
}

.ui-autocomplete .ui-menu-item-wrapper.ui-state-active {
    background-color: var(--color-gris-bootstrap) !important;
    border-color: var(--color-gris-bootstrap) !important;
}

.ui-widget.ui-widget-content {
    z-index: 7999 !important;
}

.tooltip-inner {
    max-width: 700px;
    white-space: normal;
    word-wrap: break-word;
    text-align: left;
}

.modal-right .modal-dialog {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    margin: 0;
    width: auto;
}

.modal-right .modal-content {
    height: 100vh;
    border-radius: 0;
    overflow-y: auto;
    width: auto;
}

.z-index-5999 {
    z-index: 5999 !important;
}

/* 
    Esta clase (input-group-text) nativa de Bootstrap se utiliza en los inputs que tienen botones integrados. 
    Se modifica el padding porque el estilo nativo desproporciona el input, 
    haciéndolo ver un poco más grande en comparación con los inputs que no tienen un botón integrado.
    Parametros Originales: padding: .375rem .75rem;
*/
.input-group-text {
    padding: .22rem .75rem !important;
}

input[readonly] {
    background-color: var(--color-gris-disabled);
    opacity: 1;
    pointer-events: none !important;
}

.container-vista-parial {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.body-vista-parcial {
    flex: 1;
    overflow: auto;
    width: auto;
    overflow-x: hidden;
}

.footer-vista-parcial {
    border-top: 1px solid var(--bs-border-color);
    padding: 10px;
    text-align: right;
}

.is-required:after {
    content: '*';
    margin-left: 3px;
    color: red;
    font-weight: bold;
}

fieldset {
    background-color: white !important;
    padding: 2% !important;
    margin-bottom: 2% !important;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.2) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

fieldset:has(legend) {
    padding: 0% 2% 2% 2% !important;
}

.spanRedirectDisable {
    background-color: var(--color-gris-disabled) !important;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* Cambia el color del borde de los inputs en foco a gris */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--color-gris-bootstrap) !important;
    box-shadow: 0 0 0 0.25rem rgba(116, 116, 116, 0.25) !important;
    outline: 0 !important;
}

.btn-coem-primary {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    border: 1px solid var(--color-empresarial-blanco);
    user-select: none;
    border-radius: 0.25rem;
    background-color: var(--color-empresarial-magenta)!important;
    color: var(--color-empresarial-blanco)!important;
    min-width: 3rem;
}

.btn-coem-primary:hover {
    border: 1px solid var(--color-empresarial-magenta);
}

.btn-coem-secondary {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    border: 1px solid var(--color-empresarial-blanco);
    user-select: none;
    border-radius: 0.25rem;
    background-color: var(--color-empresarial-azul)!important;
    color: var(--color-empresarial-blanco)!important;
    min-width: 3rem;
}

.btn-coem-secondary:hover {
    border: 1px solid var(--color-empresarial-azul);
}

.btn-coem-primary:disabled, .btn-coem-secondary:disabled {
    opacity: 0.65;
    pointer-events: none;
    color: var(--color-empresarial-blanco);
}

select[readonly] {
    background-color: #e9ecef;
    opacity: 1;
    cursor: not-allowed;
    pointer-events: none;
}

textarea[readonly] {
    background-color: #e9ecef;
    opacity: 1;
    cursor: not-allowed;
}

/*Anula el boton de sumar o restar en el campo input de tipo number*/
/*Se usa colocando la clase hidden-spin-button*/
.hidden-spin-button::-webkit-inner-spin-button,
.hidden-spin-button::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Ajuste del tamaño del modal */
@media (min-width: 1200px) {
    .modal-xxl {
        --bs-modal-width: 1600px
    }
}

.cursor-pointer {
    cursor: pointer
}

.text-justify {
    text-align: justify;
    text-justify: inter-word;
}

.listaDesplegable {
    display: none; 
    z-index: 1050;
    max-height: 200px;
    overflow-y: auto; 
}

.render-body {
    overflow-y: auto;
    padding-bottom: 2%;
    overflow-x: hidden;
}

.separador {
    border-left: solid #b5b5b5 2px;
    padding-left: 1%;
}

.text-muted {
    font-weight: 400;
    line-height: normal;
}