/* ACTUALIZADO FARCOS (23/10/2025) */
/* Estilos propios del proyecto */

/******************************************************************************************/
/***********************************HTML, BODY Y BÁSICOS***********************************/
/******************************************************************************************/
html, body {
    font-size: 13px;
    font-family: "Work Sans", sans-serif;
    font-weight: 500;
    justify-content: center;    
    width: 100%;
    height: auto;
    min-height: 100%;
}

::placeholder { font-style: italic; }
.p { font-size: 1rem; font-family: "Work Sans", sans-serif; }
p { font-size: 16px; }





/******************************************************************************************/
/*********************************************H********************************************/
/******************************************************************************************/
.h1, h1 { font-size: 3rem; font-family: "DM Sans", sans-serif; font-weight: 600; }
.h2, h2 { font-size: 2rem; font-family: "DM Sans", sans-serif; font-weight: 600; }
.h3, h3 { font-size: 1.4rem; font-family: "DM Sans", sans-serif; }
.h4, h4 { font-size: 1.2rem; font-family: "DM Sans", sans-serif; }
.h5, h5 { font-size: 1rem; font-family: "DM Sans", sans-serif; }





/******************************************************************************************/
/****************************************COLORES*******************************************/
/******************************************************************************************/
/*DEFINICIÓN DE COLORES*/
:root {
    --colorPrincipal: #557A46; /*Verde Caro*/
    --colorSecundario: #C96E4F; /*Naranja*/
    --colorGris: #F2EFEA; /*Gris claro fondo*/
    --colorGrisFormularios: #f2f2f2;
    --colorGrisOscuro: #343F44;
    --colorBlue: #24A9E5; /*Azul*/
    --colorRojo: red;
}
.colorPrincipal { color: var(--colorPrincipal) !important; }
.colorSecundario { color: var(--colorSecundario) !important; }
.colorGris { color: var(--colorGris) !important; }
.colorGrisOscuro { color: var(--colorGrisOscuro) !important; }
.colorGrisFormularios { color: var(--colorGrisFormularios) !important; }
.colorRojo {color: var(--colorRojo) !important; }


/*BACKGROUNDS*/
.bg-gris { background-color: var(--colorGris) !important; }
.bg-grisOscuro {background-color: var(--colorGrisOscuro) !important;}
.bg-grisFormularios { background-color: var(--colorGrisFormularios) !important; }
.bg-colorPrincipal { background-color: var(--colorPrincipal) !important; }

