/**
 * Estilos del bloque de login social. El botón es el OFICIAL de Google (GIS renderButton,
 * tema filled_blue); aquí solo maquetamos el contenedor, el consentimiento y el separador
 * "o con tu correo" del handoff. Ver social-login.js.
 */
.zaca-social-login {
    margin: 0 0 4px;
}

.zaca-social-login__btn {
    width: 100%;
}

/* GIS renderiza aquí su botón. min-height para evitar salto de maquetación al cargar. */
.zaca-social-login__google {
    min-height: 44px;
}

/**
 * Agrandar SOLO el texto del botón oficial de Google. El botón se renderiza en el DOM de la
 * página (no en un iframe), así que su etiqueta es estilable por CSS.
 * OJO: la clase la genera GIS y es ofuscada; si Google la cambia, dejaría de aplicar (revisar).
 */
.zaca-social-login .nsm7Bb-HzV7m-LgbsSe-BPrWId {
    font-size: 1.6em !important;
}

.zaca-social-login__consent {
    margin: 14px 0 0;
    font-size: 13px;
    line-height: 1.55;
    color: #6B727B;
}

.zaca-social-login__consent a {
    color: #1878C6;
    text-decoration: none;
}

.zaca-social-login__consent a:hover {
    color: #125E9B;
}

.zaca-social-login__message {
    margin-top: 12px;
}

/* Separador "O CON TU CORREO" — clavado al handoff. */
.zaca-social-login__divider {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 24px 0 20px;
}

.zaca-social-login__divider-line {
    display: block;
    flex: 1 1 auto;
    height: 1px;
    background: #E6E8EB;
}

.zaca-social-login__divider-text {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    color: #9AA0A8;
    text-transform: uppercase;
    letter-spacing: .08em;
    white-space: nowrap;
}
