/* El botón de ayuda de las pantallas sin sesión (login, entrada desde el ERP): `js/core/manual-sin-sesion.js`.
   El login no carga variables.css (lo pinta entero `login-form` de JobWC), así que cada color lleva su valor de reserva:
   el de `--primary` / `--accent-dark` de variables.css. */
.ayuda-sin-sesion {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 1000;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid var(--line, #e6ece7);
    border-radius: 50%;
    background: #fff;
    color: var(--accent-dark, #4a8c4f);
    font-size: 20px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .12);
}

/* En la página de EXEMPLEADO (tiene banda arriba, con sus botones): abajo a la derecha, para no taparlos. */
main.cm-pagina ~ .ayuda-sin-sesion {
    top: auto;
    bottom: 16px;
}

.ayuda-sin-sesion:hover,
.ayuda-sin-sesion:focus-visible {
    color: var(--primary, #2d4a3e);
    outline: 2px solid var(--accent, #6ab06a);
    outline-offset: 2px;
}