@import 'REL.Web.Client.h9fh5563ea.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-hkehj16sic] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-hkehj16sic] {
    flex: 1;
}

.sidebar[b-hkehj16sic] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-hkehj16sic] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-hkehj16sic]  a, .top-row[b-hkehj16sic]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-hkehj16sic]  a:hover, .top-row[b-hkehj16sic]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-hkehj16sic]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-hkehj16sic] {
        justify-content: space-between;
    }

    .top-row[b-hkehj16sic]  a, .top-row[b-hkehj16sic]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-hkehj16sic] {
        flex-direction: row;
    }

    .sidebar[b-hkehj16sic] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-hkehj16sic] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-hkehj16sic]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-hkehj16sic], article[b-hkehj16sic] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-hkehj16sic] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-hkehj16sic] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/Posta/LayoutPosta.razor.rz.scp.css */
/* Barra de la pantalla de posta, en CSS puro: este layout no monta componentes de MudBlazor a
   propósito (ver el comentario del .razor). El color es el primario del tema por defecto de
   MudBlazor, el mismo que usa el resto del sitio, escrito a mano porque aquí no hay
   MudThemeProvider que emita las variables. */
.rel-posta-barra[b-g0tm6xrlny] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    background-color: #594AE2;
    color: #FFFFFF;
    /* Se queda arriba al desplazar: en el cerro se carga con una mano y la lista puede ser larga. */
    position: sticky;
    top: 0;
    z-index: 10;
}

.rel-posta-titulo[b-g0tm6xrlny] {
    font-size: 1.15rem;
    font-weight: 500;
}

.rel-posta-volver[b-g0tm6xrlny] {
    color: #FFFFFF;
    text-decoration: none;
    font-size: 0.9rem;
    /* Área de toque generosa: esto se usa con el pulgar, de pie y con prisa. */
    padding: 0.5rem 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 4px;
    white-space: nowrap;
}

.rel-posta-volver:hover[b-g0tm6xrlny],
.rel-posta-volver:focus-visible[b-g0tm6xrlny] {
    background-color: rgba(255, 255, 255, 0.15);
}

.rel-posta-cuerpo[b-g0tm6xrlny] {
    display: block;
}
/* /Components/Layout/Publico/LayoutPublico.razor.rz.scp.css */
.rel-marca[b-tnaiwxik3w] {
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
}

/* ---- Alternancia de navegación por CSS puro (sin MudHidden) ---------------------------------
   MudHidden decide qué rama mostrar por JS interop contra un circuito Blazor vivo, y esta zona es
   SSR estático (sin @rendermode): sin circuito, ninguna de las dos ramas de MudHidden llegaba a
   renderizar nada — la barra entera (Inicio, Resultados, Inscripción) era invisible para todo el
   mundo. Corregido con dos contenedores + "@media", igual que ya hacía .rel-nav-movil (que SÍ era
   CSS puro) — ver LayoutPublico.razor. 960px es el borde "md" de MudBlazor (el mismo breakpoint
   que usaba Breakpoint.SmAndDown/MdAndUp), para no cambiar en qué ancho cambia la barra. */
.rel-nav-escritorio[b-tnaiwxik3w] {
    display: none;
    align-items: center;
}

@media (min-width: 960px) {
    .rel-nav-escritorio[b-tnaiwxik3w] {
        display: flex;
    }

    .rel-nav-movil[b-tnaiwxik3w] {
        display: none;
    }
}

.rel-nav-movil[b-tnaiwxik3w] {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    padding: 0.5rem 1rem;
    background: #24462F;
    white-space: nowrap;
}

