/* Estilos personalizados para la plantilla */
/* Añadir regla !important cuando sea modificación sobre plantilla bootstrap original  */
/* Recomendable indicar el div para actuar sobre un elemento concreto */
/* BOTONES: Necesario añadir nuevas clases al fichero Buttons.cs */

:root {
  --blue: #007bff;
  --indigo: #6610f2;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #dc3545;
  --orange: #fd7e14;
  --yellow: #ffc107;
  --green: #28a745;
  --teal: #20c997;
  --cyan: #17a2b8;
  --white: #fff;
  --gray: #6c757d;
  --gray-dark: #343a40;
  --primary: #007bff;
  --secondary: #6c757d;
  --success: #28a745;
  --info: #17a2b8;
  --warning: #ffc107;
  --danger: #dc3545;
  --light: #f8f9fa;
  --dark: #343a40;
  --ituc2_hover: #1c2b5a;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --font-family-sans-serif: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

imgfondo {
    background-image: url("../img/blur-close-up-connection-1624895-1.jpg");
    background-size: cover;
}

/* Personalización general de la aplicación ituc2, fondo, menús, botones, etc... */
.bg-ituc {
    /*background: -moz-radial-gradient(center, ellipse cover, #0264d6 1%, #1c2b5a 100%);*/
    background-color: #343a40;
}

.btn-ituc {
    background-color: #EAECEE;
    border: 1px solid #343a40;
    color: #343a40;
}

/*INI VMM 2025-05-26 Admision familiares. Evitar bordes en algunos casos*/
.btn-ituc-noborder {
    background-color: #EAECEE;
    border: none; /* Quita el borde */
    color: #343a40;
    box-shadow: none; /* Quita sombra si hay */
    outline: none; /* Quita contorno al enfocar */
}

    .btn-ituc-noborder:focus,
    .btn-ituc-noborder:active {
        border: none;
        outline: none;
        box-shadow: none;
    }
/*FIN VMM 2025-05-26 Admision familiares. Evitar bordes en algunos casos*/

.btn-ituc:hover {
    background-color: var(--ituc2_hover) !important;
    color: white !important;
}

#topnavigation .text-ituc {
    color: #212F3D !important;
}

/* Pantalla login */
.login-pie {
    padding: 0;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 50px;
    line-height: 45px;
}

/* Menú lateral (MainNavigation) 
#mainnavigation {
    background-color: #212F3D !important;
}*/

.nav-header {
    background-color: #1C2833 !important;
    margin: 0;
    color: gray;
    font-weight: bold;
    text-align: left;
}

#menu_lateral .nav-item {
    background-color: #273746 !important;
}

#menu_lateral .nav-treeview {
    color: #566573 !important;
}

#menu_lateral a {
    color: white !important;
}

#menu_lateral a:hover {
    background-color: #212F3D !important;
    margin-left: 4px;
    color: white !important;
}


/* Tamaño de la imagen del usuario */
.imgperfil {
    width: 15%;
    height: 15%;
}

.imgperfil2 {
    max-height: 100px;
    max-width: 100px;
}

/* Colocamos la opción de buscar abajo del menú lateral */
#buscar {
    position: absolute;
    bottom: 0;
    padding-top: 5px;
    border-top: 1px solid white;
}

/* Fin Menú lateral */
/* **************** */

/* borde superior de los formularios */
.borde-superior {
    border-top: 4px solid #0dcaf0 !important;  info 
}

.borde-superior2 {
    border-top: 4px solid #343a40 !important; /* dark */ 
}

.borde-superior3 {
    border-top: 4px solid #00ff21 !important; /* verde */
}

.borde-superior4 {
    border-top: 4px solid #FFA500 !important; /* naranja */
}

/* Opciones para el Grid */
/* Color personalizado para los botones de menú y cabecera del Grid */
#idDivGridSearch thead {
    color: black;
}

#idDivGridSearch .btn-grid {
    background-color: #EAECEE !important;
    border: 1px solid #343a40;
    color: #343a40 !important;
}

#idDivGridSearch .btn-grid:hover {
    background-color: var(--ituc2_hover) !important;
    color: white !important;
}

