/* =======================================================
   LOADING.CSS — carregador de página (barra no topo + spinner)
   ======================================================= */

#page-loader {
  position: fixed; inset: 0; z-index: 9999;
  display: grid; place-items: center;
  background: var(--rb-loader-veil);           /* véu sólido, sem blur */
  transition: opacity .2s var(--rb-ease), visibility .2s var(--rb-ease);
}
#page-loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }

/* A linha no topo */
#page-loader::before {
  content: ""; position: absolute; top: 0; left: 0;
  height: 2px; width: 35%;
  background: var(--rb-primary);
  animation: pl-bar 1.1s var(--rb-ease) infinite;
}

#page-loader .pl-inner {
  display: flex; align-items: center; gap: var(--rb-space-3);
  padding: var(--rb-space-3) var(--rb-space-4);
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-radius-lg);
  box-shadow: var(--rb-shadow);
}
#page-loader .pl-spinner {
  width: 18px; height: 18px; border-radius: 50%;
  border: 2px solid var(--rb-border-strong);
  border-top-color: var(--rb-primary);
  animation: pl-spin .7s linear infinite;
}
#page-loader .pl-text { margin: 0; font-size: var(--rb-fs-sm); font-weight: var(--rb-fw-medium); color: var(--rb-text-muted); }

@keyframes pl-spin { to { transform: rotate(360deg); } }
@keyframes pl-bar { 0% { transform: translateX(-100%); } 100% { transform: translateX(300%); } }

@media (prefers-reduced-motion: reduce) {
  #page-loader::before, #page-loader .pl-spinner { animation: none; }
  #page-loader { transition: none; }
}
