/* =============================================================
   PACER pacer-sprint11b.css — Design Fix Pass
   Loaded AFTER pacer-theme.css — overrides Sprint 11 issues
   ============================================================= */

/* 1. HEADER GRADIENT: Linear left-to-right depth
      Overrides any radial / top-concentrated gradient
   ─────────────────────────────────────────────── */
header,
#pacer-header,
[class*="app-header"],
[class*="appHeader"],
[class*="main-header"],
[class*="mainHeader"],
[class*="site-header"],
[class*="siteHeader"],
[class*="top-bar"],
[class*="topBar"],
[class*="topbar"],
[class*="navbar"],
[class*="navBar"] {
  background:       linear-gradient(90deg, #6B1511 0%, #BE3527 50%, #C8402F 100%) !important;
  background-image: linear-gradient(90deg, #6B1511 0%, #BE3527 50%, #C8402F 100%) !important;
  background-color: #BE3527 !important;
}


/* 2. KILL LIGHT BLUE (#C8D8E9) ANYWHERE
   ─────────────────────────────────────── */
header [style*="C8D8E9"],
header [style*="c8d8e9"],
header [style*="#C8D"],
header [style*="200, 216"],
header [style*="200,216"],
[style*="background:#C8D8E9"],
[style*="background: #C8D8E9"],
[style*="backgroundColor:#C8D8E9"],
[style*="backgroundColor: #C8D8E9"],
[style*="background:#c8d8e9"],
[style*="background: #c8d8e9"] {
  background:       transparent !important;
  background-color: transparent !important;
  color: #ffffff !important;
}


/* 3. HEADER STATS ("complete", "outstanding", "deferred"):
      Gold, bold, with shadow for contrast
   ─────────────────────────────────────────────────────── */
header [class*="stat"],
header [class*="Stat"],
header [class*="count"],
header [class*="Count"],
header [class*="number"],
header [class*="Number"],
header [class*="score"],
header [class*="Score"],
header [class*="metric"],
header [class*="Metric"],
header [class*="percent"],
header [class*="Percent"],
header [class*="complete"],
header [class*="Complete"],
header [class*="outstanding"],
header [class*="Outstanding"],
header [class*="deferred"],
header [class*="Deferred"],
header [class*="badge"],
header [class*="Badge"],
[class*="stat-value"],
[class*="statValue"],
[class*="header-stat"],
[class*="headerStat"],
[class*="stat-label"],
[class*="statLabel"],
[class*="counter"],
[class*="Counter"],
[class*="progress-label"],
[class*="progressLabel"] {
  color:       #FBB923 !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,0.45) !important;
}


/* 4. HEADER TEXT: keep all header text white by default */
header,
header > *,
header > * > *,
header span,
header p,
header small,
header label,
header div:not([id^="pacer-admin"]) {
  color: #ffffff !important;
}
/* But re-apply gold to stats */
header [class*="stat"],
header [class*="count"],
header [class*="number"],
header [class*="score"],
header [class*="complete"],
header [class*="outstanding"],
header [class*="deferred"] {
  color: #FBB923 !important;
}


/* 5. NAV TABS (Setup / Checklist / Report / Safe&Export):
      Pill-button style with clear separation
   ─────────────────────────────────────────────────────── */
.pacer-tab-btn,
[class*="tab-btn"],
[class*="tabBtn"],
[role="tablist"] [role="tab"],
[class*="tab-nav"] a,
[class*="tab-nav"] button,
[class*="tabNav"] a,
[class*="tabNav"] button,
nav[class*="pacer"] a,
nav[class*="pacer"] button,
[id*="pacer-nav"] a,
[id*="pacer-nav"] button {
  background:    rgba(255,255,255,0.13) !important;
  border:        1.5px solid rgba(255,255,255,0.28) !important;
  border-radius: 22px !important;
  padding:       5px 17px !important;
  margin:        0 3px !important;
  font-weight:   700 !important;
  letter-spacing:0.015em !important;
  color:         #ffffff !important;
  transition:    background 0.14s, border-color 0.14s !important;
}
.pacer-tab-btn:hover,
[role="tab"]:hover {
  background: rgba(255,255,255,0.22) !important;
}
.pacer-tab-btn[aria-selected="true"],
.pacer-tab-btn.active,
[role="tab"][aria-selected="true"],
[class*="tab-btn"][class*="active"],
[class*="tabBtn"][class*="active"] {
  background:    rgba(255,255,255,0.26) !important;
  border-color:  #FBB923 !important;
  color:         #FBB923 !important;
  font-weight:   800 !important;
}


/* 6. UNDO TOO-BROAD button[aria-expanded] CRIMSON
      Sprint 11 painted ALL aria-expanded buttons crimson.
      This file loads AFTER theme.css, so same specificity
      but later in cascade — wins over Sprint 11's rule.
   ─────────────────────────────────────────────────────── */
button[aria-expanded] {
  background:       transparent !important;
  background-color: transparent !important;
  color:            inherit !important;
}
button[aria-expanded] * {
  color: inherit !important;
}

/* Re-apply crimson ONLY to recognized section/accordion headers */
[class*="accordion-header"],
[class*="accordionHeader"],
[class*="section-header"],
[class*="sectionHeader"],
[class*="group-header"],
[class*="groupHeader"],
[class*="task-section"],
[class*="taskSection"] {
  background: #BE3527 !important;
  color:      #ffffff !important;
}
[class*="accordion-header"] *,
[class*="accordionHeader"] *,
[class*="section-header"] *,
[class*="sectionHeader"] * {
  color: #ffffff !important;
}


/* 7. TASK ROW SHADING: Barely perceptible (was 0.05) */
[class*="task-row"],
[class*="taskRow"],
[class*="task-item"],
[class*="taskItem"],
[class*="checklist-item"],
[class*="checklistItem"] {
  background: rgba(190, 53, 39, 0.025) !important;
}
[style*="rgba(17, 168"],
[style*="rgba(17,168"],
[style*="rgba(23, 168"],
[style*="rgba(23,168"] {
  background: rgba(190, 53, 39, 0.025) !important;
}


/* 8. TRAINEE NAME: Bold goldenrod, no pill — stronger override */
#pacer-user-badge,
#pacer-user-badge.pacer-trainee-styled {
  background:       transparent !important;
  background-color: transparent !important;
  border:           none !important;
  box-shadow:       none !important;
  padding:          0 !important;
  border-radius:    0 !important;
}
#pacer-user-badge.pacer-trainee-styled,
#pacer-user-badge.pacer-trainee-styled * {
  color:       #F89821 !important;
  font-weight: 800 !important;
}


