@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-layout[b-xtx2dwbrva] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
}

.auth-layout-content[b-xtx2dwbrva] {
    margin-top: auto;
    margin-bottom: auto;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-2jgvsm1at8] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-2jgvsm1at8] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* article.content: el "contenedor de página" real. Al ser flex:1 dentro de
   main (que ahora es una columna con altura definida en desktop, ver media
   query abajo), esta clase pasa a tener una altura EXACTA y confiable, sin
   necesidad de que cada página adivine un valor en vh.
   overflow-y: auto es lo que hace que, si una página no controla su propio
   scroll interno (la mayoría, ej. Dashboard, listados), la página completa
   siga scrolleando con total normalidad, igual que hoy. */
.content[b-2jgvsm1at8] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}

/* El sidebar es siempre oscuro (chrome de marca), independiente del toggle
   claro/oscuro del área de contenido -- ver ThemeToggle.razor. */
.sidebar[b-2jgvsm1at8] {
    background-image: linear-gradient(180deg, #14101f 0%, #241a3d 100%);
}

.top-row[b-2jgvsm1at8] {
    background-color: var(--bs-body-bg);
    border-bottom: 1px solid var(--bs-border-color);
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-2jgvsm1at8]  a, .top-row[b-2jgvsm1at8]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-2jgvsm1at8]  a:hover, .top-row[b-2jgvsm1at8]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-2jgvsm1at8]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-2jgvsm1at8] {
        justify-content: space-between;
    }

    .top-row[b-2jgvsm1at8]  a, .top-row[b-2jgvsm1at8]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-2jgvsm1at8] {
        flex-direction: row;
        height: 100vh;
    }

    .sidebar[b-2jgvsm1at8] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-2jgvsm1at8] {
        position: sticky;
        top: 0;
        z-index: 1;
        flex-shrink: 0;
    }

    .top-row.auth[b-2jgvsm1at8]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-2jgvsm1at8], article[b-2jgvsm1at8] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-2jgvsm1at8] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    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-2jgvsm1at8] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-cati89isfs] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

    .navbar-toggler:checked[b-cati89isfs] {
        background-color: rgba(255, 255, 255, 0.5);
    }

.top-row[b-cati89isfs] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-cati89isfs] {
    font-size: 1.1rem;
}

.brand-icon[b-cati89isfs] {
    width: 1.5rem;
    height: 1.5rem;
    color: #00e5c7;
    flex-shrink: 0;
}

/* 🌟 CORRECCIÓN DE ALINEACIÓN PARA BOOTSTRAP ICONS REALES */
.bi[b-cati89isfs] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem; /* Tamaño uniforme */
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.85rem; /* Separación perfecta del texto */
    flex-shrink: 0;
}

.nav-item[b-cati89isfs] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-cati89isfs] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-cati89isfs] {
        padding-bottom: 1rem;
    }

    .nav-item[b-cati89isfs]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center; /* Alineación vertical perfecta */
        width: 100%;
        padding: 0 1rem;
    }

    .nav-item[b-cati89isfs]  a.active {
        background-color: rgba(109, 94, 245, 0.45);
        color: white;
    }

    .nav-item[b-cati89isfs]  .nav-link:hover {
        background-color: rgba(255,255,255,0.1);
        color: white;
    }

    /* "Guía de inicio": se destaca del resto de ítems del menú (acento teal de marca). */
    .nav-item[b-cati89isfs]  .guia-inicio-destacada {
        background-color: rgba(255,255,255,0.08);
        border-left: 3px solid #00e5c7;
        color: #f1f1f1;
    }

    .nav-item[b-cati89isfs]  .guia-inicio-destacada:hover {
        background-color: rgba(255,255,255,0.18);
        color: white;
    }

.nav-scrollable[b-cati89isfs] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-cati89isfs] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-cati89isfs] {
        display: none;
    }

    .nav-scrollable[b-cati89isfs] {
        display: block;
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-nune7h6vtw],
.components-reconnect-repeated-attempt-visible[b-nune7h6vtw],
.components-reconnect-failed-visible[b-nune7h6vtw],
.components-pause-visible[b-nune7h6vtw],
.components-resume-failed-visible[b-nune7h6vtw],
.components-rejoining-animation[b-nune7h6vtw] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-retrying[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-failed[b-nune7h6vtw],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-nune7h6vtw] {
    display: block;
}


#components-reconnect-modal[b-nune7h6vtw] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-nune7h6vtw 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-nune7h6vtw 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-nune7h6vtw 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-nune7h6vtw]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-nune7h6vtw 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-nune7h6vtw {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-nune7h6vtw {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-nune7h6vtw {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-nune7h6vtw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-nune7h6vtw] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-nune7h6vtw] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-nune7h6vtw] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-nune7h6vtw] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-nune7h6vtw] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-nune7h6vtw] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-nune7h6vtw 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-nune7h6vtw] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-nune7h6vtw {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Casos/CasoDetalle.razor.rz.scp.css */
/* En mobile: comportamiento normal, la página scrollea completa como
   cualquier otra (igual que Dashboard, listados, etc.). No forzamos
   ningún alto fijo ahí. */
