﻿/* Acceso de jugadores (Views/Jugador/Acceso). Los campos y botones usan las clases de la plantilla
   (form-control + form-control-bg, btn btn-md sombra); aquí solo va la disposición del panel. */

.player-access__panel {
    max-width: 38rem;
    margin: 0 auto;
    color: var(--qg-public-color-white);
}

.player-access__title {
    margin-bottom: .75rem;
    color: var(--qg-public-color-white);
}

.player-access__subtitle {
    margin-bottom: .5rem;
    color: var(--qg-public-color-white);
    font-size: 1.15rem;
}

.player-access__text {
    margin-bottom: 1.25rem;
    color: var(--qg-public-color-white-70);
}

.player-access__alert {
    margin-bottom: 1.25rem;
    padding: .75rem 1rem;
    border-radius: .3rem;
    background: var(--qg-public-color-surface-login);
    color: var(--qg-public-color-white);
}

.player-access__alert--error {
    background: var(--qg-public-color-surface-session-hover);
}

.player-access__alert code {
    color: var(--qg-public-color-gold-light);
}

.player-access__providers {
    display: grid;
    gap: .75rem;
    margin-bottom: 1.75rem;
}

.player-access__form {
    margin-bottom: 0;
}

.player-access__form--secondary {
    margin-top: 1rem;
}

/* El fondo del campo de la plantilla se coloca con margen negativo, así que el campo y su span van seguidos. */
.player-access__field {
    max-width: 24rem;
    margin-bottom: 1rem;
}

.player-access__label {
    display: block;
    margin-bottom: .35rem;
    color: var(--qg-public-color-white);
    font-weight: 600;
}

.player-access__button--provider {
    width: 100%;
}

/* Acción secundaria con aspecto de enlace: salir por correo, o darse de baja. */
.player-access__link-button {
    padding: 0;
    border: 0;
    background: none;
    color: var(--qg-public-color-gold);
    font-weight: 600;
    text-align: left;
}

.player-access__link-button:hover,
.player-access__link-button:focus-visible {
    color: var(--qg-public-color-gold-light);
    text-decoration: underline;
}

.player-access__simulation,
.player-access__recovery {
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--qg-public-color-white-20);
}

@media (max-width: 575.98px) {
    .player-access__field {
        max-width: none;
    }
}
