/* Azul del escudo del club */
:root {
    --villestro-azul: #1a3a8f;
    --villestro-azul-oscuro: #142d6e;
}

body {
    background-color: #f2f4f7;
}

.navbar {
    background-color: var(--villestro-azul);
}

.navbar-brand {
    font-weight: 600;
    letter-spacing: .2px;
}

/* El banderín es azul y la barra también: sin este disco blanco detrás
   se camufla y solo se distingue la franja del texto. */
.navbar-brand img {
    background: #fff;
    border-radius: 50%;
    padding: 4px;
    box-sizing: content-box;
}

.card {
    border: none;
    border-radius: .6rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .08);
}

.btn-primary {
    --bs-btn-bg: var(--villestro-azul);
    --bs-btn-border-color: var(--villestro-azul);
    --bs-btn-hover-bg: var(--villestro-azul-oscuro);
    --bs-btn-hover-border-color: var(--villestro-azul-oscuro);
    --bs-btn-active-bg: var(--villestro-azul-oscuro);
    --bs-btn-active-border-color: var(--villestro-azul-oscuro);
}

.btn-outline-primary {
    --bs-btn-color: var(--villestro-azul);
    --bs-btn-border-color: var(--villestro-azul);
    --bs-btn-hover-bg: var(--villestro-azul);
    --bs-btn-hover-border-color: var(--villestro-azul);
}

.bg-primary {
    background-color: var(--villestro-azul) !important;
}

/* Las tarjetas de comida son enlaces: que se note al pasar por encima */
a .card {
    transition: box-shadow .15s ease, transform .15s ease;
}

a .card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
    transform: translateY(-2px);
}

.pagina-login {
    min-height: 100vh;
    background: linear-gradient(160deg, #e8ecf5 0%, #f2f4f7 100%);
}

/* Web pública ------------------------------------------------------------- */

.portada {
    padding: 2rem 0 1rem;
}

.marcador {
    font-weight: 700;
    font-size: 1.1rem;
    white-space: nowrap;
}

.marcador.ganado {
    color: #157347;
}

.marcador.perdido {
    color: #b02a37;
}

.marcador.empatado {
    color: #6c757d;
}

.dorsal {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    color: var(--villestro-azul);
}

.foto-miniatura,
.foto-galeria {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: .4rem;
}

.foto-galeria {
    border-radius: .6rem .6rem 0 0;
}

.campo-goles {
    width: 3.5rem;
    text-align: center;
}