/* TITULO SOLICIT@ */

.titulo-ivace.titulo-solicita .banner .titulo-app{
    background: none;
}
.titulo-ivace.titulo-solicita .banner {
    background-image: url(../img/banner-cas.png.xhtml?ln=default);
    background-repeat: no-repeat;
    background-size: auto 100px;
}
.titulo-ivace.titulo-solicita.titulo-val .banner {
    background-image: url(../img/banner-val.png.xhtml?ln=default);
}
@media screen and (max-width: 992px) {
    .titulo-ivace.titulo-solicita .banner {
        background-image: url(../img/mini-cas.png.xhtml?ln=default);
        background-size: auto 65px;
    }
    .titulo-ivace.titulo-solicita.titulo-val .banner {
        background-image: url(../img/mini-val.png.xhtml?ln=default);
    }
}
                        
/* ENTRADA */
#entrada{
    display: flex;
    height: 100%;
    padding: 1em;
    flex-grow: 1;
    flex-direction: column;
}

/* UI */
.bloque-entrada .ui-button.ui-state-default{
    background: #53579b;
    color: var(--page-background);
    border: none;
    border-radius: 2px;
}
.bloque-entrada .ui-button.ui-state-hover {
    box-shadow: 0 0 20px rgba(0,0,0,0.20);
    border: none;
}
.bloque-entrada .ui-button .ui-button-text {
    padding: .5em 1.5em;
}

/**
** ENTRADA
**/
.contenedor-entrada{
    background-image: url(../img/fondo-entrada.png.xhtml?ln=default);
    background-size: cover;
    background-position: center top;
    border-bottom-left-radius: 10px;
}
.bloque-entrada {
    display: flex;
    flex-direction: row;
    margin: auto 0px;
    text-align: center;
    justify-content: center;
    border-radius: 10px;
    box-shadow: 0 0 30px rgba(0,0,0,0.10);
    overflow: hidden;
    background: url(../img/fondo-entrada-formulario.png.xhtml?ln=default);
    background-color: var(--page-root);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.bloque-entrada .entrada-panel{
    display: flex;
    flex-direction: column;
    padding: 1em;
    flex-basis: 100%;
    background-color: transparent;
    border: none;
    min-width: 50%;
    max-width: 600px;
    overflow: auto;
}
.bloque-entrada #entrada-solicita,
.bloque-entrada #entrada-proximamente{
    background-color: var(--page-background);
}

.bloque-entrada .texto-bienvenida{
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size: 1.5em;
    font-weight: bold;
    text-align: center;
    color: var(--rojo-ivace);
    margin: 0.5em;
}

.bloque-entrada .texto-necesita-ayuda{
    font-family: 'M PLUS Rounded 1c', sans-serif;
    font-size: 1em;
    font-weight: bold;
    text-align: left;
    color: var(--rojo-ivace);
}

.bloque-entrada #entrada-para-pruebas {
    padding: 1em 1em 0em 1em;
    border: 1px solid var(--page-outline);
    border-style: dashed;
    border-radius: 6px;
}
.bloque-entrada .campo {
    margin: 0.5rem 0rem 0rem 0rem;
}
.bloque-entrada .logo-clave{
    margin: 1em;
}
.bloque-entrada .cambiador{
    display: flex;
    flex-direction: row;
    justify-content: space-around; 
    flex-wrap: wrap;
}
.bloque-entrada .cambiador a{
    font-size: 12px;
}
.logo-clave img{
    margin: 1em auto 1em;
    max-width: 100%;
}

/**
** Asistente
**/

#asistente .pasos{
    margin-top: 10px;
    padding: 0px 20px;
    overflow: hidden;
}
#asistente .paso{
    margin: 5px auto;
    padding: 1em;
    border-radius: 6px;
}
#asistente .pasos .paso:hover{
    cursor: default;
    box-shadow: 0 0 50px rgba(0,0,0,0.10);
}
#asistente .titulo{
    font-weight: bold;
}
#asistente .titulo .contador{
    display: inline-block;
    color: var(--page-background);
    background-color: var(--color);
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 50%;
    z-index: 2;
}
#asistente .titulo .accion{
    display: inline-block;
    margin-left: .5em;
}
#asistente .titulo .enlace{
    background-color: rgba(0, 0, 0, 0.04);
    padding: .2em .5em;
    border-radius: .5em;
    text-decoration: none;
    font-size: 1em;
}
#asistente .titulo .enlace:hover {
    background-color: rgba(0, 0, 0, 0.08);
}
#asistente .explicacion{
    margin-left: 3em;
    padding: 1em 0 0 0;
    line-height: 20px;
}


#menu-lateral{
    width: 300px;
    vertical-align: top;
    flex-shrink: 0;
    align-self: flex-start;
}
#sede-central{
    vertical-align: top;
    flex-shrink: 1;
    flex-grow: 1;
    align-self: flex-start;
}