#idDivGridSearch tr:hover {
    background-color: var(--secondary) !important;
    color: white;
    cursor: pointer;
}

/* Opciones para la gestión del menú */
#Menu a {

}
#Menu .header {
    color: white !important;
    font-size: 1.1rem;
    font-weight: bold;
}
#Menu .link {
    color: #343a40 !important;
    font-size: 1rem;
    font-weight: bold;
}

#Menu .tree {
    color: #343a40 !important;
    font-size: 0.9rem;
}

#tree .row:hover {
    background-color: #fcfcfc !important;
    color: white !important;
    cursor: pointer;
}

h6 a:hover {
    text-decoration: none !important;
    color: red !important;
    cursor: move;
}

.form-group, .checkbox {
    display: inline-block;
}
.btn-gridoperacion {
    background-color: transparent !important;
    color: black;
}

.capa-draggable {
    width: 200px;
    background-color: #3498db;
    color: #fff;
    position: absolute;
    cursor: grab;
}

.capamodal {
    /*INI VMM 2024-10-08 Arreglar el problema del modal de edición que no funcionaba en edge y chrome*/
    /*position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
    width: 90%;
    height: 75%;
    min-height: max-content;
    z-index: 100;*/
    position: absolute;
    top: 50%; /* Para centrar verticalmente */
    left: 50%; /* Para centrar horizontalmente */
    transform: translate(-50%, -50%); /* Ajuste para que el modal esté en el centro */
    width: 90%; /* Ajusta el ancho del modal */
    height: 80%;
    z-index: 100; /* Asegura que esté encima de otros elementos */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    /*FIN VMM 2024-10-08 Arreglar el problema del modal de edición que no funcionaba en edge y chrome*/
}

.ResultsArchetypedDataCharts {
    width: 100%;
   
    background-color: #f0f0f0; /* Color de fondo para visualización */
    border: 1px solid #ccc; /* Borde para visualización */
}
.amchartdiv {
    width: 100%;
    height: 300px;
}

/*INI VMM 2024-05-13 Cambio de forma de cursor en paginacion para Objetos */
.custom-link {
    color: blue;
    text-decoration: underline;
    cursor: default; /* Default cursor style */
}

.custom-link-off {
    color: grey;
    cursor: default; /* Default cursor style */
}

.flex-container {/*VMM 2024-05-15 Para alinear a la derecha la input de busqueda en pantalla de perfiles*/
    display: flex;
    justify-content: flex-end;
}
/*FIN VMM 2024-05-13 Cambio de forma de cursor en paginacion para Objetos */


/*INI VMM 2024-06-26 Cambiar el color de la letra de los elementos de un combo multicheck. Viene del select2.min.css. Sobreescribimos aqui*/
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #e4e4e4;
    border: 1px solid #aaa;
    border-radius: 4px;
    cursor: default;
    float: left;
    margin-right: 5px;
    margin-top: 5px;
    padding: 0 5px;
    /*color: #fff;*/ /*Antes de color blanco ahora negro, antes no se veia bien*/
    color: #007bff !important;
    font-weight: bold; /* Ponemos negrita que se ve mejor*/
}
/*FIN VMM 2024-06-26 Cambiar el color de la letra de los elementos de un combo multicheck*/

/*INI VMM 2024-06-26 Alinear en una sola fila el combo y los botones de busqueda, edicion,... Viene del adminlte.min.css. Sobreescribimos aqui*/
.input-group {
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    /*flex-wrap: wrap;*/ /*Antes saltaba de linea*/
    flex-wrap: nowrap !important;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}
/*FIN VMM 2024-06-26 Alinear en una sola fila el combo y los botones de busqueda, edicion,...*/

/*/INI VMM 2024-010-01 Bloqueo para divs de informacion extendida de un IDCAMPO de una entidad*/
.bloqueado {
    pointer-events: none; /* Deshabilita clicks e interacciones */
    opacity: 0.7; /* Cambia la opacidad para parecer deshabilitado */
}
/*FIN VMM 2024-010-01 Bloqueo para divs de informacion extendida de un IDCAMPO de una entidad*/