.bg-inscripcion { background-color: #E9E3F8 !important; border: 1px solid #C8B6E2 !important; }
.bg-admisionProvisional { background-color: #B3E0F5 !important; border: 1px solid #66C2EF !important; }
.bg-denegado { background-color: #F8B8B1 !important; border: 1px solid #E57368 !important; }
.bg-revisionDocumentacion { background-color: #F6C8A4 !important; border: 1px solid #ED7D31 !important; }
.bg-adjudicacion { background-color: #DDF3E3 !important; border: 1px solid #B6E0BF !important; }
.bg-solicitudRetirada { background-color: #F59C96 !important; border: 1px solid #E05B50 !important; }
.bg-contrato { background-color: #A3C9A8 !important; border: 1px solid #7FB686 !important; }
.bg-desistido { background-color: #F2786C !important; border: 1px solid #CC4B3F !important; }
.bg-enEsperaDeViviendaLibre { background-color: #F9D0E8 !important; border: 1px solid #E89BC9 !important; }
.bg-finalizado { background-color: #FFF3B0 !important; border: 1px solid #F6D860 !important; }

.bg-aprobado { background-color: #66BB6A !important; border: 1px solid #43A047 !important; }
.bg-rechazado { background-color: #EF6F6F !important; border: 1px solid #D32F2F !important; }
.bg-pendienteRevision { background-color: #FFA726 !important; border: 1px solid #FB8C00 !important; }





/******************************************************************************************/
/****************************************ENLACES*******************************************/
/******************************************************************************************/
a { color: var(--colorBlue) !important; background-color: transparent; transition: color 0.3s ease; text-decoration: underline !important; }
a:hover { opacity: 0.6; color: var(--colorBlue) !important; }
.no_a { border: none !important; padding: 8px 8px 8px 16px; text-decoration: none; border: solid 1px white; display: flex;}
.no_a:hover { border: none !important; }
.a-none:hover { opacity: 0.6; color: var(--colorGrisOscuro) !important; }

a.btn-general{ display:inline-flex; align-items:center; justify-content:center; text-decoration:none !important; cursor:pointer; color:var(--colorPrincipal) !important; font-family:"DM Sans",sans-serif; font-weight:700; background-color:#fff; padding:.3rem 2.5rem; border-radius:.5rem; border:2px solid var(--colorPrincipal) !important; box-shadow:0 .125rem .25rem rgba(0,0,0,.075) !important; }
a.btn-general:hover{ color:#fff !important; background-color:var(--colorPrincipal) !important; border-color:var(--colorPrincipal) !important; text-decoration:none !important; opacity:1 !important; }
a.btn-general:focus-visible{ outline:2px solid var(--colorPrincipal); outline-offset:2px; }
a.btn-general.is-disabled{ pointer-events:none; opacity:.65 !important; cursor:default; }





/******************************************************************************************/
/****************************************BOTONES*******************************************/
/******************************************************************************************/
/* util común de padding (evita repetir cuatro lados) */
:root {
    --btn-px-lg: 2.95rem;
    --btn-px: 2.5rem;
    --btn-py: .3rem;
}

/* base botones (sobre Bootstrap) */
.btn { font-family: "DM Sans", sans-serif; border-radius: 0.5rem; box-shadow: 0 .125rem .25rem rgba(0,0,0,.075); }
.btn:hover { color: #fff !important; opacity: .8; }
.btn:focus { outline: 0 !important; box-shadow: none !important; }
.btn:disabled { pointer-events: none; background-color: #ccc; color: #666; cursor: not-allowed; }
.btn:disabled:hover { background-color: #ccc; }

.btn--md-pad { padding: var(--btn-py) var(--btn-px) !important; }

.btn-cancelar { color: #fff !important; background-color: #808080 !important; border: 2px solid #808080 !important; padding: var(--btn-py) var(--btn-px) !important; }
.btn-cancelar:hover { background-color: #c2c2c2 !important; border-color: #c2c2c2 !important; }

.btn-general { color: var(--colorPrincipal); background-color: #fff; border: 2px solid var(--colorPrincipal) !important; font-weight: 700; padding: var(--btn-py) var(--btn-px) !important; }
.btn-general:hover { color: #fff; background-color: var(--colorPrincipal) !important; border-color: var(--colorPrincipal) !important; }

.btn-aprobar { color: #fff !important; background-color: #4CAF50 !important; border: 2px solid #4CAF50 !important; padding: var(--btn-py) var(--btn-px) !important; }
.btn-aprobar:hover { background-color: #43A047 !important; border-color: #43A047 !important; }

.btn-secundario { color: #fff !important; background-color: var(--colorSecundario) !important; border: none !important; padding: .5rem var(--btn-px-lg) !important; }
.btn-secundario:hover { background-color: #F2B099 !important; }

.btn-secundarioAdjuntar { color: var(--colorSecundario) !important; background-color: #c96e4f20 !important; border: 1px solid var(--colorSecundario) !important; font-size: 1rem; line-height: 1.25 !important; padding: .5rem var(--btn-px-lg) !important; }
.btn-secundarioAdjuntar:hover { background-color: #fff !important; }

@media (max-width: 768px) {
    .btn-secundarioAdjuntar { padding: .5rem 2rem !important; }
}





/******************************************************************************************/
/*****************************************INPUT********************************************/
/******************************************************************************************/
/*VALIDACIONES EN INPUTS, DROPDOWNS, ETC...*/
input.form-control.is-invalid, .was-validated input.form-control:invalid {
    padding-right: calc(1.3em + .75rem);
}

/*CAMBIO COLOR FOCUS*/
.control-input:focus {
    outline: none; /* Quitar el borde predeterminado de enfoque */
    border-color: var(--colorPrincipal); /* Cambiar el color del borde a tu elección */
    box-shadow: 0 0 5px var(--colorPrincipal); /* Añadir sombra para un efecto visual */
}

/*CUANDO EL NAVEGADOR SUGIERE AUTOCOMPLETAR Y CLICKAMOS, PODEMOS PERSONALIZAR EL FONDO*/
input:-webkit-autofill {
    background-color: white !important; /* Establece el fondo en blanco */
    color: inherit; /* Mantiene el color del texto */
    transition: background-color 5000s ease-in-out 0s; /* Evita que Chrome vuelva a aplicar el fondo */
}

/*PARA PONER UN ICONO A LA DERECHA DE UN CAMPO INPUT*/
.input-icoright-group { position: relative; }
.input-icoright-group i { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: black; cursor: not-allowed; }
.input-icoright-group input { padding-right: 35px; cursor: pointer; background-position: right calc(.875em + 1.30rem) center !important; }
.input-icoright-group input.form-control.is-invalid[type="text"], 
.input-icoright-group .was-validated input.form-control[type="text"]:invalid {
    padding-right: calc(1.5em + 1rem); /* Ajuste del padding para los inputs con iconos a la derecha */
    background-position: right calc(.875em + 1.30rem) center; /* Ajustar la posición del icono */
    /*background-color: #f8d7da;*/ /* Color de fondo rojo claro cuando es inválido */
    border-color: #dc3545; /* Color del borde cuando es inválido */
}

.form-control{ border: 1px solid var(--colorPrincipal) !important; }


/* base: mismo color de borde para input y addon */
.input-group .form-control,
.input-group .input-group-text{
  border-color: var(--colorPrincipal) !important;
}

/* foco: aplica al grupo completo cuando cualquier hijo tiene foco */
.input-group:focus-within .form-control,
.input-group:focus-within .input-group-text{
  border-color: var(--colorPrincipal) !important;
  box-shadow: 0 0 5px var(--colorPrincipal);
}

/* opcional: fondo y texto del addon para que no “cante” */
.input-group .input-group-text{
  background-color: #fff;        /* o transparent si prefieres */
  color: inherit;
}

/* si usas validaciones, deja que el rojo prevalezca */
.input-group .form-control.is-invalid,
.was-validated .input-group .form-control:invalid,
.input-group .form-control.is-invalid + .input-group-text{
  border-color: #dc3545 !important;
  box-shadow: none;
}





/******************************************************************************************/
/***************************************CHECKBOX*******************************************/
/******************************************************************************************/
input[type="checkbox"] {
    /* Ocultar el checkbox nativo */
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    outline: none;
    width: 17px;
    height: 17px;
    cursor: pointer;
    background-color: white;
    border: 1px solid var(--colorPrincipal); /* Color personalizado del borde */
    border-radius: 2px;
    transition: background-color 0.2s, border-color 0.2s;
    position: relative;
}

input[type="checkbox"]:checked {
    background-color: var(--colorPrincipal); /* Cambiar el fondo al estar seleccionado */
    border-color: var(--colorPrincipal); /* Cambiar el borde al estar seleccionado */
}

input[type="checkbox"]:checked::after {
    content: '\2714'; /* Código del checkmark */
    color: white; /* Color del checkmark */
    font-size: 12px;
    position: absolute;
    left: 3px;
    top: -1px;
}

/* Para mejorar la apariencia en todos los navegadores */
input[type="checkbox"]:hover {
    opacity: 0.85; 
}

.form-check-input:checked { background-color: var(--colorPrincipal) !important; border-color:var(--colorPrincipal) !important; }





/******************************************************************************************/
/***********************************RADIOBUTTONS*******************************************/
/******************************************************************************************/
input[type="radio"].form-check-input:focus {
    box-shadow: 0 0 0 .2rem rgba(85, 122, 70, .35) !important;
    outline: none !important;
}





/******************************************************************************************/
/***********************************SELECT (COMBOS)****************************************/
/******************************************************************************************/
select.form-control.is-invalid, .was-validated select.form-control:invalid {
    padding-right: calc(1.5em + 1rem); /* Diferente ajuste para los select */
    background-position: right calc(.875em + .5000rem) center
}

/*CAMBIO COLOR FOCUS*/
.control-select:focus {
    outline: none; /* Quitar el borde predeterminado de enfoque */
    border-color: var(--colorPrincipal); /* Cambiar el color del borde a tu elección */
    box-shadow: 0 0 5px var(--colorPrincipal); /* Añadir sombra para un efecto visual */
}





/******************************************************************************************/
/************************MULTISELECT (Combo multiseleccionable)****************************/
/******************************************************************************************/
.choices { width: 100%; font-family: "Work Sans", sans-serif; font-weight: 500; }

.choices__inner { background-color: #fff; border: 1px solid var(--colorPrincipal) !important; border-radius: .5rem; padding: .375rem .75rem; min-height: calc(1.5em + .75rem + 7px); box-shadow: none; }
.choices:focus-within .choices__inner { border-color: var(--colorPrincipal) !important; box-shadow: 0 0 5px var(--colorPrincipal); }
.choices__placeholder { color: #6c757d; opacity: 1; }
.choices__list--single .choices__item { padding: 0; color: inherit; }

.choices__list--dropdown, 
.choices__list[aria-expanded] {
  border: 1px solid var(--colorPrincipal);
  border-top: none;
  border-radius: 0 0 .5rem .5rem;
  box-shadow: 0 .25rem .5rem rgba(0,0,0,.08);
  margin-top: -1px;
}

.choices.is-open .choices__inner { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }

.choices__list--dropdown .choices__item--selectable:hover,
.choices__list--dropdown .choices__item--selectable.is-highlighted {
  background-color: var(--colorPrincipal) !important;
  color: #fff !important;
}

.choices__list--dropdown .choices__item--selectable:hover::after,
.choices__list--dropdown .choices__item--selectable.is-highlighted::after {
  color: rgba(255,255,255,.85) !important;
}

.choices__list--dropdown .choices__input,
.choices__input {
  border: 1px solid var(--colorPrincipal) !important;
  border-radius: .5rem;
  padding: .375rem .5rem;
}

.choices__list--multiple .choices__item {
  background: #f5f7f6;
  border: 1px solid var(--colorPrincipal);
  color: inherit;
}
.choices__list--multiple .choices__item.is-highlighted {
  background: var(--colorPrincipal);
  color: #fff;
  border-color: var(--colorPrincipal);
}

.choices.is-open .choices__inner {
  border-color: var(--colorPrincipal) !important;
  box-shadow: 0 0 5px var(--colorPrincipal);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.choices[data-type*="select-one"].is-open .choices__list--dropdown,
.choices[data-type*="select-one"] .choices__list--dropdown,
.choices[data-type*="select-multiple"].is-open .choices__list--dropdown,
.choices[data-type*="select-multiple"] .choices__list--dropdown {
  border-color: var(--colorPrincipal) !important;
  box-shadow: 0 .25rem .5rem rgba(85,122,70,.15);
  border-top: 1px solid var(--colorPrincipal) !important;
  margin-top: -1px;
}

.choices__list--dropdown {
  border-top-color: var(--colorPrincipal) !important;
}

.choices:focus-within .choices__inner {
  border-color: var(--colorPrincipal) !important;
  box-shadow: 0 0 5px var(--colorPrincipal);
}





/******************************************************************************************/
/************************************MENSAJE CARGANDO**************************************/
/******************************************************************************************/
#materialLoading {
    font-family: "Red Hat Display", sans-serif;
    color: black;
    font-weight: bold;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    display: table;
    z-index: 9999;
}

#materialLoadingCentered { display: table-cell; vertical-align: middle; padding: 20px; }
#materialLoadingContent { text-align: center; }
#materialLoadingContent .spinner-container { background-color: #FFFFFF; text-align: center; border-radius: 7px; padding: 40px 20px; }
#materialLoadingContent .spinner-container .texto { padding-top: 10px; font-size: 16px; font-weight: bold; }
#materialLoadingContent .spinner-container .spinner-border { text-align: center; color: var(--colorPrincipal); width: 3rem; height: 3rem; }
#materialLoading.hide { opacity: 0; transition: opacity 0.2s ease-out; pointer-events: none; }
#materialLoading.hide #materialLoadingCentered { transform: scale(0.8); transition: transform 0.2s ease-out; }
#materialLoading.show { opacity: 1; transition: opacity 0.2s ease-in; }
#materialLoading.show #materialLoadingCentered { transform: scale(1); transition: transform 0.2s ease-in; }





/******************************************************************************************/
/************************************TOOLTIP CON ICONO*************************************/
/******************************************************************************************/
.tooltip { border-bottom: none !important; }
.tooltip-inner { background-color: white; color: #333; border: 1px solid var(--colorPrincipal); padding: 10px; border-radius: 5px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); max-width: 300px; }

/* flechita que indica el bocadillo tooltip */
.tooltip.bs-tooltip-bottom .arrow::before { border-bottom-color: var(--colorPrincipal); }





/******************************************************************************************/
/**************************************MENSAJE TOAST***************************************/
/******************************************************************************************/
#toast-container > div {
    opacity:0.95 !important; /* Ajusta la opacidad del mensaje toast */
    transition: opacity 0.3s; /* Opcional: para una transición suave al cambiar la opacidad */
}

#toast-container > div:hover {
    opacity: 1 !important; /* Ajusta la opacidad del mensaje toast al pasar el mouse sobre �l */
}





/******************************************************************************************/
/*********************************CALENDARIO AIR DATEPICKER********************************/
/******************************************************************************************/
.air-datepicker {
    z-index: 1051 !important; /* Ajuste de z-index para que se muestre sobre el modal */
}

/*CAMBIA EL COLOR DEL DÍA SELECCIONADO*/
.air-datepicker-cell.-selected- {
    background-color: var(--colorPrincipal) !important;
    color: white !important;
}

/*CAMBIA EL COLOR DEL FONDO DEL HOVER*/
.air-datepicker-cell.-selected-.-focus- {
    background-color: var(--colorPrincipal) !important;
}





/******************************************************************************************/
/****************************************MODALES*******************************************/
/******************************************************************************************/
.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--bs-modal-color);
    pointer-events: auto;
    background-color: var(--bs-modal-bg);
    background-clip: padding-box;
    border: solid 5px var(--colorPrincipal);
    border-radius: var(--bs-modal-border-radius);
    outline: 0;
}

.modal-content-borderColorSecundario {
    border: solid 5px var(--colorSecundario);
}

/* quitar sombra/outline del botón close del modal */
.modal .btn-close:focus,
.modal .btn-close:active,
.modal .btn-close:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

/* opcional: quitar flash azul en móviles */
.modal .btn-close {
    -webkit-tap-highlight-color: transparent;
}





/******************************************************************************************/
/***************************************ACORDEÓN*******************************************/
/******************************************************************************************/
.accordion-button:focus { z-index: 3; outline: 0; box-shadow: none !important; }
.accordion-button:not(.collapsed) { color: var(--bs-accordion-active-color); background-color: var(--bs-accordion-active-bg); box-shadow: none !important; }





/******************************************************************************************/
/*******************************TABLA DEL GRID RESPONSIVE**********************************/
/******************************************************************************************/
.mvc-grid-table > table > thead > tr > th { background-color: white !important; border-left: none !important; border-right: none !important; border-top: 2px solid #dee2e6 !important; border-bottom: 2px solid #dee2e6 !important; }
.mvc-grid-table > table > thead > tr > th, .mvc-grid-table > table > tbody > tr > td, .mvc-grid-table > table > tfoot > tr > td { border: none !important; }
.mvc-grid-table > table > tbody > tr:nth-of-type(odd) { background-color: rgba(0, 0, 0, .05); }
.mvc-grid-pager .active, .mvc-grid-pager .active:focus, .mvc-grid-pager .active:hover { border-color: var(--colorPrincipal) !important; background: var(--colorPrincipal) !important; color: white !important; }
.mvc-grid-pager button { color: black !important; }
.mvc-grid-pager button:hover { outline: none !important; box-shadow: none !important; color: var(--colorPrincipal) !important; }
.mvc-grid-pager button:focus { outline: none !important; box-shadow: none !important; color: var(--colorPrincipal) !important; }
.blackHeaderTable table thead tr th { color: white !important; background-color: black !important }
th.text-nowrap, td.text-nowrap { white-space: nowrap !important; }
.notes-wrap { white-space: normal !important; word-break: break-word; overflow-wrap: anywhere; }

@media only screen and (max-width: 850px) 
{   
    /*Se pone que not(.table-striped) y significa que para aquellos grids que usen la clase table-striped no se aplicará esto en repsonsive*/

    /*TABLA DEL GRID*/
    .table-responsive-rows:not(.table-striped) table, 
    .table-responsive-rows:not(.table-striped) thead, 
    .table-responsive-rows:not(.table-striped) tbody, 
    .table-responsive-rows:not(.table-striped) th, 
    .table-responsive-rows:not(.table-striped) td, 
    .table-responsive-rows:not(.table-striped) tr {
        display: block; 
    }

    /* Ocultar encabezados de tabla (pero no mostrar: ninguno por accesibilidad) */
    .table-responsive-rows:not(.table-striped) thead tr { position: absolute; top: -9999px; left: -9999px; }
    
    .table-responsive-rows:not(.table-striped) th { font-size: 1em !important; }
    .table-responsive-rows:not(.table-striped) tr { padding-bottom: 0px; border-left: none; border-right: none; }
    .table-responsive-rows:not(.table-striped) td { border: none; border-bottom: 1px solid #eee; font-size: 14px; position: relative; padding-left: 42% !important; white-space: normal; text-align: right; }
        .table-responsive-rows:not(.table-striped) td:before { position: absolute; top: 6px; left: 6px; padding-right: 10px; white-space: nowrap; text-align: left; font-weight: bold; font-size: 14px; }

    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > thead > tr > th:nth-of-type(1), 
    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > tbody > tr > td:nth-of-type(1), 
    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > tfoot > tr > td:nth-of-type(1) { 
        border-top: 1px solid black !important; 
    }

    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > tbody > tr:last-child, 
    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > tfoot > tr:last-child { 
        border-bottom: 1px solid black !important; 
    }
    
    /*CENTRA EL TÍTULO "No hay resultados..." EN RESPONSIVE*/
    .table-responsive-rows:not(.table-striped) .mvc-grid-empty-row td { text-align: center !important; padding: 20px !important; font-size: 13px !important; color: inherit !important; }
    
    /*PAGINACIÓN EN RESPONSIVE*/
    .table-responsive-rows:not(.table-striped) .mvc-grid-pager button:focus { outline: none !important; box-shadow: none !important; }
    .table-responsive-rows:not(.table-striped) .tableless thead { display: none; }
    .table-responsive-rows:not(.table-striped) .tableless td { border: solid 0px transparent !important; }
    
    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > thead > tr > th, 
    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > tbody > tr > td, 
    .table-responsive-rows:not(.table-striped) .mvc-grid-table > table > tfoot > tr > td { 
        border: 0px solid #dee2e6 !important; padding: 0.5em; 
    }

    /*NOMBRES TÍTULOS EN RESPONSIVE*/
    
    /* Nombres de títulos tabla REQUEST PUBLIC */ 
    .table-responsive-rows td.title_codigo-solicitud:before { content: "Código Solicitud:"; }
    .table-responsive-rows td.title_fecha-solicitud:before { content: "Fecha Hora:"; }
    .table-responsive-rows td.title_municipio-empadronamiento:before { content: "Municipio:";}
    .table-responsive-rows td.title_discapacidad:before {content: "Vivienda Adaptada:";  }
    .table-responsive-rows td.title_nivel-prioridad:before { content: "Prioridad:"; }
    .table-responsive-rows td.title_estado-solicitud:before { content: "Estado:"; }

    /* Nombres de títulos tabla DOCUMENT HISTORY */ 
    .table-responsive-rows td.title_tipo-documento:before { content: "Tipo Doc:"; }
    .table-responsive-rows td.title_fecha-creacion:before { content: "Fecha Creación:"; }
    .table-responsive-rows td.title_estado-validacion:before { content: "Estado:";}
    .table-responsive-rows td.title_fecha-validacion:before {content: "Fecha Validación:";  }
    .table-responsive-rows td.title_comentarios:before { content: "Comentarios:"; }

     /* Nombres de títulos tabla ASIGNACION VIVIENDA HISTORY */ 
    .table-responsive-rows td.title_vivienda:before { content: "Vivienda:"; }
    .table-responsive-rows td.title_fecha-asignacion:before { content: "Fecha Asignación:"; }
    .table-responsive-rows td.title_fecha-rechazo:before { content: "Fecha Rechazo:";}

    /* Nombres de títulos tabla ESTADOS HISTORY */ 
    .table-responsive-rows td.title_estado-solicitud:before { content: "Estado:"; }
    .table-responsive-rows td.title_fecha-modificacion:before { content: "Fecha Mod:"; }
    .table-responsive-rows td.title_usuario-modificacion:before { content: "Usuario Mod:";}

    /* Nombres de títulos tabla CÓDIGOS OTP */ 
    .table-responsive-rows td.title_tipo-otp:before { content: "Tipo:"; }
    .table-responsive-rows td.title_codigo-otp:before { content: "OTP:"; }
    .table-responsive-rows td.title_resultado:before { content: "Resultado:";}
    .table-responsive-rows td.title_descripcion:before { content: "Descripción:";}    


    /* Nombres de títulos tabla HISTORICO NOTIFICACIONES */ 
    .table-responsive-rows td.title_usuario-email:before { content: "Email:"; }
    .table-responsive-rows td.title_tipo-notificacion:before { content: "Tipo:"; }
  

}





/******************************************************************************************/
/*****************************************VARIOS*******************************************/
/******************************************************************************************/

/*Tipos de cursores*/
.cursor-hand { cursor: pointer !important; }
.cursor-arrow { cursor: default !important; }
.cursor-notAllowed { cursor: not-allowed !important; }
.cursor-text { cursor: text !important; }

/* Mensaje de validaciónes */
.label-message-error span,
.label-message-error .field-validation-error,
.label-message-error .field-validation-valid {
    display: block;
    text-align: left;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
}
.label-message-error {
    margin-top: .30rem;
    padding-bottom: .3rem;
}

/* Títulos */
.titulo-absolute {
    position: absolute;
    font-family: "DM Sans", sans-serif;
    color: #fff;
    width: auto;
    height: auto;
    border-radius: .5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    top: -35px;
}

/* Color asterisco */
.req-asterisk { color: #dc3545; font-weight: 700; }

/* Recuadro de notas */
.doc-notes {
    background: #FDFBF8;
    border: 1px solid #ececec;
    border-left: 3px solid var(--colorSecundario);
    border-radius: .5rem;
    padding: .75rem;
}

/* icono ojo/histórico para ver documentos */
.doc-eye,
.doc-history {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
}

/* mensaje para el error de página */
.pill-status {
    background: #e9ecef;
    color: var(--colorSecundario) !important;
    padding: .35rem .9rem;
    border-radius: 2rem;
    font-weight: 500;
    font-size: .9rem;
}

/* etiqueta aceptada */
.badge-asignada {
    width: 100%;
}

@media (min-width: 768px) {
    .badge-asignada {
        min-width: 250px;
    }
}