/*@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700');*/

/* COLORES
* #cc0000 rojo ur. Uso recomendado: enlaces, botones muy visibles e iconos destacados.
* #990000 matiz oscuro 1. Uso recomendado: enlaces, botones muy visibles e iconos destacados. (botones y enlaces)
* #660000 matiz oscuro 2. Uso recomendado: enlaces, botones muy visibles e iconos destacados.
* #ec9f9f matiz muy claro. Uso: fondos.
* #c1002c matiz cabecera
* #e68080 botones deshabilitados
* #c0e2e0 matiz claro verde secundario. Uso: fondos destacados.
* #a5d7d2 matiz oscuro verde secundario. Uso: fondos destacados.
* #59aca3 matiz oscuro mensajes destacados
* #ff3232 texto error
* #2d373c gris oscuro. Uso: texto, líneas finas y fondos.
* #46505a gris medio. Uso: texto, líneas y fondos.
* #6b737b gris intermedio
* #eaebec gris claro. Uso: líneas y fondos.
* #f6f6f6 gris muy claro Uso: líneas y fondos. Fondo mensajes error y cabecera de fichas
* #129fea borde campo formulario activo

*/
/* Configuración de los Material Icons de Google Fonts mediante Autohosting */
@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

@font-face {
    font-family: 'Material Icons Outlined';
    font-style: normal;
    font-weight: 400;
    src: url(https://fonts.gstatic.com/s/materialiconsoutlined/v109/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUce.woff2) format('woff2');
}

.material-icons-outlined {
    font-family: 'Material Icons Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.material-symbols-outlined {
    vertical-align: -.2em;
    /* padding-right: 0.5em;*/
}

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 100 700;
    src: url(https://fonts.gstatic.com/s/materialsymbolsoutlined/v179/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2) format('woff2');
}

.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -moz-font-feature-settings: 'liga';
    -moz-osx-font-smoothing: grayscale;
}
html {
    font-size: 0.95em;
    height: 100%;
}
body {
    min-height: 100%;
    display: grid; grid-template-rows: auto auto 1fr auto;
}

a {
    color:#990000;
    text-decoration: none;
}
a:hover {
    color:#660000;
    text-decoration: underline;
}
header {
    background-color: #cc0000;
    background-image: url("../images/logo_ur.png");
    background-repeat: no-repeat;
    background-position: left top;
    font-size: 1.05em; /* al meter un 0.95em de tamaño del texto en todo el html tenemos que devolver la fuents de la cabecera a su tamaño original */
    min-height: 5em;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

header .titulo-servicio {
    color: #fff;
    padding-left: 210px; /* ancho del logo (icono + texto "UNIVERSIDAD DE LA RIOJA") */
    white-space: nowrap;
    padding-bottom: 16px;  /* pequeño margen respecto al borde inferior */
    align-self: flex-end; /* esto lo pega abajo en vez de centrarlo */
}

@media only screen and (max-width: 430px) {
    header {
        background-image: url("../images/logo_ur_movil.png");
    }
    header .titulo-servicio {
        display: none; /* en móvil no cabe junto al resto, mejor ocultarlo */
    }
}

header h1 {
    text-align: right;
    margin: 0 0.3em 0.5em 1.5em;
    padding-top: 0.6em;
    line-height: 0.85em;
}
header h1 a {
    color: #fff;
    /*font-family: "Open Sans";*/
    font-size: 0.7em;
    font-weight: 700;
    letter-spacing: 0.01rem;
    line-height: 1.2em;
    text-decoration: none !important;
}
header h1 a:hover {
    color: #fff;
}

.cabecera {
    display:flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: space-between; /* items are evenly distributed in the line; first item is on the start line, last item on the end line*/
}

.nav-entrada {
    background-color: #fff;
    color: #000;
    border-bottom: 1px solid #990000;
}

.nav-menu {
    background-color: #2d373c;
}
.nav-menu .material-icons {
    color: #eaebec;
}
.nav-entrada .nav-link {
    color:#990000;
}
body > header {
    position: fixed;
    top: 0;
    left:0;
    z-index:1031;
}
body > header + * {
    margin-top: 79px;
}
div.container-fluid > div >nav + main
{
  margin-left: 280px;

}
.menu_lateral{
    background-color: #2d373c;
    color: #eaebec;
    font-size: 0.9em;
    width: 280px;
    position: fixed;
    top: 79px;
    left: 0;
    bottom: 0;
    z-index: 1030;
    overflow: visible;
    overflow-y: auto;
    /*min-height: 100vh; /* As we do not know if the content will vertically fill the entire screen, we will set the minimum height of the sidebar to 100vh. vh is a CSS unit that refers to the viewport height.
                        This means that the initial height of the sidebar will be at least equal to the screen height. Also, its height will increase when the page content would increase. */
    /*border-right: 2px solid #2d373c;*/
}
.menu_lateral .nav-link, .menu_lateral .nav-link a, .menu_lateral .nav-item a, .menu_lateral{
    color: #eaebec;
}
.menu_lateral .material-icons {
    padding-right: 0.1em;
}

.admin .material-icons{
    color: #a5d7d2;
}
.solic .material-icons{
    color: #ec9f9f;
}
.menu_lateral a:hover, .menu_lateral button:hover, .menu_lateral_activo {
    color: #fff;
    background-color: #46505a !important;
    text-decoration: none;
    border-radius: .25rem;
}
.menu_lateral a:focus{
    color: #fff;
    text-decoration: none;
}
.menu_lateral #submenubecas .material-icons, .menu_lateral #submenugestion .material-icons {
    /*font-size: 1.3em;*/
    color: #eaebec;
}
/* dropdowns */
.dropdown-item:hover, .dropdown-item:active, .dropdown-item:focus {
    background-color: #eaebec;
}

