/*
 * FT Recursos - Boton de descarga.
 *
 * Todo el color sale de las variables del tema con su respaldo detras: si el
 * dia de manana se cambia la paleta desde el panel, el boton la sigue sin
 * tocar nada, y en un tema que no las defina se ve igual que ahora.
 */

/*
 * Mismo caso que la calculadora: puesto directamente en una pagina, el
 * boton se quedaba pegado al borde de la pantalla. Dentro de una columna
 * el ancho lo pone la columna y esto se desactiva.
 */
.ftr-recurso {
    max-width: calc(var(--prb-wide-width, 1140px) + var(--prb-gutter, 2rem) * 2);
    margin-inline: auto;
    margin-block: 1.5rem;
    padding-inline: var(--prb-gutter, clamp(1rem, 4vw, 2.5rem));
}

.prb-cols-col .ftr-recurso {
    max-width: none;
    padding-inline: 0;
}

.ftr-recurso--centro {
    text-align: center;
}

.ftr-recurso-boton {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85em 1.8em;
    border: 2px solid var(--prb-color-secondary, #b8892b);
    border-radius: var(--prb-radius, 6px);
    background: var(--prb-color-secondary, #b8892b);

    /* Texto oscuro sobre el dorado: da 4,9:1, por encima del 4,5:1 que
       pide la norma. Al reves, blanco sobre dorado, se quedaba corto. */
    color: var(--prb-color-primary, #10243a);

    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/*
 * La clase se repite para ganarle a la regla de enlaces del tema, que en
 * algunos casos fuerza el color y el subrayado de todos los <a>.
 */
a.ftr-recurso-boton:hover,
a.ftr-recurso-boton:focus-visible {
    background: var(--prb-color-primary, #10243a);
    border-color: var(--prb-color-primary, #10243a);
    color: var(--prb-color-bg, #ffffff);
    text-decoration: none;
}

/* El anillo del teclado no puede depender del cambio de color: sobre el
   fondo oscuro del hover se perderia. */
a.ftr-recurso-boton:focus-visible {
    outline: 3px solid var(--prb-color-secondary, #b8892b);
    outline-offset: 3px;
}

.ftr-recurso-boton svg {
    flex-shrink: 0;
}

.ftr-recurso-nota {
    margin: 0.75rem 0 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--prb-color-muted, #5c6874);
}