.caso-detalle-container[b-hxgl4vo337] {
    display: flex;
    flex-direction: column;
}

/* Permite que el bloque de título/metadatos del encabezado se trunque en vez
   de forzar el ancho (necesario para que text-truncate funcione dentro de un
   contenedor flex). */
.min-w-0[b-hxgl4vo337] {
    min-width: 0;
}

/* En desktop: esta página SÍ quiere encajar en una sola pantalla (el chat
   con su propio scroll interno, sin scroll de página). Usamos 100% en vez
   de un cálculo en vh -- MainLayout.razor.css ya le da a article.content
   una altura real y exacta vía flexbox, así que este 100% es fiel al alto
   disponible de verdad, sin adivinar. */
@media (min-width: 641px) {
    .caso-detalle-container[b-hxgl4vo337] {
        height: 100%;
        overflow: hidden;
    }
}

/* En desktop ancho (dos columnas lado a lado): la fila ocupa TODO el alto
   restante y cada columna hereda ese alto real. min-height: 0 es la pieza
   clave -- sin él, un hijo flex con flex-grow-1 no se encoge por debajo de
   su contenido, así que la fila (y con ella el chat) no llega a estirarse
   hasta el fondo de la pantalla. */
@media (min-width: 1200px) {
    .caso-detalle-fila[b-hxgl4vo337] {
        min-height: 0;
    }

    .caso-detalle-fila > [class*="col-"][b-hxgl4vo337] {
        min-height: 0;
        height: 100%;
    }
}
/* /Components/Pages/IA/Chatbot.razor.rz.scp.css */
/* CSS for Chatbot component */
/* Clases de apoyo */
.whitespace-pre-wrap[b-cg70c6gnqx] {
    white-space: pre-wrap;
}

.text-xs[b-cg70c6gnqx] {
    font-size: 0.75rem;
}

.border-dashed[b-cg70c6gnqx] {
    border-style: dashed !important;
}


/* Limita la tarjeta del chat para que NUNCA sobrepase el alto de la pantalla */
.chat-card-container[b-cg70c6gnqx] {
    /* 120px es el espacio estimado para el Navbar superior + paddings. Ajusta este valor según tu diseño */
    height: calc(100vh - 120px) !important;
    max-height: calc(100vh - 120px) !important;
    display: flex;
    flex-direction: column;
}

/* Fuerza a que el cuerpo de mensajes sea el ÚNICO que haga scroll.
   min-height: 0 es la parte clave: sin esto, un hijo flex con flex-grow-1
   nunca se encoge por debajo de su contenido, así que en vez de scrollear
   él mismo, empuja al footer (el aviso) fuera del alto visible de la card. */
#chatIaContainer[b-cg70c6gnqx] {
    overflow-y: auto !important;
    scroll-behavior: smooth;
    min-height: 0;
}

/* Tarjetas de fuentes consultadas */
.fuente-card[b-cg70c6gnqx] {
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.fuente-card:hover[b-cg70c6gnqx] {
    background-color: var(--bs-primary-bg-subtle) !important;
    border-color: var(--bs-primary-border-subtle) !important;
}

.fuente-card .min-w-0[b-cg70c6gnqx] {
    min-width: 0;
}

/* Trunca el fragmento de la fuente a 2 líneas de forma prolija, sin cortar a la mitad de una palabra */
.fuente-fragmento[b-cg70c6gnqx] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
/* /Components/Pages/Notificaciones/NotificacionesIndex.razor.rz.scp.css */
/* Antes cada aviso era un item de list-group pegado a los de al lado (sin
   separación visual real entre "cuadros"). Ahora cada aviso es su propia
   tarjeta con espacio real entre ellas (gap-3 en el contenedor) y una
   transición sutil al pasar el mouse, para que la lista se sienta como una
   serie de tarjetas y no como una tabla comprimida. */
.notif-card[b-zkn3npfgaz] {
    width: 100%;
    border-radius: var(--bs-border-radius-lg);
    transition: box-shadow .15s ease, transform .15s ease;
}

.notif-card:hover[b-zkn3npfgaz] {
    box-shadow: 0 .5rem 1.25rem rgba(0, 0, 0, .08) !important;
    transform: translateY(-1px);
}

.notif-card-no-leida[b-zkn3npfgaz] {
    background-color: rgba(var(--bs-primary-rgb), .06);
    border-left: 4px solid var(--bs-primary) !important;
}

/* Permite que el título se trunque (text-truncate) sin que el flex-item lo
   empuje a su ancho de contenido completo. */
.min-w-0[b-zkn3npfgaz] {
    min-width: 0;
}

.notif-icono[b-zkn3npfgaz] {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.1rem;
}

/* Doble check estilo WhatsApp: gris mientras el aviso no se abrió, y se
   colorea con el acento teal de marca (mismo rol que el celeste de WhatsApp)
   en cuanto el usuario lo abre. */
.notif-check[b-zkn3npfgaz] {
    color: var(--bs-secondary-color);
    font-size: .95rem;
    line-height: 1;
}

.notif-check-leida[b-zkn3npfgaz] {
    color: var(--bs-info);
}
