/* /Pages/Authentication/Login.razor.rz.scp.css */
/* Contenedor principal 50/50 */
.login-split-container[b-t46tu59ddn] {
    display: flex;
    height: 100vh;
    width: 100vw;
    margin: 0;
    padding: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
}

/* LADO IZQUIERDO: BRANDING */
.brand-panel[b-t46tu59ddn] {
    flex: 1;
    background: linear-gradient(135deg, #0d1b2a 0%, #1b263b 100%); /* Azul Navy Médico */
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem;
    color: white;
}

/* Efecto visual de malla (Data Visual) */
.data-grid-overlay[b-t46tu59ddn] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.1;
    background-image: radial-gradient(#38bdf8 1px, transparent 1px);
    background-size: 30px 30px;
}

.brand-content[b-t46tu59ddn] {
    position: relative;
    z-index: 5;
}

.hospital-title[b-t46tu59ddn] {
    font-size: 3.5rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
    margin-bottom: 0;
}

.hospital-subtitle[b-t46tu59ddn] {
    margin-top: 1.5rem;
    font-size: 1.2rem;
    color: #94a3b8;
}

/* EFECTO TYPEWRITER (Máquina de Escribir) - Simplificado y Corregido */

/* Contenedor principal - mantiene el espacio y posición */
.typewriter-container[b-t46tu59ddn] {
    display: inline-block;
    position: relative;
    min-height: 1.2em;
    vertical-align: bottom;
    min-width: 350px; /* Más espacio para palabras completas */
}

/* Estilos base para cada palabra */
.typewriter[b-t46tu59ddn] {
    font-family: "Courier New", Courier, monospace;
    font-weight: 800;
    font-size: 0.92em; /* Ligeramente más pequeño para compensar letter-spacing */
    color: #38bdf8;
    overflow: hidden;
    border-right: 2px solid #38bdf8; /* Cursor más fino */
    white-space: nowrap;
    letter-spacing: 0.05em;
    margin: 0;
    padding-right: 4px; /* Espacio entre texto y cursor */
    position: absolute;
    left: 0;
    top: 0;
    width: 0; /* Estado inicial */
    max-width: none; /* Sin límite, usamos ch por palabra */
    opacity: 0;
    visibility: hidden;
}

/* Palabra 1: "decisiones" (10 caracteres) - Activa 0-5s */
.word-1[b-t46tu59ddn] {
    animation:
        word-1-cycle-b-t46tu59ddn 20s steps(10, end) infinite,
        blink-caret-b-t46tu59ddn 0.75s step-end infinite;
}

/* Palabra 2: "insights" (8 caracteres) - Activa 5-10s */
.word-2[b-t46tu59ddn] {
    animation:
        word-2-cycle-b-t46tu59ddn 20s steps(12, end) infinite,
        blink-caret-b-t46tu59ddn 0.75s step-end infinite;
}

/* Palabra 3: "eficiencia" (10 caracteres) - Activa 10-15s */
.word-3[b-t46tu59ddn] {
    animation:
        word-3-cycle-b-t46tu59ddn 20s steps(10, end) infinite,
        blink-caret-b-t46tu59ddn 0.75s step-end infinite;
}

/* Palabra 4: "resultados" (10 caracteres) - Activa 15-20s */
.word-4[b-t46tu59ddn] {
    animation:
        word-4-cycle-b-t46tu59ddn 20s steps(10, end) infinite,
        blink-caret-b-t46tu59ddn 0.75s step-end infinite;
}

/* Cursor parpadeante */
@keyframes blink-caret-b-t46tu59ddn {
    from, to { border-color: transparent; }
    50% { border-color: #38bdf8; }
}

/* === ANIMACIONES COMPLETAS POR PALABRA === */

/* Palabra 1: 0-25% del ciclo (0-5s de 20s) - "decisiones" = 10ch
   - 0-7.5%: escribir
   - 7.5-17.5%: pausa
   - 17.5-25%: borrar */
@keyframes word-1-cycle-b-t46tu59ddn {
    0% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    7.5% {
        opacity: 1;
        visibility: visible;
        width: 11ch;
    }
    17.5% {
        opacity: 1;
        visibility: visible;
        width: 11ch;
    }
    25% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    25.01% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    100% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
}

/* Palabra 2: 25-50% del ciclo (5-10s de 20s) - "conocimiento" = 12ch */
@keyframes word-2-cycle-b-t46tu59ddn {
    0% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    24.99% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    25% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    32.5% {
        opacity: 1;
        visibility: visible;
        width: 13ch;
    }
    42.5% {
        opacity: 1;
        visibility: visible;
        width: 13ch;
    }
    50% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    50.01% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    100% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
}

/* Palabra 3: 50-75% del ciclo (10-15s de 20s) - "eficiencia" = 10ch */
@keyframes word-3-cycle-b-t46tu59ddn {
    0% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    49.99% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    50% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    57.5% {
        opacity: 1;
        visibility: visible;
        width: 11ch;
    }
    67.5% {
        opacity: 1;
        visibility: visible;
        width: 11ch;
    }
    75% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    75.01% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    100% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
}

/* Palabra 4: 75-100% del ciclo (15-20s de 20s) - "resultados" = 10ch */
@keyframes word-4-cycle-b-t46tu59ddn {
    0% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    74.99% {
        opacity: 0;
        visibility: hidden;
        width: 0;
    }
    75% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
    82.5% {
        opacity: 1;
        visibility: visible;
        width: 11ch;
    }
    92.5% {
        opacity: 1;
        visibility: visible;
        width: 11ch;
    }
    100% {
        opacity: 1;
        visibility: visible;
        width: 0;
    }
}

/* Accesibilidad: respeta preferencias de movimiento reducido */
@media (prefers-reduced-motion: reduce) {
    .typewriter[b-t46tu59ddn] {
        animation: none;
        width: auto;
        max-width: 100%;
        border-right: none;
        padding-right: 0;
    }
    .word-1[b-t46tu59ddn] {
        opacity: 1 !important;
        visibility: visible !important;
    }
    .word-2[b-t46tu59ddn], .word-3[b-t46tu59ddn], .word-4[b-t46tu59ddn] {
        opacity: 0 !important;
        visibility: hidden !important;
    }
}

/* LADO DERECHO: FORMULARIO */
.form-panel[b-t46tu59ddn] {
    flex: 1;
    background-color: #ffffff;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
}

.form-content-wrapper[b-t46tu59ddn] {
    width: 100%;
    max-width: 420px;
    position: relative;
    z-index: 5;
}

/* RESPONSIVE: Tablets - ajustar tamaño de texto */
@media (max-width: 1200px) {
    .hospital-title[b-t46tu59ddn] {
        font-size: 2.5rem;
    }

    .hospital-subtitle[b-t46tu59ddn] {
        font-size: 1rem;
    }

    .brand-panel[b-t46tu59ddn] {
        padding: 2rem;
    }
}

/* RESPONSIVE: Móviles - ocultar lado izquierdo */
@media (max-width: 960px) {
    .brand-panel[b-t46tu59ddn] {
        display: none;
    }

    .form-panel[b-t46tu59ddn] {
        width: 100%;
    }

    .form-content-wrapper[b-t46tu59ddn] {
        max-width: 100%;
        padding: 1.5rem;
    }
}
/* /Pages/Comingsoon.razor.rz.scp.css */
/* wwwroot/css/ComingSoon.css */
/* Reset básico para evitar espacios no deseados */
html[b-m8i3ypj6xr], body[b-m8i3ypj6xr] {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow-x: hidden; /* Evita el scroll horizontal */
}

.coming-soon-container[b-m8i3ypj6xr] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Altura exacta de la ventana */
    width: 100%; /* Ancho completo */
    margin: 0; /* Sin márgenes */
    padding: 1rem;
    box-sizing: border-box; /* Para que el padding no añada tamaño */
    background: linear-gradient(135deg, #f5f7fa 0%, #e4e8eb 100%);
    position: absolute; /* Posicionamiento absoluto */
    top: 0;
    left: 0;
}

.coming-soon-card[b-m8i3ypj6xr] {
    border-radius: 80px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,0.12);
    width: 100%;
    max-width: 700px;
}

.icon-container[b-m8i3ypj6xr] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
}

.construction-icon[b-m8i3ypj6xr] {
    font-size: 80px;
}

/* Ajustes para pantallas pequeñas */
@media (max-width: 600px) {
    .construction-icon[b-m8i3ypj6xr] {
        font-size: 60px;
    }

    .coming-soon-card[b-m8i3ypj6xr] {
        padding: 1.5rem !important;
        max-width: 90vw;
    }
}