/* ── Top progress bar loader (replaces large block spinner) ── */
.page-loader {
  position: fixed !important;
  top: 0; left: 0;
  width: 100%;
  height: 3px !important;
  min-height: 0 !important;
  background: transparent !important;
  z-index: 9999;
  display: block !important;
  overflow: hidden;
  align-items: unset !important;
  justify-content: unset !important;
}
.page-loader[style*="display: none"],
.page-loader[style*="display:none"] {
  display: none !important;
}
.page-loader .spinner {
  display: none !important;
}
.page-loader::after {
  content: '';
  display: block;
  height: 3px;
  width: 40%;
  background: var(--orange, #F07A00);
  border-radius: 2px;
  animation: topbar-slide 1s ease-in-out infinite;
}
@keyframes topbar-slide {
  0%   { margin-left: -40%; }
  100% { margin-left: 140%; }
}

/* Page fade-in transition */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.content {
  animation: fadeIn 0.18s ease-out;
}

/* Link click fade-out */
.page-exit {
  animation: fadeOut 0.12s ease-in forwards;
}
@keyframes fadeOut {
  from { opacity: 1; }
  to   { opacity: 0; }
}

/* Keyboard shortcut tooltip */
[data-shortcut] {
  position: relative;
}
[data-shortcut]:hover::after {
  content: attr(data-shortcut);
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.8);
  color: #fff;
  font-size: 11px;
  padding: 3px 7px;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
  z-index: 1000;
}
[data-shortcut]:hover::before {
  content: '';
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  border: 4px solid transparent;
  border-top-color: rgba(0,0,0,0.8);
  pointer-events: none;
  z-index: 1000;
}