/* sample_results.css - styles for the standalone sample results page */
:root{
  --weps-purple-1: #8b5cf6; /* primary */
  --weps-purple-2: #a855f7;
  --weps-purple-3: #c084fc;
  --weps-purple-4: #d8b4fe;
  --weps-purple-5: #e9d5ff;
  --weps-muted: #6b7280;
}

html,body{
  height:100%;
  background:#f7f7fb;
  color:#1f2937;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}

.site-header{position:sticky;top:0;z-index:1020}
.site-header .logo-placeholder{font-size:1.05rem}

.card-title h4, .card-title{color:var(--weps-purple-1)}

/* Benchmark color cards - match weps_results.php inline badge gradients */
.benchmark-card{min-width:140px}
.benchmark-limited{background: linear-gradient(135deg, #f3e8ff, #e9d5ff); color: #6b21a8}
.benchmark-early{background: linear-gradient(135deg, #e9d5ff, #d8b4fe); color: #5b21b6}
.benchmark-moderate{background: linear-gradient(135deg, #d8b4fe, #c084fc); color: #4c1d95}
.benchmark-significant{background: linear-gradient(135deg, #c084fc, #a855f7); color: #3730a3}
.benchmark-model{background: linear-gradient(135deg, #a855f7, #8b5cf6); color: #312e81}

/* Progress bar purple segments */
.bg-purple-1{background:var(--weps-purple-1)}
.bg-purple-2{background:var(--weps-purple-2)}
.bg-purple-3{background:var(--weps-purple-3)}
.bg-purple-4{background:var(--weps-purple-4)}
.bg-purple-5{background:var(--weps-purple-5)}

/* Primary gradients used for progress bars */
.progress-bar.weps-gradient{
  background: linear-gradient(135deg, var(--weps-purple-1), var(--weps-purple-2));
}

/* Ensure primary text and headings use WEPS purple on this page */
.text-primary, .text-primary * {
  color: var(--weps-purple-1) !important;
}

/* Make progress bars purple by default and override inline backgrounds */
.progress .progress-bar,
.progress-bar.bg-primary,
.progress-bar.weps-gradient {
  background: linear-gradient(135deg, var(--weps-purple-1), var(--weps-purple-2)) !important;
  border: none !important;
}

/* Badges (small) */
.badge-sm{font-size:0.7rem;padding:.25rem .4rem}

/* Make chart container responsive */
#principleChart{width:100%;height:100%;min-height:320px}

/* Small tweaks for print-friendly layout */
@media print{
  body{background:white}
  .site-header{display:none}
  a[href]:after{content:''}
}

/* Accessibility: focus outlines for keyboard users */
.btn:focus, a:focus{outline:3px solid rgba(139,92,246,0.18);outline-offset:2px}

/* Stack actions on small screens */
@media (max-width:576px){
  .container-xxl{padding-left:12px;padding-right:12px}
  .benchmark-card{min-width:120px}
}

/* Recommendation blur / overlay styles (updated) */
.recommendation-wrapper{position:relative}
.recommendation-blur{
  transition: opacity 300ms ease;
}
/* Blur only the descriptive text so the principle names (h6) remain readable */
.recommendation-blur.blurred .card-body p,
.recommendation-blur.blurred .card-body .card-text {
  filter: blur(6px) saturate(.9);
  opacity: .95;
  pointer-events: none;
  user-select: none;
  transition: filter 300ms ease, opacity 300ms ease;
}

.blur-overlay{
  position:absolute;
  inset:0;
  z-index:5;
  display:flex;
  background: linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.7));
  gap:12px;
  padding:1.5rem;
  transition: opacity 300ms ease, visibility 300ms ease;
  align-items:center;
  justify-content:center;
  pointer-events:auto;
}
.blur-overlay p{color:#111; max-width:520px}

/* Revealed state: remove blur from paragraphs and hide overlay (also disable overlay pointer events) */
.recommendation-wrapper.revealed .recommendation-blur .card-body p,
.recommendation-wrapper.revealed .recommendation-blur .card-body .card-text {
  filter: none !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  user-select: auto !important;
}
.recommendation-wrapper.revealed .blur-overlay{opacity:0;visibility:hidden;pointer-events:none}

/* Small responsive tweak to center overlay content on small screens */
@media (max-width:576px){
  .blur-overlay{padding:1rem;text-align:center}
}

/* End of file */