/*
MENU LATERAL
*/
.menu-lateral{
    padding-bottom: 1px;
}
.panel-menu-lateral{
    padding: 0px;
    background-color: var(--page-root);
}
.panel-menu-lateral .ui-panel-content{
    display: flex;
    flex-direction: column;
    padding: 0px 0px .5em 0px;
    background-color: var(--page-root);
}
.panel-menu-lateral .modo-desa-invertido .ui-panel-content{
    background-color: var(--color-desa);
}
.panel-menu-lateral .elemento{
    display: block;
    width: 100%;
    padding: .5em;
    font-size: 1.1em;
    margin: 0px;
}
.panel-menu-lateral .elemento i{
    margin-right: .3em;
}
.panel-menu-lateral .caja{
    display: flex;
    flex-direction: column;
    margin: 0.3em 2em;
    background-color: var(--page-background);
    font-size: 1em;
    text-align: center;   
    border-top-right-radius: 1em;
    border-bottom-right-radius: 1em;
    border-bottom-width: 1px;
    border-bottom-color: var(--color);
    border-bottom-style: solid;
    box-shadow: 0px 0px 2px var(--color);
}
.panel-menu-lateral .toggle{
    cursor: pointer;
}
.panel-menu-lateral .caja .servicio{
    padding: .5em;
    font-size: 1.1em;
    text-decoration: none;
}
.panel-menu-lateral .caja .servicio:hover{
    background-color: var(--color-hover);
}
.panel-menu-lateral .caja .detalle{
    padding: .2em;
    color: var(--azul-ivace);
}
.panel-menu-lateral .caja .detalle:hover{
    background-color: var(--color-hover);
}
.panel-menu-lateral .elemento a, .panel-menu-lateral .caja a{
    text-decoration: none;
    color: inherit;
}
.panel-menu-lateral .elemento a:hover, .panel-menu-lateral .caja a:hover{
    font-weight: bold;
    text-decoration: underline;
}
.panel-menu-lateral #caja-notificaciones #link-pendientes{
    color: #86a212;
}
.panel-menu-lateral #caja-notificaciones #link-leidas{
    color: #53579b;
}
.panel-menu-lateral #caja-notificaciones #link-caducadas{
    color: #CC2222;
}
.panel-menu-lateral .error{
    color: #FF2222;
}
.link_menu_lateral_destacado{
    font-weight: bold;
}



/**
** Otros
**/
.texto-publicidad{
    font-size: 1em;
}
.texto-introductorio, .texto-introductorio.ui-widget{
    font-size: 1.1em;
}

.link-descarga-manual{
    display: block;
    font-size: 1em;
    text-align: center;
    text-transform: uppercase;
    margin: auto;
    padding: 0px 8px;
}


/* LISTA RUTS */
.lista-escoger {
    display: flex;
    flex-direction: column;
    margin: 1em;
    padding: 2em 1em;
    border: 1px solid var(--page-outline);
    border-radius: 6px;
}

.lista-escoger .elemento {
    display: flex;
    align-items: center;
    padding: .8em 1em;
    border-radius: .5em;
}
.lista-escoger .elemento a {
    padding: 0em .2em;
    border-radius: .5em;
    text-decoration: none;
}
.lista-escoger .elemento a:hover{
    text-decoration: underline;
}
.lista-escoger .elemento a i{
    visibility: hidden;
    width: auto;
}
.lista-escoger .elemento a:hover i{
    visibility: visible;
    text-decoration: underline;
}

.lista-escoger .elemento .desdoblable{
    margin-left: auto;
    margin-right: 0px;
}

.ui-widget-content .boton-destacado{
    border: 1px solid #0073ea;
    background: var(--page-background);
    font-weight: bold;
    color: #000000;
}

.sede-flex-row-table{
    margin: 0.5em 0em 0.5em 1em;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    column-gap: 1em;
}
.sede-flex-row-table div:first-child{
    flex-grow: 1;
}
.sede-flex-row-table div:not(:first-child){
    margin-left: 1em;
    flex-grow: 0;
}
.seccion-app{
    margin: 1em 1em 2em 1em;
}
.seccion-app .titulo{
    border-bottom: solid 1px var(--page-shadow);
    width: auto;
    font-weight: bold;
    margin: 1em 0em;
    font-size: 1em;
}
.seccion-app .doble-bold{
    font-weight: bold;
    padding: 1em 0em;
}
.seccion-app .convocatoria, .seccion-app .programa{
    margin: 0em 0em 1em 1em;
}
.seccion-app .actuacion{
    margin: 0em 0em 0.5em 1em;
}
.seccion-app .error{
    color: #FF2222;
    margin: 1em;
}
.seccion-app .empty{
    margin: 1em;
}
.seccion-app .actuacion{
    display: flex;
    flex-direction: row;
}
.seccion-app .actuacion .act-id{
    width: 100px;
    flex-grow: 0;
    flex-shrink: 0;
}
.seccion-app .actuacion .act-desc{
    flex-grow: 1;
}


@media screen and (max-width: 992px) {
    .bloque-entrada {
        background-size: contain;
        background-position: center bottom;
        flex-direction: column;
        align-items: center;
        align-self: center;
        max-width: 600px;
    }
    .bloque-entrada .entrada-panel {
        flex-basis: auto;
        width: 100%;
    }
}