/* VaultFab — floating action button(s). position: bottom-right | bottom-left | top-right | top-left. color: primary | secondary | primary-light | light */

.vault-projects-page { position: relative; }

/* Body-level FAB viewport (used for projects page so FAB is always visible in side panel) */
.vault-fab-viewport {
  position: fixed !important;
  bottom: 1rem !important;
  right: 1rem !important;
  left: auto !important;
  top: auto !important;
  width: 3rem !important;
  height: 3rem !important;
  z-index: 2147483647;
  pointer-events: none;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.vault-fab-viewport.hidden { display: none !important; visibility: hidden !important; }
.vault-fab-viewport:not(.hidden) { display: block !important; visibility: visible !important; }
.vault-fab-viewport > * {
  pointer-events: auto;
  position: absolute !important;
  bottom: 0 !important;
  right: 0 !important;
  left: auto;
  top: auto;
}
.vault-fab-viewport > .vault-fab {
  width: 3rem !important;
  height: 3rem !important;
  min-width: 3rem !important;
  min-height: 3rem !important;
}

.vault-projects-page-fab-container {
  position: fixed;
  bottom: 1rem;
  right: 1rem;
  left: auto;
  top: auto;
  z-index: 100;
  pointer-events: none;
}
.vault-projects-page-fab-container > * {
  pointer-events: auto;
  position: relative;
  bottom: auto;
  right: auto;
}

.vault-fab-wrap {
  position: absolute;
  z-index: 10;
  pointer-events: none;
}
.vault-fab-wrap * {
  pointer-events: auto;
}

.vault-fab-wrap--bottom-right { bottom: 1rem; right: 1rem; }
.vault-fab-wrap--bottom-left { bottom: 1rem; left: 1rem; }
.vault-fab-wrap--top-right { top: 1rem; right: 1rem; }
.vault-fab-wrap--top-left { top: 1rem; left: 1rem; }

.vault-fab-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.vault-fab-wrap--bottom-right .vault-fab-list,
.vault-fab-wrap--top-right .vault-fab-list { align-items: flex-end; }
.vault-fab-wrap--bottom-left .vault-fab-list,
.vault-fab-wrap--top-left .vault-fab-list { align-items: flex-start; }
.vault-fab-wrap--bottom-right .vault-fab-list,
.vault-fab-wrap--bottom-left .vault-fab-list { flex-direction: column-reverse; }

.vault-fab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  transition: transform 0.2s, box-shadow 0.2s, background-color 0.15s, color 0.15s;
}
.vault-fab:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.vault-fab:focus-visible {
  outline: 2px solid var(--vault-focus-ring);
  outline-offset: 2px;
}
.vault-fab__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.vault-fab__icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

.vault-fab--primary { background: var(--vault-primary); color: #fff; }
.vault-fab--primary:hover { background: var(--vault-primary-hover); }
.vault-fab--secondary { background: #475569; color: #fff; }
.vault-fab--secondary:hover { background: #334155; }
.vault-fab--primary-light { background: var(--vault-primary-light); color: var(--vault-primary); }
.vault-fab--primary-light:hover { background: rgba(4, 146, 181, 0.25); }
.vault-fab--light { background: var(--vault-bg-elevated); color: var(--vault-text); border: 1px solid var(--vault-border); }
.vault-fab--light:hover { background: var(--vault-border); }

/* Mini FABs in expanded menu */
.vault-fab-mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  background: var(--vault-bg-elevated);
  color: var(--vault-text);
  border: 1px solid var(--vault-border);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s, background-color 0.15s;
}
.vault-fab-mini:hover { background: var(--vault-border); transform: scale(1.05); }
.vault-fab-mini__icon svg { width: 1rem; height: 1rem; }
.vault-fab-mini .vault-fab-mini__label {
  position: absolute;
  white-space: nowrap;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
  background: var(--vault-text);
  color: var(--vault-bg-elevated);
  border-radius: 0.25rem;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s;
}
.vault-fab-wrap--bottom-right .vault-fab-mini .vault-fab-mini__label,
.vault-fab-wrap--top-right .vault-fab-mini .vault-fab-mini__label { right: 100%; margin-right: 0.5rem; }
.vault-fab-wrap--bottom-left .vault-fab-mini .vault-fab-mini__label,
.vault-fab-wrap--top-left .vault-fab-mini .vault-fab-mini__label { left: 100%; margin-left: 0.5rem; }
.vault-fab-mini:hover .vault-fab-mini__label { opacity: 1; }
.vault-fab-mini { position: relative; }

.vault-fab-menu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.vault-fab-wrap--bottom-right .vault-fab-menu,
.vault-fab-wrap--top-right .vault-fab-menu { align-items: flex-end; }
.vault-fab-wrap--bottom-left .vault-fab-menu,
.vault-fab-wrap--top-left .vault-fab-menu { align-items: flex-start; }
.vault-fab-wrap--bottom-right .vault-fab-menu,
.vault-fab-wrap--bottom-left .vault-fab-menu { flex-direction: column-reverse; }

.vault-fab-menu-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}