/* Tailwind overrides + brand CSS vars applied by src/brand.js. */

:root {
  --brand-primary: #1E293B;
  --brand-accent:  #2563EB;
  --brand-text:    #0F172A;
  --brand-bg:      #F8FAFC;
}

body {
  background: var(--brand-bg);
  color: var(--brand-text);
}

.brand-primary-bg  { background: var(--brand-primary); }
.brand-accent-bg   { background: var(--brand-accent); }
.brand-accent-text { color: var(--brand-accent); }

.status-green  { color: #16a34a; }
.status-amber  { color: #d97706; }
.status-red    { color: #dc2626; }
.status-unknown { color: #64748b; }

/* Stampeders brand tweaks. Variables --brand-primary/--brand-accent/etc.
   are set at runtime by src/brand.js from clientConfig.brand. */

:root {
  color-scheme: light;
}

body {
  background: var(--brand-bg, #F8FAFC);
  color:      var(--brand-text, #0F172A);
}

/* Cards: retone Tailwind's pure-white surface to a warm cream that ties to the
   brand gold, and force dark text inside so readability doesn't depend on body
   color. Without this, page-level body text (white, set so loose text reads on
   the green page bg) bleeds into card interiors and renders white-on-white. */
.bg-white {
  background-color: #FBF7EE !important;
  color: #0F172A;
}

.btn-primary {
  background: var(--brand-primary, #206444);
  color: #ffffff;
}
.btn-primary:hover { filter: brightness(1.1); }

.btn-accent {
  background: var(--brand-accent, #C9A96C);
  color: #0F172A;
}

/* Pulsing red badge used by missing-list when a deadline has passed.
   Implemented as a class so the JS just toggles it. */
@keyframes pulse-red {
  0%, 100% { box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.7); }
  50%      { box-shadow: 0 0 0 6px rgba(220, 38, 38, 0); }
}
.badge-urgent {
  background: #DC2626;
  color: #ffffff;
  animation: pulse-red 1.4s ease-out infinite;
}
.badge-approaching {
  background: #F59E0B;
  color: #1F2937;
}

/* Banner colors. */
.banner-red    { background: #FEE2E2; border-left: 4px solid #DC2626; color: #7F1D1D; }
.banner-amber  { background: #FEF3C7; border-left: 4px solid #F59E0B; color: #78350F; }
.banner-green  { background: #DCFCE7; border-left: 4px solid #16A34A; color: #14532D; }
