/* Pantallas de acceso: entrada de los amigos (login.html) y panel de cuentas del dueño (admin.html).
   Colores y botones vienen de style.css; las tablas y paneles de la pantalla de sesiones, de sesiones.css. */

html.pagina-acceso, body.pagina-acceso {
  /* style.css oculta el desplazamiento (pensado para el gráfico); acá la página puede crecer. */
  overflow-y: auto;
  height: auto;
  min-height: 100%;
}

/* ---- Entrada ------------------------------------------------------------------------------ */
.acc-caja {
  max-width: 340px;
  margin: 10vh auto 0;
  padding: 24px 20px;
  background: var(--bg-flotante);
  border: 1px solid var(--borde-flotante);
  border-radius: 8px;
}
.acc-marca { margin: 0 0 6px; font-size: 20px; font-weight: 600; letter-spacing: .5px; }
.acc-texto { margin: 0 0 18px; color: var(--texto-tenue); font-size: 12px; line-height: 1.45; }
.acc-form { display: flex; flex-direction: column; gap: 6px; }
.acc-form label { color: var(--texto-tenue); font-size: 12px; margin-top: 6px; }
.acc-form input { height: 34px; font-size: 14px; }
.acc-error { color: var(--rojo); font-size: 12px; margin-bottom: 4px; }
.acc-boton { height: 36px; margin-top: 14px; font-size: 13px; }

/* ---- Panel de cuentas (admin) ------------------------------------------------------------- */
.adm-acciones { display: flex; gap: 4px; flex-wrap: wrap; }
.adm-acciones button { font-size: 11px; white-space: nowrap; }
.ses-tabla td.adm-agente { white-space: normal; max-width: 240px; font-size: 11px; color: var(--texto-tenue); }
.adm-sesiones a { display: block; color: var(--acento); text-decoration: none; font-size: 11px; }
.adm-sesiones a:hover { text-decoration: underline; }