/* Botones flotantes "🏠 Inicio" y "👤 Salir" — global en todas las páginas
   web RNP-Sys. El de Salir solo aparece si hay sesión activa.
   Inyectados vía web_include en hooks.py.
*/
#rnp-home-fab,
#rnp-logout-fab {
  position: fixed;
  bottom: 42%;            /* centro vertical (~40% desde abajo), NO esquina */
  z-index: 99999;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px 9px 12px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "IBM Plex Sans",
               Roboto, sans-serif;
  font-size: 13px;
  font-weight: 600;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: saturate(140%) blur(8px);
  border-radius: 999px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.2, 0.7, 0.3, 1);
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

/* Inicio (verde corporativo) — borde IZQUIERDO, centro vertical */
#rnp-home-fab {
  left: 14px;
  color: #15603d;
  border: 1px solid rgba(21, 96, 61, 0.20);
  box-shadow: 0 2px 6px rgba(22, 32, 26, 0.08),
              0 8px 24px -10px rgba(15, 77, 49, 0.18);
}
#rnp-home-fab:hover {
  background: #15603d;
  color: white;
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(22, 32, 26, 0.12),
              0 12px 28px -10px rgba(15, 77, 49, 0.35);
  border-color: #15603d;
}

/* Salir (rojo discreto) — borde DERECHO, centro vertical */
#rnp-logout-fab {
  right: 14px;
  color: #7a2828;
  border: 1px solid rgba(122, 40, 40, 0.20);
  box-shadow: 0 2px 6px rgba(22, 32, 26, 0.08),
              0 8px 24px -10px rgba(122, 40, 40, 0.18);
}
#rnp-logout-fab:hover {
  background: #7a2828;
  color: white;
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(22, 32, 26, 0.12),
              0 12px 28px -10px rgba(122, 40, 40, 0.35);
  border-color: #7a2828;
}

/* Inicio (izquierda) y Salir (derecha) van en lados OPUESTOS, centro vertical —
   ya no se apilan, así que el Salir se queda en su borde derecho. */
body:has(#rnp-home-fab) #rnp-logout-fab {
  right: 14px;
}

#rnp-home-fab:active,
#rnp-logout-fab:active { transform: translateY(0); }

#rnp-home-fab .ic,
#rnp-logout-fab .ic {
  font-size: 16px;
  line-height: 1;
}
#rnp-home-fab .lbl,
#rnp-logout-fab .lbl {
  font-weight: 600;
}

/* Compacto en mobile: solo icono */
@media (max-width: 600px) {
  #rnp-home-fab,
  #rnp-logout-fab {
    padding: 9px 11px;
    border-radius: 50%;
    width: 38px;
    height: 38px;
    justify-content: center;
  }
  #rnp-home-fab .lbl,
  #rnp-logout-fab .lbl { display: none; }
}

/* Posición centro-vertical fija; .dropped (legacy) ya no empuja desde arriba. */
#rnp-home-fab.dropped,
#rnp-logout-fab.dropped { top: auto; bottom: 42%; }

/* Skip en estas páginas (clase aplicada por JS) */
body.rnp-no-home-fab #rnp-home-fab,
body.rnp-no-home-fab #rnp-logout-fab { display: none !important; }