/* dropdown-claro: variante clara para la barra de navegación superior */
.dropdown-claro.dropdown-toggle:hover,
.dropdown-claro.dropdown-toggle:active,
.dropdown-claro.dropdown-toggle:focus {
    text-decoration: none;
}

.dropdown-claro.dropdown-item.boton-sin-sombra,
a.dropdown-claro.dropdown-item {
    color: #990000;
}

.dropdown-claro.dropdown-item:hover,
.dropdown-claro.dropdown-item:active,
.dropdown-claro.dropdown-item:focus {
    background-color: #f8f9fa;
    text-decoration: none;
}

.nav-entrada .dropdown-menu {
    background-color: #fff;
    border: 1px solid #eaebec;
    min-width: 280px;
}

.nav-entrada .dropdown-menu .material-symbols-outlined {
    color: #990000;
    font-size: 1em;
    vertical-align: -.15em;
}

.nav-roles-lista {
    list-style: disc;
    padding-left: 1.5rem;
    margin-bottom: 0;
}

.nav-roles-lista li {
    color: #2d373c;
}

.nav-sidebar .dropdown-menu {
    background-color: #fff;
    border: 1px solid #eaebec;
    min-width: 200px;
}

.nav-sidebar .dropdown-menu .material-symbols-outlined {
    color: #990000;
    font-size: 1em;
    vertical-align: -.15em;
}
footer {
    background-color: #2d373c;
}

/* al meter un 0.95em de tamaño del texto en todo el html tenemos que devolver las fuentes del login a su tamaño original */
.acceso {
    font-size: 1.05em;
}
.acceso input, .acceso button {
    font-size: 1em;
}

.obligatorio {
    color:#990000;
}

.encabezado {
    background-color: #eaebec;
    padding: 5px;
}

.encabezado-rosa {
    background-color: #eec0cb;
    padding: 15px;
}
.error {
    color:red;
    font-weight: bold;
}
.oculto{
    display: none;
}
.inactivo {
    color: #6b737b;
    font-style: italic;
}

.material-icons, .material-icons-outlined {
    vertical-align: -.2em;
    padding-right: 0.3em;
    white-space: nowrap;
}

.material-icons.entrada, .material-icons-outlined.entrada {
    padding-right: 0;
}

.material-icons.error, .material-icons-outlined.error {
    font-size: 5em;
    color:red;
}

.icon-button {
    display: inline-block;
    background-color: #007bff;
    border: none;
    border-radius: 4px;
    padding: 10px 20px;
    cursor: pointer;
}

.icon-button--no-bg {
    background-color: transparent;
}

