/* Performance UI theme (decisions/0166) -- the Dashboard's theme.css
   header rules (decisions/0149), same dark navy + orange visual language
   as every module (decisions/0044).
*/

*, *::before, *::after { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background: #0d1f35;
  color: #d0e4f4;
}

/* Suite-wide dark scrollbar (decisions/0088) -- the default OS/browser
   scrollbar (light grey) looks out of place against every module's dark
   background; same light-on-transparent style applied identically in
   Portal/eMapp/Documents/Vulani's own theme files. */
* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: rgba(255,255,255,.25); border-radius: 6px; }
*::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.4); }

a { color: #f5a623; }

/* ── App header / global nav ── */
#app-header {
  background: linear-gradient(135deg, #0d1f35 0%, #1a3a5c 100%);
  color: white; padding: 10px 18px 8px;
  border-bottom: 2px solid #f5a623;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 10px;
}
#app-header .brand { display: flex; align-items: center; gap: 12px; }
#app-header .logo {
  width: 36px; height: 36px; border-radius: 50%; background: #f5a623;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 800; color: #0d1f35; flex-shrink: 0;
}
#app-header h1 { font-size: .95rem; font-weight: 700; margin: 0; }
#app-header .back-link { font-size: .75rem; color: #8aaac8; text-decoration: none; }
#app-header .back-link:hover { color: #f5a623; }
#app-header nav { display: flex; gap: 14px; flex-wrap: wrap; }
#app-header nav a { font-size: .8rem; color: #b8d0e8; text-decoration: none; }
#app-header nav a:hover, #app-header nav a.active { color: #f5a623; }
#app-header .session-info { font-size: .75rem; color: #cdd5e0; text-align: right; }

/* decisions/0077: when embedded in Portal this module's own header is
   redundant; standalone access keeps it. */
.vs-embedded #app-header { display: none; }
/* Signed out inside Portal: the loading screen covers the wait for Portal's
   sign-in token; the standalone "Sign in" prompt never shows there. */
.vs-embedded .pf-signin { display: none; }


/* David: a real, hand-bumped version visible on screen at all times, even
   embedded (deliberately outside #app-header so the hide rule above
   doesn't take it down too) -- so a stale tab/iframe is distinguishable
   from a genuinely updated one without opening devtools. Top-right:
   bottom-right collides with the ambient Vulani bubble (decisions/0074). */
#performance-version {
  position: fixed; right: 6px; top: 4px; z-index: 900;
  font-family: 'Consolas', 'Courier New', monospace;
  font-size: .62rem; letter-spacing: .06em;
  color: #6b7f94; opacity: .75; pointer-events: none;
}

/* ── Page body ── */
.pf-page { padding: 0 18px 24px; }
.pf-page h1 { font-size: 1.1rem; color: #f5a623; margin: 14px 0 6px; }
.pf-intro { font-size: .85rem; color: #8aaac8; margin: 0 0 16px; }
.pf-grid {
  display: grid; gap: 14px;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}
.pf-card {
  background: #13283f; border: 1px solid #1f4266; border-radius: 6px;
  padding: 14px 16px;
}
/* Written case, not uppercase: "TIDs" and "QPRs" would read as "TIDS" and "QPRS". */
.pf-card h3 {
  font-size: .8rem; color: #f5a623; letter-spacing: .02em;
  margin: 0 0 8px; opacity: .9;
}
.pf-card p { font-size: .85rem; margin: 0 0 12px; }
/* A label, not a control: plain text, no button chrome (read-only). */
.pf-soon { font-size: .7rem; color: #6b7f94; letter-spacing: .05em; }

button {
  padding: 5px 14px; border: 1px solid #3a5a7a; border-radius: 3px;
  cursor: pointer; font-size: 12px; background: #1e3a58; color: #b8d0e8;
  transition: all .15s;
}
button:hover:not(:disabled) { background: #254870; color: white; border-color: #5a7a9a; }
button:disabled { opacity: .4; cursor: default; }