/*INI VMM 2024-10-07 Ajustar el modal de los reports al contenido para que no quede todo muy apretado*/
.reports-modal-size {
    width: 75% !important; /* Ajusta el tamaño del modal */
    max-width: none !important; /* Desactiva límites máximos predefinidos */
}
/*FIN VMM 2024-10-07 Ajustar el modal de los reports al contenido para que no quede todo muy apretado*/

/*VMM 2024-10-15 Centrar en la pestaña de informes-reports*/
informes_reports {
    width:auto;
    height:auto;
    max-height:100%;
    max-width:100%;
}


/*INI VMM 2024-10-30 Para uso de listas especiales de la pagina de prferencias*/
.fixed-dropdown {
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 10px;
    position: relative;
    max-height: 400px; /* Altura máxima para scroll */
    overflow-y: auto; /* Scroll vertical si es necesario */

    width: 400px; /* Ancho fijo */
    height: 500px; /* Alto fijo */
    /*padding: 0.375rem 0.75rem;*/ /* Ajuste de padding para centrar texto */
}
.selected-options {
    margin-bottom: 10px;
}
.option-item {
    display: flex;
    align-items: center;
    padding: 5px 0;
    cursor: pointer;
}
.option-item input[type="checkbox"] {
    margin-right: 10px;
}

.fixed-dropdown.bg-primary {
    background-color: #ffffff !important; /* Blanco */
    color: #000 !important;
    text-transform: uppercase !important; /* Convertir a mayúsculas (opcional) */
    font-weight: normal !important; /* Quitar la negrita */
    font-size: 14px !important;
}
.btn.btn-primary.btn-color-custom {
    background-color: #EAECEE !important;
    border: 1px solid #343a40 !important;
    color: #343a40 !important;
    font-weight: bold !important;
}
/*FIN VMM 2024-10-30*/
/*INI 2024-11-13 capas para el modal de edicion basic*/
.capamodalbasic {
    position: fixed;
    z-index: 100; /* Encima de otros elementos */
    left: 0;
    top: 0;
    width: 100%; /* Ocupa toda la pantalla */
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Fondo oscuro semitransparente */
    display: flex;
    align-items: center; /* Centrado vertical */
    justify-content: center; /* Centrado horizontal */
}

/* Estilos para el contenido del modal basic*/
.modalbasic-contenido {
    background-color: white;
    left: 15%;
    top: 15%;
    width: 70%;  /*Ancho del modal */
    height: 40%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra en el modal */
    position: relative;
}
/*FIN 2024-11-13 capas para el modal de edicion basic*/


.textarea-resize { /*VMM 2024-11-19 hacer que los textareas se puedan expandir hacia la decha y hacia abajo*/
    resize: both;
    max-width: 500px; /* Ancho máximo */
    max-height: 500px; /* Alto máximo */
    min-width: 200px; /* Ancho mínimo */
    min-height: 200px; /* Alto mínimo */
}

.textarea-resize-basic { /*VMM 2024-11-19 hacer que los textareas se puedan expandir hacia la decha y hacia abajo*/
    resize: both;
    max-width: 500px; /* Ancho máximo */
    max-height: 500px; /* Alto máximo */
    min-width: 300px; /* Ancho mínimo */
    min-height: 30px; /* Alto mínimo */
}

.titulo_preferencias { /*VMM 2024-12-16 Titulo en pantalla de Preferencias*/
    font-weight: bold;
    color: black;
    font-size: 20px;
    background-color: #E4ECEF;
    border: 1px solid #688fb8;
    margin: 5px;
}


/*INI VMM 2025-01-21 Pantalla de Contenidos/TVs para listas dual*/
.dual-listbox-container {
    display: flex;
    justify-content: space-between;
}
.list-container {
    width: 45%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow-y: auto;
    max-height: 500px;
}
.list-container h5 {
    text-align: center;
}
.list-header, .list-item {
    display: flex;
    justify-content: space-between;
    padding: 5px;
}
.list-header {
    font-weight: bold;
    border-bottom: 2px solid #000;
}
.list-item {
    border-bottom: 1px solid #eee;
    cursor: pointer;
}
.list-item:hover {
    background-color: #f9f9f9;
}
.list-item.selected {
    background-color: #007bff;
    color: white;
}
.list-item span, .list-header span {
    flex: 1;
    text-align: center;
}
.list-item span:first-child, .list-header span:first-child {
    text-align: left;
}
.list-item span:last-child, .list-header span:last-child {
    text-align: right;
}
.btn-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
}
.btn-container button {
    margin: 5px;
}
/*FIN VMM 2025-01-21 Pantalla de Contenidos/TVs para listas dual*/

