/* =========================
   LOGIN MULTIVA (encabezado)
   ========================= */
.theme-multiva #EncabezadoPrincipal {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.theme-multiva .topbar {
    background: var(--color-primary);
    color: var(--color-blanco);
    padding: .5rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .9rem;
    box-shadow: inset 0 -4px 0 var(--color-naranja); /* línea naranja */
}

.theme-multiva .topbar-nav {
    display: flex;
    gap: 1rem;
}

    .theme-multiva .topbar-nav a {
        color: var(--color-blanco);
        text-decoration: none;
        font-weight: 500;
    }

        .theme-multiva .topbar-nav a:hover {
            color: var(--color-accent-1);
        }

.theme-multiva .logos {
    background: var(--color-blanco);
    padding: .5rem 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid var(--color-border);
}

.theme-multiva .logo-fidu, .theme-multiva .logo-solutrust {
    max-height: 50px;
    object-fit: contain;
}

/* =========================
   LOGIN: contenedor + campos
   ========================= */
.theme-multiva body {
    background: var(--color-surface);
    color: var(--color-text);
}

.theme-multiva #LoginContainer {
   /* margin: 2.25rem auto;*/
    padding: 2rem 2.25rem;
    /*max-width: 420px;*/
    background: var(--color-naranja);
    border: 1px solid #d0d7de; /* borde un poco más marcado para contraste */
    border-radius: .75rem;
    box-shadow: 0 8px 22px rgba(0,0,0,.08);
    text-align: left;
}

.theme-multiva .SectionHeader {
    font-family: "Multiva Sans", Corbel, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    font-weight: 600;
    font-size: 1.15rem;
    color: var(--color-acero);
    background: var(--color-blanco);
    padding: 0;
    margin: 0 0 1rem 0;
    border-bottom: 3px solid var(--color-naranja);
}

/* Mensajes de error/información */
.theme-multiva .LoginMessage {
    background: var(--color-danger);
    color: #7f1d1d;
    padding: .6rem .75rem;
    border-radius: .35rem;
    margin-bottom: .9rem;
}

/* Campos (reusa tus clases .Lab y .Pass) */
.theme-multiva .LoginField {
    margin-bottom: .9rem;
}

.theme-multiva .Lab {
    display: block;
    margin-bottom: .35rem;
    color: var(--color-text-muted);
    font-family: "Multiva Sans", Corbel, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    font-size:large;
}

.theme-multiva .Pass,
.theme-multiva input[type="text"],
.theme-multiva input[type="password"] {
    width: 91%;
    padding: .6rem .75rem;
    border: 1px solid var(--color-border);
    border-radius: .35rem;
    background: #fff;
    color: var(--color-text);
    font-size: 1rem;
    font-family: "Multiva Sans", Corbel, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

    .theme-multiva .Pass:focus,
    .theme-multiva input[type="text"]:focus,
    .theme-multiva input[type="password"]:focus {
        outline: 3px solid color-mix(in srgb, var(--color-primary) 25%, white);
        outline-offset: 2px;
    }

/* Extras (recordarme + link) */
.theme-multiva .LoginExtras {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin: .25rem 0 1rem;
}

    .theme-multiva .LoginExtras .chk {
        display: flex;
        align-items: center;
        gap: .4rem;
        color: var(--color-text);
    }

.theme-multiva .LinkUno {
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 500;
    font-size:medium
}

    .theme-multiva .LinkUno:hover {
        color: var(--color-naranja);
        text-decoration: underline;
    }

/* Acciones (botones) */
.theme-multiva .LoginActions {
    display: grid;
    grid-template-columns: 1fr;
    gap: .65rem;
}

/* Variante destacada (naranja) sin cambiar tu HTML: aplica en el 2º botón si es <a> */
.theme-multiva .LoginActions a.FormatoBotones {
    background: var(--color-naranja);
    border-color: #e64000;
}

    .theme-multiva .LoginActions a.FormatoBotones:hover {
        background: #ff5c33;
    }

/* Responsive mínimo */
@media (max-width: 480px) {
    .theme-multiva #LoginContainer {
        margin: 1.25rem;
        padding: 1.25rem;
    }

    .theme-multiva .LoginExtras {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem;
    }
}

/* Variante destacada (naranja) sin cambiar tu HTML: aplica en el 2º botón si es <a> */
.theme-multiva #DivToken {
    margin-left:-48px
}

.theme-multiva #TblInsTokGemalto,
.theme-multiva .LabS {
    font-size: large
}

.theme-multiva .bottomM {
    /*background-image: url('../Imagenes/bottomM.jpg');*/
    height: 0px;
}

.theme-multiva .middleM {
    /*background-image: url('../Imagenes/bottomM.jpg');*/
    width: 100%;
}