.rel-nav-movil a[b-tnaiwxik3w] {
    color: #F7F5F0;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.rel-nav-movil a:hover[b-tnaiwxik3w],
.rel-nav-movil a:focus-visible[b-tnaiwxik3w] {
    text-decoration: underline;
}

.rel-pie[b-tnaiwxik3w] {
    margin-top: 3rem;
    padding: 0 0 1.5rem;
    background: #F0EEE7;
}

/* Membrete institucional ASIV: franja apaisada, ancho completo, encima del texto del pie.
   object-fit: contain (no cover) porque la pieza trae texto de borde a borde — recortarla se
   comería el sello WOTS Gilwell o el nombre completo de la agrupación. */
.rel-pie-membrete[b-tnaiwxik3w] {
    width: 100%;
    max-height: 90px;
    object-fit: contain;
    background: #3A5A2A;
    display: block;
    margin-bottom: 1.5rem;
}

.rel-pie-privacidad[b-tnaiwxik3w] {
    text-align: left;
}

@media (min-width: 600px) {
    .rel-pie-privacidad[b-tnaiwxik3w] {
        text-align: right;
    }
}

/* Salir es un <form> y no un <a> -por seguridad, ver el comentario del layout-, pero tiene que
   seguir viendose exactamente igual que los demas accesos de la barra. El form no debe ocupar
   ni empujar nada: de ahi el display:inline y el margen a cero. */
.rel-nav-salir[b-tnaiwxik3w] {
    display: inline;
    margin: 0;
    padding: 0;
}

/* El boton de la barra movil se disfraza del <a> que era: mismas reglas que ".rel-nav-movil a". */
.rel-nav-salir-boton[b-tnaiwxik3w] {
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
    color: #F7F5F0;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
}

.rel-nav-salir-boton:hover[b-tnaiwxik3w],
.rel-nav-salir-boton:focus-visible[b-tnaiwxik3w] {
    text-decoration: underline;
}
/* /Components/Pages/Acceso/Acceso.razor.rz.scp.css */
/* Estilos propios de la pantalla de acceso.
   Van en CSS aislado (Acceso.razor.css) y no en un <style> dentro de la página porque la política
   de seguridad de contenido del sitio no permite scripts en línea y conviene no acostumbrarse a
   meter nada en línea: el archivo aislado se sirve desde el propio dominio y entra por
   REL.Web.styles.css, que App.razor ya carga. */

.rel-formulario[b-5ezcast8vj] {
    display: flex;
    flex-direction: column;
}

.rel-etiqueta[b-5ezcast8vj] {
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
    opacity: 0.85;
}

/* Texto de ayuda bajo un campo. Mas apagado que la etiqueta: explica, no pide. */
.rel-ayuda[b-5ezcast8vj] {
    font-size: 0.78rem;
    line-height: 1.35;
    opacity: 0.7;
}

.rel-campo[b-5ezcast8vj] {
    width: 100%;
    box-sizing: border-box;
    padding: 0.7rem 0.75rem;
    font-size: 1rem;
    font-family: inherit;
    color: inherit;
    background: transparent;
    border: 1px solid rgba(128, 128, 128, 0.5);
    border-radius: 4px;
}

.rel-campo:focus[b-5ezcast8vj] {
    outline: none;
    border-color: var(--mud-palette-primary, #594ae2);
    box-shadow: 0 0 0 1px var(--mud-palette-primary, #594ae2);
}

/* El código se lee de un vistazo mientras se copia del correo. */
.rel-codigo[b-5ezcast8vj] {
    font-size: 1.6rem;
    letter-spacing: 0.5rem;
    text-align: center;
}

.rel-enlace[b-5ezcast8vj] {
    color: var(--mud-palette-primary, #594ae2);
    text-decoration: none;
}

.rel-enlace:hover[b-5ezcast8vj] {
    text-decoration: underline;
}

/* El botón de salir va dentro de un <form> (POST): un cierre de sesión por GET lo dispararía
   cualquier página ajena con una etiqueta <img>. El formulario no debe ocupar espacio propio. */
.rel-forma-en-linea[b-5ezcast8vj] {
    display: inline;
}
/* /Components/Pages/Acceso/Denegado.razor.rz.scp.css */
/* Ver la nota de Lobby.razor.css: el CSS aislado de Blazor es por componente. */

.rel-enlace[b-4sc7gyh4mo] {
    color: var(--mud-palette-primary, #594ae2);
    text-decoration: none;
}

.rel-enlace:hover[b-4sc7gyh4mo] {
    text-decoration: underline;
}

.rel-forma-en-linea[b-4sc7gyh4mo] {
    display: inline;
}

.rel-boton-enlace[b-4sc7gyh4mo] {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    color: var(--mud-palette-primary, #594ae2);
}

.rel-boton-enlace:hover[b-4sc7gyh4mo] {
    text-decoration: underline;
}
/* /Components/Pages/Acceso/Lobby.razor.rz.scp.css */
/* Estilos aislados del lobby. Se repiten los del acceso porque el CSS aislado de Blazor es por
   componente: cada .razor solo ve su propio .razor.css. Duplicar cuatro reglas es preferible a
   inventar un archivo global que luego nadie sabe quién usa. */

.rel-enlace[b-1322ev6mb5] {
    color: var(--mud-palette-primary, #594ae2);
    text-decoration: none;
}

.rel-enlace:hover[b-1322ev6mb5] {
    text-decoration: underline;
}

/* El formulario de cierre de sesión no debe romper la línea de enlaces. */
.rel-forma-en-linea[b-1322ev6mb5] {
    display: inline;
}

/* Un botón con aspecto de enlace: la acción es un POST (con token antifalsificación), pero para
   el usuario tiene que parecer lo que es, un enlace más. */
.rel-boton-enlace[b-1322ev6mb5] {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    color: var(--mud-palette-primary, #594ae2);
}

.rel-boton-enlace:hover[b-1322ev6mb5] {
    text-decoration: underline;
}