/*INI VMM 2025-02-14 ajuste de cards para treeview en busquedas*/
/*.card-treeview {*/
    /*justify-content: flex-start; /* Alinea los elementos a la izquierda */
    /*align-items: center; /* Opcional: Alinea verticalmente al centro */
    /*margin-left: 0 !important; /* Alinea la card a la izquierda */
    /*    margin-right: auto;
    margin-left: auto;*/
    /*margin: 0 !important;
}*/

.container-treeview {
    margin-left:10px !important;
}

.card-body-treeview {
    flex: 0 0 auto;
    padding: 0.3rem;
}

.jsgrid-treeview-colapse {
    border: 0px;
    background-color: transparent; /* Fondo transparente */
}
/*FIN VMM 2025-02-14 ajuste de cards para treeview en busquedas*/


.alignedSuperpuestoTitleCensus {
    position: absolute;
    top: -12px;
    left: 12px;
    background-color: #ffffff;
    padding: 0 12px;
    border: 1px solid #688fb8;
    border-radius: 4px;
    font-weight: bold !important;
    /*color: #0dcaf0;*/
    color: #0062cc !important;
}

/*INI VMM 2025-07-24 Para indicadores de orden en duallistboxes de contenidos*/
.sortable {
    cursor: pointer;
    user-select: none;
}

.sorted-asc::after {
    content: " ▲";
    font-size: 0.8em;
}

.sorted-desc::after {
    content: " ▼";
    font-size: 0.8em;
}
/*FIN VMM 2025-07-24 Para indicadores de orden en duallistboxes de contenidos*/

/*VMM 2025-08-07 Para hacer mas grande el area de texto en caso de los Mensajes/Observaciones en Censo*/
.textarea-grande {
    height: 150px !important;
    width: 1000px !important;
}

/*INI VMM 2025-08-25 Censo. Ajustes de los textareas*/
.textarea-fill,
.textarea-fill > div {
    display: flex;
    flex-direction: column;
    height: 100% !important;
}
/* El textarea dentro del helper */
.textarea-fill textarea {
    flex: 1 1 auto;
    width: 100% !important;
    min-height: 0;
    box-sizing: border-box;
    resize: none;
    overflow-y: auto;
}
/*FIN VMM 2025-08-25


/*INI VMM 2025-08-21 Censo, ajuste de campos generados en edicion para que no tengan tanta separacion entre ellos*/
/* 1) Quita cualquier margen que metan los helpers (mb-*, etc.) */
.compact-fields [class*="mb-"] {
    margin-bottom: 0 !important;
}
/* 2) Compacta cada fila generada */
.compact-fields .row.align-items-center {
    --bs-gutter-y: 0; /* sin gutter vertical */
    margin-top: 0 !important;
    margin-bottom: 0 !important; /* la separación la daremos con gap */
}
/* 3) Quita padding vertical en columnas para que no “crezca” la fila */
.compact-fields .row.align-items-center > [class^="col-"],
.compact-fields .row.align-items-center > [class*=" col-"] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
/* 4) Asegura label e input compactos */
.compact-fields .col-form-label {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.2;
}
.compact-fields input.form-control {
    margin: 0 !important;
}
/* 5) Por si el helper mete <br> para espaciar */
.compact-fields br {
    display: none !important;
}
/* 6) Define tú el espacio entre filas (ajusta a gusto) */
.compact-fields {
    display: flex;
    flex-direction: column;
    gap: 0.00rem !important; /* ⇽ separación final entre un campo y otro */
}
/*FIN VMM 2025-08-21 Censo, ajuste de campos generados en edicion para que no tengan tanta separacion entre ellos*/