/* 9. FAB HIDE TOGGLE BUTTON */
#pacer-fab-toggle {
  position:      fixed;
  right:         14px;
  bottom:        370px;    /* will be repositioned by JS */
  width:         26px;
  height:        26px;
  border-radius: 50%;
  background:    rgba(30,30,30,0.6);
  color:         #fff;
  border:        none;
  cursor:        pointer;
  font-size:     11px;
  font-weight:   800;
  z-index:       9390;
  display:       flex;
  align-items:   center;
  justify-content: center;
  box-shadow:    0 2px 8px rgba(0,0,0,0.35);
  transition:    background 0.15s, right 0.2s, bottom 0.2s;
  line-height:   1;
}
#pacer-fab-toggle:hover {
  background: rgba(190,53,39,0.85);
}
#pacer-fab-toggle.fabs-hidden {
  background: rgba(190,53,39,0.75);
  right:      8px;
}


/* 10. FAB SLIDE TRANSITION when hidden */
#pacer-resources-toggle,
#pacer-quiz-toggle,
#pacer-assign-toggle,
#pacer-campus-toggle,
#pacer-dir-toggle {
  transition: opacity 0.2s, transform 0.2s !important;
}
.pacer-fabs-hidden #pacer-resources-toggle,
.pacer-fabs-hidden #pacer-quiz-toggle,
.pacer-fabs-hidden #pacer-assign-toggle,
.pacer-fabs-hidden #pacer-campus-toggle,
.pacer-fabs-hidden #pacer-dir-toggle {
  opacity:        0 !important;
  pointer-events: none !important;
  transform:      translateX(70px) !important;
}