.recortado {
    max-width: 350px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.zona-requisitos {
    height: 25em;
    overflow: auto;

}

/* modificaciones de elementos de bootstrap */

/* botones */
.btn-primary.disabled, .btn:disabled{
    background-color: #C46D6D;
    border-color: #C46D6D;
}

.btn:hover {
    text-decoration: initial;
}
.btn-primary {
    background-color: #990000;
    border-color: #990000;
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus {
    background-color: #660000;
    border-color: #660000;
}
.btn-outline-primary {
    color: #990000;
    border-color: #990000;
}
.btn-outline-primary:hover, .btn-outline-primary:active, .btn-outline-primary:focus {
    background-color: #eaebec;
    color: #990000;
    border-color: #990000;
}
.btn-outline-secondary {
    color: #46505a;
    border-color: #46505a;
}
.btn-outline-secondary:hover,  .btn-outline-secondary:active, .btn-outline-secondary:focus {
    background-color: #46505a;
    border-color: #46505a;
}
btn-outline-light {
    color: #eaebec;
    border-color: #46505a;
}
.btn-outline-light:hover, .btn-outline-light:active, .btn-outline-light:focus {
    background-color: #eaebec;
    border-color: #46505a;
}
.btn-link {
    color:#990000;
    text-decoration: none;
}
.btn-link:hover {
    color:#660000;
    text-decoration: underline;
}


.boton-detalles {
    font-size: 0.75em;
    padding: 0.3em;
    margin: 0;
    /*line-height: 1.2em;*/
}
.boton-sin-sombra.btn-check:focus, .boton-sin-sombra.btn:focus {
    box-shadow: none;
    color: white !important;
}
.boton-info {
    color: #2F66CD;
    border: 0px;
    padding: 0px
}
.boton-info:hover, .boton-info:focus {
    color: #1D4080;
}

.boton-verde {
    color: #008000;
    border: 0px;
    padding: 0px
}
.boton-verde:hover, .boton-verde:focus {
    color: #0B6730;
}

.boton-rojo {
    color: #800000;
    border: 0px;
    padding: 0px
}
.boton-rojo:hover, .boton-rojo:focus {
    color: #4C0E0E;
}

.form-check-input {
    border: 1px solid rgba(0,0,0,.35);
}

/* page-links */
.pagination {
    font-size: 0.8em;
}
.page-link, .page-link:hover {
    color:#660000;
}
.page-item.active .page-link {
    background-color: #660000;
    border-color: #660000;
}

/* cards */
.card-header {
    color: #2d373c;
    background-color: #eaebec;

}
.pregunta-card {
    background-color: #fbfcfc; /*eff8f7*/
    border: 2px solid rgba(0,0,0,.3);
}

.card-sin-borde {
    border: none !important;
}

/* forms */
.input-group-text {
    font-size: 0.75rem;
}




/* containers */
.container-footer {
    width: auto;
    padding: 0 15px;
    color: #eaebec;
    font-size: 0.75rem;
}

/* accordions */
.accordion{
    border: 1px solid;
    border-color: #ccc;
}
.accordion-header {
    background-color: #c0e2e0;
}
.accordion-button:not(.collapsed) {
    padding:0.5rem;
    color: #2d373c;
    background-color: #eaebec;
}
.accordion-button.collapsed {
    padding:0.5rem;
    color: #2d373c;
    background-color: #eaebec;
}
.accordion-item:first-child > .accordion-header{
    background-color: #F00;
}

.accordion-requisitos, .accordion-documentacion, .accordion-preguntas {
    border:0;
}
.accordion-requisitos .accordion-item, .accordion-documentacion .accordion-item, .accordion-preguntas .accordion-item {
    border:0;
}
.accordion-requisitos .accordion-header, .accordion-documentacion .accordion-header, .accordion-preguntas .accordion-header,
.accordion-requisitos .accordion-item:first-child > .accordion-header, .accordion-documentacion .accordion-item:first-child > .accordion-header, .accordion-preguntas .accordion-item:first-child > .accordion-header {
    background: none;
}
.accordion-requisitos .accordion-button, .accordion-documentacion .accordion-button, .accordion-preguntas .accordion-button  {
    background: none;
    color: #990000;
}

/* nav tabs */
.nav-link {
    color: #CC0000;
}
.nav-tabs .nav-link.active {
    font-weight: bold;
    text-decoration: none;
}
.nav-tabs .nav-link:hover {
    text-decoration: none;    
}
.nav-link:hover {
    color: #000;
}

.alert-success{
    border-color: #a5d7d2;
    background-color: #c0e2e0;
}
/*
.alert-warning, .alert-danger{
    border-color: #46505a;
    background-color: #46505a;
    color: #FFFFFF;
}*/

.form-check-input:checked {
    background-color: #990000;
    border-color: #990000;
}

/* https://web.dev/drag-and-drop/ */
.preguntas-container {
    display:block;
    gap: 10px;
}

.pregunta-card {
    padding: 10px;
    cursor: move;
}

.pregunta-card.over {
    border: 2px dashed rgba(0,0,0,.3);
    /*  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out ;*/
}

.readonly{
    background-color: #CCC!important;
    cursor: not-allowed;
}

.text-highlight {
    color: #007bff;
    font-weight: bolder;
}

.text-atencion {
    color: #ff7b00;
}
.bg-primary{
    background-color: #900!important;
}

.span-primary{
    color: #990000;
    padding-right: 0.1rem;
    padding-left: 0.1rem;
    font-size: 18px;
}

.cursor-pointer{
    cursor: pointer;
}

.icono-carrousel{
    font-size: 45px;
    cursor: pointer;
    padding-right: 0px;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.list-group-item-secondary{
    opacity: 0.6;
}

.texto-aviso  {
    color:#990000 !important;
    font-size: 13px;
    padding-right: 0.4rem;
}
.texto-aviso-grande  {
    color:#990000 !important;
    font-size: 16px;
    padding-right: 0.4rem;
}

.tooltip-title{
    cursor: pointer;
}
.misma-linea{
    white-space: nowrap;
}

.negrita {
    font-weight: bold;
}

.texto-bd  {
    color:#000099 !important;
    padding-right: 0.4rem;
}

.texto-bd-aviso  {
    color:#990000 !important;
    padding-right: 0.4rem;
}

.texto-grande {
    font-size: 24px;
}
.texto-mediano {
    font-size: 18px;
}

.texto-pequeno {
    font-size: 14px;
}

.spinner {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.nav-solicitante {
    background-color: #2d373c;
}
.nav-solicitante .material-symbols-outlined {
    color: #eaebec;
}
.nav-empresa {
    background-color: #2d373c;
}
.nav-empresa .material-symbols-outlined {
    color: #eaebec;
}
.celda-verde {
    color: #52B788 !important;
}
.celda-roja {
    color: #CB002D !important;
}
.celda-azul {
    color: #0096FF !important;
}
.icono-blanco {
    color: white; /* Cambia el color del icono a blanco */
}
.tableFixHead300 {
    overflow: auto;
    height: 300px;
}
.tableFixHead260 thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}
input.celda-estrecha {
    height: 10px !important;

}

.info-icon {
    color: #990000;
    border-color: #990000;
    cursor: pointer; /* Cambia el cursor a "puntero" */
    transition: color 0.3s ease-in-out;
}
.info-icon:hover, .btn-outline-primary:active, .btn-outline-primary:focus {
    background-color: #FFFFFF;
    color: #990000;
    border-color: #990000;
}

.dropdown-menu, .dselect-wrapper > button{
    padding: .175rem 2.25rem .175rem .75rem;
    text-align: left;
}

.mi-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Separa los párrafos, el primero arriba, el segundo abajo */
    height: 200px; /* Ajusta la altura según necesites */
    /* border: 1px solid #ccc; /* Solo para visualizar los límites */
    padding: 10px;
}

.full-width {
    width: 100%; /* Ocupa todo el ancho */
}

.one-third-width {
    width: 33.33%; /* Ocupa un tercio del ancho */
    align-self: flex-start; /* Se alinea a la izquierda del contenedor */
}

.recuadro {
    border: 3px solid #ccc;
    padding: 6px;
    border-radius: 3px;
    background-color: #FFCCCC;
    margin-top: 15px;
    text-align: center;
}

.recuadro-adjuntar {
    display: inline-flex !important;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    border: 1px solid #990000;
    border-radius: 0.25rem;
    padding: 0.25rem 0.5rem;
    background-color: transparent;
    font-size: 0.875rem;
    margin: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.recuadro-adjuntar input[type="file"] {
    width: auto;
}
.columna-flex {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.sin-mano {
    cursor: help;
}

.tabla-scroll {
    max-height: 500px;   /* ajusta según lo que quieras mostrar */
    overflow-y: auto;    /* scroll vertical */
}

/* Cabecera fija */
.tabla-scroll thead th {
    position: sticky;
    top: 0;
    background: #fff; /* color de fondo para que no se superponga al scroll */
    z-index: 2;
}

.modal-title {
    padding: 4px 8px !important;
    margin: 0 !important;
}

.w-5percent {
    width: 5%;
}
.w-95 {
    width: 95%!important;
}

.tooltip-wide .tooltip-inner {
    max-width: 400px;
    white-space: nowrap;
}
.tooltip-izquierda .tooltip-inner {
    text-align: left;
}
.info-box {
    background-color: #f0f4ff;
    border-left: 4px solid  #990000;
    border-right: 4px solid  #990000;
    padding: 16px 20px;
    border-radius: 6px;
    font-family: sans-serif;
    color: #1e293b;
    line-height: 1.6;
    margin-bottom: 16px;
}

.info-box ol {
    padding-left: 20px;
    margin: 8px 0;
}

.info-box li {
    margin-bottom: 4px;
}

.col-titulacion {
    min-width: 150px;
    max-width: 200px;
    white-space: normal;
    word-break: break-word;
}

.parrafo-quill p {
    margin-bottom: 0;
}

.btn-outline-mi-color {
    color: #000099;
    border-color: #000099;
}

.btn-outline-mi-color:hover {
    background-color:#000099;
    color: white;
}

.centrado {
    text-align: center;
}
.form-label-inline {
    white-space: nowrap;

    font-weight: 500;
    margin-bottom: 0;
}

.campo-fila {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}

.campo-fila .form-control,
.campo-fila .form-select {
    flex: 1;
    min-width: 6rem;
}

.campo-fila-fecha {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}

.campo-fila-fecha .grupo-fecha {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.campo-fila-fecha .form-control {
    width: auto;
}

.boton-deshabilitado {
    pointer-events: none;
    opacity: 0.65;
}